This is a wiki for a reason. Anyone can contribute. If you see something that is inaccurate or can be improved, don't ask that it be fixed--just improve it.
[ Disclaimer, Create new user --- Wiki markup help, Install P99 ]

Difference between revisions of "MediaWiki:Common.js"

From Project 1999 Wiki
Jump to: navigation, search
m (Reverted edits by Loramin (talk) to last revision by Ravhin)
Line 3: Line 3:
 
/* p1999wiki.js
 
/* p1999wiki.js
 
  * written by http://wiki.project1999.com/User:Ravhin
 
  * written by http://wiki.project1999.com/User:Ravhin
  * last update: 16 June, 2013
+
  * last update: 7 January, 2018 by Loramin
 
  */
 
  */
  
Line 9: Line 9:
 
/* --- hoverbox for item/mob, currently only used in magelo --- */
 
/* --- hoverbox for item/mob, currently only used in magelo --- */
  
$(document).ready(function() {
+
$(function() {
 +
  var hideDelay = 0;
 +
  var trigDelay = 250;
 +
  var hideTimer = null;
 +
  var ajax = null;
  
    $(function() 
+
  var currentPosition = { left: '0px', top: '0px' };
    { 
+
      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>');
  
      // One instance that's reused to show info for the current person 
+
  $('body').append(container);
      var container = $('<div id="itemHoverContainer">' 
+
          + '<div id="itemHoverContent"></div>'
+
          + '</div>'); 
+
     
+
      $('body').append(container);
+
  
      //$('span.ih a')
 
  
      $('span.ih a').on('mouseover', function()
+
  // Determine which "a" elements should trigger the item stats mouseover
      {
+
  var $mouseoverTargets = $('span.ih a');
          var itemname = $(this).attr('title');
+
  var isItemCategory = document.title.startsWith('Category:') && document.title.includes('Equipment - Project 1999 Wiki');
 +
  if (isItemCategory) {
 +
    // Include the category's item list along with ".ih" links
 +
    $mouseoverTargets = $mouseoverTargets.add('.mw-content-ltr a');
 +
  }
  
          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');
+
  $mouseoverTargets.on('mouseover', function()
     
+
  {
          $('#itemHoverContent').html('&nbsp;');
+
    var $this = $(this);
 +
    var itemname = $this.attr('title');
  
          //$('#itemHoverContent').html('<div class="itemtopbg"><div class="itemtitle">Loading...</div></div>'
+
    if (itemname == '' || itemname == 'undefined')
          //                          + '<div class="itembg" style="min-height:50px;"><div class="itemdata">'
+
      return;
          //                          + '<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)
+
    if (hideTimer)
          { 
+
      clearTimeout(hideTimer);
              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');
+
    if ($this.parents('div.mw-content-ltr').length) {
          //container.fadeIn('fast');
+
      var pos = $this.offset();
 +
      var width = $this.width();
  
       }); //on mouseover
+
       container.css({
     
+
           left: pos.left + 5 + 'px',
      $('span.ih a').on('mouseout', function() 
+
          top: pos.top + 5 + 'px'
      {
+
      });
           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
+
    $(this).trigger('mousemove');
           
+
            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 });
+
    $('#itemHoverContent').html('&nbsp;');
      });
+
     
+
      // 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
+
    //$('#itemHoverContent').html('<div class="itemtopbg"><div class="itemtitle">Loading...</div></div>'
        var tipHeight = childContainer.height(); //Find height of tooltip
+
    //                          + '<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>'
        var mousex = e.pageX + 20; //Get X coodrinates
+
    //                         + '<p></p></div></div><div class="itembotbg"></div>');
        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 (ajax)
           
+
    {
            if( tipWidth > e.pageX - 20){
+
      ajax.abort();
                mousex = 0;
+
      ajax = null;
            } else {
+
    }
                mousex = e.pageX - tipWidth - 20;
+
    ajax = $.ajax({
            }
+
      url: 'http://wiki.project1999.com/index.php/Special:AjaxHoverHelper/'+itemname,
           
+
      cacheResponse: true,
        } if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
+
      success: function(html)
            mousey = e.pageY - tipHeight - 20;
+
      {
        }
+
         var $html = $(html);
+
        $('#itemHoverContent').html($html[2]).prepend($html[0]).prepend($html[1]);
         childContainer.css({ top: mousey, left: mousex, 'z-index':'999' });
+
      }
      });
+
    });
+
 
// change to position:fixed on all hover divs if we have JS active
+
    container.css('display', 'block');
// otherwise leave as position:absolute so the stationary hovers are near their items
+
    //container.fadeIn('fast');
$('.magelohb span.hb').each(function(i) {
+
 
$(this).css({'position':'fixed'});
+
  }); //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
 +
 
 +
    //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(function (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');
 +
 
 +
  // The item category search also needs special JS
 +
  } else if ($('title').text() === 'Item Category Search - Project 1999 Wiki') {
 +
    importScript('MediaWiki:ItemCategorySearch.js');
 +
  // So does the Solo Artist Challenge
 +
  } else if ($('title').text() === 'Solo Artist Challenge - Project 1999 Wiki') {
 +
    importScript('MediaWiki:SoloArtistChallenge.js');
 +
  } else if ($('title').text() === 'Treasure Hunting Guide - Project 1999 Wiki') {
 +
    importScript('MediaWiki:TreasureHuntingGuide.js');
 +
  }
 +
 
 +
  // Warn users who accidentally try to edit a templated section
 +
  if ((window.location + '').includes('title=Template:Namedmobpage&action=edit')) {
 +
    alert('Warning: You are attempting you edit the template for all named mobs. You probably didn\'t mean to do that: you probably clicked on an edit link somewhere in the page and wound up here.  To avoid this simply go back and use the edit *tab* at the top of the page instead.');
 +
  }
  
  
 
});
 
});

Revision as of 17:21, 24 October 2018

/* 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: 7 January, 2018 by Loramin
 */


/* --- 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);


  // Determine which "a" elements should trigger the item stats mouseover
  var $mouseoverTargets = $('span.ih a');
  var isItemCategory = document.title.startsWith('Category:') && document.title.includes('Equipment - Project 1999 Wiki');
  if (isItemCategory) {
    // Include the category's item list along with ".ih" links
    $mouseoverTargets = $mouseoverTargets.add('.mw-content-ltr a');
  }


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

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

    if (hideTimer)
      clearTimeout(hideTimer);

    if ($this.parents('div.mw-content-ltr').length) {
      var pos = $this.offset();
      var width = $this.width();

      container.css({
          left: pos.left + 5 + '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.com/index.php/Special:AjaxHoverHelper/'+itemname,
      cacheResponse: true,
      success: function(html)
      {
        var $html = $(html);
        $('#itemHoverContent').html($html[2]).prepend($html[0]).prepend($html[1]);
      }
    });

    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

    //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(function (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');

  // The item category search also needs special JS
  } else if ($('title').text() === 'Item Category Search - Project 1999 Wiki') {
    importScript('MediaWiki:ItemCategorySearch.js');
  // So does the Solo Artist Challenge
  } else if ($('title').text() === 'Solo Artist Challenge - Project 1999 Wiki') {
    importScript('MediaWiki:SoloArtistChallenge.js');
  } else if ($('title').text() === 'Treasure Hunting Guide - Project 1999 Wiki') {
    importScript('MediaWiki:TreasureHuntingGuide.js');
  }

  // Warn users who accidentally try to edit a templated section
  if ((window.location + '').includes('title=Template:Namedmobpage&action=edit')) {
    alert('Warning: You are attempting you edit the template for all named mobs.  You probably didn\'t mean to do that: you probably clicked on an edit link somewhere in the page and wound up here.  To avoid this simply go back and use the edit *tab* at the top of the page instead.');
  }


});