Worked on queues and removed SoundCloud.

app/client/head.html

@@ -30,7 +30,6 @@
     <link href='http://fonts.googleapis.com/css?family=Oxygen:400,300,700' rel='stylesheet' type='text/css'>
     <script src="/jquery.textcomplete.min.js"></script>
     <script src="/emojidropdown.js"></script>
-    <script src="https://connect.soundcloud.com/sdk-2.0.0.js"></script>
     <script type="application/javascript">
         addEventListener("load", function() {
             setTimeout(hideURLbar, 0);
@@ -66,13 +65,5 @@
 
         ga('create', 'UA-69432115-1', 'auto');
         ga('send', 'pageview');
-
-        // SoundCloud initialising
-        function init() {
-            SC.initialize({
-                client_id: "577d3fbbdb5fe05bb4af698d686508fe"
-            });
-        }
-        init();
     </script>
 </head>

app/client/scripts/events.js

@@ -34,11 +34,6 @@ function executeCommand(command, params){
                 if (YTPlayer !== undefined) {
                     YTPlayer.setVolume(volume);
                     localStorage.setItem("volume", volume);
-                } else if (SCPlayer !== undefined) {
-                    //SCPlayer
-                    var volume = volume / 100;
-                    SCPlayer.setVolume(volume);
-                    localStorage.setItem("volume", volume * 100);
                 }
                 return true;
             }
@@ -49,10 +44,6 @@ function executeCommand(command, params){
         if (YTPlayer !== undefined) {
             YTPlayer.setVolume(0);
             localStorage.setItem("volume", 0);
-        } else if (SCPlayer !== undefined) {
-            //SCPlayer
-            SCPlayer.setVolume(0);
-            localStorage.setItem("volume", 0);
         }
     } else if(command === "ban"){
         var user = params[0];
@@ -382,6 +373,7 @@ Template.profile.events({
 Template.queues.events({
     "click .preview-button": function(e){
         Session.set("song", this);
+        $("#previewModal").openModal();
     },
     "click #previewImageButton": function() {
         $("#preview-image").attr("src", Session.get("song").img);
@@ -400,6 +392,7 @@ Template.queues.events({
         $("#dislikes").val(this.dislikes);
         $("#duration").val(this.duration);
         $("#skip-duration").val(this.skipDuration);
+        $("#editModal").openModal();
     },
     "click .add-song-button": function(e){
         var genre = $(e.target).data("genre") || $(e.target).parent().data("genre");
@@ -417,45 +410,37 @@ Template.queues.events({
         var type = song.type;
         var volume = localStorage.getItem("volume") || 20;
 
-        if (type === "YouTube") {
-            if (YTPlayer === undefined) {
-                YTPlayer = new YT.Player("previewPlayer", {
-                    height: 540,
-                    width: 568,
-                    videoId: id,
-                    playerVars: {autoplay: 1, controls: 0, iv_load_policy: 3, showinfo: 0},
-                    events: {
-                        'onReady': function(event) {
-                            event.target.seekTo(Number(song.skipDuration));
+        if (YTPlayer === undefined) {
+            YTPlayer = new YT.Player("previewPlayer", {
+                height: 540,
+                width: 568,
+                videoId: id,
+                playerVars: {autoplay: 1, controls: 0, iv_load_policy: 3, showinfo: 0},
+                events: {
+                    'onReady': function(event) {
+                        event.target.seekTo(Number(song.skipDuration));
+                        event.target.playVideo();
+                        event.target.setVolume(volume);
+                    },
+                    'onStateChange': function(event){
+                        if (event.data == YT.PlayerState.PAUSED) {
                             event.target.playVideo();
-                            event.target.setVolume(volume);
-                        },
-                        'onStateChange': function(event){
-                            if (event.data == YT.PlayerState.PAUSED) {
-                                event.target.playVideo();
-                            }
-                            if (event.data == YT.PlayerState.PLAYING) {
-                                $("#play").attr("disabled", true);
-                                $("#stop").attr("disabled", false);
-                            } else {
-                                $("#play").attr("disabled", false);
-                                $("#stop").attr("disabled", true);
-                            }
+                        }
+                        if (event.data == YT.PlayerState.PLAYING) {
+                            $("#play").attr("disabled", true);
+                            $("#stop").attr("disabled", false);
+                        } else {
+                            $("#play").attr("disabled", false);
+                            $("#stop").attr("disabled", true);
                         }
                     }
-                });
-            } else {
-                YTPlayer.loadVideoById(id);
-                YTPlayer.seekTo(Number(song.skipDuration));
-            }
-            $("#previewPlayer").show();
-        } else if (type === "SoundCloud") {
-            SC.stream("/tracks/" + song.id, function(sound) {
-                SCPlayer = sound;
-                sound.setVolume(volume / 100);
-                sound.play();
+                }
             });
+        } else {
+            YTPlayer.loadVideoById(id);
+            YTPlayer.seekTo(Number(song.skipDuration));
         }
+        $("#previewPlayer").show();
 
         if (previewEndSongTimeout !== undefined) {
             Meteor.clearTimeout(previewEndSongTimeout);
@@ -464,9 +449,6 @@ Template.queues.events({
             if (YTPlayer !== undefined) {
                 YTPlayer.stopVideo();
             }
-            if (SCPlayer !== undefined) {
-                SCPlayer.stop();
-            }
             $("#play").attr("disabled", false);
             $("#stop").attr("disabled", true);
             $("#previewPlayer").hide();
@@ -481,9 +463,6 @@ Template.queues.events({
         if (YTPlayer !== undefined) {
             YTPlayer.stopVideo();
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.stop();
-        }
     },
     "click #forward": function() {
         var error = false;
@@ -497,9 +476,6 @@ Template.queues.events({
                 YTPlayer.seekTo(skipDuration + duration - 10);
             }
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.seekTo((skipDuration + duration - 10) * 1000);
-        }
         if (!error) {
             if (previewEndSongTimeout !== undefined) {
                 Meteor.clearTimeout(previewEndSongTimeout);
@@ -508,9 +484,6 @@ Template.queues.events({
                 if (YTPlayer !== undefined) {
                     YTPlayer.stopVideo();
                 }
-                if (SCPlayer !== undefined) {
-                    SCPlayer.stop();
-                }
                 $("#play").attr("disabled", false);
                 $("#stop").attr("disabled", true);
                 $("#previewPlayer").hide();
@@ -749,9 +722,6 @@ Template.room.events({
                 if (YTPlayer !== undefined) {
                     YTPlayer.seekTo(skipDuration + timeIn / 1000);
                 }
-                else if (SCPlayer !== undefined) {
-                    SCPlayer.seekTo(skipDuration * 1000 + timeIn);
-                }
             }
         }
     },
@@ -894,99 +864,56 @@ Template.room.events({
     "click #search-song": function () {
         var songs = [];
         $("#song-results").empty();
-        var search_type = $("#search_type").val();
-        if (search_type === "YouTube") {
-            $.ajax({
-                type: "GET",
-                url: "https://www.googleapis.com/youtube/v3/search?part=snippet&q=" + $("#song-input").val() + "&key=AIzaSyAgBdacEWrHCHVPPM4k-AFM7uXg-Q__YXY",
-                applicationType: "application/json",
-                contentType: "json",
-                success: function (data) {
-                    for (var i in data.items) {
-                        var item = data.items[i];
-                        $("#song-results").append(
-                            "<div>" +
-                            "<img src='" + item.snippet.thumbnails.medium.url + "' class='song-result-thumbnail'/>" +
-                            "<div>" +
-                            "<span class='song-result-title'>" + item.snippet.title + "</span>" +
-                            "<span class='song-result-channel'>" + item.snippet.channelTitle + "</span>" +
-                            "</div>" +
-                            "</div>"
-                        );
-                        songs.push({title: item.snippet.title, id: item.id.videoId});
-                    }
-                    $("#song-results > div").click(function () {
-                        $("#search-info").hide();
-                        $("#add-info").show();
-                        var title = $(this).find("div > .song-result-title").text();
-                        for (var i in songs) {
-                            if (songs[i].title === title) {
-                                var songObj = {
-                                    id: songs[i].id,
-                                    title: songs[i].title,
-                                    type: "youtube"
-                                };
-                                $("#title").val(songObj.title);
-                                $("#artist").val("");
-                                $("#id").val(songObj.id);
-                                $("#type").val("YouTube");
-                                getSpotifyInfo(songObj.title.replace(/\[.*\]/g, ""), function (data) {
-                                    if (data.tracks.items.length > 0) {
-                                        $("#title").val(data.tracks.items[0].name);
-                                        var artists = [];
-                                        $("#img").val(data.tracks.items[0].album.images[2].url);
-                                        data.tracks.items[0].artists.forEach(function (artist) {
-                                            artists.push(artist.name);
-                                        });
-                                        $("#artist").val(artists.join(", "));
-                                    }
-                                });
-                            }
-                        }
-                    })
-                }
-            })
-        } else if (search_type === "SoundCloud") {
-            SC.get('/tracks', {q: $("#song-input").val()}, function (tracks) {
-                for (var i in tracks) {
-                    $("#song-results").append("<p>" + tracks[i].title + "</p>")
-                    songsArr.push({title: tracks[i].title, id: tracks[i].id, duration: tracks[i].duration / 1000});
+        $.ajax({
+            type: "GET",
+            url: "https://www.googleapis.com/youtube/v3/search?part=snippet&q=" + $("#song-input").val() + "&key=AIzaSyAgBdacEWrHCHVPPM4k-AFM7uXg-Q__YXY",
+            applicationType: "application/json",
+            contentType: "json",
+            success: function (data) {
+                for (var i in data.items) {
+                    var item = data.items[i];
+                    $("#song-results").append(
+                        "<div>" +
+                        "<img src='" + item.snippet.thumbnails.medium.url + "' class='song-result-thumbnail'/>" +
+                        "<div>" +
+                        "<span class='song-result-title'>" + item.snippet.title + "</span>" +
+                        "<span class='song-result-channel'>" + item.snippet.channelTitle + "</span>" +
+                        "</div>" +
+                        "</div>"
+                    );
+                    songs.push({title: item.snippet.title, id: item.id.videoId});
                 }
-                $("#song-results p").click(function () {
+                $("#song-results > div").click(function () {
                     $("#search-info").hide();
                     $("#add-info").show();
-                    var title = $(this).text();
-                    for (var i in songsArr) {
-                        if (songsArr[i].title === title) {
-                            var id = songsArr[i].id;
-                            var duration = songsArr[i].duration;
+                    var title = $(this).find("div > .song-result-title").text();
+                    for (var i in songs) {
+                        if (songs[i].title === title) {
                             var songObj = {
-                                title: songsArr[i].title,
-                                id: id,
-                                duration: duration,
-                                type: "soundcloud"
-                            }
+                                id: songs[i].id,
+                                title: songs[i].title,
+                                type: "youtube"
+                            };
                             $("#title").val(songObj.title);
-                            // Set ID field
+                            $("#artist").val("");
                             $("#id").val(songObj.id);
-                            $("#type").val("SoundCloud");
+                            $("#type").val("YouTube");
                             getSpotifyInfo(songObj.title.replace(/\[.*\]/g, ""), function (data) {
                                 if (data.tracks.items.length > 0) {
                                     $("#title").val(data.tracks.items[0].name);
                                     var artists = [];
+                                    $("#img").val(data.tracks.items[0].album.images[2].url);
                                     data.tracks.items[0].artists.forEach(function (artist) {
                                         artists.push(artist.name);
                                     });
                                     $("#artist").val(artists.join(", "));
                                 }
-                                // Set title field again if possible
-                                // Set artist if possible
                             });
                         }
                     }
                 })
-            });
-        }
+            }
+        })
     },
     "click #volume-icon": function () {
         var volume = 0;
@@ -996,10 +923,6 @@ Template.room.events({
             YTPlayer.setVolume(volume);
             localStorage.setItem("volume", volume);
             $("#volume-slider").slider("setValue", volume);
-        } else if (SCPlayer !== undefined) {
-            SCPlayer.setVolume(volume);
-            localStorage.setItem("volume", volume);
-            $("#volume-slider").slider("setValue", volume);
         }
     },
     "click #play": function () {
@@ -1226,7 +1149,6 @@ Template.room.onCreated(function () {
         resizeSeekerbarInterval = undefined;
     }
     YTPlayer = undefined;
-    SCPlayer = undefined;
     Session.set("videoHidden", false);
     var tag = document.createElement("script");
     tag.src = "https://www.youtube.com/iframe_api";
@@ -1269,93 +1191,62 @@ Template.room.onCreated(function () {
         $("#time-elapsed").text("0:00");
         $("#vote-skip").attr("disabled", false);
         if (currentSong !== undefined) {
-            if (SCPlayer !== undefined) SCPlayer.stop();
             if (YTPlayer !== undefined && YTPlayer.stopVideo !== undefined) YTPlayer.stopVideo();
 
             var volume = localStorage.getItem("volume") || 20;
 
-            if (currentSong.type === "SoundCloud") {
-                if ($("#soundcloud-image").length !== 1) {
-                    //$("#media-container").append('<img alt="Not loading" src="/soundcloud-image.png" class="embed-responsive-item" id="soundcloud-image" />');
-                    $("#media-container").append('<h1 id="soundcloud-image">We have temporarily disabled the playing of SoundCloud songs. We are sorry for this inconvenience.</h1>');
-                }
-                if ($("#player").length === 1) {
-                    $("#player").hide();
-                }
-                $("#soundcloud-image").show();
-                //getSongInfo(currentSong);
-                /*SC.stream("/tracks/" + currentSong.id, function(sound){
-                    SCPlayer = sound;
-                    sound.setVolume(volume / 100);
-                    sound.play();
-                    var interval = setInterval(function() {
-                        if (sound.getState() === "playing") {
-                            sound.seek(getTimeElapsed());
-                            window.clearInterval(interval);
-                        }
-                    }, 200);
-                    Session.set("duration", parseInt(currentSong.duration));
-                    var d = moment.duration(parseInt(currentSong.duration), 'seconds');
-                    $("#time-total").text(d.minutes() + ":" + ("0" + d.seconds()).slice(-2));
-                    resizeSeekerbar();
-                });*/
-            } else {
-                if ($("#player").length !== 1) {
-                    $("#media-container").append('<div id="player" class="embed-responsive-item"></div>');
-                }
-                if ($("#soundcloud-image").length === 1) {
-                    $("#soundcloud-image").hide();
-                }
-                $("#player").show();
-                function loadVideo() {
-                    if (!Session.get("YTLoaded")) {
-                        Session.set("loadVideoTimeout", Meteor.setTimeout(function () {
-                            loadVideo();
-                        }, 500));
-                    } else {
-                        if (YTPlayer === undefined) {
-                            YTPlayer = new YT.Player("player", {
-                                height: 540,
-                                width: 960,
-                                videoId: currentSong.id,
-                                playerVars: {controls: 0, iv_load_policy: 3, rel: 0, showinfo: 0},
-                                events: {
-                                    'onReady': function (event) {
-                                        if (currentSong.skipDuration === undefined) {
-                                            currentSong.skipDuration = 0;
+            if ($("#player").length !== 1) {
+                $("#media-container").append('<div id="player" class="embed-responsive-item"></div>');
+            }
+            $("#player").show();
+            function loadVideo() {
+                if (!Session.get("YTLoaded")) {
+                    Session.set("loadVideoTimeout", Meteor.setTimeout(function () {
+                        loadVideo();
+                    }, 500));
+                } else {
+                    if (YTPlayer === undefined) {
+                        YTPlayer = new YT.Player("player", {
+                            height: 540,
+                            width: 960,
+                            videoId: currentSong.id,
+                            playerVars: {controls: 0, iv_load_policy: 3, rel: 0, showinfo: 0},
+                            events: {
+                                'onReady': function (event) {
+                                    if (currentSong.skipDuration === undefined) {
+                                        currentSong.skipDuration = 0;
+                                    }
+                                    event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                    event.target.playVideo();
+                                    event.target.setVolume(volume);
+                                    resizeSeekerbar();
+                                },
+                                'onStateChange': function (event) {
+                                    if (Session.get("YTLoaded")) {
+                                        if (event.data == YT.PlayerState.PAUSED && Session.get("state") === "playing") {
+                                            event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                            event.target.playVideo();
                                         }
-                                        event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                        event.target.playVideo();
-                                        event.target.setVolume(volume);
-                                        resizeSeekerbar();
-                                    },
-                                    'onStateChange': function (event) {
-                                        if (Session.get("YTLoaded")) {
-                                            if (event.data == YT.PlayerState.PAUSED && Session.get("state") === "playing") {
-                                                event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                                event.target.playVideo();
-                                            }
-                                            if (event.data == YT.PlayerState.PLAYING && Session.get("state") === "paused") {
-                                                event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                                event.target.pauseVideo();
-                                            }
+                                        if (event.data == YT.PlayerState.PLAYING && Session.get("state") === "paused") {
+                                            event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                            event.target.pauseVideo();
                                         }
                                     }
                                 }
-                            });
-                        } else {
-                            YTPlayer.loadVideoById(currentSong.id);
-                            if (currentSong.skipDuration === undefined) {
-                                currentSong.skipDuration = 0;
                             }
-                            YTPlayer.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                        });
+                    } else {
+                        YTPlayer.loadVideoById(currentSong.id);
+                        if (currentSong.skipDuration === undefined) {
+                            currentSong.skipDuration = 0;
                         }
-                        Session.set("pauseVideo", false);
-                        getSongInfo(currentSong);
+                        YTPlayer.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
                     }
+                    Session.set("pauseVideo", false);
+                    getSongInfo(currentSong);
                 }
-                loadVideo();
             }
+            loadVideo();
         }
     }
 
@@ -1378,15 +1269,11 @@ Template.room.onCreated(function () {
                         // TODO Fix issue where sometimes nothing loads with the YT is not defined error. The error points to around this.
                         if (YTPlayer !== undefined && YTPlayer.getPlayerState !== undefined && YTPlayer.getPlayerState() === 1) {
                             YTPlayer.pauseVideo();
-                        } else if (SCPlayer !== undefined && SCPlayer.getState().indexOf("playing") !== -1) {
-                            SCPlayer.pause();
                         }
                     } else {
                         Session.set("state", "playing");
                         if (YTPlayer !== undefined && YTPlayer.getPlayerState !== undefined && YTPlayer.getPlayerState() !== 1) {
                             YTPlayer.playVideo();
-                        } else if (SCPlayer !== undefined && SCPlayer.getState().indexOf("paused") !== -1) {
-                            SCPlayer.play();
                         }
                     }
                 }
@@ -1531,48 +1418,39 @@ Template.stations.events({
         $("#stop").attr("disabled", false);
         var song = Session.get("song");
         var id = song.id;
-        var type = song.type;
         var volume = localStorage.getItem("volume") || 20;
 
-        if (type === "YouTube") {
-            if (YTPlayer === undefined) {
-                YTPlayer = new YT.Player("previewPlayer", {
-                    height: 540,
-                    width: 568,
-                    videoId: id,
-                    playerVars: {controls: 0, iv_load_policy: 3, showinfo: 0},
-                    events: {
-                        'onReady': function(event) {
-                            event.target.seekTo(Number(song.skipDuration));
+        if (YTPlayer === undefined) {
+            YTPlayer = new YT.Player("previewPlayer", {
+                height: 540,
+                width: 568,
+                videoId: id,
+                playerVars: {controls: 0, iv_load_policy: 3, showinfo: 0},
+                events: {
+                    'onReady': function(event) {
+                        event.target.seekTo(Number(song.skipDuration));
+                        event.target.playVideo();
+                        event.target.setVolume(volume);
+                    },
+                    'onStateChange': function(event){
+                        if (event.data == YT.PlayerState.PAUSED) {
                             event.target.playVideo();
-                            event.target.setVolume(volume);
-                        },
-                        'onStateChange': function(event){
-                            if (event.data == YT.PlayerState.PAUSED) {
-                                event.target.playVideo();
-                            }
-                            if (event.data == YT.PlayerState.PLAYING) {
-                                $("#play").attr("disabled", true);
-                                $("#stop").attr("disabled", false);
-                            } else {
-                                $("#play").attr("disabled", false);
-                                $("#stop").attr("disabled", true);
-                            }
+                        }
+                        if (event.data == YT.PlayerState.PLAYING) {
+                            $("#play").attr("disabled", true);
+                            $("#stop").attr("disabled", false);
+                        } else {
+                            $("#play").attr("disabled", false);
+                            $("#stop").attr("disabled", true);
                         }
                     }
-                });
-            } else {
-                YTPlayer.loadVideoById(id);
-                YTPlayer.seekTo(Number(song.skipDuration));
-            }
-            $("#previewPlayer").show();
-        } else if (type === "SoundCloud") {
-            SC.stream("/tracks/" + song.id, function(sound) {
-                SCPlayer = sound;
-                sound.setVolume(volume / 100);
-                sound.play();
+                }
             });
+        } else {
+            YTPlayer.loadVideoById(id);
+            YTPlayer.seekTo(Number(song.skipDuration));
         }
+        $("#previewPlayer").show();
 
         if (previewEndSongTimeout !== undefined) {
             Meteor.clearTimeout(previewEndSongTimeout);
@@ -1581,9 +1459,6 @@ Template.stations.events({
             if (YTPlayer !== undefined) {
                 YTPlayer.stopVideo();
             }
-            if (SCPlayer !== undefined) {
-                SCPlayer.stop();
-            }
             $("#play").attr("disabled", false);
             $("#stop").attr("disabled", true);
             $("#previewPlayer").hide();
@@ -1598,9 +1473,6 @@ Template.stations.events({
         if (YTPlayer !== undefined) {
             YTPlayer.stopVideo();
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.stop();
-        }
     },
     "click #forward": function() {
         var error = false;
@@ -1614,9 +1486,6 @@ Template.stations.events({
                 YTPlayer.seekTo(skipDuration + duration - 10);
             }
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.seekTo((skipDuration + duration - 10) * 1000);
-        }
         if (!error) {
             if (previewEndSongTimeout !== undefined) {
                 Meteor.clearTimeout(previewEndSongTimeout);
@@ -1625,9 +1494,6 @@ Template.stations.events({
                 if (YTPlayer !== undefined) {
                     YTPlayer.stopVideo();
                 }
-                if (SCPlayer !== undefined) {
-                    SCPlayer.stop();
-                }
                 $("#play").attr("disabled", false);
                 $("#stop").attr("disabled", true);
                 $("#previewPlayer").hide();

app/client/scripts/main.js

@@ -71,7 +71,6 @@ Template.registerHelper("rtime", function(date) {
 
 var allAlertSub = undefined;
 var YTPlayer = undefined;
-var SCPlayer = undefined;
 var previewEndSongTimeout = undefined;
 var hpSound = undefined;
 var songsArr = [];

app/client/scripts/onCreated.js

@@ -1,4 +1,3 @@
-var SCPlayer = undefined;
 var minterval;
 var StationSubscription = undefined;
 var resizeSeekerbarInterval;
@@ -20,7 +19,6 @@ Template.banned.onCreated(function() {
 });
 
 Template.dashboard.onCreated(function() {
-    if (SCPlayer !== undefined) SCPlayer.stop();
     if (minterval !== undefined) {
         Meteor.clearInterval(minterval);
     }
@@ -79,7 +77,6 @@ Template.queues.onCreated(function() {
     var firstScriptTag = document.getElementsByTagName('script')[0];
     firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
     YTPlayer = undefined;
-    SCPlayer = undefined;
 });
 
 Template.register.onCreated(function() {
@@ -118,7 +115,6 @@ Template.room.onCreated(function () {
         resizeSeekerbarInterval = undefined;
     }
     YTPlayer = undefined;
-    SCPlayer = undefined;
     Session.set("videoHidden", false);
     var tag = document.createElement("script");
     tag.src = "https://www.youtube.com/iframe_api";
@@ -161,93 +157,62 @@ Template.room.onCreated(function () {
         $("#time-elapsed").text("0:00");
         $("#vote-skip").attr("disabled", false);
         if (currentSong !== undefined) {
-            if (SCPlayer !== undefined) SCPlayer.stop();
             if (YTPlayer !== undefined && YTPlayer.stopVideo !== undefined) YTPlayer.stopVideo();
 
             var volume = localStorage.getItem("volume") || 20;
 
-            if (currentSong.type === "SoundCloud") {
-                if ($("#soundcloud-image").length !== 1) {
-                    //$("#media-container").append('<img alt="Not loading" src="/soundcloud-image.png" class="embed-responsive-item" id="soundcloud-image" />');
-                    $("#media-container").append('<h1 id="soundcloud-image">We have temporarily disabled the playing of SoundCloud songs. We are sorry for this inconvenience.</h1>');
-                }
-                if ($("#player").length === 1) {
-                    $("#player").hide();
-                }
-                $("#soundcloud-image").show();
-                //getSongInfo(currentSong);
-                /*SC.stream("/tracks/" + currentSong.id, function(sound){
-                 SCPlayer = sound;
-                 sound.setVolume(volume / 100);
-                 sound.play();
-                 var interval = setInterval(function() {
-                 if (sound.getState() === "playing") {
-                 sound.seek(getTimeElapsed());
-                 window.clearInterval(interval);
-                 }
-                 }, 200);
-                 Session.set("duration", parseInt(currentSong.duration));
-                 var d = moment.duration(parseInt(currentSong.duration), 'seconds');
-                 $("#time-total").text(d.minutes() + ":" + ("0" + d.seconds()).slice(-2));
-                 resizeSeekerbar();
-                 });*/
-            } else {
-                if ($("#player").length !== 1) {
-                    $("#media-container").append('<div id="player" class="embed-responsive-item"></div>');
-                }
-                if ($("#soundcloud-image").length === 1) {
-                    $("#soundcloud-image").hide();
-                }
-                $("#player").show();
-                function loadVideo() {
-                    if (!Session.get("YTLoaded")) {
-                        Session.set("loadVideoTimeout", Meteor.setTimeout(function () {
-                            loadVideo();
-                        }, 500));
-                    } else {
-                        if (YTPlayer === undefined) {
-                            YTPlayer = new YT.Player("player", {
-                                height: 540,
-                                width: 960,
-                                videoId: currentSong.id,
-                                playerVars: {controls: 0, iv_load_policy: 3, rel: 0, showinfo: 0},
-                                events: {
-                                    'onReady': function (event) {
-                                        if (currentSong.skipDuration === undefined) {
-                                            currentSong.skipDuration = 0;
+            if ($("#player").length !== 1) {
+                $("#media-container").append('<div id="player" class="embed-responsive-item"></div>');
+            }
+            $("#player").show();
+            function loadVideo() {
+                if (!Session.get("YTLoaded")) {
+                    Session.set("loadVideoTimeout", Meteor.setTimeout(function () {
+                        loadVideo();
+                    }, 500));
+                } else {
+                    if (YTPlayer === undefined) {
+                        YTPlayer = new YT.Player("player", {
+                            height: 540,
+                            width: 960,
+                            videoId: currentSong.id,
+                            playerVars: {controls: 0, iv_load_policy: 3, rel: 0, showinfo: 0},
+                            events: {
+                                'onReady': function (event) {
+                                    if (currentSong.skipDuration === undefined) {
+                                        currentSong.skipDuration = 0;
+                                    }
+                                    event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                    event.target.playVideo();
+                                    event.target.setVolume(volume);
+                                    resizeSeekerbar();
+                                },
+                                'onStateChange': function (event) {
+                                    if (Session.get("YTLoaded")) {
+                                        if (event.data == YT.PlayerState.PAUSED && Session.get("state") === "playing") {
+                                            event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                            event.target.playVideo();
                                         }
-                                        event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                        event.target.playVideo();
-                                        event.target.setVolume(volume);
-                                        resizeSeekerbar();
-                                    },
-                                    'onStateChange': function (event) {
-                                        if (Session.get("YTLoaded")) {
-                                            if (event.data == YT.PlayerState.PAUSED && Session.get("state") === "playing") {
-                                                event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                                event.target.playVideo();
-                                            }
-                                            if (event.data == YT.PlayerState.PLAYING && Session.get("state") === "paused") {
-                                                event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
-                                                event.target.pauseVideo();
-                                            }
+                                        if (event.data == YT.PlayerState.PLAYING && Session.get("state") === "paused") {
+                                            event.target.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                                            event.target.pauseVideo();
                                         }
                                     }
                                 }
-                            });
-                        } else {
-                            YTPlayer.loadVideoById(currentSong.id);
-                            if (currentSong.skipDuration === undefined) {
-                                currentSong.skipDuration = 0;
                             }
-                            YTPlayer.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
+                        });
+                    } else {
+                        YTPlayer.loadVideoById(currentSong.id);
+                        if (currentSong.skipDuration === undefined) {
+                            currentSong.skipDuration = 0;
                         }
-                        Session.set("pauseVideo", false);
-                        getSongInfo(currentSong);
+                        YTPlayer.seekTo(Number(currentSong.skipDuration) + getTimeElapsed() / 1000);
                     }
+                    Session.set("pauseVideo", false);
+                    getSongInfo(currentSong);
                 }
-                loadVideo();
             }
+            loadVideo();
         }
     }
 
@@ -270,15 +235,11 @@ Template.room.onCreated(function () {
                         // TODO Fix issue where sometimes nothing loads with the YT is not defined error. The error points to around this.
                         if (YTPlayer !== undefined && YTPlayer.getPlayerState !== undefined && YTPlayer.getPlayerState() === 1) {
                             YTPlayer.pauseVideo();
-                        } else if (SCPlayer !== undefined && SCPlayer.getState().indexOf("playing") !== -1) {
-                            SCPlayer.pause();
                         }
                     } else {
                         Session.set("state", "playing");
                         if (YTPlayer !== undefined && YTPlayer.getPlayerState !== undefined && YTPlayer.getPlayerState() !== 1) {
                             YTPlayer.playVideo();
-                        } else if (SCPlayer !== undefined && SCPlayer.getState().indexOf("paused") !== -1) {
-                            SCPlayer.play();
                         }
                     }
                 }
@@ -347,5 +308,4 @@ Template.stations.onCreated(function() {
     var firstScriptTag = document.getElementsByTagName('script')[0];
     firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
     YTPlayer = undefined;
-    SCPlayer = undefined;
 });

app/client/scripts/onRendered.js

@@ -12,9 +12,6 @@ Template.queues.onRendered(function() {
             YTPlayer.seekTo(0);
             YTPlayer.stopVideo();
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.stop();
-        }
     });
     $(document).ready(function() {
         function makeSlider(){
@@ -30,9 +27,6 @@ Template.queues.onRendered(function() {
                     localStorage.setItem("volume", val.value);
                     if (YTPlayer !== undefined) {
                         YTPlayer.setVolume(val.value);
-                    } else if (SCPlayer !== undefined) {
-                        var volume = val.value / 100;
-                        SCPlayer.setVolume(volume);
                     }
                 });
             }
@@ -73,11 +67,6 @@ Template.room.onRendered(function() {
                     if (YTPlayer !== undefined) {
                         YTPlayer.setVolume(val.value);
                         localStorage.setItem("volume", val.value);
-                    } else if (SCPlayer !== undefined) {
-                        //SCPlayer
-                        var volume = val.value / 100;
-                        SCPlayer.setVolume(volume);
-                        localStorage.setItem("volume", val.value);
                     }
                 });
             }
@@ -98,9 +87,6 @@ Template.stations.onRendered(function() {
             YTPlayer.seekTo(0);
             YTPlayer.stopVideo();
         }
-        if (SCPlayer !== undefined) {
-            SCPlayer.stop();
-        }
     });
     $(document).ready(function() {
         function makeSlider(){
@@ -116,9 +102,6 @@ Template.stations.onRendered(function() {
                     localStorage.setItem("volume", val.value);
                     if (YTPlayer !== undefined) {
                         YTPlayer.setVolume(val.value);
-                    } else if (SCPlayer !== undefined) {
-                        var volume = val.value / 100;
-                        SCPlayer.setVolume(volume);
                     }
                 });
             }

app/client/templates/faq.html

@@ -9,13 +9,11 @@
         <h4>How can I add a song?</h4>
         <p class="flow-text">You can add a song if you are logged in, by clicking on the Add Song button under the
             video in
-            the station you want to add your song in. That will open up a modal where you can search for a title in
-            YouTube
-            or SoundCloud, or you can paste a YouTube link into there and click the Search Song button. You can then
+            the station you want to add your song in. That will open up a modal where you can search search for a song by putting a search query there or by putting a link in there and clicking the Search Song button. You can then
             edit
             some more information, like the artist and title. It's helpful for us if you fill those in so we don't
             have to
-            research every song, but you are not required to.</p>
+            research every song, but you are not required to. You can also import playlists from YouTube.</p>
         <h4>Can I skip a song?</h4>
         <p class="flow-text">Yes, and no. You can vote on skipping a song. You can click the blue skip button. When
             the

app/client/templates/queues.html

@@ -3,133 +3,129 @@
     <div class="landing">
         {{> header}}
         <div class="row">
-          {{#each queues}}
-              <div class="col-md-8 col-md-offset-2 admin-queue-panel">
-                  <div class="panel panel-danger">
-                      <div class="panel-heading">
-                          <h3 class="panel-title">{{display}} review queue</h3>
-                      </div>
-                      <div class="panel-body admin-panel-body">
-                          <table class="table table-striped">
-                              <thead>
-                                  <tr>
-                                      <th>Title</th>
-                                      <th>Artist(s)</th>
-                                      <th>Type</th>
-                                      <th>Id</th>
-                                      <th>Likes</th>
-                                      <th>Dislikes</th>
-                                      <th>Img</th>
-                                      <th>Preview</th>
-                                      <th>Edit</th>
-                                      <th>Add</th>
-                                      <th colspan="10">Remove</th>
-                                  </tr>
-                              </thead>
-                              <tbody>
-                                  {{#each songs}}
-                                      <tr>
-                                          <th scope="row">{{title}}</th>
-                                          <td>{{artist}}</td>
-                                          <td>{{type}}</td>
-                                          <td>{{id}}</td>
-                                          <td>{{likes}}</td>
-                                          <td>{{dislikes}}</td>
-                                          <td class="column-small"><button class="btn btn-primary preview-button" id="previewImageButton" data-toggle="modal" data-target="#previewImageModal">Preview Image</button></td>
-                                          <td class="column-small"><button class="btn btn-primary preview-button" data-toggle="modal" data-target="#previewModal">Preview</button></td>
-                                          <td class="column-small"><button class="btn btn-primary edit-queue-button" data-genre="{{../type}}" data-toggle="modal" data-target="#editModal">Edit</button></td>
-                                          <td class="column-small"><button class="btn btn-success add-song-button" data-genre="{{../type}}"><i class="fa fa-check-circle"></i></button></td>
-                                          <td class="column-small"><button class="btn btn-danger deny-song-button" data-genre="{{../type}}"><i class="fa fa-ban"></i></button></td>
-                                      </tr>
-                                  {{/each}}
-                              </tbody>
-                          </table>
-                      </div>
-                  </div>
-              </div>
-          {{/each}}
-        </div>
-
-        <div id="previewModal" class="modal fade" role="dialog">
-            <div class="modal-dialog">
-                <!-- Modal content-->
-                <div class="modal-content">
-                    <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal">&times;</button>
-                        <h4 class="modal-title">Preview</h4>
-                    </div>
-                    <div class="modal-body">
-                        <div width="960" height="540" id="previewPlayer"></div>
-                        <button id="play" title="Play video" class="btn btn-success"><i class="fa fa-play"></i></button>
-                        <button id="stop" title="Stop video" class="btn btn-danger" disabled><i class="fa fa-stop"></i></button>
-                        <button id="forward" title="Go to the last 10 seconds of the video" class="btn btn-primary"><i class="fa fa-fast-forward"></i></button>
-                        <div id="volume-container-admin">
-                            <input type="text" id="volume-slider" class="span2" value="" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="hide">
-                        </div>
-                    </div>
-                    <div class="modal-footer">
-                        <button id="close-modal" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+            {{#each queues}}
+                <div class="col m8 s8 l8 offset-l2 offset-m1 offset-s2 admin-queue-panel card-panel teal accent-3">
+                    <div class="card-content white-text">
+                        <h3 class="text-center">{{display}} review queue</h3>
+                        <table class="bordered">
+                            <thead>
+                            <tr>
+                                <th>Title</th>
+                                <th>Artist(s)</th>
+                                <th>Type</th>
+                                <th>Id</th>
+                                <th>Likes</th>
+                                <th>Dislikes</th>
+                                <th>Img</th>
+                                <th>Preview</th>
+                                <th>Edit</th>
+                                <th>Add</th>
+                                <th colspan="10">Remove</th>
+                            </tr>
+                            </thead>
+                            <tbody>
+                            {{#each songs}}
+                                <tr>
+                                    <th scope="row">{{title}}</th>
+                                    <td>{{artist}}</td>
+                                    <td>{{type}}</td>
+                                    <td>{{id}}</td>
+                                    <td>{{likes}}</td>
+                                    <td>{{dislikes}}</td>
+                                    <td>
+                                        <a class="waves-effect waves-light btn modal-trigger preview-modal-button"
+                                           href="#previewModal">Preview Modal</a>
+                                    </td>
+                                    <td>
+                                        <button class="btn preview-button preview-modal-button" data-toggle="modal"
+                                                data-target="#previewModal">Preview
+                                        </button>
+                                    </td>
+                                    <td>
+                                        <button class="btn edit-queue-button" data-genre="{{../type}}"
+                                                data-toggle="modal" data-target="#editModal">Edit
+                                        </button>
+                                    </td>
+                                    <td>
+                                        <button class="btn green add-song-button" data-genre="{{../type}}"><i
+                                                class="material-icons">thumb_up</i></button>
+                                    </td>
+                                    <td>
+                                        <button class="btn red deny-song-button" data-genre="{{../type}}"><i
+                                                class="material-icons">thumb_down</i></button>
+                                    </td>
+                                </tr>
+                            {{/each}}
+                            </tbody>
+                        </table>
                     </div>
                 </div>
-            </div>
+            {{/each}}
         </div>
-        <div id="previewImageModal" class="modal fade" role="dialog">
-            <div class="modal-dialog">
-                <!-- Modal content-->
-                <div class="modal-content">
-                    <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal">&times;</button>
-                        <h4 class="modal-title">Preview Image</h4>
-                    </div>
-                    <div class="modal-body">
-                        <img alt="Not loading" id="preview-image" height="210px" width="210px" src=""/>
-                    </div>
-                    <div class="modal-footer">
-                        <button id="close-modal" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                    </div>
+
+        <div id="previewModal" class="modal">
+            <div class="modal-content">
+                <h4>Preview</h4>
+                <div width="960" height="540" id="previewPlayer"></div>
+                <button id="play" title="Play video" class="btn btn-success"><i class="fa fa-play"></i></button>
+                <button id="stop" title="Stop video" class="btn btn-danger" disabled><i class="fa fa-stop"></i>
+                </button>
+                <button id="forward" title="Go to the last 10 seconds of the video" class="btn btn-primary"><i
+                        class="fa fa-fast-forward"></i></button>
+                <div id="volume-container-admin">
+                    <input type="text" id="volume-slider" class="span2" value="" data-slider-min="0"
+                           data-slider-max="100" data-slider-step="1" data-slider-value="50"
+                           data-slider-orientation="horizontal" data-slider-selection="after"
+                           data-slider-tooltip="hide">
                 </div>
             </div>
+            <div class="modal-footer">
+                <a href="#!" class=" modal-action modal-close waves-effect waves-light btn-flat">Close</a>
+            </div>
         </div>
-        <div id="editModal" class="modal fade" role="dialog">
-            <div class="modal-dialog">
-                <!-- Modal content-->
-                <div class="modal-content">
-                    <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal">&times;</button>
-                        <h4 class="modal-title">Edit</h4>
-                    </div>
-                    <div class="modal-body">
-                        <label for="type" class="song-input-label">Song Type</label>
-                        <select name="type" id="type" class="song-input-select">
-                            <option name="youtube" id="youtube">YouTube</option>
-                            <option name="soundcloud" id="soundcloud">SoundCloud</option>
-                        </select>
-                        <label for="mid" class="song-input-label">Song MID</label>
-                        <input class="song-input" name="mid" id="mid" type="text" />
-                        <label for="id" class="song-input-label">Song ID</label>
-                        <input class="song-input" name="id" id="id" type="text" />
-                        <label for="id" class="song-input-label">Song Artist</label>
-                        <input class="song-input" name="artist" id="artist" type="text" />
-                        <label for="title" class="song-input-label">Song Title</label>
-                        <input class="song-input" name="title" id="title" type="text" />
-                        <label for="title" class="song-input-label">Song Duration</label>
-                        <input class="song-input" name="duration" id="duration" type="number" />
-                        <label for="skip-duration" class="song-input-label">Skip Duration</label>
-                        <input class="song-input" id="skip-duration" type="number" />
-                        <label for="likes" class="song-input-label">Likes</label>
-                        <input class="song-input" id="likes" type="number"/>
-                        <label for="dislikes" class="song-input-label">Dislikes</label>
-                        <input class="song-input" id="dislikes" type="number"/>
-                        <label for="img" class="song-input-label">Song Image</label>
-                        <input class="song-input" name="img" id="img" type="text" />
-                        <button type="button" id="get-spotify-info" class="button">Get Spotify Data</button>
-                        <button type="button" id="save-song-button" class="button">Save Changes</button>
-                    </div>
-                    <div class="modal-footer">
-                        <button id="close-modal" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                    </div>
+    </div>
+    <!--div id="previewImageModal" class="modal modal-fixed-footer" role="dialog">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal">&times;</button>
+                    <h4 class="modal-title">Preview Image</h4>
+                </div>
+                <div class="modal-body">
+                    <img alt="Not loading" id="preview-image" height="210px" width="210px" src=""/>
+                </div>
+                <div class="modal-footer">
+                    <button id="close-modal" type="button" class="btn btn-default" data-dismiss="modal">Close
+                    </button>
                 </div>
             </div>
         </div>
+    </div-->
+    <div id="editModal" class="modal modal-fixed-footer">
+        <div class="modal-content">
+            <label for="mid" class="song-input-label">Song MID</label>
+            <input class="song-input" name="mid" id="mid" type="text"/>
+            <label for="id" class="song-input-label">Song ID</label>
+            <input class="song-input" name="id" id="id" type="text"/>
+            <label for="id" class="song-input-label">Song Artist</label>
+            <input class="song-input" name="artist" id="artist" type="text"/>
+            <label for="title" class="song-input-label">Song Title</label>
+            <input class="song-input" name="title" id="title" type="text"/>
+            <label for="title" class="song-input-label">Song Duration</label>
+            <input class="song-input" name="duration" id="duration" type="number"/>
+            <label for="skip-duration" class="song-input-label">Skip Duration</label>
+            <input class="song-input" id="skip-duration" type="number"/>
+            <label for="likes" class="song-input-label">Likes</label>
+            <input class="song-input" id="likes" type="number"/>
+            <label for="dislikes" class="song-input-label">Dislikes</label>
+            <input class="song-input" id="dislikes" type="number"/>
+            <label for="img" class="song-input-label">Song Image</label>
+            <input class="song-input" name="img" id="img" type="text"/>
+            <button type="button" id="get-spotify-info" class="button">Get Spotify Data</button>
+            <button type="button" id="save-song-button" class="button">Save Changes</button>
+        </div>
+        <div class="modal-footer">
+            <a href="#!" class="modal-action modal-close waves-effect waves-light btn-flat ">X</a>
+        </div>
     </div>
 </template>

app/client/templates/room.html

@@ -191,21 +191,12 @@
                             </select>
                             <hr>
                             <div id="search-info">
-                                <select name="type" id="search_type" class="song-input-select">
-                                    <option name="youtube" id="search_youtube">YouTube</option>
-                                    <option name="soundcloud" id="search_soundcloud">SoundCloud</option>
-                                </select>
                                 <input type="text" id="song-input" class="song-input" placeholder="Enter search query" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter search query'">
-                                <button type="button" id="search-song" class="button">Search</button>
+                                <button type="button" id="search-song" class="button">Search YouTube</button>
                                 <div id="song-results"></div>
                             </div>
                             <div id="add-info" style="display:none">
                                 <button type="button" id="return" class="button">Return</button>
-                                <label for="type" class="song-input-label">Song Type</label>
-                                <select name="type" id="type" class="song-input-select">
-                                    <option name="youtube" id="youtube">YouTube</option>
-                                    <option name="soundcloud" id="soundcloud">SoundCloud</option>
-                                </select>
                                 <label for="id" class="song-input-label">Song ID</label>
                                 <input class="song-input" name="id" id="id" type="text"/>
                                 <label for="id" class="song-input-label">Song Artist</label>

app/client/templates/stations.html

@@ -125,11 +125,6 @@
                             <h4 class="modal-title">Edit</h4>
                         </div>
                         <div class="modal-body">
-                            <label for="type" class="song-input-label">Song Type</label>
-                            <select name="type" id="type" class="song-input-select">
-                                <option name="youtube" id="youtube">YouTube</option>
-                                <option name="soundcloud" id="soundcloud">SoundCloud</option>
-                            </select>
                             <label for="mid" class="song-input-label">Song MID</label>
                             <input class="song-input" name="mid" id="mid" type="text" />
                             <label for="id" class="song-input-label">Song ID</label>