User:HectorMoffet/OfferToHideImages.js

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

//   OfferToHideImages.js
//  
//  This script adds a short message offering to hide all the images the page.   
//  The message, once clicked, temporarily hides all images.
//  All images can be restored by clicking on a message at the top of the page. 
//  All images can be restored by clicking on any of the "unhide all" messages above each image.  

//  Experimental.    


//Global Mode
//AlwaysOffer = true;  // Always offer to hide regardless of page


//List mode
AlwaysOffer = false;  // Only offer to hide images on specific pages
// In List Mode, The "Hide All Images" option will be offer only on these pages: 
var OfferImageHidePages =  [ "Muhammad" , "Flag desecration" , "Bahá'u'lláh" , "Piss Christ" ];


// Tweakable messages: Top of article offer to hide image, Top offer to unhide images, and Per-Image offers to unhide images.   
var   HideOfferHTML="To hide all images in this article, <a onCLick='HideAllImages()'>click here</a>." ;  //Would you like to hide all images on page?
var UnhideOfferHTML="<a onCLick='UnHideAllImages() '>Click here</a> to reveal all images."; // Would you like to see all images again?
var UnhideImgHTML="<a class=\"UnhideImageLink\" onCLick='UnHideAllImages(); return false;' href=\"\">Unhide All</a>";  // Would you like to see images after all?  (or in future "Would you like to see just this image and only this image?")




if (AlwaysOffer==true) { OfferHideAllImages();} // Global Mode
else                                            // List mode
{ 
  // Is this page on this list? 
  var LocalPageTitle=mw.config.get('wgTitle');             // Get the Page Title
  if (OfferImageHidePages.indexOf(LocalPageTitle) != -1)   // Is this page on the list?
  { 
    // Yes, this page is on the list.    
    //alert("Page title = "+mw.config.get('wgTitle'));   // For debugging
    OfferHideAllImages();
  }
}



//*************************************
// OfferHideAllImages()  is a function that add a message to an appropriate part of the page.   
function OfferHideAllImages() {
   document.getElementById('contentSub').innerHTML+=HideOfferHTML;
}

// HideAllImages is a function that gets each Img, hides them, and puts up Unhide offers
function HideAllImages() 
{
   var imgs=document.getElementsByTagName("img");
   for(var i=0;i<imgs.length;i++) HideImage(imgs[i]);
   OfferUnHideAllImages()
}

// HideImage is the function that actually hides an IMG and replaces it with Unhide Offer.
function HideImage (myNode)
{
  myNode.style.visibility="hidden";                 // Hide it

  // Create an Unhide Offer at this specific image
  var newNode=document.createElement('div');        // Make New Div
  newNode.innerHTML=UnhideImgHTML;                  // Add html to Div 
  myNode.parentNode.insertBefore(newNode, myNode);  // Insert the Div
}


// OfferUnHideAllImages()  is a function that updates the page to allow unhiding.   
function OfferUnHideAllImages() {

   document.getElementById('contentSub').innerHTML=UnhideOfferHTML;

}


// UnHideAllImages is a function that will unhide all images.
function UnHideAllImages() 
{
   // Restore the images
   var imgs=document.getElementsByTagName("img");
   for(var i=0;i<imgs.length;i++) imgs[i].style.visibility="visible";

   // Erase offers to unhide
   document.getElementById('contentSub').innerHTML="";  // Erase top of article offer
   $('.UnhideImageLink').hide();                        // Erase per image offer

   // Recreate hide offer at top.   
   OfferHideAllImages(); 
}

//*************************************