MediaWiki:Common.js: Difference between revisions

From Melvor Idle
(Changed header rows classnames to headerRow -0 and -1 for future proofing)
(Initial javascript testing.)
Line 29: Line 29:
     setStickyHeaderTop();
     setStickyHeaderTop();
     $(window).resize(setStickyHeaderTop);
     $(window).resize(setStickyHeaderTop);
  }
  //Testing out adding input boxes
  if ($('#js-test').length > 0) {
    var newInput = document.createElement('input');
    newInput.setAttribute('type', 'text');
    newInput.setAttribute('id', 'txtInput1');
    $('#js-test').append(newInput);
   }
   }
}
}
);
);

Revision as of 14:28, 30 September 2020

/* Any JavaScript here will be loaded for all users on every page load. */

/* Sets the top property for stickyHeader tables */
function setStickyHeaderTop() {
  const stickyTables = document.getElementsByClassName('stickyHeader');
  const headHeight = document.getElementById('mw-header-container').offsetHeight;
  for (var i = 0; i < stickyTables.length; i++) {
    const firstRow = stickyTables[i].getElementsByClassName('headerRow-0');
    const secondRow = stickyTables[i].getElementsByClassName('headerRow-1');
    var firstHeight = 0;
    if (firstRow.length > 0) {
      firstHeight = firstRow[0].offsetHeight;
      const firstHeaders = firstRow[0].getElementsByTagName('th');
      for (var j = 0; j < firstHeaders.length; j++) {
        firstHeaders[j].style.top = headHeight + 'px';
      }
      if (secondRow.length > 0) {
        const secondHeaders = secondRow[0].getElementsByTagName('th');
        var secondHeight = headHeight + firstHeight;
        for (var j = 0; j < secondHeaders.length; j++) {
          secondHeaders[j].style.top = secondHeight + 'px';
        }
      }
    }
  }
}
$(document).ready(function () {
  if (document.getElementsByClassName('stickyHeader').length > 0) {
    setStickyHeaderTop();
    $(window).resize(setStickyHeaderTop);
  }
  //Testing out adding input boxes
  if ($('#js-test').length > 0) {
    var newInput = document.createElement('input');
    newInput.setAttribute('type', 'text');
    newInput.setAttribute('id', 'txtInput1');
    $('#js-test').append(newInput);
  }
}
);