var MODULE = (function (radio) { var last_volume = 0; var sound = new Howl({ src: "https://blog.project-insanity.org/106fm", html5: true, volume: 0 }); radio.isElementOverflowing = function(element) { var overflowX = element.offsetWidth < element.scrollWidth, overflowY = element.offsetHeight < element.scrollHeight; return (overflowX || overflowY); } radio.wrapContentsInMarquee = function(element) { var marquee = document.createElement('marquee'), contents = element.innerText; marquee.innerText = contents; element.innerHTML = ''; element.appendChild(marquee); } /* Playbutton click */ $('#playbutton').click(function() { if (typeof radio.sound !== "undefined") { if (radio.sound.playing()) { radio.sound.pause(); } else { radio.sound.play(); } }; }); radio.action_play = function(stationid, stationname){ $('#playbutton').attr("class", "buffering"); $('#player').attr('data-id',stationid); $("#station_metadata").html("Playing: "+stationname); /* dirty fix missing background color for first td */ $('tbody tr').css("background-color", "white"); $(this).parent().css("background-color", "#f8f8f8"); var element = document.getElementById('station_metadata'); if (radio.isElementOverflowing(element)) { radio.wrapContentsInMarquee(element); }; if (!radio.scheduled){ radio.schedule_get_metadata(stationid); }; if (typeof radio.sound !== "undefined") { var volume_state = $('#volumeslider').slider('value'); radio.sound.fade(volume_state, 0, 500); }; $.ajax({ method: "GET", url: "https://de1.api.radio-browser.info/json/url/"+stationid, dataType: 'json', success: function(data){ var streamurl = data['url']; radio.sound = new Howl({ src: streamurl, html5: true, volume: 0, onfade: function() { if (this.volume() == 0) { this.unload(); } }, onplay: function() { $('#playbutton').attr("class", "pause"); }, onpause: function() { $('#playbutton').attr("class", "play"); }, onload: function() { $('#playbutton').attr("class", "buffering"); } }); sound_id = radio.sound.play(); radio.sound.once('play', function() { var volume_state = $('#volumeslider').slider('value'); radio.sound.fade(0, volume_state, 1000); }); } }); }; radio.debounce = function(func, wait, immediate) { var timeout; return function() { var context = this, args = arguments; var later = function() { timeout = null; if (!immediate) func.apply(context, args); }; var callNow = immediate && !timeout; clearTimeout(timeout); timeout = setTimeout(later, wait); if (callNow) func.apply(context, args); }; }; // Volume slider $('#volumeslider').slider({ orientation: "horizontal", value: 0.5, min: 0, max: 1, range: 'min', animate: true, step: .05, change: function(e, ui) { if (typeof radio.sound !== "undefined") { radio.sound.volume(ui.value); } if (ui.value < 0.1) { $("#volumeicon").removeClass(); $("#volumeicon").attr("class","silent"); } if (ui.value > 0.5) { $("#volumeicon").removeClass(); $("#volumeicon").attr("class","full"); } if (ui.value <= 0.5 && ui.value >= 0.1) { $("#volumeicon").removeClass(); $("#volumeicon").attr("class","mid"); } } }); $("#volumeslider").on("slidestop", radio.debounce(function(e, ui) { radio.save_volume_state(ui.value); }, 700) ); $("#volumeicon").on("click", function(e) { var current_volume = $('#volumeslider').slider('value'); if (current_volume > 0) { last_volume = current_volume; $('#volumeslider').slider('value',0); radio.save_volume_state(0); } else { if (!last_volume == 0) { $('#volumeslider').slider('value',last_volume); radio.save_volume_state(last_volume); } else { $('#volumeslider').slider('value',1); radio.save_volume_state(1); } } }); radio.load_volume_state = function(){ var volume_state = 0; var baseUrl = OC.generateUrl('/apps/radio/getVolumeState'); $.get(baseUrl, function ( data ) { if ("volume_state" in data) { volume_state = data["volume_state"]; if (volume_state == "") { last_volume = 1; $('#volumeslider').slider('value',1); } else { last_volume = volume_state; $('#volumeslider').slider('value',Number(volume_state)); } } return true; }); } radio.save_volume_state = function(volume_state) { var baseUrl = OC.generateUrl('/apps/radio/saveVolumeState'); var settings = { "volume_state": volume_state }; $.ajax({ url: baseUrl, method: 'POST', contentType: 'application/json', data: JSON.stringify(settings) }).done(function(data){ return true; }); } // Load volume state radio.load_volume_state(); return radio; }(MODULE || {}));