Locked password alert shows up correctly

server/public/assets/css/style.css

@@ -436,6 +436,10 @@ footer{
   z-index: 9999999999 !important;
 }
 
+.material-tooltip {
+  z-index: 999999 !important;
+}
+
 #user_password {
   width: 50% !important;
 }

server/public/assets/js/admin.js

@@ -100,7 +100,7 @@ var Admin = {
         w_p       = false;
         adminpass = msg;
         names     = ["vote","addsongs","longsongs","frontpage", "allvideos",
-        "removeplay", "skip", "shuffle"];
+        "removeplay", "skip", "shuffle", "userpass"];
 
         Crypt.set_pass(chan.toLowerCase(), Crypt.decrypt_pass(msg));
 
@@ -120,6 +120,11 @@ var Admin = {
         }
         $("#password").val("");
         $("#password").attr("placeholder", "Change channel password");
+        $(".user-password-li").removeClass("hide");
+        console.log($(".password_protected").prop("checked"));
+        if($(".password_protected").prop("checked")) {
+            $(".change_user_pass").removeClass("hide");
+        }
         //if(!Helper.mobilecheck()){
         if(!Helper.contains($(".playlist-tabs").attr("class").split(" "), "hide")) {
             $(".playlist-tabs-loggedIn").removeClass("hide");
@@ -200,6 +205,18 @@ var Admin = {
             }
         }
 
+        if(!$(".user-password-li").hasClass("hide")) {
+            $(".user-password-li").addClass("hide")
+        }
+
+        if($(".password_protected").prop("checked")) {
+            $(".change_user_pass").removeClass("hide");
+        }
+
+        if(!$(".change_user_pass").hasClass("hide")) {
+            $(".change_user_pass").addClass("hide");
+        }
+
         if(!Helper.contains($(".playlist-tabs-loggedIn").attr("class").split(" "), "hide")){
             $(".playlist-tabs-loggedIn").addClass("hide");
             $(".playlist-tabs").removeClass("hide");
@@ -224,8 +241,8 @@ var Admin = {
     },
 
     //function used in html onlick
-    save: function(){
+    save: function(userpass){
-    	Admin.submitAdmin(document.getElementById("adminForm").elements);
+    	Admin.submitAdmin(document.getElementById("adminForm").elements, userpass);
     },
 
     set_conf: function(conf_array)
@@ -233,7 +250,7 @@ var Admin = {
         music     = conf_array.allvideos;
         longsongs = conf_array.longsongs;
         names     = ["vote","addsongs","longsongs","frontpage", "allvideos",
-                    "removeplay", "skip", "shuffle"];
+                    "removeplay", "skip", "shuffle", "userpass"];
 
 
         if(conf_array.adminpass === "" || !w_p){
@@ -259,6 +276,14 @@ var Admin = {
                 $(".playlist-tabs").addClass("hide");
             }
             $("#password").attr("placeholder", "Create channel password");
+        } else {
+            if($(".password_protected").prop("checked")) {
+                $(".change_user_pass").removeClass("hide");
+            }
+        }
+
+        if(!$(".password_protected").prop("checked") && !$(".change_user_pass").hasClass("hide")) {
+            $(".change_user_pass").addClass("hide");
         }
 
         if(conf_array.thumbnail != undefined && conf_array.thumbnail != ""){
@@ -275,7 +300,7 @@ var Admin = {
         }*/
     },
 
-    submitAdmin: function(form)
+    submitAdmin: function(form, userpass_changed)
     {
     	voting     = form.vote.checked;
     	addsongs   = form.addsongs.checked;
@@ -286,7 +311,7 @@ var Admin = {
     	skipping   = form.skip.checked;
     	shuffling  = form.shuffle.checked;
     	configs    = {
-            voting: voting, addsongs: addsongs, longsongs: longsongs, frontpage: frontpage, allvideos: allvideos, removeplay: removeplay, adminpass: adminpass, skipping: skipping, shuffling: shuffling
+            voting: voting, addsongs: addsongs, longsongs: longsongs, frontpage: frontpage, allvideos: allvideos, removeplay: removeplay, adminpass: adminpass, skipping: skipping, shuffling: shuffling, userpass: userpass, userpass_changed: userpass_changed
         };
 
     	socket.emit("conf", configs);

server/public/assets/js/frontpage.js

@@ -427,8 +427,8 @@ function initfp(){
 
     if(window.location.hostname == "zoff.me") add = "https://zoff.me";
     else add = window.location.hostname;
-    if(socket === undefined || Helper.mobilecheck()) socket = io.connect(''+add+':8080', connection_options);
+    if(socket === undefined || Helper.mobilecheck() || user_auth_avoid) socket = io.connect(''+add+':8080', connection_options);
-    if($("#alreadyfp").length === 0 || Helper.mobilecheck() || !socket._callbacks.$playlists){
+    if($("#alreadyfp").length === 0 || Helper.mobilecheck() || !socket._callbacks.$playlists || user_auth_avoid){
       setup_playlist_listener();
     }
 

server/public/assets/js/list.js

@@ -10,6 +10,7 @@ var List = {
 
     channel_function: function(msg)
     {
+        user_auth_started = false;
         switch(msg.type)
         {
             case "list":

server/public/assets/js/listeners.js

@@ -16,6 +16,9 @@ var filesadded		   	  = "";
 var player_ready 	   	  = false;
 var viewers 			  = 1;
 var dragging = false;
+var user_auth_started = false;
+var user_auth_avoid = false;
+var user_change_password = false;
 var paused 				  = false;
 var currently_showing_channels = 1;
 var playing 			  = false;
@@ -23,6 +26,7 @@ var SAMPLE_RATE 		  = 6000; // 6 seconds
 var lastSample 			  = Date.now();
 var fireplace_initiated   = false;
 var began 				  = false;
+var userpass              = "";
 var i 					  = -1;
 var lazy_load    		  = false;
 var embed				  = false;
@@ -209,6 +213,8 @@ function init(){
 			socket = io.connect(''+add+':8080', connection_options);
 		}
 
+        setup_auth_listener();
+
 	    Crypt.init();
 	    if(Crypt.get_offline()){
 	        $(".offline_switch_class")[0].checked = true;
@@ -476,6 +482,15 @@ function chromecastListener(evt, data){
     }
 }
 
+function setup_auth_listener() {
+    socket.on('auth_required', function() {
+        user_auth_started = true;
+        $("#player_overlay").removeClass("hide");
+        $("#player_overlay").css("display", "block");
+        $("#user_password").modal("open");
+    });
+}
+
 function setup_no_connection_listener(){
     socket.on('connect_failed', function(){
         Helper.log('Connection Failed');
@@ -727,7 +742,6 @@ window.disable_debug = disable_debug;
 
 function seekToMove(e){
 		//if(!Helper.mobilecheck()) {
-		console.log("hello");
 	    var pos_x = e.clientX - Math.ceil($("#seekToDuration").width() / 2) - 8;
 	    if(pos_x < 0) pos_x = 0;
 	    else if(pos_x + $("#seekToDuration").width() > $("#controls").width()) {
@@ -959,17 +973,74 @@ $(document).on("change", ".password_protected", function(e) {
     if(this.checked) {
         //alert("kwek");
         $("#user_password").modal('open');
+        $("#user-pass-input").focus();
+    } else {
+        userpass = "";
+        if(!$(".change_user_pass").hasClass("hide")) $(".change_user_pass").addClass("hide");
+        Admin.save(false);
     }
 });
 
+$(document).on("submit", "#user-password-channel-form", function(e) {
+    e.preventDefault();
+    console.log(user_auth_started);
+    if(user_auth_started) {
+        user_auth_started = false;
+        //$("#user_password").modal('close');
+        $("#user-pass-input").val("");
+        socket.emit("list", chan.toLowerCase());
+    } else {
+        $("#user_password").modal('close');
+        userpass = $("#user-pass-input").val();
+        user_change_password = false;
+        $("#user-pass-input").val("");
+        Admin.save(true);
+    }
+});
+
+$(document).on("click", ".change_user_pass_btn", function(e) {
+    e.preventDefault();
+    user_change_password = true;
+    $("#user_password").modal('open');
+    $("#user-pass-input").focus();
+});
+
 $(document).on("click", ".submit-user-password", function(e) {
     e.preventDefault();
+    console.log(user_auth_started);
+    if(user_auth_started) {
+        user_auth_started = false;
+        //$("#user_password").modal('close');
+        $("#user-pass-input").val("");
+        socket.emit("list", chan.toLowerCase());
+    } else {
         $("#user_password").modal('close');
-    console.log($("#user-pass-input").val());
+        userpass = $("#user-pass-input").val();
-})
+        user_change_password = false;
+        $("#user-pass-input").val("");
+        Admin.save(true);
+    }
+});
 
 $(document).on("click", ".close-user-password", function() {
+    if(user_auth_started) {
+        Player.stopInterval = true;
+        user_auth_avoid = true;
+        $('.castButton-active').tooltip("remove");
+		$("#viewers").tooltip("remove");
+		$('.castButton-unactive').tooltip("remove");
+		$("#offline-mode").tooltip("remove");
+		$('#chan_thumbnail').tooltip("remove");
+		$('#admin-lock').tooltip("remove");
+        window.history.pushState("to the frontpage!", "Title", "/");
+    	onepage_load();
+    } else {
+        $("#user-pass-input").val("");
+        if(!user_change_password) {
             $(".password_protected").prop("checked", false);
+        }
+        user_change_password = false;
+    }
 });
 
 $(document).on("click", ".not-exported-container .not-exported-element #extra-export-container-text .extra-add-text", function(){
@@ -1084,7 +1155,7 @@ $(document).on("change", 'input[class=offline_switch_class]', function()
 
 $(document).on("change", 'input[class=conf]', function()
 {
-    Admin.save();
+    Admin.save(false);
 });
 
 $("#clickme").click(function(){
@@ -1609,6 +1680,7 @@ function onepage_load(){
 			if(private_channel) add = Crypt.getCookie("_uI") + "_";
 	    socket.emit("list", add + chan.toLowerCase());
 	}else if(url_split[3] === ""){
+        user_change_password = false;
         clearTimeout(width_timeout);
 		if(fireplace_initiated){
         fireplace_initiated = false;
@@ -1637,7 +1709,7 @@ function onepage_load(){
 		    url: "/",
 		    success: function(e){
 
-		    	if(Helper.mobilecheck()) {
+		    	if(Helper.mobilecheck() || user_auth_avoid) {
                     Helper.log("Removing all listeners");
 		    		socket.removeAllListeners();
 		    		socket.disconnect();
@@ -1655,14 +1727,14 @@ function onepage_load(){
     			document.getElementById("playpause").removeEventListener("click", Playercontrols.play_pause);
     			document.getElementById("fullscreen").removeEventListener("click", Playercontrols.fullscreen);
 
-			    if(Helper.mobilecheck()) {
+			    if(Helper.mobilecheck() || user_auth_avoid) {
 			    	video_id   = "";
 			    	song_title = "";
 		    	}
 
 		    	$("meta[name=theme-color]").attr("content", "#2D2D2D");
 
-		    	if(!Helper.mobilecheck()){
+		    	if(!Helper.mobilecheck() && !user_auth_avoid){
                     $(".video-container").resizable("destroy");
 		    		$("main").append("<a id='closePlayer' title='Close Player'>X</a>");
 		    		$("#playbar").remove();
@@ -1694,7 +1766,7 @@ function onepage_load(){
                 $("header").html($(response.find("header")).html());
                 $($(response.find(".section.mega"))).insertAfter("header");
                 $($(response.find(".section.mobile-search"))).insertAfter(".mega");
-                if(Helper.mobilecheck()) $("main").html($(response.find("main")).html());
+                if(Helper.mobilecheck() || user_auth_avoid) $("main").html($(response.find("main")).html());
                 else $("main").append($(response.find("#main_section_frontpage")).wrap("<div>").parent().html());
 		      	$(".page-footer").removeClass("padding-bottom-extra");
 		      	$(".page-footer").removeClass("padding-bottom-novideo");
@@ -1709,11 +1781,13 @@ function onepage_load(){
 		            initfp();
 		        }
 
-		      	if($("#alreadychannel").length === 0){
+		      	if($("#alreadychannel").length === 0 && !user_auth_avoid){
 		      		$("head").append("<div id='alreadychannel'></div");
+		      	} else if(user_auth_avoid) {
+                    $("#alreadychannel").remove();
                 }
 		      	$("#channel-load").css("display", "none");
-
+                user_auth_avoid = false;
 		    }
 		});
 	}

server/public/assets/js/player.js

@@ -229,6 +229,7 @@ var Player = {
     },
 
     loadVideoById: function(id){
+        console.log(id);
         if(chromecastAvailable){
             castSession.sendMessage("urn:x-cast:zoff.me", {type: "loadVideo", videoId: id});
             chrome.cast.media.GenericMediaMetadata({metadataType: "GENERIC", title:song_title, image: 'https://img.youtube.com/vi/'+id+'/mqdefault.jpg'});
@@ -307,6 +308,7 @@ var Player = {
 
     errorHandler: function(newState)
     {
+        if(!user_auth_started) {
         	if(newState.data == 5 || newState.data == 100 ||
                 newState.data == 101 || newState.data == 150)
             {
@@ -328,8 +330,10 @@ var Player = {
                     Player.count ++;
                     }, Math.floor((Math.random() * 100) + 1));
                 }*/
-    	}else if(video_id !== undefined)
+        	}else if(video_id !== undefined) {
         		Player.loadVideoById(video_id);
+            }
+        }
     },
 
     onPlayerReady: function(event) {
@@ -477,8 +481,9 @@ var Player = {
         /*try{
             //duration = Player.player.getDuration();
         }catch(e){};*/
-        if(duration !== undefined){
         try{
+            if(!user_auth_avoid && duration !== undefined){
+
                 if(!Player.stopInterval) durationBegun = true;
                 dMinutes = Math.floor(duration / 60);
                 dSeconds = duration - dMinutes * 60;
@@ -495,9 +500,10 @@ var Player = {
                     per = 0;
 
                 if(!dragging) $("#bar").width(per+"%");
-            }catch(e){
 
             }
+        }catch(e){
+
         }
         if(!Player.stopInterval) setTimeout(Player.durationSetter, 1000);
     },

server/public/layouts/channel.handlebars

@@ -91,10 +91,11 @@
       </div>
       <div id="user_password" class="modal">
             <div class="modal-content">
-                  <h5>Password</h5>
+                  <h5>Locked Channel</h5>
                 <form id="user-password-channel-form">
                       <div class="input-field">
                            <input id="user-pass-input" name="user-pass" type="password" autocomplete="off" />
+                           <label for="user-pass-input" class="noselect">Password</label>
                      </div>
                 </form>
             </div>

server/public/partials/panel.handlebars

@@ -92,14 +92,17 @@
                             <span class="right-span">Remove</span>
                         </label></div></li>
 
-                        <li><span class="switch-text">
+                        <li class="user-password-li hide"><span class="switch-text">
                             User password
                           </span>
                             <div class="switch"><label>
                             <span class="left-span">No</span>
-                            <input name="password_protected" type="checkbox" class="conf password_protected" /><span class="lever"></span>
+                            <input name="userpass" type="checkbox" class="conf password_protected" /><span class="lever"></span>
                             <span class="right-span">Yes</span>
                         </label></div></li>
+                        <li class="change_user_pass hide">
+                            <a href="#!" class="change_user_pass_btn btn waves-effect">Change password</a>
+                        </li>
                       </ul>
                 </form>
             </div>

server/server.js

@@ -355,6 +355,8 @@ io.on('connection', function(socket){
     {
         if(typeof(list) === 'string' && list !== undefined && list !== null && list !== "")
         {
+            db.collection(list).find({views: {$exists: true}}, function(err, docs) {
+              if(docs.length == 0 || docs[0].userpass == "" || docs[0].userpass == undefined) {
                     in_list = true;
                     coll = emojiStrip(list).toLowerCase();
                     //coll = decodeURIComponent(coll);
@@ -379,6 +381,10 @@ io.on('connection', function(socket){
                             });
                         }
                     });
+              } else {
+                  socket.emit("auth_required");
+              }
+            })
         }
     });
 
@@ -703,6 +709,13 @@ io.on('connection', function(socket){
             var adminpass = params.adminpass;
             var skipping = params.skipping;
             var shuffling = params.shuffling;
+            var userpass = params.userpass;
+            console.log(params.userpass_changed, frontpage, userpass);
+            if(!params.userpass_changed && frontpage) {
+              userpass = "";
+            } else if(params.userpass_changed && userpass != "") {
+              frontpage = false;
+            }
             var description = "";
             var hash;
             if(params.description) description = params.description;
@@ -725,10 +738,13 @@ io.on('connection', function(socket){
                         shuffle:shuffling,
                         longsongs:longsongs,
                         adminpass:hash,
-                        desc: description
+                        desc: description,
+                        userpass: userpass,
                     }}, function(err, docs){
                         db.collection(coll).find({views:{$exists:true}}, function(err, docs){
                             if(docs[0].adminpass !== "") docs[0].adminpass = true;
+                            if(docs[0].hasOwnProperty("userpass") && docs[0].userpass != "") docs[0].userpass = true;
+                            else docs[0].userpass = false;
                             io.to(coll).emit("conf", docs);
                             socket.emit("toast", "savedsettings");
 
@@ -1160,6 +1176,8 @@ function send_list(coll, socket, send, list_send, configs, shuffled)
         if(configs)
         {
             if(conf[0].adminpass !== "") conf[0].adminpass = true;
+            if(conf[0].hasOwnProperty("userpass") && conf[0].userpass != "") conf[0].userpass = true;
+            else conf[0].userpass = false;
             io.to(coll).emit("conf", conf);
         }
     });
@@ -1182,6 +1200,8 @@ function send_play(coll, socket)
                 }else if(conf !== null && conf !== undefined && conf.length !== 0)
                 {
                     if(conf[0].adminpass !== "") conf[0].adminpass = true;
+                    if(conf[0].hasOwnProperty("userpass") && conf[0].userpass != "") conf[0].userpass = true;
+                    else conf[0].userpass = false;
                     toSend = {np: np, conf: conf, time: get_time()};
                     if(socket === undefined)
                         io.to(coll).emit("np", toSend);