Difference between revisions of "MediaWiki:Common.js"
Jump to navigation
Jump to search
m |
m |
||
Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
− | + | /* Javascript filter for the manual 2020.05.26 | |
− | + | -------------------------------------------------*/ | |
− | + | // animate divs on start | |
− | + | var items = document.querySelectorAll('.filter-sections ul'); | |
− | + | animate(items); | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | // | + | // filter on click |
− | function | + | each('.filter-links li a', function(el) { |
− | + | el.addEventListener('click', function(e) { | |
− | + | e.preventDefault(); | |
− | + | filterLinks(el); | |
− | + | }); | |
− | + | }); | |
− | |||
− | |||
− | } | ||
− | } | ||
− | // | + | // filter links functions |
− | function | + | function filterLinks(element) { |
− | + | // get text | |
− | + | var el = element.textContent, | |
− | + | // convert to lowercase | |
− | + | linksTolowerCase = el.toLowerCase(); | |
− | + | // if all remove all elements | |
− | + | if (el === 'All') { | |
− | } | + | // first show all view class |
+ | each('.view', function(e) { | ||
+ | e.classList.remove('view'); | ||
+ | }); | ||
+ | // no show init animation | ||
+ | animate(items); | ||
+ | } else { | ||
+ | // if not click all remove all elements | ||
+ | each('.view', function(e) { | ||
+ | e.classList.remove('view'); | ||
+ | }); | ||
} | } | ||
− | + | // show animation for current elements | |
− | } | + | animate(document.querySelectorAll('.' + linksTolowerCase)); |
− | + | }; | |
− | // | + | // forech arrays |
− | var | + | function each(el, callback) { |
− | + | var allDivs = document.querySelectorAll(el), | |
− | + | alltoArr = Array.prototype.slice.call(allDivs); | |
− | + | Array.prototype.forEach.call(alltoArr, function(selector, index) { | |
− | + | if (callback) return callback(selector); | |
− | |||
− | |||
}); | }); | ||
− | } | + | }; |
+ | // animate function | ||
+ | function animate(item) { | ||
+ | (function show(counter) { | ||
+ | setTimeout(function() { | ||
+ | item[counter].classList.add('view'); | ||
+ | counter++; | ||
+ | if (counter < item.length) show(counter); | ||
+ | },1); | ||
+ | })(0); | ||
+ | }; |
Revision as of 13:16, 27 May 2020
/* Any JavaScript here will be loaded for all users on every page load. */ /* Javascript filter for the manual 2020.05.26 -------------------------------------------------*/ // animate divs on start var items = document.querySelectorAll('.filter-sections ul'); animate(items); // filter on click each('.filter-links li a', function(el) { el.addEventListener('click', function(e) { e.preventDefault(); filterLinks(el); }); }); // filter links functions function filterLinks(element) { // get text var el = element.textContent, // convert to lowercase linksTolowerCase = el.toLowerCase(); // if all remove all elements if (el === 'All') { // first show all view class each('.view', function(e) { e.classList.remove('view'); }); // no show init animation animate(items); } else { // if not click all remove all elements each('.view', function(e) { e.classList.remove('view'); }); } // show animation for current elements animate(document.querySelectorAll('.' + linksTolowerCase)); }; // forech arrays function each(el, callback) { var allDivs = document.querySelectorAll(el), alltoArr = Array.prototype.slice.call(allDivs); Array.prototype.forEach.call(alltoArr, function(selector, index) { if (callback) return callback(selector); }); }; // animate function function animate(item) { (function show(counter) { setTimeout(function() { item[counter].classList.add('view'); counter++; if (counter < item.length) show(counter); },1); })(0); };