MediaWiki:Common.js
From Future Of Mankind
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */ //collapsible table column test, based on: https://codepen.io/feger/pen/eDybC $("#btnHideEnglish").click(function(){ console.log ('Hiding first column of table with an id of report'); $( "table#collapsible_report > tbody:last-child > tr > th:first-child" ).toggle(); $( "table#collapsible_report > tbody:last-child > tr > td:first-child" ).toggle(); if ($(this).text() == "Hide English"){ $(this).text("Show English"); } else { $(this).text("Hide English"); } }); $("#btnHideHigh-German").click(function(){ console.log ('Hiding second column of table with an id of report'); $( "table#collapsible_report > tbody:last-child > tr > th:last-child" ).toggle(); $( "table#collapsible_report > tbody:last-child > tr > td:last-child" ).toggle(); if ($(this).text() == "Hide High German"){ $(this).text("Show High German"); } else { $(this).text("Hide High German"); } }); $("#btnHideGerman").click(function(){ console.log ('Hiding second column of table with an id of report'); $( "table#collapsible_report > tbody:last-child > tr > th:last-child" ).toggle(); $( "table#collapsible_report > tbody:last-child > tr > td:last-child" ).toggle(); if ($(this).text() == "Hide German"){ $(this).text("Show German"); } else { $(this).text("Hide German"); } }); // hide the german by default, on page load, but only if the btnHideGerman element exists on the page if (document.getElementById("btnHideGerman")) { console.log('btnHideGerman exists'); //$("#btnHideGerman").click(); } else { // do stuff console.log('btnHideGerman does not exist'); } /** * @module referencePreview */ import { renderPopup } from '../popup/popup'; import { createNodeFromTemplate, escapeHTML } from '../templateUtil'; const templateHTML = ` <div class="mwe-popups-container"> <div class="mwe-popups-extract"> <div class="mwe-popups-scroll"> <strong class="mwe-popups-title"> <span class="mw-ui-icon mw-ui-icon-element"></span> <span class="mwe-popups-title-placeholder"></span> </strong> <div class="mw-parser-output"></div> </div> <div class="mwe-popups-fade"></div> </div> <footer> <div class="mwe-popups-settings"></div> </footer> </div>`; const LOGGING_SCHEMA = 'event.ReferencePreviewsPopups'; let isTracking = false; $( () => { if ( mw.config.get( 'wgPopupsReferencePreviews' ) && navigator.sendBeacon && mw.config.get( 'wgIsArticle' ) && !isTracking ) { isTracking = true; mw.track( LOGGING_SCHEMA, { action: 'pageview' } ); } } ); /** * @param {ext.popups.ReferencePreviewModel} model * @return {JQuery} */ export function renderReferencePreview( model ) { const type = model.referenceType || 'generic'; // The following messages are used here: // * popups-refpreview-book // * popups-refpreview-journal // * popups-refpreview-news // * popups-refpreview-note // * popups-refpreview-web let titleMsg = mw.message( `popups-refpreview-${type}` ); if ( !titleMsg.exists() ) { titleMsg = mw.message( 'popups-refpreview-reference' ); } const $el = renderPopup( model.type, createNodeFromTemplate( templateHTML ) ); $el.find( '.mwe-popups-title-placeholder' ) .replaceWith( escapeHTML( titleMsg.text() ) ); // The following classes are used here: // * mw-ui-icon-reference-generic // * mw-ui-icon-reference-book // * mw-ui-icon-reference-journal // * mw-ui-icon-reference-news // * mw-ui-icon-reference-note // * mw-ui-icon-reference-web $el.find( '.mwe-popups-title .mw-ui-icon' ) .addClass( `mw-ui-icon-reference-${type}` ); $el.find( '.mw-parser-output' ) .html( model.extract ); // Make sure to not destroy existing targets, if any $el.find( '.mwe-popups-extract a[href][class~="external"]:not([target])' ).each( ( i, a ) => { a.target = '_blank'; // Don't let the external site access and possibly manipulate window.opener.location a.rel = `${a.rel ? `${a.rel} ` : ''}noopener`; } ); // We assume elements that benefit from being collapsible are to large for the popup $el.find( '.mw-collapsible' ).replaceWith( $( '<div>' ) .addClass( 'mwe-collapsible-placeholder' ) .append( $( '<span>' ) .addClass( 'mw-ui-icon mw-ui-icon-element mw-ui-icon-infoFilled' ), $( '<div>' ) .addClass( 'mwe-collapsible-placeholder-label' ) .text( mw.msg( 'popups-refpreview-collapsible-placeholder' ) ) ) ); // Undo remaining effects from the jquery.tablesorter.js plugin $el.find( 'table.sortable' ).removeClass( 'sortable jquery-tablesorter' ) .find( '.headerSort' ).removeClass( 'headerSort' ).attr( { tabindex: null, title: null } ); // TODO: Remove when not in Beta any more if ( !mw.config.get( 'wgPopupsReferencePreviewsBetaFeature' ) ) { // TODO: Do not remove this but move it up into the templateHTML constant! $el.find( '.mwe-popups-settings' ).append( $( '<a>' ) .addClass( 'mwe-popups-settings-icon' ) .append( $( '<span>' ) .addClass( 'mw-ui-icon mw-ui-icon-element mw-ui-icon-small mw-ui-icon-settings' ) ) ); } else { // Change the styling when there is no content in the footer (to prevent empty space) $el.find( '.mwe-popups-container' ).addClass( 'footer-empty' ); } if ( isTracking ) { $el.find( '.mw-parser-output' ).on( 'click', 'a', () => { mw.track( LOGGING_SCHEMA, { action: 'clickedReferencePreviewsContentLink' } ); } ); } $el.find( '.mwe-popups-scroll' ).on( 'scroll', function ( e ) { const element = e.target, // We are dealing with floating point numbers here when the page is zoomed! scrolledToBottom = element.scrollTop >= element.scrollHeight - element.clientHeight - 1; if ( isTracking ) { if ( !element.isOpenRecorded ) { mw.track( LOGGING_SCHEMA, { action: 'poppedOpen', scrollbarsPresent: element.scrollHeight > element.clientHeight } ); element.isOpenRecorded = true; } if ( element.scrollTop > 0 && !element.isScrollRecorded ) { mw.track( LOGGING_SCHEMA, { action: 'scrolled' } ); element.isScrollRecorded = true; } } if ( !scrolledToBottom && element.isScrolling ) { return; } const $extract = $( element ).parent(), hasHorizontalScroll = element.scrollWidth > element.clientWidth, scrollbarHeight = element.offsetHeight - element.clientHeight, hasVerticalScroll = element.scrollHeight > element.clientHeight, scrollbarWidth = element.offsetWidth - element.clientWidth; $extract.find( '.mwe-popups-fade' ).css( { bottom: hasHorizontalScroll ? `${scrollbarHeight}px` : 0, right: hasVerticalScroll ? `${scrollbarWidth}px` : 0 } ); element.isScrolling = !scrolledToBottom; $extract.toggleClass( 'mwe-popups-fade-out', element.isScrolling ); } ); return $el; }