|
|
@@ -1,24 +1,67 @@
|
|
|
let leRadio = [
|
|
|
- { "name": "Radio Onda Rossa", "website": "http://www.ondarossa.info/"},
|
|
|
+ { "name": "Radio Onda Rossa", "website": "https://www.ondarossa.info/"},
|
|
|
{ "name": "Radio Spore", "website": "https://radiospore.oziosi.org/" },
|
|
|
]
|
|
|
let playlist = []
|
|
|
let audio = document.querySelector("#radio");
|
|
|
|
|
|
+/* Avoids "mixed content" problems, hoping for the best */
|
|
|
+function httpsIze(url) {
|
|
|
+ if(location.protocol === 'https:' && url.startsWith('http:')) {
|
|
|
+ return url.replace('http:', 'https:')
|
|
|
+ }
|
|
|
+ return url
|
|
|
+}
|
|
|
+
|
|
|
+class Player {
|
|
|
+ constructor(audioEl) {
|
|
|
+ this.audioEl = audioEl
|
|
|
+ }
|
|
|
+
|
|
|
+ changeStreamURLs(urls) {
|
|
|
+ this.audioEl.pause()
|
|
|
+ this.audioEl.innerHTML = ''
|
|
|
+ urls.forEach((url) => {
|
|
|
+ let src = document.createElement('source')
|
|
|
+ src.setAttribute('src', url)
|
|
|
+ this.audioEl.appendChild(src)
|
|
|
+ })
|
|
|
+ this.audioEl.load()
|
|
|
+ this.audioEl.play()
|
|
|
+ }
|
|
|
+}
|
|
|
+function downloadPlaylist() {
|
|
|
+ let m3u = "#EXTM3U\n"
|
|
|
+ m3u = playlist.reduce((data, track) => {
|
|
|
+ data += `#EXTINF:${track.itunes.duration},${track.itunes.name} \n`
|
|
|
+ data += `${track.enclosure}\n`
|
|
|
+ return data
|
|
|
+ }, m3u)
|
|
|
+ console.log(m3u)
|
|
|
+ const blob = new Blob([m3u], { 'type': 'audio/x-mpegurl'});
|
|
|
+ const m3uFile = window.URL.createObjectURL(blob);
|
|
|
+ var a = document.createElement("a");
|
|
|
+ a.style = "display: none";
|
|
|
+ document.body.appendChild(a);
|
|
|
+ url = window.URL.createObjectURL(blob);
|
|
|
+ a.href = url;
|
|
|
+ a.download = "playlist.m3u";
|
|
|
+ a.click();
|
|
|
+ window.URL.revokeObjectURL(url);
|
|
|
+}
|
|
|
+
|
|
|
async function main() {
|
|
|
|
|
|
let radio = null
|
|
|
+ let player = new Player(audio)
|
|
|
|
|
|
async function deployRadio(website) {
|
|
|
+ radio = await radiomanifest.get(httpsIze(website))
|
|
|
document.querySelector('#radio-name').textContent = 'Loading ...'
|
|
|
- radio = await radiomanifest.get(website)
|
|
|
- console.log('eccola', radio)
|
|
|
- let src = await radio.getStreaming().pickURL()
|
|
|
- if (src !== audio.src) {
|
|
|
- audio.pause()
|
|
|
- audio.src = src
|
|
|
- audio.play()
|
|
|
- }
|
|
|
+ document.querySelector('#program-name').textContent = 'Loading ...'
|
|
|
+ let urls = await radio.getStreaming().pickURLs()
|
|
|
+ urls = urls.map(httpsIze)
|
|
|
+ player.changeStreamURLs(urls)
|
|
|
document.querySelector('#radio-name').textContent = radio.getName()
|
|
|
const show = radio.getShowAtTime()
|
|
|
let showName = ''
|
|
|
@@ -26,7 +69,10 @@ async function main() {
|
|
|
showName = show.getName()
|
|
|
}
|
|
|
document.querySelector('#program-name').textContent = showName
|
|
|
+
|
|
|
+ setupProgrammi()
|
|
|
}
|
|
|
+
|
|
|
const playButton = document.querySelector("#play")
|
|
|
const nextButton = document.querySelector("#next")
|
|
|
const prevButton = document.querySelector("#prev")
|
|
|
@@ -66,11 +112,12 @@ async function main() {
|
|
|
console.log(el)
|
|
|
el.addEventListener('change', (e) => {
|
|
|
for(let ce of document.querySelectorAll("#menu > input")) {
|
|
|
+ var selector = "#"+ce.id.split('-').slice(1).join('-')
|
|
|
if(ce.checked) {
|
|
|
- document.querySelector("#"+ce.id.split('-').slice(1).join('-')).classList.remove("hidden")
|
|
|
+ document.querySelector(selector).classList.remove("hidden")
|
|
|
}
|
|
|
else {
|
|
|
- document.querySelector("#"+ce.id.split('-').slice(1).join('-')).classList.add("hidden")
|
|
|
+ document.querySelector(selector).classList.add("hidden")
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
@@ -101,15 +148,15 @@ async function main() {
|
|
|
}
|
|
|
prevButton.addEventListener("click",(e) => {
|
|
|
audio.currentTime -= 15;
|
|
|
- showBackToLive()
|
|
|
+ showBackToLive()
|
|
|
}, false)
|
|
|
nextButton.addEventListener("click",(e) => {
|
|
|
audio.currentTime += 15;
|
|
|
- showBackToLive()
|
|
|
+ showBackToLive()
|
|
|
}, false)
|
|
|
|
|
|
audio.addEventListener('pause', (e) => {
|
|
|
- showBackToLive()
|
|
|
+ showBackToLive()
|
|
|
})
|
|
|
document.querySelector(".back-to-live").addEventListener('click', (e) => {
|
|
|
document.querySelector(".is-live").classList.remove("hidden")
|
|
|
@@ -118,25 +165,6 @@ async function main() {
|
|
|
audio.play()
|
|
|
})
|
|
|
}
|
|
|
- function downloadPlaylist() {
|
|
|
- let m3u = "#EXTM3U\n"
|
|
|
- m3u = playlist.reduce((data, track) => {
|
|
|
- data += `#EXTINF:${track.itunes.duration},${track.itunes.name} \n`
|
|
|
- data += `${track.guid}\n`
|
|
|
- return data
|
|
|
- }, m3u)
|
|
|
- console.log(m3u)
|
|
|
- const blob = new Blob([m3u], { 'type': 'audio/x-mpegurl'});
|
|
|
- const m3uFile = window.URL.createObjectURL(blob);
|
|
|
- var a = document.createElement("a");
|
|
|
- a.style = "display: none";
|
|
|
- document.body.appendChild(a);
|
|
|
- url = window.URL.createObjectURL(blob);
|
|
|
- a.href = url;
|
|
|
- a.download = "playlist.m3u";
|
|
|
- a.click();
|
|
|
- window.URL.revokeObjectURL(url);
|
|
|
- }
|
|
|
function setupRadios() {
|
|
|
for(let r of leRadio) {
|
|
|
let el = document.createElement("span")
|
|
|
@@ -190,24 +218,27 @@ async function main() {
|
|
|
if(radio === null) return;
|
|
|
|
|
|
const programmi = radio.getShows();
|
|
|
+ if(programmi === null || programmi === undefined) return;
|
|
|
for(let p of programmi) {
|
|
|
let el = document.createElement("span")
|
|
|
el.innerHTML = p.getName();
|
|
|
showListEl.appendChild(el)
|
|
|
el.addEventListener('click', (e) => {
|
|
|
console.log("Hai clickato su", p.getName())
|
|
|
+ document.querySelectorAll("#programmi-content > .content-box").forEach((el) => {
|
|
|
+ el.remove()
|
|
|
+ })
|
|
|
document.querySelectorAll("#programmi > .show-content > .arrow").forEach((el) => {
|
|
|
el.classList.remove("hidden")
|
|
|
})
|
|
|
- fetch(p.getFeed())
|
|
|
+ fetch(httpsIze(p.getFeed()))
|
|
|
.then(res => res.text())
|
|
|
.then(res => new window.DOMParser().parseFromString(res, "text/xml"))
|
|
|
.then(xml => {
|
|
|
- console.log('yo!', xml)
|
|
|
+ // XXX: we'd need a proper podcast-parsing library here
|
|
|
let data = Array.from(xml.getElementsByTagName("item")).
|
|
|
map(item => Array.from(item.childNodes)
|
|
|
.reduce((data, node) => {
|
|
|
- console.log('node', node, node.localName, node.prefix)
|
|
|
if(node.localName) {
|
|
|
if(node.prefix){
|
|
|
if(!data[node.prefix]) {
|
|
|
@@ -240,30 +271,29 @@ async function main() {
|
|
|
s['itunes']['keywords'].split(',').map((k) => `<span>${k}</span>`).join('')
|
|
|
}
|
|
|
puntata.querySelector(".title").textContent = s.title;
|
|
|
- puntata.querySelector(".description").textContent = s.description;
|
|
|
- //puntata.innerHTML = `<span><b>${data[a].title}</b></span> <div class="small-tags">${keywordso}</div> <br/> <br/><div>${data[a].description}</div>`;
|
|
|
+ puntata.querySelector(".description").textContent = s.description.substr(0, 150);
|
|
|
puntata.querySelector(".play-pause").addEventListener('click', (e) => {
|
|
|
- audio.src = s.enclosure;
|
|
|
- playPauseRadio();
|
|
|
+ console.log(httpsIze(s.enclosure))
|
|
|
+ player.changeStreamURLs([httpsIze(s.enclosure)])
|
|
|
document.querySelector("#radio-name").textContent = p.getName();
|
|
|
document.querySelector("#program-name").textContent = s.title;
|
|
|
})
|
|
|
puntata.querySelector(".add-to-playlist").addEventListener('click', (e) => {
|
|
|
+ console.log('playlist?', s, s.enclosure)
|
|
|
playlist.push(s)
|
|
|
})
|
|
|
- programma.appendChild(puntata)
|
|
|
+ programma.appendChild(puntata)
|
|
|
}
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
+ document.querySelector('#programmi').classList.add('hidden')
|
|
|
setupPlayer();
|
|
|
setupRadios();
|
|
|
setupTabs();
|
|
|
setupShowButtons();
|
|
|
await deployRadio(leRadio[0].website)
|
|
|
-
|
|
|
- setupProgrammi();
|
|
|
}
|
|
|
|
|
|
main()
|
boyska