diff --git a/.eslintrc.json b/.eslintrc.json index 325a038..d8a3335 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -2,7 +2,7 @@ "root": true, "extends": [ "wikimedia/client-common", - "wikimedia/language/es2022", + "wikimedia/language/es2015", "wikimedia/mediawiki", "wikimedia/jquery" ] diff --git a/resources/.eslintrc.json b/resources/.eslintrc.json index 0d12380..48284e4 100644 --- a/resources/.eslintrc.json +++ b/resources/.eslintrc.json @@ -1,7 +1,7 @@ { "root": true, "extends": [ - "wikimedia/client-es6", + "wikimedia/client-es5", "wikimedia/jquery", "wikimedia/mediawiki" ], diff --git a/resources/scripts/main.js b/resources/scripts/main.js index 923b577..05ef18c 100644 --- a/resources/scripts/main.js +++ b/resources/scripts/main.js @@ -19,10 +19,10 @@ */ 'use strict'; -$( () => { +$( function () { // sidebar-inner only applies to desktop-small, but the toggles are hidden at // other resolutions regardless and the css overrides any visible effects. - const $dropdowns = $( '#personal, #p-variants-desktop, .sidebar-inner' ); + var $dropdowns = $( '#personal, #p-variants-desktop, .sidebar-inner' ); /** * Desktop menu click-toggling @@ -30,10 +30,11 @@ $( () => { * We're not even checking if it's desktop because the classes in play have no effect * on mobile regardless... this may break things at some point, though. */ + /** * Close all dropdowns */ - const closeOpen = () => { + var closeOpen = function closeOpen() { $dropdowns.removeClass( 'dropdown-active' ); }; @@ -55,8 +56,8 @@ $( () => { $( this ).addClass( 'dropdown-active' ); } } ); - $( document ).on( 'click', ( { target } ) => { - if ( $( target ).closest( $dropdowns ).length > 0 ) { + $( document ).on( 'click', function ( e ) { + if ( $( e.target ).closest( $dropdowns ).length > 0 ) { // Clicked inside an open menu; don't close anything } else { closeOpen(); diff --git a/resources/scripts/mobile.js b/resources/scripts/mobile.js index 06f5106..eaeba77 100644 --- a/resources/scripts/mobile.js +++ b/resources/scripts/mobile.js @@ -21,11 +21,11 @@ 'use strict'; -$( () => { - const toggleTime = 150; +$( function () { + var toggleTime = 150; // Open the various menus - $( '#user-tools h2' ).on( 'click', () => { + $( '#user-tools h2' ).on( 'click', function () { if ( $( window ).width() < 851 ) { $( '#personal-inner' ).css( 'left', @@ -39,7 +39,7 @@ $( () => { $( '#personal .mobile-close-button' ).fadeToggle( toggleTime ); } } ); - $( '#sidebar-tools h2' ).on( 'click', () => { + $( '#sidebar-tools h2' ).on( 'click', function () { if ( $( window ).width() < 851 ) { $( '#site-navigation .sidebar-inner' ).css( 'left', @@ -53,7 +53,7 @@ $( () => { $( '#site-navigation .mobile-close-button' ).fadeToggle( toggleTime ); } } ); - $( '#search-button h2' ).on( 'click', () => { + $( '#search-button h2' ).on( 'click', function () { if ( $( window ).width() < 851 ) { $( '#p-search .mobile-close-button' ) .css( 'top', $( '#search-button h2' ).offset().top - 4 ) @@ -63,7 +63,7 @@ $( () => { $( '#p-search .mobile-close-button' ).fadeToggle( toggleTime ); } } ); - $( '#ca-more' ).on( 'click', () => { + $( '#ca-more' ).on( 'click', function () { $( '#page-more .sidebar-inner' ).css( 'top', $( '#ca-more' ).offset().top + 25 ); $( '#page-more .mobile-close-button' ) .css( 'top', $( '#ca-more' ).offset().top - 4 ) @@ -74,7 +74,7 @@ $( () => { $( '#page-more .mobile-close-button' ).fadeToggle( toggleTime ); } } ); - $( '#ca-tools' ).on( 'click', () => { + $( '#ca-tools' ).on( 'click', function () { $( '#page-tools .sidebar-inner' ).css( 'top', $( '#ca-tools' ).offset().top + 25 @@ -88,7 +88,7 @@ $( () => { $( '#page-tools .mobile-close-button' ).fadeToggle( toggleTime ); } } ); - $( '#ca-languages' ).on( 'click', () => { + $( '#ca-languages' ).on( 'click', function () { $( '#other-languages .sidebar-inner' ).css( 'top', $( '#ca-languages' ).offset().top + 25 @@ -104,10 +104,10 @@ $( () => { } ); // Close menus on click outside - $( document ).on( 'click touchstart', ( { target } ) => { + $( document ).on( 'click touchstart', function ( e ) { if ( - $( target ).closest( '#menus-cover' ).length > 0 || - $( target ).closest( '.mobile-close-button' ).length > 0 + $( e.target ).closest( '#menus-cover' ).length > 0 || + $( e.target ).closest( '.mobile-close-button' ).length > 0 ) { $( '#personal-inner' ).fadeOut( toggleTime ); $( '.sidebar-inner' ).fadeOut( toggleTime ); diff --git a/resources/scripts/table-scroll.js b/resources/scripts/table-scroll.js index 862f35e..b5cee6c 100644 --- a/resources/scripts/table-scroll.js +++ b/resources/scripts/table-scroll.js @@ -20,7 +20,7 @@ 'use strict'; -mw.hook( 'wikipage.content' ).add( ( $content ) => { +mw.hook( 'wikipage.content' ).add( function ( $content ) { // Skip on Special:Recentchanges if ( mw.config.get( 'wgCanonicalSpecialPageName' ) === 'Recentchanges' ) { return; @@ -45,11 +45,11 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { * * @param {jQuery} $table */ - const setScrollClass = ( $table ) => { - const $tableWrapper = $table.parent(); - const $wrapper = $tableWrapper.parent(); - - const scroll = Math.abs( $tableWrapper.scrollLeft() ); // wtf browser rtl implementations + function setScrollClass( $table ) { + var $tableWrapper = $table.parent(), + $wrapper = $tableWrapper.parent(), + // wtf browser rtl implementations + scroll = Math.abs( $tableWrapper.scrollLeft() ); // 1 instead of 0 because of weird rtl rounding errors or something if ( scroll > 1 ) { @@ -62,27 +62,27 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { } else { $wrapper.removeClass( 'scroll-right' ); } - }; + } $content.find( '.content-table' ).on( 'scroll', function () { setScrollClass( $( this ).children( 'table' ).first() ); if ( $content.attr( 'dir' ) === 'rtl' ) { $( this ) .find( 'caption' ) - .css( 'margin-right', `${Math.abs( $( this ).scrollLeft() )}px` ); + .css( 'margin-right', Math.abs( $( this ).scrollLeft() ) + 'px' ); } else { $( this ) .find( 'caption' ) - .css( 'margin-left', `${$( this ).scrollLeft()}px` ); + .css( 'margin-left', $( this ).scrollLeft() + 'px' ); } } ); /** * Mark overflowed tables for scrolling */ - const unOverflowTables = () => { + function unOverflowTables() { $content.find( '.content-table > table' ).each( function () { - const $table = $( this ); - const $wrapper = $table.parent().parent(); + var $table = $( this ), + $wrapper = $table.parent().parent(); if ( $table.outerWidth() > $wrapper.outerWidth() ) { $wrapper.addClass( 'overflowed' ); setScrollClass( $table ); @@ -95,10 +95,10 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { // Set up sticky captions $content.find( '.content-table > table > caption' ).each( function () { - let $container; - let tableHeight; - const $table = $( this ).parent(); - const $wrapper = $table.parent().parent(); + var $container, + tableHeight, + $table = $( this ).parent(), + $wrapper = $table.parent().parent(); if ( $table.outerWidth() > $wrapper.outerWidth() ) { $container = $( this ).parents( '.content-table-wrapper' ); $( this ).width( $content.width() ); @@ -107,7 +107,7 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { $container.find( '.content-table-right' ).height( tableHeight ); } } ); - }; + } unOverflowTables(); $( window ).on( 'resize', unOverflowTables ); @@ -115,14 +115,15 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { * Sticky scrollbars maybe?! */ $content.find( '.content-table' ).each( function () { - const $tableWrapper = $( this ); - const $table = $tableWrapper.children( 'table' ).first(); + var $table, $tableWrapper, $spoof, $scrollbar; + $tableWrapper = $( this ); + $table = $tableWrapper.children( 'table' ).first(); // Assemble our silly crap and add to page - const $scrollbar = $( '
' ) + $scrollbar = $( '
' ) .addClass( 'content-table-scrollbar inactive' ) .width( $content.width() ); - const $spoof = $( '
' ) + $spoof = $( '
' ) .addClass( 'content-table-spoof' ) .width( $table.outerWidth() ); $tableWrapper.parent().prepend( $scrollbar.prepend( $spoof ) ); @@ -133,11 +134,11 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { */ $content.find( '.content-table' ).on( 'scroll', function () { // Only do this here if we're not already mirroring the spoof - const $mirror = $( this ).siblings( '.inactive' ).first(); + var $mirror = $( this ).siblings( '.inactive' ).first(); $mirror.scrollLeft( $( this ).scrollLeft() ); } ); $content.find( '.content-table-scrollbar' ).on( 'scroll', function () { - const $mirror = $( this ).siblings( '.content-table' ).first(); + var $mirror = $( this ).siblings( '.content-table' ).first(); // Only do this here if we're not already mirroring the table // eslint-disable-next-line no-jquery/no-class-state @@ -149,10 +150,13 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { /** * Set active when actually over the table it applies to... */ - const determineActiveSpoofScrollbars = () => { + function determineActiveSpoofScrollbars() { $content.find( '.overflowed .content-table' ).each( function () { - const $scrollbar = $( this ).siblings( '.content-table-scrollbar' ).first(); - let captionHeight; + var $scrollbar = $( this ).siblings( '.content-table-scrollbar' ).first(), + tableTop, + tableBottom, + viewBottom, + captionHeight; // Skip caption captionHeight = $( this ).find( 'caption' ).outerHeight(); @@ -162,25 +166,25 @@ mw.hook( 'wikipage.content' ).add( ( $content ) => { // Pad slightly for reasons captionHeight += 8; } - const tableTop = $( this ).offset().top; - const tableBottom = tableTop + $( this ).outerHeight(); - const viewBottom = window.scrollY + document.documentElement.clientHeight; + tableTop = $( this ).offset().top; + tableBottom = tableTop + $( this ).outerHeight(); + viewBottom = window.scrollY + document.documentElement.clientHeight; if ( tableTop + captionHeight < viewBottom && tableBottom > viewBottom ) { $scrollbar.removeClass( 'inactive' ); } else { $scrollbar.addClass( 'inactive' ); } } ); - }; + } determineActiveSpoofScrollbars(); $( window ).on( 'scroll resize', determineActiveSpoofScrollbars ); /** * Make sure tablespoofs remain correctly-sized? */ - $( window ).on( 'resize', () => { + $( window ).on( 'resize', function () { $content.find( '.content-table-scrollbar' ).each( function () { - const width = $( this ).siblings().first().find( 'table' ).first().width(); + var width = $( this ).siblings().first().find( 'table' ).first().width(); $( this ).find( '.content-table-spoof' ).first().width( width ); $( this ).width( $content.width() ); } ); diff --git a/resources/scripts/toc.js b/resources/scripts/toc.js index f360f6c..ee26f29 100644 --- a/resources/scripts/toc.js +++ b/resources/scripts/toc.js @@ -18,10 +18,10 @@ */ 'use strict'; -$( () => { +$( function () { if ( $( '#toc>ul' ).length !== 0 ) { /* TOC (Left) */ - const $div = $( '
' ).attr( 'id', 'site-toc' ).addClass( 'sidebar-chunk' ), + var $div = $( '
' ).attr( 'id', 'site-toc' ).addClass( 'sidebar-chunk' ), $title = $( '#mw-toc-heading' ).html(), $titleH2 = $( '

' ).append( $( '' ).text( $title ) ), $titleH3 = $( '

' ).attr( 'id', 'p-toc-label' ).text( $title ), @@ -44,7 +44,7 @@ $( () => { .appendTo( $( '#mw-site-navigation' ) ); /* TOC (Right) */ - const $divNavi = $( '
' ).attr( 'id', 'mw-toc-navigation' ), + var $divNavi = $( '
' ).attr( 'id', 'mw-toc-navigation' ), $divRight = $( '
' ) .attr( 'id', 'site-toc-right' ) .addClass( 'sidebar-chunk' ), diff --git a/skin.json b/skin.json index d9c1099..3f28eec 100644 --- a/skin.json +++ b/skin.json @@ -123,22 +123,18 @@ "@NOTE": "Remember to also update variables.less if you change the width cutoffs here. screen-misc.less and mobile.js may also need updating." }, "skins.gongbi.main": { - "es6": true, "targets": [ "desktop", "mobile" ], "packageFiles": [ "resources/scripts/main.js" ] }, "skins.gongbi.mobile": { - "es6": true, "targets": [ "desktop", "mobile" ], "packageFiles": [ "resources/scripts/mobile.js" ] }, "skins.gongbi.toc": { - "es6": true, "targets": [ "desktop", "mobile" ], "packageFiles": [ "resources/scripts/toc.js" ] }, "skins.gongbi.table-scroll": { - "es6": true, "targets": [ "desktop", "mobile" ], "packageFiles": [ "resources/scripts/table-scroll.js" ] }