Difference between revisions of "MediaWiki:Common.js"

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";
          }
        }