diff --git a/index.php b/index.php
index 135fed1a..22eca5ff 100755
--- a/index.php
+++ b/index.php
@@ -25,8 +25,8 @@
/
-
-
+
+
-
Loading...
@@ -64,15 +64,17 @@
-
-
-
-
+
+
+
+
![]()
+
+
+
+
diff --git a/static/css/style.css b/static/css/style.css
index 37ef6e56..61d6162e 100755
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -75,12 +75,12 @@ left: initial;
display: inline;
}
-@media only screen and (min-width: 992px) {
- nav .zbrand {
- display: inline-block;
- }
+.title-container{
+ position: absolute;
+ margin-top: 64px;
+ width: 99%;
+ left: 0;
}
-
.navbar-fixed {
height: 128px;
}
@@ -89,6 +89,16 @@ display: inline;
.navbar-fixed {
height: 64px;
}
+ nav .zbrand {
+ display: inline-block;
+ }
+ .title-container{
+ position: initial;
+ margin-top: initial;
+ width: 65%;
+ width: calc(90% - 256px - 130px);
+ left: initial;
+ }
}
.fullwidth{
@@ -226,8 +236,6 @@ hide mdi-action-visibility mdi-action-visibility-off
}
.title-container{
- width: 65%;
- width: calc(90% - 256px - 130px);
padding-left: 30px;
display: inline-block;
height: 100%;
@@ -333,11 +341,18 @@ hide mdi-action-visibility mdi-action-visibility-off
}
.card-image{cursor:pointer}
.card{margin:5px 0 5px 0 !important;}
-#result img{float:left;padding-right:20px !important;}
-#result{height:100px;margin-left:40px;}
+.result img{
+ float:left;
+ height: 70px;
+ border-radius: 3px;
+ margin: 15px 20px;
+}
+.result{height:100px;margin-left:40px;}
#results{
background-color: rgba(0,0,0,0.6);
margin-top: -27px;
+ max-height: 600px;
+ overflow: overlay;
}
.result:hover {
background-color: rgba(0,0,0,0.4);
@@ -356,9 +371,7 @@ hide mdi-action-visibility mdi-action-visibility-off
}
.result {
- border-bottom: solid 1px #E5E5E5;
- text-align: left;
- height: 70px;
+ border-bottom: solid 1px rgba(229, 229, 229, 0.5);
cursor: pointer;
width:93%;
}
@@ -529,6 +542,6 @@ hide mdi-action-visibility mdi-action-visibility-off
{
height:100%;
background-color:rgba(0,0,0,0.5);
- -webkit-transition: width 1s ease;
- transition: width 1s ease;
+ /*-webkit-transition: width 1s ease;
+ transition: width 1s ease;*/
}
diff --git a/static/js/search.js b/static/js/search.js
index 66a984c8..146c0659 100755
--- a/static/js/search.js
+++ b/static/js/search.js
@@ -1,12 +1,15 @@
var old_input="";
var timer = 0;
+var result_html = $("#temp-results").html();
+$( "#results" ).empty();
+var time_regex = /P((([0-9]*\.?[0-9]*)Y)?(([0-9]*\.?[0-9]*)M)?(([0-9]*\.?[0-9]*)W)?(([0-9]*\.?[0-9]*)D)?)?(T(([0-9]*\.?[0-9]*)H)?(([0-9]*\.?[0-9]*)M)?(([0-9]*\.?[0-9]*)S)?)?/
+
/*jshint multistr: true */
$(document).ready(function()
{
+
$( "#results" ).hover( function() { $("div.result").removeClass("hoverResults"); i = 0; }, function() { });
-
-
$("#search").focus();
$('#base').bind("keyup keypress", function(e) {
@@ -19,7 +22,8 @@ $(document).ready(function()
$(".search_input").focus();
$(".search_input").keyup(function(event) {
- var search_input = $(this).val();
+ search_input = $(this).val();
+ console.log(search_input);
if(event.keyCode == 13 && search_input == "fireplace")
{
if(!peis)
@@ -114,6 +118,10 @@ $(document).keyup(function(e) {
function showSearch(){
$("#search-wrapper").toggleClass("hide");
+ if(window.mobilecheck())
+ {
+ $(".search_input").focus();
+ }
$("#song-title").toggleClass("hide");
$("#search").focus();
}
@@ -121,9 +129,9 @@ function showSearch(){
function search(search_input){
- $("#results").html('');
- if(search_input !== ""){
- var keyword= encodeURIComponent(search_input);
+ $(".search_results").html('');
+ if(window.search_input !== ""){
+ var keyword= encodeURIComponent(window.search_input);
//response= x
var yt_url = "https://www.googleapis.com/youtube/v3/search?key=***REMOVED***&videoEmbeddable=true&part=id&fields=items(id)&type=video&order=viewCount&safeSearch=none&maxResults=25";
@@ -152,10 +160,23 @@ function search(search_input){
success: function(response){
$.each(response.items, function(i,song)
{
- var title=song.snippet.title;
- id=song.id;
- duration=song.contentDetails.duration;
- viewers=
+ var duration=song.contentDetails.duration;
+ secs=durationToSeconds(duration)
+ if(!longsongs || secs<720){
+ title=song.snippet.title;
+ 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 song = $("#result");
+ song.find(".search-title").text(title);
+ song.find(".result_info").text(duration);
+ song.find(".thumb").attr("src", thumb);
+ song.attr("onclick", "submitAndClose('"+id+"','"+enc_title+"',"+secs+");");
+ song.attr("id",id);
+ }
});
}
});
@@ -190,3 +211,11 @@ function submit(id,title,type, duration){
$(".main").removeClass("clickthrough");
}
}
+
+function durationToSeconds(duration) {
+ var matches = duration.match(time_regex);
+ hours= parseInt(matches[12])||0,
+ minutes= parseInt(matches[14])||0,
+ seconds= parseInt(matches[16])||0
+ return hours*60*60+minutes*60+seconds;
+}
diff --git a/static/js/youtube.js b/static/js/youtube.js
index 14eac9fc..096181d6 100755
--- a/static/js/youtube.js
+++ b/static/js/youtube.js
@@ -75,6 +75,8 @@ socket.on(chan.toLowerCase()+",np", function(obj)
if(ytplayer.getDuration() > seekTo)
ytplayer.seekTo(seekTo);
}
+ else
+ getTitle(song_title, viewers);
}
});
@@ -209,13 +211,13 @@ function getTitle(titt, v)
{
var outPutWord = v > 1 ? "viewers" : "viewer";
var title= decodeURIComponent(titt);
- var elem = $('#song-title');
+ var elem = document.getElementById('song-title');
+
document.title = title + " • Zöff";
- if(!window.mobilecheck()){
- elem.text = title;
+ elem.innerHTML = title;
document.getElementById('viewers').innerHTML = v + " " + outPutWord;
elem.title = title + " • " + v + " " + outPutWord;
- }
+
}
function errorHandler(newState)