Line 228: |
Line 228: |
| | | |
| function supportTemplateMapImageNode() { | | function supportTemplateMapImageNode() { |
− | $('.map-node a').off('click'); | + | $('.map-image > span > a').off('click'); |
− | $('.map-node a').click(function (e) { | + | $('.map-image > span > a').click(function (e) { |
| e.preventDefault(); | | e.preventDefault(); |
| var $element = $($(this).attr('href')); | | var $element = $($(this).attr('href')); |
Line 238: |
Line 238: |
| supportTemplateMapImageNode(); | | supportTemplateMapImageNode(); |
| mw.hook('wikipage.content').add(supportTemplateMapImageNode); | | mw.hook('wikipage.content').add(supportTemplateMapImageNode); |
| + | |
| + | // From gbf.wiki |
| + | // Add a dynamic fixed header to tables with: |
| + | // 1) table with "header-fixed" class |
| + | // 2) a table row with "header-row" class |
| + | // TODO: tablesorter, tabbertab, resize |
| + | // mw.loader.using('jquery.tablesorter', function() { |
| + | var tables = []; |
| + | |
| + | function initializeStickyHeader() { |
| + | var $tables = $('.header-fixed'); |
| + | |
| + | if ($tables.length == 0) return; |
| + | |
| + | $tables.each(function(n) { |
| + | if ($(this).hasClass('header-fixed-done')) return; |
| + | if ($(this).hasClass('mw-collapsed')) { |
| + | 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()); |
| + | |
| + | var $columnsOld = $headerRow.find('td:not([colspan]),th:not([colspan])'); |
| + | var $newHeaderColgroup = $('<colgroup>'); |
| + | for (var i = 0; i < $columnsOld.length; i++) { |
| + | $newHeaderColgroup.append($('<col>').css('width', $columnsOld[i].getBoundingClientRect().width)); |
| + | } |
| + | |
| + | $(this).before( |
| + | $('<table>') |
| + | .addClass('header-fixed-helper') |
| + | .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) |
| + | }); |
| + | } |
| + | |
| + | $(window).on('scroll', function() { |
| + | var scrollOffset = $(this).scrollTop(); |
| + | for (var i = 0; i < tables.length; i++) { |
| + | var tableOffset = $(tables[i].table).offset().top; |
| + | var tableHeight = $(tables[i].table).height(); |
| + | var helperHeight = $(tables[i].helper).height(); |
| + | if ((scrollOffset > tableOffset) && (scrollOffset < (tableOffset + tableHeight - helperHeight))) { |
| + | if ($(tables[i].helper).is(':hidden')) { |
| + | $(tables[i].helper).show(); |
| + | } |
| + | } else { |
| + | $(tables[i].helper).hide(); |
| + | } |
| + | } |
| + | }); |
| + | |
| + | /* |
| + | var ts = $.fn.tablesorter; |
| + | $.fn.tablesorter = function() { |
| + | ts.apply(this, arguments); |
| + | initializeStickyHeader(); |
| + | } |
| + | */ |
| + | setTimeout(function() { initializeStickyHeader(); }, 1000); |
| + | //}) |
| + | |
| + | // Basic video support using <img> and <video> elements |
| + | |
| + | $('.video').each(function () { |
| + | var src = $(this).data('src') || ''; |
| + | var parts = src.split('.'); |
| + | var ext = parts[parts.length - 1] || ''; |
| + | if (ext === 'webp') { |
| + | var a = $('<a>').addClass('image').attr('href', '/File:' + src); |
| + | var img = $('<img>'); |
| + | for (var attr in $(this).data()) { |
| + | 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); |
| + | } |
| + | }); |
| | | |
| }); | | }); |