Controller is up

static/css/style.css

@@ -753,3 +753,37 @@ ul #chat-log{
         padding:0px 0px 0px 0px;
     }
 }
+
+#volume-controll {
+    cursor:pointer;
+  float:left;
+    position: relative;
+    left: 10px;
+    margin: 13px auto;
+    height:5px;
+    width: 97%;
+    background-color:rgba(0, 0, 0, 0.5);
+    border: none;
+    outline: none;
+    border-radius: 2px;
+}
+
+#volume-controll .ui-slider-range-min {
+    height:5px;
+    width: 75px;
+    position: absolute;
+    background-color:rgba(55, 255, 0, 1);
+    border: none;
+    outline: none;
+    border-radius: 2px;
+}
+
+#volume-controll .ui-slider-handle {
+    height:15px;
+    width:5px;
+    background-color:black;
+    position: absolute;
+    cursor: pointer;
+    outline: none;
+    border: none;
+}

static/js/controller.js

@@ -1,17 +1,17 @@
 var began = false;
+var id
 
-socket.on("guid", function(guid)
+socket.on("id", function(id)
 {
-  console.log(guid);
   if(!began)
   {
-    socket.on(guid, function(arr)
+    socket.on(id, function(arr)
     {
-        console.log(arr);
         if(arr[0] == "volume")
         {
           $("#volume").slider("value", arr[1]);
           ytplayer.setVolume(arr[1]);
+          localStorage.setItem("volume", arr[1]);
         }else if(arr[0] == "channel")
         {
           socket.emit("change_channel");

static/js/mobilecontroller.js

@@ -0,0 +1,42 @@
+var start = true;
+var id;
+var socket;
+
+$(document).ready(function (){
+    setTimeout(function(){$("#search").focus();},500);
+    socket = io.connect('http://'+window.location.hostname+':3000');
+});
+
+function controll()
+{
+  if(start)
+  {
+    id = $("#search").val().toLowerCase();
+    $("#search").val("");
+    start = false;
+    $("#volume-controll").css("display", "block");
+    $("#search").attr("length", "18");
+    $("#search").attr("maxlength", "18");
+    $("#forsearch").html("Type new channel name to change to")
+    $("#volume-controll").slider({
+  	    min: 0,
+  	    max: 100,
+  	    value: 100,
+  			range: "min",
+  			animate: true,
+  	    /*slide: function(event, ui) {
+          console.log(ui.value);
+  				//localStorage.setItem("volume", ui.value);
+  	    },*/
+        stop:function(event, ui) {
+          socket.emit("id", [id, "volume", ui.value]);
+          //console.log(ui.value);
+        }
+  	});
+  }else
+  {
+    socket.emit("id", [id, "channel", $("#search").val().toLowerCase()]);
+    $("#search").val("");
+  }
+
+}