mirror of
https://github.com/KevinMidboe/zoff.git
synced 2025-10-29 18:00:23 +00:00
Fixed the remote, and removed materializecss stupid slider that struggles with click events
This commit is contained in:
@@ -54,7 +54,7 @@
|
||||
<h3 id="remote-text"></h3>
|
||||
</div>
|
||||
<div class="section">
|
||||
<form class="row" id="base" onsubmit="controll();return false;">
|
||||
<form class="row" id="base" onsubmit="window.location.href = '/remote/'+this.chan.value;return false;">
|
||||
<div class="input-field col s12">
|
||||
<input
|
||||
class="input-field"
|
||||
@@ -75,20 +75,21 @@
|
||||
</div>
|
||||
</form>
|
||||
<div id="remote-controls" style="display:none;">
|
||||
<a class="chan-link waves-effect btn green">
|
||||
<a class="chan-link waves-effect btn green" onclick="play();">
|
||||
<i id="remote_play" class="mdi-av-play-arrow"></i>
|
||||
</a>
|
||||
<a class="chan-link waves-effect btn gray">
|
||||
<a class="chan-link waves-effect btn gray" onclick="pause();">
|
||||
<i id="remote_pause" class="mdi-av-pause"></i>
|
||||
</a>
|
||||
<a class="chan-link waves-effect btn blue">
|
||||
<a class="chan-link waves-effect btn blue" onclick="skip();">
|
||||
<i id="remote_skip" class="mdi-av-skip-next"></i>
|
||||
</a>
|
||||
|
||||
</a>
|
||||
|
||||
</div>
|
||||
<p class="range-field">
|
||||
<!--<p class="range-field" onclick="console.log('test');">
|
||||
<input type="range" id="volume-control" style="display:none;" min="0" value="100" max="100" />
|
||||
</p>
|
||||
</p>-->
|
||||
<div id="volume-control"></div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
|
||||
@@ -24,7 +24,6 @@ process.on('uncaughtException', function(e){
|
||||
})
|
||||
|
||||
io.on('connection', function(socket){
|
||||
|
||||
socket.emit("get_list");
|
||||
|
||||
var guid = hash_pass(socket.handshake.headers["user-agent"] + socket.handshake.address + socket.handshake.headers["accept-language"]).substring(0,8);
|
||||
|
||||
@@ -770,3 +770,36 @@ ul #chat-log{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#volume-control {
|
||||
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-control .ui-slider-range-min {
|
||||
height:5px;
|
||||
width: 75px;
|
||||
position: absolute;
|
||||
background-color:rgba(47, 47, 47, 1);
|
||||
border: none;
|
||||
outline: none;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#volume-control .ui-slider-handle {
|
||||
height:15px;
|
||||
width:5px;
|
||||
background-color:black;
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
@@ -12,11 +12,13 @@ socket.on("id", function(id)
|
||||
{
|
||||
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]);
|
||||
choose_button(arr[1], false);
|
||||
}else if(arr[0] == "channel")
|
||||
{
|
||||
socket.emit("change_channel");
|
||||
|
||||
@@ -10,25 +10,25 @@ $(document).ready(function (){
|
||||
control();
|
||||
});
|
||||
|
||||
document.getElementById("remote_play").addEventListener("click", function()
|
||||
function play()
|
||||
{
|
||||
socket.emit("id", [id, "play", "mock"]);
|
||||
});
|
||||
};
|
||||
|
||||
document.getElementById("remote_pause").addEventListener("click", function()
|
||||
function pause()
|
||||
{
|
||||
socket.emit("id", [id, "pause", "mock"]);
|
||||
});
|
||||
};
|
||||
|
||||
document.getElementById("remote_skip").addEventListener("click", function()
|
||||
function skip()
|
||||
{
|
||||
socket.emit("id", [id, "skip", "mock"]);
|
||||
});
|
||||
|
||||
};
|
||||
/*
|
||||
document.getElementById("volume-control").addEventListener("click", function()
|
||||
{
|
||||
socket.emit("id", [id, "volume", $("#volume-control").val()]);
|
||||
});
|
||||
});*/
|
||||
|
||||
function control()
|
||||
{
|
||||
@@ -40,14 +40,32 @@ function control()
|
||||
|
||||
$("#volume-control").css("display", "block");
|
||||
$("#remote-controls").css("display", "block");
|
||||
|
||||
document.getElementById("base").setAttribute("onsubmit", "control(); return false;");
|
||||
$("#remote-text").text("Controlling "+ id.toUpperCase())
|
||||
$("#code-input").attr("length", "18");
|
||||
$("#code-input").attr("maxlength", "18");
|
||||
document.getElementById("search").setAttribute("length", "18");
|
||||
document.getElementById("search").setAttribute("maxlength", "18");
|
||||
$("#forsearch").html("Type new channel name to change to");
|
||||
|
||||
$("#volume-control").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", $("#code-input").val().toLowerCase()]);
|
||||
$("#code-input").val("");
|
||||
socket.emit("id", [id, "channel", $("#search").val().toLowerCase()]);
|
||||
$("#search").val("");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user