Updated find-div to say how many were found, and the current found in the array.

- Fixed bug where updating the searchtext when CTRL+F (find) didn't reset the search in the list
- Fixed bug where using the find function when a song is changed didn't reset the search
This commit is contained in:
Kasper Rynning-Tønnesen
2017-09-06 12:39:24 +02:00
parent 84cbdfaba0
commit 95a15f4b6e
6 changed files with 57 additions and 4 deletions

View File

@@ -837,6 +837,27 @@ hide mdi-action-visibility mdi-action-visibility-off
color: white;
}
#find_form {
display: flex;
flex-direction: row;
align-content: center;
justify-content: center;
}
.num_of_found {
display: flex;
align-self: center;
color: white;
padding-left: 8px;
}
#close_find_form_button {
display: flex;
align-self: center;
padding-left: 10px;
color: white;
}
.highlight{
background: rgba(255, 255, 255, 0.2) !important;
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -127,6 +127,8 @@ var List = {
if(full_playlist.length > 0) {
Player.sendNext({title: full_playlist[0].title, videoId: full_playlist[0].id});
}
found_array = [];
found_array_index = 0;
//if(!w_p) List.dragging(true);
break;
}

View File

@@ -59,6 +59,7 @@ var number_suggested = 0;
var prev_chan_list = "";
var prev_chan_player = "";
var chromecastReady = false;
var find_word = "";
var found_array = [];
var found_array_index = 0;
var guid = "";
@@ -1693,6 +1694,7 @@ $(document).keydown(function(event) {
if(find_started){
$("#find_div").toggleClass("hide");
$("#find_input").focus();
find_word = "";
} else {
$("#find_div").toggleClass("hide");
$("#find_input").val("");
@@ -1700,6 +1702,7 @@ $(document).keydown(function(event) {
$(".highlight").removeClass("highlight");
found_array = [];
found_array_index = 0;
find_word = "";
}
} else if(event.keyCode == 32 && $(".search-container").hasClass("hide") && window.location.pathname != "/" &&
!$("#text-chat-input").is(":focus") &&
@@ -1728,6 +1731,19 @@ $(document).keydown(function(event) {
}
});
$(document).on("click", "#close_find_form_button", function(e) {
e.preventDefault();
find_start = false;
find_started = false;
$("#find_div").toggleClass("hide");
$("#find_input").val("");
$("#find_input").blur();
$(".highlight").removeClass("highlight");
found_array = [];
found_array_index = 0;
find_word = "";
});
$(document).keyup(function(event){
if((event.keyCode == 91 || event.keyCode == 17) && !find_started){
find_start = false;
@@ -1736,19 +1752,28 @@ $(document).keyup(function(event){
$(document).on("submit", "#find_form", function(e){
e.preventDefault();
if(this.find_value.value != find_word) {
find_word = this.find_value.value;
found_array = [];
found_array_index = 0;
}
if(found_array.length == 0){
var that = this;
found_array_index = 0;
found_array = $.map(full_playlist, function(obj, index) {
if(obj.title.toLowerCase().indexOf(that.find_value.value.toLowerCase()) >= 0) {
if(obj.title.toLowerCase().indexOf(that.find_value.value.toLowerCase()) >= 0 && index != full_playlist.length-1) {
return index;
}
});
$("#num_found").text(found_array_index + 1);
$("#of_total_found").text(found_array.length);
} else {
found_array_index = found_array_index + 1;
if(found_array.length - 1 < found_array_index){
found_array_index = 0;
}
$("#num_found").text(found_array_index + 1);
$("#of_total_found").text(found_array.length);
}
if(found_array.length > 0 && found_array[found_array_index] != full_playlist.length - 1){
$(".highlight").removeClass("highlight");
@@ -1756,6 +1781,7 @@ $(document).on("submit", "#find_form", function(e){
$($("#wrapper").children()[found_array[found_array_index]]).addClass("highlight");
List.dynamicContentPageJumpTo(jump_to_page);
} else {
$(".highlight").removeClass("highlight");
Helper.log("none found");
}
});

View File

@@ -219,12 +219,16 @@
</ul>
<ul class="tabs playlist-tabs-loggedIn hide tabs-fixed-width" style="width: 96%;">
<li class="tab col s3"><a class="playlist-tab-links playlist-link active truncate" href="#wrapper">Playlist</a></li>
<li class="tab col s3"><a class="playlist-tab-links suggested-link truncate" href="#suggestions">Suggested<span class="new badge white hide"></a></li>
<li class="tab col s3"><a class="playlist-tab-links suggested-link truncate" href="#suggestions">Suggested<span class="new badge white hide"></span></a></li>
<li class="tab col s3"><a class="playlist-tab-links chat-link truncate" href="#chat">Chat<span class="new badge white hide"></span></a></li>
</ul>
<div id="find_div" class="hide">
<form id="find_form">
<input type="text" name="find_value" placeholder="Find.." id="find_input" autocomplete="off" />
<div class="num_of_found">
<span id="num_found">0</span>/<span id="of_total_found">0</span>
</div>
<a href="#" id="close_find_form_button"><i class="material-icons">clear</i></a>
</form>
</div>
<div id="wrapper" class="tabs_height">