Added option for autoplay in embed

index.php

@@ -158,7 +158,7 @@
             </div>
             <div class="modal-content">
               <h4>Embed code (in beta)</h4>
-              <p>Copy the code in the textarea, and paste on your website.</p>
+              <p>Copy the code in the textarea, and paste on your website. Remove the &amp; and autoplay, to prevent the player to autoplay.</p>
               <textarea id="embed-area"></textarea>
             </div>
         </div>

php/channel.php

@@ -150,7 +150,7 @@
             </div>
             <div class="modal-content">
               <h4>Embed code (in beta)</h4>
-              <p>Copy the code in the textarea, and paste on your website.</p>
+              <p>Copy the code in the textarea, and paste on your website. Remove the &amp; and autoplay, to prevent the player to autoplay.</p>
               <textarea id="embed-area"></textarea>
             </div>
         </div>

static/js/embed.js

@@ -13,7 +13,9 @@ var seekTo;
 var socket;
 var video_id;
 var previous_video_id;
-var chan = window.location.hash.substring(1);
+var hash 	 = window.location.hash.substring(1).split("&");
+var chan 	 = hash[0];
+var autoplay = false;
 
 var connection_options = {
 	'sync disconnect on unload':true,
@@ -23,6 +25,11 @@ var connection_options = {
 
 $(document).ready(function(){
 
+	if(hash.length == 2 && hash[1] == "autoplay"){
+		autoplay = true;
+		paused   = true;
+	}
+
 	$("head").append('<link type="text/css" rel="stylesheet" href="/static/css/embed.css" />');
 	$("head").append('<link type="text/css" rel="stylesheet" href="/static/css/materialize.min.css" />');
 
@@ -33,10 +40,10 @@ $(document).ready(function(){
 	    setTimeout(function(){socket.emit('list', chan.toLowerCase())},1000);
 	});
 
+
 	Youtube.setup_youtube_listener(chan);
 	List.channel_listener();
 
-
 	window.onYouTubeIframeAPIReady = Youtube.onYouTubeIframeAPIReady;
 
 	Youtube.loadPlayer();

static/js/listeners.js

@@ -26,6 +26,7 @@ var began 				  = false;
 var i 					  = -1;
 var lazy_load    		  = true;
 var embed				  = false;
+var autoplay			  = true;
 
 var id;
 var full_playlist;
@@ -191,7 +192,7 @@ function init(){
 	}, 1000);
 	
 	$("#embed-button").css("display", "inline-block");
-	$("#embed-area").val('<embed src="https://zoff.no/embed.html#' + chan.toLowerCase() + '" width="600px" height="300px">');
+	$("#embed-area").val('<embed src="https://zoff.no/embed.html#' + chan.toLowerCase() + '&autplay" width="600px" height="300px">');
 
 }
 

static/js/playercontrols.js

@@ -65,6 +65,14 @@ var Playercontrols = {
     	}
     },
 
+    play_pause_show: function()
+    {
+        if(document.getElementById("pause").className.split(" ").length == 1)
+            $("#pause").toggleClass("hide");
+        if(document.getElementById("play").className.split(" ").length == 2)
+            $("#play").toggleClass("hide");
+    },
+
     settings: function()
     {
     	$("#qS").toggleClass("hide");

static/js/youtube.js

@@ -111,10 +111,7 @@ var Youtube = {
     		case 2:
     			paused = true;
 
-    			if(document.getElementById("pause").className.split(" ").length == 1)
+    			Playercontrols.play_pause_show();
-    				$("#pause").toggleClass("hide");
-    			if(document.getElementById("play").className.split(" ").length == 2)
-    				$("#play").toggleClass("hide");
     			break;
     		case 3:
     			break;
@@ -173,11 +170,15 @@ var Youtube = {
 			$("#controls").css("opacity", "1");
 			$(".playlist").css("opacity", "1");
 			Youtube.ytplayer.loadVideoById(video_id);
-            Youtube.ytplayer.playVideo();
+            if(autoplay) Youtube.ytplayer.playVideo();
             Youtube.durationSetter();
             if(embed){
                 setTimeout(function(){
                     Youtube.ytplayer.seekTo(seekTo);
+                    if(!autoplay){
+                        Youtube.ytplayer.pauseVideo();
+                        Playercontrols.play_pause_show();
+                    }
                 }, 1000);
             }else
             Youtube.ytplayer.seekTo(seekTo);