Last active
June 2, 2017 20:25
-
-
Save karololszacki/f796381c6d9949191d623d3d99c9cf86 to your computer and use it in GitHub Desktop.
Some optimisations:
- a timeout trick so we don't fire same functions too often (like for keyUp event or updateClasses);
- simpler search (indexOf where we had regex);
- jQuery animations replaced with velocity, not giving that much improvement; I would get rid of "updateClasses" and the animations altogether
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$.getScript("https://cdn.jsdelivr.net/velocity/1.5.0/velocity.min.js"); | |
$( "#vidText" ).off(); | |
function keyParser(e){ | |
var q = document.getElementById("vidText").value.split(' '); | |
if(q == ''){ | |
showAll(); | |
return; | |
} | |
var first = true; | |
for (var i = 0; i < videoKeys.length; i++) { | |
var matchany = true; | |
$.each(q, function(qkey, qval){ | |
var nomatch = true; | |
if(videoKeys[i].toLowerCase().indexOf(qval.toLowerCase()) !== -1) | |
nomatch = false; | |
if(nomatch) matchany = false; | |
}); | |
if(matchany){ | |
if(first){ | |
$( "#res" + i + ":hidden" ).addClass("first-list-item").css('opacity', 0).slideDown().velocity({ opacity: 1 }, { queue: false, sequenceQueue: false }); | |
first = false; | |
}else{ | |
$( "#res" + i + ":hidden" ).css('opacity', 0).slideDown().velocity({ opacity: 1 }, { queue: false, sequenceQueue: false }); | |
} | |
} | |
else $( "#res" + i ).css('opacity', 1).slideUp().velocity({ opacity: 0 }, { queue: false, sequenceQueue: false }).removeClass("first-list-item"); | |
} | |
updateClasses(); | |
} | |
var parserTimeout = null; | |
function startKeyParser(e){ | |
clearTimeout(parserTimeout); | |
parser = setTimeout(function(){ | |
keyParser(e); | |
}, 100); | |
} | |
$( "#vidText" ).keyup(startKeyParser); | |
function showAll(){ | |
var i = 0; | |
$( "#res" + i + ":hidden" ).addClass("first-list-item").css('opacity', 0).slideDown().velocity({ opacity: 1 }, { queue: false, sequenceQueue: false }); | |
for (i = 1; i < videoKeys.length; i++) { | |
$( "#res" + i + ":hidden" ).css('opacity', 0).slideDown().velocity({ opacity: 1 }, { queue: false, sequenceQueue: false }); | |
} | |
updateClasses(); | |
} | |
var updateCounter = 0; | |
var updateTimeout = null; | |
var updateTimeout2 = null; | |
var updateTimeout3 = null; | |
function updateClasses(){ | |
clearTimeout(updateTimeout); | |
clearTimeout(updateTimeout2); | |
clearTimeout(updateTimeout3); | |
updateCounter++; | |
updateTimeout = setTimeout(function(){ | |
oldUpdateClasses(1); | |
}, updateCounter*75); | |
updateTimeout2 = setTimeout(function(){ | |
oldUpdateClasses(2); | |
}, 200); | |
updateTimeout2 = setTimeout(function(){ | |
clearTimeout(updateTimeout); | |
clearTimeout(updateTimeout2); | |
oldUpdateClasses(3); | |
}, 700); | |
} | |
function oldUpdateClasses(z){ | |
for (var i = 0; i < videoKeys.length; i++) { | |
$( "#res" + i ).removeClass("first-list-item").removeClass("last-list-item"); | |
} | |
$( ".list-group-item:visible:first" ).addClass("first-list-item"); | |
$( ".list-group-item:visible:last" ).addClass("last-list-item"); | |
if(z==1){ | |
updateCounter = 0; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment