MediaWiki:Common.js

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

/** Collapsible tables *********************************************************
 *
 *  Description: Allows tables to be collapsed, showing only the header. See
 *                         http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *  Maintainers: [[en:User:R. Koot]]
 */
 
var autoCollapse = 2;
var collapseCaption = 'hide';
var expandCaption = 'show';
 
function collapseTable( tableIndex ) {
        var Button = document.getElementById( 'collapseButton' + tableIndex );
        var Table = document.getElementById( 'collapsibleTable' + tableIndex );
 
        if ( !Table || !Button ) {
                return false;
        }
 
        var Rows = Table.rows;
 
        if ( Button.firstChild.data == collapseCaption ) {
                for ( var i = 1; i < Rows.length; i++ ) {
                        Rows[i].style.display = 'none';
                }
                Button.firstChild.data = expandCaption;
        } else {
                for ( var i = 1; i < Rows.length; i++ ) {
                        Rows[i].style.display = Rows[0].style.display;
                }
                Button.firstChild.data = collapseCaption;
        }
}
 
function createCollapseButtons() {
        var tableIndex = 0;
        var NavigationBoxes = new Object();
        var Tables = document.getElementsByTagName( 'table' );
 
        for ( var i = 0; i < Tables.length; i++ ) {
                if ( hasClass( Tables[i], 'collapsible' ) ) {
 
                        /* only add button and increment count if there is a header row to work with */
                        var HeaderRow = Tables[i].getElementsByTagName( 'tr' )[0];
                        if ( !HeaderRow ) {
                                continue;
                        }
                        var Header = HeaderRow.getElementsByTagName( 'th' )[0];
                        if ( !Header ) {
                                continue;
                        }
 
                        NavigationBoxes[tableIndex] = Tables[i];
                        Tables[i].setAttribute( 'id', 'collapsibleTable' + tableIndex );
 
                        var Button = document.createElement( 'span' );
                        var ButtonLink = document.createElement( 'a' );
                        var ButtonText = document.createTextNode( collapseCaption );
 
                        Button.className = 'collapseButton'; // Styles are declared in [[MediaWiki:Common.css]]
 
                        ButtonLink.style.color = Header.style.color;
                        ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex );
                        ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" );
                        ButtonLink.appendChild( ButtonText );
 
                        Button.appendChild( document.createTextNode( '[' ) );
                        Button.appendChild( ButtonLink );
                        Button.appendChild( document.createTextNode( ']' ) );
 
                        Header.insertBefore( Button, Header.childNodes[0] );

                        /* if the header is centered, create a spacer for the left side, so it will remain centered */
                        if (getComputedStyle(Header).getPropertyValue('text-align') == 'center') {
                                var Spacer = document.createElement( 'span' );
                                var SpacerText = document.createTextNode( collapseCaption );
                                Spacer.className = 'collapseSpacer'; // Styles are declared in [[MediaWiki:Common.css]]
                                Spacer.appendChild( document.createTextNode( '[' + collapseCaption + ']' ) );
                                Header.insertBefore( Spacer, Header.childNodes[0] );
                        }

                        tableIndex++;
                }
        }
 
        for ( var i = 0;  i < tableIndex; i++ ) {
                if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) {
                        collapseTable( i );
                } else if ( hasClass( NavigationBoxes[i], 'innercollapse' ) ) {
                        var element = NavigationBoxes[i];
                        while ( element = element.parentNode ) {
                                if ( hasClass( element, 'outercollapse' ) ) {
                                        collapseTable( i );
                                        break;
                                }
                        }
                }
        }
}

/** Test if an element has a certain class **************************************
 *
 * Description: Uses regular expressions and caching for better performance.
 * Maintainers: [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]]
 *
 * @deprecated:  Use $(element).hasClass() instead.
 */
 
var hasClass = ( function() {
        var reCache = {};
        return function( element, className ) {
                return ( reCache[className] ? reCache[className] : ( reCache[className] = new RegExp( "(?:\\s|^)" + className + "(?:\\s|$)" ) ) ).test( element.className );
        };
})();


/** Alternating table rows 
 *
 */

/* alternating colors for table rows. */
function setAlternateRows(tbl, parseClass) {
    var rowHeight = 1;
    var dark = false;
    var rows = tbl.getElementsByTagName("tr");
    for (r = 0; r < rows.length; r++ ) {
        rows[r].setAttribute("class", dark ? "even" : "odd");
        var cells = rows[r].getElementsByTagName("td")
        if (cells.length == 0) {
            dark = false;
            continue;
        }
        for (c = 0; c < cells.length; c++) {
            var cellHeight = cells[c].getAttribute("rowspan") || 1;
            if (rowHeight < cellHeight) {
                rowHeight = cellHeight;
            }
        }
        rowHeight = rowHeight - 1;
        if (rowHeight == 0) {
            dark = !dark;
        }
    }
}

/* To add a "pallet" for a table, simply modify the CASE argument and add the name
   of the CSS class that you want colors for. */
function alternateRows() {
    tbls = document.getElementsByTagName("table");
    for (i = 0; i < tbls.length; i++) {
        tbl = tbls[i];
        parseClasses = tbl.className.split(" ");
        for (j = 0; j < parseClasses.length; j++) {
            parseClass = parseClasses[j];
            switch( parseClass ) {
                case "altRows":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsMed":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsMed2":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsPad":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsCenter":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsSmall":
                    setAlternateRows( tbl, parseClass );
                    break;
                case "altRowsMP":
                    setAlternateRows( tbl, parseClass );
                    break;
                default:
                    break;
            }
        }
    }
}

// Re do stripes on a table after sort finishes
$(document).on('sortEnd.tablesorter', function(event) {
    var table = $(event.target);
    var classes = table.attr('class');
    if(classes.match('(^| )altRows')) {
        $('tbody tr:nth-child(even)',table).addClass('even').removeClass('odd');
        $('tbody tr:nth-child(odd)',table).addClass('odd').removeClass('even');
    }
})

/* This code is executed on a pages after loading has finished */
$(function() {
	createCollapseButtons();
	alternateRows();
});


// old tooltips
//importScript('User:Eleazaros/tooltip.js');
//mw.loader.load("/index.php?title=User:Eleazaros/tooltip.js&action=raw&ctype=text/javascript");
var tooltipsOn = true;
mw.loader.load("/index.php?title=User:Eleazaros/coords.js&action=raw&ctype=text/javascript");

// next-gen tooltips: main script
//importScript('MediaWiki:Lord of the tooltips.js');
mw.loader.load("/index.php?title=MediaWiki:Lord of the tooltips.js&action=raw&ctype=text/javascript");
// next-gen tooltips: external communication
//importScript('MediaWiki:Postmessage.js');
//mw.loader.load("/index.php?title=MediaWiki:Postmessage.js&action=raw&ctype=text/javascript");
// Uncomment the above if we ever want to support providing lotro-wiki tooltips on other web sites.  (See [[User:EoD/Sandbox#External_Tooltip_Howto]])

// Changetier script
function hideTier2() {
   $('#tier2').hide();
}

$(hideTier2);

function swaptierv2() {
 $('#tier1').toggle();
 $('#tier2').toggle();
}

function addtierfunc() {
 //make it clickable
 $('.changetierv2').click(swaptierv2);
}


$( addtierfunc );

// Experimental new "create new item" tool
// importScript('User:Sethladan/vector.js');

// If browser doesn't have a plugin (e.g. Firebug) which supports console.log , disable it.
if(typeof console === "undefined") {
    console = { log: function() { } };
}

//Creatures tier functionality supporting more than 2 tiers
function hideTiers() {                    // Function to hide tiers on page load and show only T1
 $('.creatureTier').hide();               // Hide all elements with 'creatureTier' class
 $('#tier1').show();                      // show element with 'tier1' id
}

$(hideTiers);                             

function showTier() {
 $('.changeTier').click(function(){       // add click function to all elements with 'changeTier' class
  var id = $(this).attr("data-tier-id");  // get 'data-tier-id' attribute of the element that was clicked on, id to be shown
  $('.creatureTier').hide();              // hide all elements with 'changeTier' class
  $('#'+id).show();                       // show element with given id
 });
}

$(showTier);

// Allow users to replace {{name}}, {{race}}, {{class}} placeholders in quest text
function replace_placeholder(kind, value) {
    placeholders = document.getElementsByClassName(kind + "-placeholder");
    for (i = 0; i < placeholders.length; i++) {
        placeholders[i].style = "font-weight:bold";
        placeholders[i].innerHTML = value;
    }
}
/*
function ItemNameAutosize() {
    var tooltips = document.getElementsByClassName("itemtooltip") //get tooltips from page
    for (i=0; i<tooltips.length; i++) {
        var nameTag = tooltips[i].children[1].children[0] //get the tag that holds the item name
        var name = nameTag.textContent                    //save the item name
        nameTag.textContent = "Test"                      //replace name with "Test" to test what should be one line name height
        var lineHeight = nameTag.offsetHeight             //save one line height to variable
        nameTag.textContent = name                        //restore original item name
        if (nameTag.offsetHeight == lineHeight){          //if original name is short increase size
           nameTag.parentNode.style.fontSize = "1.5em"   //Warning:The item name might be multiple lines after increasing size but im ok with it
           nameTag.parentNode.style.lineHeight = "1.6em"
        }
    }
}
$(ItemNameAutosize);
*/

// Convert server times to the user's local timezone (see Template:Server Time)
function getColloquialTime(timeStr) {
    // 12-hour times
    timeStr = timeStr.replace("AM", "a.m.").replace("PM", "p.m.").replace("12:00 a.m.", "midnight").replace("12:00 p.m.", "noon");
    
    // 24-hour times
    timeStr = timeStr.replace(/24(.00)/, "00$1");
    
    return timeStr;
}

function convertServerTimes() {
    var spans = document.getElementsByClassName("servertime");
    if (spans.length > 0) {
        var days = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ];

        // Find current Eastern Time (ET) offset from UTC
        var testDate = new Date();
        testDate.setUTCHours(12);
        var etOffsetHours = parseInt(testDate.toLocaleTimeString( "en-US", { timeZone: "America/New_York", hour: "numeric" } )) - 12;

        // Find user's time zone offset from UTC
        if (mw.config.get('wgUserId') != null) {
            var userTimeZoneInfo = mw.user.options.get('timecorrection').split("|");
            var userOffsetHours = parseInt(userTimeZoneInfo[1]) / 60;
            var userTimeZone = userTimeZoneInfo[2] || "UTC";
            if (userTimeZone != "UTC") {
                userOffsetHours = 0;
            }
        } else {
            var userOffsetHours = new Date().getTimezoneOffset() / -60;
            var userTimeZone = "UTC";
        }

        // Determine from the browser whether 12 or 24-hour format is desired
        const hour12mode = new Intl.DateTimeFormat([], { hour: 'numeric' }).resolvedOptions().hour12;

        for (var i = 0; i < spans.length; i++) {

            // Get the day, hour, minute from the server time
            var span = spans[i];
            var serverDateStr = span.innerHTML;
            var matches = serverDateStr.match(/^([A-Za-z]+) at ([0-9]+):([0-9]+) ([amp.]+) (.+)$/);
            if (matches) {
                var serverDayStr = matches[1];
                var serverDay = days.indexOf(matches[1]);
                var serverAmpmStr = matches[4];
                var serverHour = (parseInt(matches[2]) % 12 + (serverAmpmStr == "p.m." ? 12 : 0)) % 24;
                var serverMinute = parseInt(matches[3]);
                var restStr = matches[5];
            } else {
                matches = span.innerHTML.match(/^([0-9]+):([0-9]+) ([amp.]+) (.+)$/);
                var serverDay = null;
                var serverAmpmStr = matches[3];
                var serverHour = (parseInt(matches[1]) % 12 + (serverAmpmStr == "p.m." ? 12 : 0)) % 24;
                var serverMinute = parseInt(matches[2]);
                var restStr = matches[4];
            }

            // Create a Date object representing server time in the near future
            var date = new Date();
            date.setUTCHours(serverHour);
            date.setUTCMinutes(serverMinute);
            if (serverDay) {
                // Advance to the next occurrence of the specified day
                var daysToAdvance = (parseInt(serverDay) - date.getUTCDay() + 7) % 7;
                date.setUTCDate(date.getUTCDate() + daysToAdvance);
            }
            var hoursToAdvance = (serverHour - etOffsetHours - date.getUTCHours() + 24) % 24;
            date.setUTCHours(date.getUTCHours() + hoursToAdvance);

            // Re-display server time, if 12-hour format is not wanted
            if (!hour12mode) {
                serverDateStr = (serverDay ? serverDayStr + " at " : "");
                serverDateStr += date.toLocaleTimeString([], { timeZone: "America/New_York",  hour12: hour12mode, hour: "numeric", minute: "numeric" });
                serverDateStr = getColloquialTime(serverDateStr);
                serverDateStr += " " + restStr;
            }

            // Convert server time to user's time zone
            date.setTime(date.getTime() + userOffsetHours * 60 * 60 * 1000);
            var userDayStr = date.toLocaleTimeString("en-US", { timeZone: userTimeZone, weekday: "long" }).split(" ")[0];
            var userTimeStr = date.toLocaleTimeString("en-US", { timeZone: userTimeZone, hour12: hour12mode, hour: "numeric", minute: "numeric" });
            userTimeStr = getColloquialTime(userTimeStr);

            // Display the weekday if needed
            var midnight = (userTimeStr == "midnight");
            var dayChanged = (serverDayStr != userDayStr);
            if (serverDay && (dayChanged || midnight)) {
                if (midnight) {
                    userDayStr = days[(7 + days.indexOf(userDayStr) - 1) % 7] + " evening";
                }
                userTimeStr = userDayStr + " at " + userTimeStr;
            }
            
            span.innerHTML = serverDateStr + " (" + userTimeStr + ' in <a href="/index.php/Special:Preferences#mw-prefsection-rendering">your timezone</a>)';
        }
    }
}

$(convertServerTimes);