User:TheDJ/usagecollapse.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.

var usageCollapser = {};

usageCollapser.hook = function() {
 if( wgAction == 'edit' || wgAction == 'submit' )
  usageCollapser.templateUsage();
 if( wgNamespaceNumber == 6 ) 
  usageCollapser.fileUsage();
}

usageCollapser.templateUsage = function() {
 var callName = "TemplateUsage";
 var tused = getElementsByClassName( document, "div", "templatesUsed" )[0];
 if( !tused )  return;

 /* Get default status */
 /* FIXME: check cookie */
 var collapsed_status = usageCollapser.Cookie.read("uc"+callName) == "true" || false;

 /* Hide for display */
 tused.style.display = "none";

 /* Set up the new table */
 var table = document.createElement( "table" );
 table.className = "collapsible"
 table.id = "collapsibleTable" + callName;
 table.style.width = "100%";
 if( collapsed_status ) table.className += " collapsed";

 var header = document.createElement( "th" );
 header.style.textAlign = "left";
 header.style.fontWeight = "normal";
 var button = usageCollapser.createSHButton(collapsed_status, callName);
 if( !button ) return;
 header.appendChild( button );

 var elements = getElementsByClassName( tused, "div", "mw-templatesUsedExplanation" );
 if( !elements || !elements[0] ) return;
 var header_title = elements[0].firstChild.childNodes;
 for( i=0 ; i< header_title.length; i++ )
  header.appendChild( header_title[i] );

 var row1 = document.createElement( "tr");
 row1.appendChild( header );
 var row2 = document.createElement( "tr");

 if( collapsed_status )
  row2.style.display = "none";

 var ul1 = tused.getElementsByTagName("ul")[0];
 row2.appendChild( ul1 );
 table.appendChild( row1 );
 table.appendChild( row2 );

 tused.parentNode.insertBefore( table, tused);
}

usageCollapser.fileUsage = function() {
 if( document.getElementById( 'globalusage' ) )
  usageCollapser.globalUsage();
 if( document.getElementById( 'mw-imagepage-section-linkstoimage' ) )
  usageCollapser.localUsage();
};

usageCollapser.localUsage = function() {
 var callName = "LocalFileUsage";
 var lused = document.getElementById( 'mw-imagepage-section-linkstoimage' );
 if( !lused ) return;
 var p = document.getElementById('linkstoimage');

 if( !p ) {
  p = lused.firstChild;
  do {
   p = p.nextSibling;
  } while( p != null && p.nodeName != "P" );
 }
 if( !p ) return;
 var list = getElementsByClassName( lused, "ul", "mw-imagepage-linkstoimage" )[0];
 if( !list )  return;

 var p2 = list;
 do {
  p2 = p2.nextSibling;
 } while( p2 != null && p2.nodeName != "P" );

 /* Hide for display */
 lused.style.display = "none";

 /* Get default status */
 /* FIXME: check cookie */
 var collapsed_status = usageCollapser.Cookie.read("uc"+callName) == "true" || false;

 /* Set up the new table */
 var table = document.createElement( "table" );
 table.className = "collapsible"
 table.id = "collapsibleTable" + callName;
 table.style.width = "100%";
 if( collapsed_status ) table.className += " collapsed";

 var header = document.createElement( "th" );
 header.style.textAlign = "left";
 header.style.fontWeight = "normal";
 var button = usageCollapser.createSHButton(collapsed_status, callName);
 if( !button ) return;
 header.appendChild( button );

 var header_title = p.childNodes;
 for( i=0 ; i< header_title.length; i++ )
  header.appendChild( header_title[i] );

 var row1 = document.createElement( "tr");
 row1.appendChild( header );
 var row2 = document.createElement( "tr");

 if( collapsed_status )
  row2.style.display = "none";

 row2.appendChild( list );
 if( p2 )  row2.appendChild( p2 );
 table.appendChild( row1 );
 table.appendChild( row2 );

 lused.parentNode.insertBefore( table, lused );
}

usageCollapser.globalUsage = function() {
 var callName = "GlobalFileUsage";
 var h2 = document.getElementById( 'globalusage' );
 if( !h2 ) return;
 var p = h2;
 do {
  p = p.nextSibling;
 } while( p != null && p.nodeName != "P" );
 if( !p ) return;
 var list = p;
 do {
  list = list.nextSibling;
 } while( list != null && list.nodeName != "UL" );
 if( !list )  return;
 var p2 = list;
 do {
  p2 = p2.nextSibling;
 } while( p2 != null && p2.nodeName != "P" );

 /* Get default status */
 /* FIXME: check cookie */
 var collapsed_status = usageCollapser.Cookie.read("uc"+callName) == "true" || false;

 /* Set up the new table */
 var table = document.createElement( "table" );
 table.className = "collapsible"
 table.id = "collapsibleTable" + callName;
 table.style.width = "100%";
 if( collapsed_status ) table.className += " collapsed";

 var header = document.createElement( "th" );
 header.style.textAlign = "left";
 header.style.fontWeight = "normal";
 var button = usageCollapser.createSHButton(collapsed_status, callName);
 if( !button ) return;
 header.appendChild( button );

 var header_title = p.childNodes;
 for( i=0 ; i< header_title.length; i++ )
  header.appendChild( header_title[i] );

 var row1 = document.createElement( "tr");
 row1.appendChild( header );
 var row2 = document.createElement( "tr");

 if( collapsed_status )
  row2.style.display = "none";

 row2.appendChild( list );
 if( p2 )  row2.appendChild( p2 );
 table.appendChild( row1 );
 table.appendChild( row2 );

 h2.parentNode.insertBefore( table, h2.nextSibling );
}

usageCollapser.createSHButton = function(collapsed, ident) {
 var Button     = document.createElement( "span" );
 var ButtonLink = document.createElement( "a" );
 var ButtonText = document.createTextNode( collapsed ? expandCaption : collapseCaption );

 Button.className = "collapseButton";  //Styles are declared in Common.css
 Button.style.float = "left";
 Button.style.marginRight = "1em";
 ButtonLink.setAttribute( "id", "collapseButton"  + ident );
 ButtonLink.setAttribute( "href", "javascript:usageCollapser.collapseTable('" + ident + "');" );
 ButtonLink.appendChild( ButtonText );
 Button.appendChild( document.createTextNode( "[" ) );
 Button.appendChild( ButtonLink );
 Button.appendChild( document.createTextNode( "]" ) );
 return Button;
}

usageCollapser.collapseTable = function( tableIndex ) {
 var Button = document.getElementById( "collapseButton" + tableIndex );
 if( !Button ) return;
 if ( Button.firstChild.data == collapseCaption ) {
   usageCollapser.Cookie.create( "uc"+tableIndex, "true", 30 );
 } else {
   usageCollapser.Cookie.create( "uc"+tableIndex, "false", 30 );
 }
 collapseTable(tableIndex);
}

usageCollapser.Cookie = {
    create: function(name,value,days)
    {
        var expires;
        if (days)
        {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            expires = "; expires="+date.toGMTString();
        }
        else { expires = ""; }
        document.cookie = name+"="+value+expires+"; path=/";
    },

    read: function(name)
    {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for(var i=0;i < ca.length;i++)
        {
            var c = ca[i];
            while (c.charAt(0)==' ') { c = c.substring(1,c.length); }
            if (c.indexOf(nameEQ) === 0) { return c.substring(nameEQ.length,c.length); }
        }
        return null;
    },

    erase: function(name)
    {
        Cookie.create(name,"",-1);
    }
};

addOnloadHook( usageCollapser.hook );