• Welcome to the Kancolle Wiki!
  • If you have any questions regarding site content, account registration, etc., please visit the KanColle Wiki Discord

Changes

Jump to navigation Jump to search

MediaWiki:Common.js (view source)

Revision as of 02:53, 10 May 2023

991 bytes added ,  1 year ago
m
no edit summary
Line 243: Line 243:  
// 1) table with "header-fixed" class
 
// 1) table with "header-fixed" class
 
// 2) a table row with "header-row" class
 
// 2) a table row with "header-row" class
−
mw.loader.using('jquery.tablesorter', function() {
+
// TODO: tablesorter, tabbertab, resize
−
function initializeStickyHeader() {
+
// mw.loader.using('jquery.tablesorter', function() {
−
  var tables = [];
+
var tables = [];
−
  var $tables = $('.header-fixed');
     −
  console.debug('FixedHeader: ' + $tables.length)
+
function initializeStickyHeader() {
−
+
var $tables = $('.header-fixed');
−
  if ($tables.length == 0) return;
     −
  $tables.each(function() {
+
if ($tables.length == 0) return;
−
    // If this table is under tabber AND is hidden,
  −
    // temporarily make element visible so we can pull its width data later
  −
    var tabberTabParent = $(this).parent(".tabbertab")[0];
  −
    var originalStyleDisplay;
  −
    if (tabberTabParent) {
  −
      originalStyleDisplay = tabberTabParent.style.display;
  −
      tabberTabParent.style.visibility = "hidden";
  −
      tabberTabParent.style.display = "block";
  −
    }
     −
    // Build fixed-header-table content
+
$tables.each(function(n) {
−
    var $headerRow = $(this).find('.header-row');
+
  if ($(this).hasClass('header-fixed-done')) return;
−
    var $newHeaderContent = $('<tbody>');
+
  if ($(this).hasClass('mw-collapsed')) {
−
    $newHeaderContent.append($headerRow.clone());
+
  console.debug('header-fixed: collapsed: ' + n)
 +
  $(this).find('.mw-collapsible-text').click(function() {
 +
  console.debug('header-fixed: click: ' + n)
 +
  setTimeout(function() { initializeStickyHeader(); }, 1000);
 +
  })
 +
  return;
 +
  }
 +
/*
 +
    var tabberTabParent = $(this).parent(".tabbertab")[0];
 +
    var originalStyleDisplay;
 +
    if (tabberTabParent) {
 +
    originalStyleDisplay = tabberTabParent.style.display;
 +
    tabberTabParent.style.visibility = "hidden";
 +
    tabberTabParent.style.display = "block";
 +
    }
 +
*/
 +
    var $headerRow = $(this).find('.header-row');
 +
    var $newHeaderContent = $('<tbody>');
 +
    $newHeaderContent.append($headerRow.clone());
   −
    // Add fixed-header-table colgroup to fix width
+
    var $columnsOld = $headerRow.find('td:not([colspan]),th:not([colspan])');
−
    var $columnsOld = $headerRow.find('td:not([colspan]),th:not([colspan])');
+
    var $newHeaderColgroup = $('<colgroup>');
−
    var $newHeaderColgroup = $('<colgroup>');
+
    for (var i = 0; i < $columnsOld.length; i++) {
 +
    $newHeaderColgroup.append($('<col>').css('width', $columnsOld[i].getBoundingClientRect().width));
 +
    }
   −
    for (var i = 0; i < $columnsOld.length; i++) {
+
    $(this).before(
−
      var width = $columnsOld[i].getBoundingClientRect().width;
+
    $('<table>')
−
      $newHeaderColgroup.append(
+
        .addClass('header-fixed-helper')
−
        $('<col>').css('width', width)
+
        .addClass('wikitable')
−
      );
+
        .css('position', 'sticky')
−
    }
+
        .css('top', '0')
 +
        .css('z-index', '9')
 +
        .css('display', 'none')
 +
        .css('background-color', '#fff')
 +
        .css('margin-top', '0')
 +
        .css('margin-bottom', '0')
 +
        .css('table-layout', 'fixed')
 +
        .append($newHeaderColgroup)
 +
        .append($newHeaderContent)
 +
    );
 +
    tables.push({ table: this, helper: this.previousSibling });
 +
    $(this.previousSibling).css('width', $(this).width() + 1);
 +
/*
 +
    if (tabberTabParent) {
 +
    tabberTabParent.style.visibility = "";
 +
    tabberTabParent.style.display = originalStyleDisplay;
 +
    }
 +
    */
 +
    $(this).addClass('header-fixed-done');
 +
    console.debug('header-fixed: fixed: ' + n)
 +
});
 +
}
   −
    $(this).before(
+
$(window).on('scroll', function() {
−
      $('<table>')
+
var scrollOffset = $(this).scrollTop();
−
        .addClass('header-fixed-helper')
+
for (var i = 0; i < tables.length; i++) {
−
        .addClass('wikitable')
+
var tableOffset = $(tables[i].table).offset().top;
−
        .css('position', 'sticky')
+
var tableHeight = $(tables[i].table).height();
−
        .css('top', '0')
+
var helperHeight = $(tables[i].helper).height();
−
        .css('z-index', '9')
+
if ((scrollOffset > tableOffset) && (scrollOffset < (tableOffset + tableHeight - helperHeight))) {
−
        .css('display', 'none')
+
    if ($(tables[i].helper).is(':hidden')) {
−
        .css('background-color', '#fff')
+
    $(tables[i].helper).show();
−
        .css('margin-top', '0')
+
    }
−
        .css('margin-bottom', '0')
+
} else {
−
        .css('table-layout', 'fixed')
+
    $(tables[i].helper).hide();
−
        .append($newHeaderColgroup)
+
}
−
        .append($newHeaderContent)
+
}
−
    );
+
});
−
    tables.push({
  −
      table: this,
  −
      helper: this.previousSibling
  −
    });
  −
    $(this.previousSibling).css('width', $(this).width() + 1);
     −
    // Restore original tab display status
+
/*
−
    // if this table was under tabber and hidden
+
var ts = $.fn.tablesorter;
−
    if (tabberTabParent) {
+
$.fn.tablesorter = function() {
−
      tabberTabParent.style.visibility = "";
+
  ts.apply(this, arguments);
−
      tabberTabParent.style.display = originalStyleDisplay;
+
  initializeStickyHeader();
−
    }
+
}
−
  });
+
*/
 +
setTimeout(function() { initializeStickyHeader(); }, 1000);
 +
//})
   −
  $(window).on('scroll', function() {
+
// Basic video support using <img> and <video> elements
−
    var scrollOffset = $(this).scrollTop();
+
 
−
    for (var i = 0; i < tables.length; i++) {
+
$('.video').each(function () {
−
      var tableOffset = $(tables[i].table).offset().top;
+
var src = $(this).data('src') || '';
−
      var tableHeight = $(tables[i].table).height();
+
var parts = src.split('.');
−
      var helperHeight = $(tables[i].helper).height();
+
var ext = parts[parts.length - 1] || '';
−
      if ((scrollOffset > tableOffset) && (scrollOffset < (tableOffset + tableHeight - helperHeight))) {
+
if (ext === 'webp') {
−
        if ($(tables[i].helper).is(':hidden'))
+
var a = $('<a>').addClass('image').attr('href', '/File:' + src);
−
          $(tables[i].helper).show();
+
var img = $('<img>');
−
      } else {
+
for (var attr in $(this).data()) {
−
        $(tables[i].helper).hide();
+
img.attr(attr, (attr === 'src' ? 'https://en.kancollewiki.net/Special:Filepath/' : '') + $(this).data(attr));
−
      }
+
}
−
    }
+
a.append(img);
−
  });
+
      $(this).append(a);
 +
} else {
 +
var video = $('<video>').attr('controls', '');
 +
var source = $('<source>').attr('type', 'video/' + ext);
 +
for (var attr in $(this).data()) {
 +
var el = attr === 'src' || attr === 'type' ? source : video;
 +
el.attr(attr, (attr === 'src' ? 'https://en.kancollewiki.net/Special:Filepath/' : '') + $(this).data(attr));
 +
}
 +
video.append(source);
 +
      $(this).append(video);
 
}
 
}
 +
});
   −
var ts = $.fn.tablesorter;
  −
$.fn.tablesorter = function() {
  −
  ts.apply(this, arguments);
  −
  initializeStickyHeader();
  −
}
  −
  −
initializeStickyHeader();
  −
})
   
});
 
});
がか
cssedit, gkautomate
6,926

edits

Retrieved from "https://en.kancollewiki.net/Special:MobileDiff/142767...154278"

Navigation menu