diff --git a/CHANGELOG.md b/CHANGELOG.md index a3fe110..90121d9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,8 @@ +## 0.6.2 – +### Fixed +- Split up javascript file + [#67](https://git.project-insanity.org/onny/nextcloud-app-radio/issues/67) @onny + ## 0.6.2 – 2018-08-11 ### Added - Remember last menu state diff --git a/js/main.js b/js/main.js index a85a330..1ce98f5 100644 --- a/js/main.js +++ b/js/main.js @@ -1,21 +1,7 @@ var MODULE = (function (radio) { - var last_volume = 0; - $(document).ready(function () { - // Player icon pause/stop - var vid = document.getElementById("player"); - vid.onwaiting = function () { - $('#playbutton').attr("class", "buffering"); - }; - vid.onplaying = function () { - $('#playbutton').attr("class", "pause"); - }; - vid.onpause = function () { - $('#playbutton').attr("class", "play"); - }; - // Scroll event handler $(window).scroll(function(){ var station_list = $("#app-content-files"); @@ -45,22 +31,6 @@ var MODULE = (function (radio) { searchTimeout = null; var scheduled; - 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); - } - /* ============== // EVENTS // /===============*/ @@ -94,16 +64,6 @@ var MODULE = (function (radio) { radio.action_favorite(stationid); }); - /* Playbutton click */ - $('#playbutton').click(function() { - var music = document.getElementById('player'); - if (music.paused && $("#player").attr("src") != "") { - music.play(); - } else { - music.pause(); - } - }); - /* ============== // ACTIONS // /===============*/ @@ -167,19 +127,6 @@ var MODULE = (function (radio) { }); }; - radio.action_play = function(stationid){ - $.ajax({ - method: "GET", - url: "https://www.radio-browser.info/webservice/v2/json/url/"+stationid, - dataType: 'json', - success: function(data){ - var streamurl = data['url']; - $("#player").attr("src", streamurl); - $('#player').trigger('play'); - } - }); - }; - radio.render_results = function(data){ var baseUrl = OC.generateUrl('/apps/radio'); @@ -303,133 +250,5 @@ var MODULE = (function (radio) { radio.switch_menu(0); }); - 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: player.volume, - min: 0, - max: 1, - range: 'min', - animate: true, - step: .1, - slide: function(e, ui) { - player.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) { - if (player.volume > 0) { - last_volume = player.volume; - player.volume = 0; - $('#volumeslider').slider('value',0); - radio.save_volume_state(0); - } else { - if (!last_volume == 0) { - player.volume = last_volume; - $('#volumeslider').slider('value',last_volume); - radio.save_volume_state(last_volume); - } else { - player.volume = 1; - $('#volumeslider').slider('value',1); - radio.save_volume_state(1); - } - } - if (player.volume < 0.1) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","silent"); - } - if (player.volume > 0.5) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","full"); - } - if (player.volume <= 0.5 && player.volume >= 0.1) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","mid"); - } -}); - - 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 == "") { - player.volume = 1; - last_volume = 1; - $('#volumeslider').slider('value',1); - } else { - last_volume = volume_state; - player.volume = Number(volume_state); - $('#volumeslider').slider('value',Number(volume_state)); - if (volume_state < 0.1) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","silent"); - } - if (volume_state > 0.5) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","full"); - } - if (volume_state <= 0.5 && volume_state >= 0.1) { - $("#volumeicon").removeClass(); - $("#volumeicon").attr("class","mid"); - } - } - } - 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 || {})); diff --git a/js/player.js b/js/player.js new file mode 100644 index 0000000..1ea70fd --- /dev/null +++ b/js/player.js @@ -0,0 +1,185 @@ +var MODULE = (function (radio) { + + var last_volume = 0; + + // Player icon pause/stop + var vid = document.getElementById("player"); + vid.onwaiting = function () { + $('#playbutton').attr("class", "buffering"); + }; + vid.onplaying = function () { + $('#playbutton').attr("class", "pause"); + }; + vid.onpause = function () { + $('#playbutton').attr("class", "play"); + }; + + 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() { + var music = document.getElementById('player'); + if (music.paused && $("#player").attr("src") != "") { + music.play(); + } else { + music.pause(); + } + }); + + radio.action_play = function(stationid){ + $.ajax({ + method: "GET", + url: "https://www.radio-browser.info/webservice/v2/json/url/"+stationid, + dataType: 'json', + success: function(data){ + var streamurl = data['url']; + $("#player").attr("src", streamurl); + $('#player').trigger('play'); + } + }); + }; + + 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: player.volume, + min: 0, + max: 1, + range: 'min', + animate: true, + step: .1, + slide: function(e, ui) { + player.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) { + if (player.volume > 0) { + last_volume = player.volume; + player.volume = 0; + $('#volumeslider').slider('value',0); + radio.save_volume_state(0); + } else { + if (!last_volume == 0) { + player.volume = last_volume; + $('#volumeslider').slider('value',last_volume); + radio.save_volume_state(last_volume); + } else { + player.volume = 1; + $('#volumeslider').slider('value',1); + radio.save_volume_state(1); + } + } + if (player.volume < 0.1) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","silent"); + } + if (player.volume > 0.5) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","full"); + } + if (player.volume <= 0.5 && player.volume >= 0.1) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","mid"); + } + }); + + 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 == "") { + player.volume = 1; + last_volume = 1; + $('#volumeslider').slider('value',1); + } else { + last_volume = volume_state; + player.volume = Number(volume_state); + $('#volumeslider').slider('value',Number(volume_state)); + if (volume_state < 0.1) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","silent"); + } + if (volume_state > 0.5) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","full"); + } + if (volume_state <= 0.5 && volume_state >= 0.1) { + $("#volumeicon").removeClass(); + $("#volumeicon").attr("class","mid"); + } + } + } + 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 || {})); diff --git a/templates/main.php b/templates/main.php index 833fe94..7b00566 100755 --- a/templates/main.php +++ b/templates/main.php @@ -2,6 +2,7 @@ style('radio', 'main'); script('radio', 'main'); script('radio', 'navigation'); + script('radio', 'player'); ?>