Trying out incapsulation

This commit is contained in:
Kasper Rynning-Tønnesen
2015-06-23 18:55:26 +02:00
parent b22d3b3adf
commit fdab1aca56
6 changed files with 69 additions and 78 deletions

View File

@@ -26,7 +26,7 @@
</div> </div>
<ul class="title-container"> <ul class="title-container">
<li class="song-title truncate" id="song-title" onclick="showSearch();"> <li class="song-title truncate" id="song-title">
Loading... Loading...
</li> </li>
<li class="search-container hide" id="search-wrapper"> <li class="search-container hide" id="search-wrapper">
@@ -81,19 +81,19 @@
</div> </div>
</li> </li>
<li> <li>
<a class="nav-btn" href="#find" id="search-btn" onclick="showSearch();"> <a class="nav-btn" href="#find" id="search-btn">
<i class="mdi-action-search"></i> <i class="mdi-action-search"></i>
<span class="hover-text">Find</span> <span class="hover-text">Find</span>
</a> </a>
</li> </li>
<li> <li>
<a class="nav-btn" href="#skip" id="skip" onclick="skip();"> <a class="nav-btn" href="#skip" id="skip">
<i class="mdi-av-skip-next"></i> <i class="mdi-av-skip-next"></i>
<span class="hover-text">Skip</span> <span class="hover-text">Skip</span>
</a> </a>
</li> </li>
<li> <li>
<a class="nav-btn hide-on-small-only" href="#stir" id="shuffle" onclick="shuffle();"> <a class="nav-btn hide-on-small-only" href="#stir" id="shuffle">
<i class="mdi-av-shuffle"></i> <i class="mdi-av-shuffle"></i>
<span class="hover-text">Stir</span> <span class="hover-text">Stir</span>
</a> </a>
@@ -161,7 +161,7 @@
</ul> </ul>
</li> </li>
<li id="chat-input"> <li id="chat-input">
<form action="#" onsubmit="chat(this.input);return false;"> <form action="#" id="chatForm" onsubmit="return false;">
<input id="text-chat-input" name="input" type="text" autocomplete="off" placeholder="Chat" maxlength="150" /> <input id="text-chat-input" name="input" type="text" autocomplete="off" placeholder="Chat" maxlength="150" />
</form> </form>
</li> </li>

View File

@@ -66,20 +66,13 @@
<script type="text/javascript" src="https://cdn.socket.io/socket.io-1.3.5.js"></script> <script type="text/javascript" src="https://cdn.socket.io/socket.io-1.3.5.js"></script>
<!--<script type="text/javascript" src="/static/js/lib/iscroll-min.js"></script>--> <!--<script type="text/javascript" src="/static/js/lib/iscroll-min.js"></script>-->
<script type="text/javascript" src="https://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/sha256.js"></script> <script type="text/javascript" src="https://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/sha256.js"></script>
<script> <script type="text/javascript" src="/static/js/zoff.js"></script>
var socket = io.connect('//'+window.location.hostname+':3000'); <!--<script type="text/javascript" src="/static/js/list.js"></script>
var guid = "<?php echo $guid; ?>";
socket.on("get_list", function(){
socket.emit('list', '<?php echo $list; ?>,'+guid);
});
</script>
<script type="text/javascript" src="/static/js/list.js"></script>
<script type="text/javascript" src="/static/js/searchlist.js"></script> <script type="text/javascript" src="/static/js/searchlist.js"></script>
<script type="text/javascript" src="/static/js/playercontrols.js"></script> <script type="text/javascript" src="/static/js/playercontrols.js"></script>
<script type="text/javascript" src="/static/js/youtube.js"></script> <script type="text/javascript" src="/static/js/youtube.js"></script>
<script type="text/javascript" src="/static/js/search.js"></script> <script type="text/javascript" src="/static/js/search.js"></script>
<script type="text/javascript" src="/static/js/admin.js"></script> <script type="text/javascript" src="/static/js/admin.js"></script>
<script type="text/javascript" src="/static/js/chat.js"></script> <script type="text/javascript" src="/static/js/chat.js"></script>
<script type="text/javascript" src="/static/js/hostcontroller.js"></script> <script type="text/javascript" src="/static/js/hostcontroller.js"></script>-->
<!--<script type="text/javascript" src="/static/js/remotecontroller.js"></script>--> <!--<script type="text/javascript" src="/static/js/remotecontroller.js"></script>-->

View File

@@ -4,16 +4,16 @@
<a class="col s9 collapsible-header bold waves-effect admin-settings"> <a class="col s9 collapsible-header bold waves-effect admin-settings">
Channel Settings Channel Settings
<i class="mdi-image-tune"></i> <i class="mdi-image-tune"></i>
<div class="nav-btn close-settings clickable" title="Close" onclick="hide_settings();"> <div class="nav-btn close-settings clickable" title="Close" id="closeSettings">
<i class="mdi-navigation-close auto-margin"></i> <i class="mdi-navigation-close auto-margin"></i>
</div> </div>
</a> </a>
<div class="collapsible-body"> <div class="collapsible-body">
<form action="#" id="adminForm" onsubmit="pass_save();return false;"> <form action="#" id="adminForm" onsubmit="return false;">
<ul> <ul>
<li class="white-bg"> <li class="white-bg">
<div class="input-field field-settings"> <div class="input-field field-settings">
<i id="admin-lock" class="mdi-action-lock" onclick="log_out()" title="Click to log out"></i> <i id="admin-lock" class="mdi-action-lock" title="Click to log out"></i>
<input placeholder="Enter channel password" id="password" type="password" class="validate" /> <input placeholder="Enter channel password" id="password" type="password" class="validate" />
</div> </div>
</li> </li>

View File

@@ -153,8 +153,7 @@ io.on('connection', function(socket){
if(list !== undefined && list !== null && list != "") if(list !== undefined && list !== null && list != "")
{ {
in_list = true; in_list = true;
list = list.split(','); coll = list.toLowerCase();
coll = list[0].toLowerCase();
socket.join(coll); socket.join(coll);
socket.join(short_id); socket.join(short_id);
socket.emit("id", short_id); socket.emit("id", short_id);

View File

@@ -1,5 +1,5 @@
var began = false; var began = false;
var id var id;
socket.on("id", function(id) socket.on("id", function(id)
{ {

View File

@@ -173,72 +173,71 @@ function search(search_input){
success: function(response){ success: function(response){
if(response.items){ if(response.items){
//get list of IDs and make new request for video info //get list of IDs and make new request for video info
$.each(response.items, function(i,data) $.each(response.items, function(i,data)
{
vid_url += data.id.videoId+",";
});
console.log("Search for: "+keyword)
$.ajax({
type: "GET",
url: vid_url,
dataType:"jsonp",
success: function(response){
var output = "";
var pre_result = $(result_html);
//$("#results").append(result_html);
$.each(response.items, function(i,song)
{ {
var duration=song.contentDetails.duration; vid_url += data.id.videoId+",";
secs=durationToSeconds(duration) });
if(!longsongs || secs<720){ console.log("Search for: "+keyword)
title=song.snippet.title;
enc_title=encodeURIComponent(title).replace(/'/g, "\\\'"); $.ajax({
id=song.id; type: "GET",
duration = duration.replace("PT","").replace("H","h ").replace("M","m ").replace("S","s") url: vid_url,
thumb=song.snippet.thumbnails.medium.url; dataType:"jsonp",
success: function(response){
var output = "";
var pre_result = $(result_html);
//$("#results").append(result_html); //$("#results").append(result_html);
var songs = pre_result;
songs.find(".search-title").text(title); $.each(response.items, function(i,song)
songs.find(".result_info").text(duration); {
songs.find(".thumb").attr("src", thumb); var duration=song.contentDetails.duration;
songs.find(".add-many").attr("onclick", "submit('"+id+"','"+enc_title+"',"+secs+");"); secs=durationToSeconds(duration)
$($(songs).find("div")[0]).attr("onclick", "submitAndClose('"+id+"','"+enc_title+"',"+secs+");"); if(!longsongs || secs<720){
$($(songs).find("div")[0]).attr("id", id) title=song.snippet.title;
output += songs.html(); enc_title=encodeURIComponent(title).replace(/'/g, "\\\'");
id=song.id;
duration = duration.replace("PT","").replace("H","h ").replace("M","m ").replace("S","s")
thumb=song.snippet.thumbnails.medium.url;
//$("#results").append(result_html);
var songs = pre_result;
songs.find(".search-title").text(title);
songs.find(".result_info").text(duration);
songs.find(".thumb").attr("src", thumb);
songs.find(".add-many").attr("onclick", "submit('"+id+"','"+enc_title+"',"+secs+");");
$($(songs).find("div")[0]).attr("onclick", "submitAndClose('"+id+"','"+enc_title+"',"+secs+");");
$($(songs).find("div")[0]).attr("id", id)
output += songs.html();
}
});
console.log(response.items.length);
$("<div style='display:none;' id='mock-div'>"+output+"</div>").appendTo($("#results")).show("blind", (response.items.length-1) * 83.33);
if(!contains($("#search_loader").attr("class").split(" "), "hide"))
$("#search_loader").addClass("hide");
$(".add-many").click(function(e) {
e.preventDefault();
e.stopPropagation();
return false;
});
} }
}); });
console.log(response.items.length);
$("<div style='display:none;' id='mock-div'>"+output+"</div>").appendTo($("#results")).show("blind", (response.items.length-1) * 83.33);
if(!contains($("#search_loader").attr("class").split(" "), "hide"))
$("#search_loader").addClass("hide");
$(".add-many").click(function(e) {
e.preventDefault();
e.stopPropagation();
return false;
});
} }
}); }
} });
}
});
}else{
$(".main").removeClass("blurT");
$("#controls").removeClass("blurT");
$(".main").removeClass("clickthrough");
}
}else{
$(".main").removeClass("blurT");
$("#controls").removeClass("blurT");
$(".main").removeClass("clickthrough");
}
} }
function submitAndClose(id,title,duration){ function submitAndClose(id,title,duration){