Difference between revisions of "MediaWiki:Common.js"

Revision as of 06:10, 28 November 2017

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

/* p1999wiki.js
 * written by http://wiki.project1999.com/User:Ravhin
 * last update: 16 June, 2013
 */


/* --- hoverbox for item/mob, currently only used in magelo --- */

$(function() {
  var hideDelay = 0;
  var trigDelay = 250;
  var hideTimer = null;
  var ajax = null;

  var currentPosition = { left: '0px', top: '0px' };

  // One instance that's reused to show info for the current person
  var container = $('<div id="itemHoverContainer">'
      + '<div id="itemHoverContent"></div>'
      + '</div>');

  $('body').append(container);

  //$('span.ih a')

  $('span.ih a').on('mouseover', function()
  {
      var itemname = $(this).attr('title');

      if (itemname == '' || itemname == 'undefined')
          return;

      if (hideTimer)
          clearTimeout(hideTimer);

      //var pos = $(this).offset();
      //var width = $(this).width();

      //container.css({
      //    left: (pos.left + width) + 'px',
      //    top: pos.top - 5 + 'px'
      //});

      $(this).trigger('mousemove');

      $('#itemHoverContent').html('&nbsp;');

      //$('#itemHoverContent').html('<div class="itemtopbg"><div class="itemtitle">Loading...</div></div>'
      //                          + '<div class="itembg" style="min-height:50px;"><div class="itemdata">'
      //                          + '<div class="itemicon" style="float:right;"><img alt="" src="/images/Ajax_loader.gif" border="0"></div>'
      //                          + '<p></p></div></div><div class="itembotbg"></div>');

      if (ajax)
      {
          ajax.abort();
          ajax = null;
      }

      ajax = $.ajax({
          url: 'http://wiki.project1999.org/index.php/Special:AjaxHoverHelper/'+itemname,
          cacheResponse: true,
          success: function(html)
          {
            $('#itemHoverContent').html(html);
          }
      });

      container.css('display', 'block');
      //container.fadeIn('fast');

  }); //on mouseover

  $('span.ih a').on('mouseout', function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
      hideTimer = setTimeout(function()
      {
          container.css('display', 'none');
          //container.fadeOut('fast');
      }, hideDelay);
  });

  $('span.ih a').mousemove(function(e){
    var mousex = e.pageX + 20; //Get X coodrinates
    var mousey = e.pageY + 20; //Get Y coordinates
    var tipWidth = container.width(); //Find width of tooltip
    var tipHeight = container.height(); //Find height of tooltip

    //Distance of element from the right edge of viewport
    var tipVisX = $(window).width() - (mousex + tipWidth);
    //Distance of element from the bottom of viewport
    var tipVisY = $(window).height() - (mousey + tipHeight);

    if ( tipVisX < 20 ) { //If tooltip exceeds the X coordinate of viewport

        if( tipWidth > e.pageX - 20 ){
            mousex = 0;
        } else {
            mousex = e.pageX - tipWidth - 20;
        }

    } if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
        mousey = e.pageY - tipHeight - 20;
    }

    container.css({  top: mousey, left: mousex });
  });

  // Allow mouse over of details without hiding details
  $('#itemHoverContainer').mouseover(function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
  });

  // Hide after mouseout
  $('#itemHoverContainer').mouseout(function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
      hideTimer = setTimeout(function()
      {
          container.css('display', 'none');
          //container.fadeOut('fast');
      }, hideDelay);
  });

        // magelo non-ajax item hover, but move box with mouse
  $('.magelohb').mousemove(function(e){
            var childContainer = $(this).children('span.hb');

    var tipWidth = childContainer.width(); //Find width of tooltip
    var tipHeight = childContainer.height(); //Find height of tooltip

    var mousex = e.pageX + 20; //Get X coodrinates
    var mousey = e.pageY + 20; //Get Y coordinates

            console.log(e.pageX,e.pageY);

    //Distance of element from the right edge of viewport
    var tipVisX = $(window).width() - (mousex + tipWidth - 20);
    //Distance of element from the bottom of viewport
    var tipVisY = $(window).height() - (mousey + tipHeight - 20);

    if ( tipVisX < 20 ) { //If tooltip exceeds the X coordinate of viewport

        if( tipWidth > e.pageX - 20){
            mousex = 0;
        } else {
            mousex = e.pageX - tipWidth - 20;
        }

    } if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
        mousey = e.pageY - tipHeight - 20;
    }

    childContainer.css({ top: mousey, left: mousex, 'z-index':'999' });
  });

        // change to position:fixed on all hover divs if we have JS active
        // otherwise leave as position:absolute so the stationary hovers are near their items
        $('.magelohb span.hb').each(function(i) {
            $(this).css({'position':'fixed'});
        });
    
    // Chrome no longer displays alt text when an image is hovered over.  However the wiki only has
    // alt attributes for images, not titles.  This fixes that by converting alt => title
    $('img[alt]').each((i, img) => $(img).attr('title', $(img).attr('alt')));
    
    // Give the Per-Level Hunting Guide Page its own JS
    if ($('title').text() === 'Per-Level Hunting Guide - Project 1999 Wiki') {
        importScript('MediaWiki:HuntingGuide.js');
    }
});