MediaWiki:Common.js: Difference between revisions

// Add New tab - Timer
$.when(mw.loader.using('mediawiki.util'), $.ready).then(
  function () {
    mw.util.addPortletLink('p-views', '', '', 'server-time-href', '', 'accesskey', '#ca-view');
  }
);

// Current Event Tab
+(function () {
  var eventData = fetch('https://api.chromerivals.net/info/server/events', {
    method: 'GET',
    headers: {
      'Cr-Api-Key': 'CR-Wiki-Public-jagAA4388DSfjk3'
    }
  }).then(function (response) {
    return response.json();
  });
  $.when(mw.loader.using('mediawiki.util'), $.ready).then(function () {
    setTimeout(function () {
      eventData.then(function (response) {
        var event = '';
        if (response.result.length == 0) {
          event += '<li class="mw-list-item mw-list-item-js" id="current-events-no">Current Events <br> There are no events running</li>';
        } else {
          //event += '<li class="mw-list-item mw-list-item-js current-events" id="current-events-no">Current Events <br></li>';    
          for (var i = 0; i < response.result.length; i++) {
            var eventName = response.result[i].mapsName.replaceAll(/\\./g, '');
            event += '<li class="mw-list-item mw-list-item-js current-events" id="=current-events-' + i + '">' + '<img src="https://download.chromerivals.net/resources/maps/big/' + response.result[i].maps[0] + '.png" width="30px">' + 'Current Events <br>' + eventName + '</li>';
          }
        }
        $(event).insertAfter("#server-time-href");
        var clockTime = function clockTime() {
          var date = new Date();
          var label = document.getElementById('server-time-label');
          var href = document.getElementById('server-time-href');
          if (label) label.innerHTML = date.toLocaleTimeString('en-gb', {
            timeZone: "etc/GMT-1",
            hour12: false
          });
          if (href) href.innerHTML = 'Server Time <br>' + date.toLocaleString('en-gb', {
            timeZone: "etc/GMT-1",
            timeZoneName: 'short',
            hour12: false
          });
        };
        clockTime();
        setInterval(clockTime, 1000);
      });
    }, 10); // Make sure we are after the droplet is added. Better would be to signal this from the addPortletLink code
  });
})();

/* Notes
PortletID:
p-namespaces - Left tab
p-views - Right tab
pt-userpage - Top tab
*/

// Footer
// CC
var element = document.createElement("div");
element.id = "footerCC";
document.getElementById('footer').appendChild(element);
 
document.getElementById('footerCC').innerHTML = '<p xmlns:cc="http://creativecommons.org/ns#" >This work is licensed under <a href="http://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display:inline-block;">CC BY 4.0<img alt="Creative Commons Attribution Icon" src="https://wiki.chromerivals.net/images/c/c6/Attribution_icon_white_x2.png"><img alt="Creative Commons Attribution Icon 2" src="https://wiki.chromerivals.net/images/1/15/Cc_icon_white_x2.png"></a></p>';

// PoweredBY
var element = document.createElement("div");
element.id = "footerPBY";
document.getElementById('footer').appendChild(element);
 
document.getElementById('footerPBY').innerHTML = '<a href="http://chromerivals.net/" target="_blank"> <img src="https://wiki.chromerivals.net/images/f/f4/Poweredby.png"></a>';


/*
// Countdown Timer - CDTimer
// <div style="float:left; font-size:3em; text-shadow:rgb(255, 0, 0) -1px 0px 0px, rgb(0, 255, 255) 1px 0px 0px; color:#e4cb5c;">
// Set the date we're counting down to
var countDownDate = new Date("Aug 24, 2023 00:00:01").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();
    
  // Find the distance between now and the count down date
  var distance = countDownDate - now;
    
  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    
  // Output the result in an element with id="CDTimer"
  document.getElementById("CDTimer").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";
    
  // If the count down is over, write some text 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("CDTimer").innerHTML = "End_Text";
  }
}, 1000);
*/

// Row click link TableShops, CrystalShop(s)
$(document).ready(function() {
    var rows = $('.TableShops, .CrystalShop1, .CrystalShop2, .CrystalShop3').find('tr');
    rows.on('click', function() {
        var row = $(this);
        console.log(row);
        if (row.find('a') !== null) {
            window.location = row.find('a').attr('href');
        }
    });       
});


// Cell click link CRPShopTable
$(document).ready(function() {
    var rows = $('.CRPShopTable').find('td');
    rows.on('click', function() {
        var row = $(this);
        console.log(row);
        if (row.find('a') !== null) {
            window.location = row.find('a').attr('href');
        }
    });       
});


// Tooltip on whole row hover FixesTable
var rows = $('.FixesTable').find('tr');
rows.each(function() {
    var row = $(this);
    row.attr('title', row.find('td').attr('title'));
});

// New expand/collapse button - all
$(document).ready(function() {
var coll = document.getElementsByClassName("ToggleElement");
var i;

for (i = 0; i < coll.length; i++) {
  coll[i].addEventListener("click", function() {
    this.classList.toggle("active");
  
    var content = this.nextElementSibling;
    if (content.style.display === "block") {
      content.style.display = "none";
    } else {
      content.style.display = "block";
    }
  });
}
});

// New expand/collapse button - text
$(document).ready(function(){
	$(".ToggleElement").click(function(){
		$(this).text($(this).text() == 'Expand' ? 'Collapse' : 'Expand');
		});
    });
   
// New expand/collapse button - animation
$(document).ready(function(){
var coll = document.getElementsByClassName("ToggleElement");
var i;

for (i = 0; i < coll.length; i++) {
  coll[i].addEventListener("click", function() {
    this.classList.toggle("active");
    var content = this.nextElementSibling;
    if (content.style.maxHeight){
      content.style.maxHeight = null;
    } else {
      content.style.maxHeight = content.scrollHeight + "1px";
    }
  });
}
});