Add files via upload
This commit is contained in:
GitHub
parent
807849d847
commit
7dc3902f72
7 changed files with 155 additions and 0 deletions
7
Leeme.txt
Normal file
7
Leeme.txt
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
LEEME.TXT
|
||||
|
||||
1) La lista de urls de stramings de radio se puede obtener en: "http://fmstream.org/index.php?c=E&o=top"
|
||||
2) Hay que incluir en el fichero radio.js en formato Array las emisoras que deseemos
|
||||
(posteriormente se incluirá como fichero externo para facilitar la carga)
|
||||
3) El directorio logos es donde se deja el logotipo de cada emisora.
|
||||
Si no hay logotipo indicar en el array como logo la imagen "vacio.jpg"
|
||||
BIN
logos/kissfm.jpg
Normal file
BIN
logos/kissfm.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
BIN
logos/logo.png
Normal file
BIN
logos/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.7 KiB |
BIN
logos/los40principales.jpg
Normal file
BIN
logos/los40principales.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6 KiB |
BIN
logos/vacio.jpg
Normal file
BIN
logos/vacio.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
44
radio.html
Normal file
44
radio.html
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<title>Emisoras de Radio</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="icon" href="./logos/logo.png">
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xs-8">
|
||||
<p>
|
||||
<h3><span class="glyphicon glyphicon-music"> </span> <span id="NombreEmisora">EMISORA</span></h3>
|
||||
<img id="LogoEmisora" src="./logos/vacio.jpg" width="300px" height="168px"><br>
|
||||
<audio id="UrlEmisora" autoplay controls src="">Audio no disponible</audio>
|
||||
<br>
|
||||
<!-- Controles de Emisora -->
|
||||
<h2>
|
||||
<a href="#" onclick="Retroceder()">
|
||||
<span class="glyphicon glyphicon-backward"></span>
|
||||
</a>
|
||||
<a id="BotonPlay" href="#" onclick="AlternarPlay()">
|
||||
<span class="glyphicon glyphicon-play-circle"></span>
|
||||
</a>
|
||||
<a id="BotonPause" href="#" hidden onclick="AlternarPlay()">
|
||||
<span class="glyphicon glyphicon-pause"></span>
|
||||
</a>
|
||||
<a href="#" onclick="Avanzar()">
|
||||
<span class="glyphicon glyphicon-forward"></span>
|
||||
</a>
|
||||
</h2>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-xs-4">
|
||||
<p id="ListaEmisoras">
|
||||
... lista de emisoras ...
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="./radio.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
104
radio.js
Normal file
104
radio.js
Normal file
|
|
@ -0,0 +1,104 @@
|
|||
/*
|
||||
-----------------------------------------------
|
||||
Programa: radio.js
|
||||
Autor: Luis G.L. (luisgulo@gmail.com)
|
||||
Version: 1.0
|
||||
MAIN - PROGRAMA PRINCIPAL
|
||||
Se inicia automaticamente en la carga del html
|
||||
-----------------------------------------------
|
||||
*/
|
||||
// Variables globales
|
||||
let PosEmisora = 0;
|
||||
let Sonando = false;
|
||||
let r="./logos/"; // Ruta de logotipos
|
||||
// Array para gestion Emisoras
|
||||
const eNombre = [];
|
||||
const eUrl = [];
|
||||
const eImg = [];
|
||||
// LLamada a funciones para inicializar la Radio
|
||||
CargarArray();
|
||||
EmisoraActiva();
|
||||
// ----- Fin del programa principal -----------------------------------------
|
||||
|
||||
|
||||
// ----- FUNCIONES ----------------------------------------------------------
|
||||
function Avanzar() {
|
||||
// Incrementamos en uno la posicion de la emisora
|
||||
// Revisamos 'desbordamiento' de la posicion y recargamos la emisora activa
|
||||
PosEmisora++;
|
||||
if (PosEmisora >= eNombre.length ) {
|
||||
PosEmisora = 0;
|
||||
};
|
||||
EmisoraActiva();
|
||||
};
|
||||
|
||||
function Retroceder() {
|
||||
// Retrocedemos en uno la posicion de la emisora
|
||||
// Revisamos 'desbordamiento' de la posicion y recargamos la emisora activa
|
||||
PosEmisora = PosEmisora - 1;
|
||||
if (PosEmisora < 0 ) {
|
||||
PosEmisora = eNombre.length - 1;
|
||||
};
|
||||
EmisoraActiva();
|
||||
};
|
||||
|
||||
function AlternarPlay() {
|
||||
// Ocultar/Mostrar los botones de Play-Pause
|
||||
// Ademas debemos para o iniciar el sonido
|
||||
if (Sonando) {
|
||||
Sonando=false;
|
||||
document.getElementById("BotonPlay").hidden=false;
|
||||
document.getElementById("BotonPause").hidden=true;
|
||||
document.getElementById("UrlEmisora").pause();
|
||||
}
|
||||
else {
|
||||
Sonando=true;
|
||||
document.getElementById("BotonPlay").hidden=true;
|
||||
document.getElementById("BotonPause").hidden=false;
|
||||
document.getElementById("UrlEmisora").play();
|
||||
};
|
||||
};
|
||||
|
||||
function CargarArray() {
|
||||
// Cargar en memoria la lista de Emisoras deseadas
|
||||
eNombre[0]="Kiss FM";
|
||||
eUrl[0]="http://kissfm.kissfmradio.cires21.com/kissfm.mp3";
|
||||
eImg[0]="kissfm.jpg";
|
||||
eNombre[1]="Los 40 Principales";
|
||||
eUrl[1]="http://23543.live.streamtheworld.com/LOS40.mp3";
|
||||
eImg[1]="los40principales.jpg";
|
||||
};
|
||||
|
||||
function ImprimirEmisoras() {
|
||||
// Imprimir en el html en la columna 2 la lista de emisoras
|
||||
let texto="";
|
||||
l = document.getElementById("ListaEmisoras");
|
||||
l.innerHTML=texto;
|
||||
// bucle recorrer array emisoras
|
||||
for (let i=0; i < eNombre.length; i++) {
|
||||
// La emisora activa se muestra en color diferente (azul) y con icono de altavoz
|
||||
// Hacemos que emisoras no activas sean clicables
|
||||
if (i == PosEmisora) {
|
||||
l.innerHTML += '<span id="0" style="color:blue"> ' + eNombre[i] + ' </span>' + ' <span id="1" style="color:blue" class="glyphicon glyphicon-volume-up"></span><br>';
|
||||
} else {
|
||||
l.innerHTML += '<span id="0" style="color:black" onclick="CambiarEmisora(' + i + ')"> ' + eNombre[i] + ' </span><br>';
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
function CambiarEmisora(nuevaEmisora) {
|
||||
PosEmisora = nuevaEmisora;
|
||||
EmisoraActiva();
|
||||
};
|
||||
|
||||
function EmisoraActiva() {
|
||||
// Actualizar en el html la emisora activa
|
||||
document.getElementById("NombreEmisora").innerHTML=eNombre[PosEmisora];
|
||||
document.getElementById("UrlEmisora").src=eUrl[PosEmisora];
|
||||
document.getElementById("LogoEmisora").src= r + eImg[PosEmisora];
|
||||
ImprimirEmisoras();
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in a new issue