Difference between revisions of "MediaWiki:Common.js"
Jump to navigation
Jump to search
(Remove Flattr code) |
|||
(20 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | /* | + | /* Javascript filter |
+ | ---------------------------------*/ | ||
+ | |||
+ | // animate divs on start | ||
+ | var items = document.querySelectorAll('.filter-sections li'); | ||
+ | animate(items); | ||
+ | |||
+ | // filter on click | ||
+ | each('.filter-links li', 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(); | ||
+ | linksTolowerCase = el; | ||
+ | // 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); | ||
+ | },2); | ||
+ | })(0); | ||
+ | }; | ||
+ | |||
+ | function openForm(evt, formName) { | ||
+ | // Declare all variables | ||
+ | var i, tabcontent, tablinks; | ||
+ | evt.preventDefault(); | ||
+ | |||
+ | // Get all elements with class="tabcontent" and hide them | ||
+ | //tabcontent = document.getElementsByClassName("contextxmlform"); | ||
+ | //for (i = 0; i < tabcontent.length; i++) { | ||
+ | // tabcontent[i].style.display = "none"; | ||
+ | //} | ||
+ | |||
+ | // Show the current tab, and add an "active" class to the link that opened the tab | ||
+ | if (evt.currentTarget.className.includes(' active')) { | ||
+ | evt.currentTarget.className.replace(" active", ""); | ||
+ | // Get all elements with class="tablinks" and remove the class "active" | ||
+ | tablinks = document.getElementsByClassName("tablinks"); | ||
+ | for (i = 0; i < tablinks.length; i++) { | ||
+ | tablinks[i].className = tablinks[i].className.replace(" active", ""); | ||
+ | } | ||
+ | document.getElementById(formName).style.display = "none"; | ||
+ | } else { | ||
+ | // Get all elements with class="tablinks" and remove the class "active" | ||
+ | tablinks = document.getElementsByClassName("tablinks"); | ||
+ | for (i = 0; i < tablinks.length; i++) { | ||
+ | tablinks[i].className = tablinks[i].className.replace(" active", ""); | ||
+ | } | ||
+ | document.getElementById(formName).style.display = "block"; | ||
+ | evt.currentTarget.className += " active"; | ||
+ | } | ||
+ | } |
Latest revision as of 10:11, 25 August 2020
/* Javascript filter ---------------------------------*/ // animate divs on start var items = document.querySelectorAll('.filter-sections li'); animate(items); // filter on click each('.filter-links li', 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(); linksTolowerCase = el; // 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); },2); })(0); }; function openForm(evt, formName) { // Declare all variables var i, tabcontent, tablinks; evt.preventDefault(); // Get all elements with class="tabcontent" and hide them //tabcontent = document.getElementsByClassName("contextxmlform"); //for (i = 0; i < tabcontent.length; i++) { // tabcontent[i].style.display = "none"; //} // Show the current tab, and add an "active" class to the link that opened the tab if (evt.currentTarget.className.includes(' active')) { evt.currentTarget.className.replace(" active", ""); // Get all elements with class="tablinks" and remove the class "active" tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(formName).style.display = "none"; } else { // Get all elements with class="tablinks" and remove the class "active" tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(formName).style.display = "block"; evt.currentTarget.className += " active"; } }