diff --git a/php/controller.php b/php/controller.php new file mode 100644 index 00000000..1f6db75f --- /dev/null +++ b/php/controller.php @@ -0,0 +1,148 @@ + + + + + +
+ + + +
+ +
+
+
+
+ + + + +
+
+ +
+ +
+ +
+
+ + + + + + + + + + + + diff --git a/server/server.js b/server/server.js index 22d8e15e..1f591528 100755 --- a/server/server.js +++ b/server/server.js @@ -114,7 +114,7 @@ io.on('connection', function(socket){ }); }); - socket.on('guid', function(arr) + socket.on('id', function(arr) { io.sockets.emit(arr[0], [arr[1], arr[2]]); }); @@ -128,7 +128,7 @@ io.on('connection', function(socket){ coll = list[0].toLowerCase(); //guid = list[1]; - socket.emit("guid", socket.id); + socket.emit("id", rndName(socket.id).substring(0,8)); //console.log(name + " joined list " + coll); diff --git a/static/css/style.css b/static/css/style.css index c504d782..eaa9f042 100755 --- a/static/css/style.css +++ b/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; +} diff --git a/static/js/controller.js b/static/js/controller.js index ae9efca0..4e3fdf7c 100644 --- a/static/js/controller.js +++ b/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"); diff --git a/static/js/mobilecontroller.js b/static/js/mobilecontroller.js new file mode 100644 index 00000000..b40eace8 --- /dev/null +++ b/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(""); + } + +}