• Welcome to the Kancolle Wiki!
  • If you have any questions regarding site content, account registration, etc., please visit the KanColle Wiki Discord

Changes

Jump to navigation Jump to search
Undo revision 275557 by Patches (talk)
Line 26: Line 26:  
   
 
   
 
/**
 
/**
  * Dynamic Navigation Bars. See [[Wikipedia:NavFrame]]
+
  * Dynamic Navigation Bars (experimental)
*
  −
* Based on script from en.wikipedia.org, 2008-09-15.
   
  *
 
  *
  * @source www.mediawiki.org/wiki/MediaWiki:Gadget-NavFrame.js
+
  * Description: See [[Wikipedia:NavFrame]].
  * @maintainer Helder.wiki, 2012–2013
+
  * Maintainers: UNMAINTAINED
* @maintainer Krinkle, 2013
   
  */
 
  */
( function () {
   
   
 
   
// Set up the words in your language
+
/* set up the words in your language */
var collapseCaption = 'hide';
+
var NavigationBarHide = '[' + collapseCaption + ']';
var expandCaption = 'show';
+
var NavigationBarShow = '[' + expandCaption + ']';
+
var indexNavigationBar = 0;
var navigationBarHide = '[' + collapseCaption + ']';
  −
var navigationBarShow = '[' + expandCaption + ']';
   
   
 
   
 
/**
 
/**
  * Shows and hides content and picture (if available) of navigation bars.
+
  * Shows and hides content and picture (if available) of navigation bars
  *
+
  * Parameters:
  * @param {number} indexNavigationBar The index of navigation bar to be toggled
+
  *     indexNavigationBar: the index of navigation bar to be toggled
  * @param {jQuery.Event} e Event object
+
  **/
*/
+
window.toggleNavigationBar = function ( indexNavigationBar, event ) {
function toggleNavigationBar( indexNavigationBar, e ) {
+
    var NavToggle = document.getElementById( 'NavToggle' + indexNavigationBar );
var navChild,
+
    var NavFrame = document.getElementById( 'NavFrame' + indexNavigationBar );
navToggle = document.getElementById( 'NavToggle' + indexNavigationBar ),
+
    var NavChild;
navFrame = document.getElementById( 'NavFrame' + indexNavigationBar );
   
   
 
   
// Prevent browser from jumping to href "#"
+
    if ( !NavFrame || !NavToggle ) {
e.preventDefault();
+
        return false;
 +
    }
 
   
 
   
if ( !navFrame || !navToggle ) {
+
    /* if shown now */
return false;
+
    if ( NavToggle.firstChild.data === NavigationBarHide ) {
}
+
        for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
 +
            if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) {
 +
                NavChild.style.display = 'none';
 +
            }
 +
        }
 +
    NavToggle.firstChild.data = NavigationBarShow;
 
   
 
   
// If shown now
+
    /* if hidden now */
if ( navToggle.firstChild.data == navigationBarHide ) {
+
    } else if ( NavToggle.firstChild.data === NavigationBarShow ) {
for ( navChild = navFrame.firstChild; navChild != null; navChild = navChild.nextSibling ) {
+
        for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
if ( hasClass( navChild, 'NavPic' ) ) {
+
            if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) {
navChild.style.display = 'none';
+
                NavChild.style.display = 'block';
}
+
            }
if ( hasClass( navChild, 'NavContent' ) ) {
+
        }
navChild.style.display = 'none';
+
        NavToggle.firstChild.data = NavigationBarHide;
}
+
    }
}
  −
navToggle.firstChild.data = navigationBarShow;
   
   
 
   
// If hidden now
+
    event.preventDefault();
} else if ( navToggle.firstChild.data == navigationBarShow ) {
+
};
for ( navChild = navFrame.firstChild; navChild != null; navChild = navChild.nextSibling ) {
  −
if ( $( navChild ).hasClass( 'NavPic' ) || $( navChild ).hasClass( 'NavContent' ) ) {
  −
navChild.style.display = 'block';
  −
}
  −
}
  −
navToggle.firstChild.data = navigationBarHide;
  −
}
  −
}
   
   
 
   
/**
+
/* adds show/hide-button to navigation bars */
* Adds show/hide-button to navigation bars.
  −
*
  −
* @param {jQuery} $content
  −
*/
   
function createNavigationBarToggleButton( $content ) {
 
function createNavigationBarToggleButton( $content ) {
var i, j, navFrame, navToggle, navToggleText, navChild,
+
    var NavChild;
indexNavigationBar = 0,
+
    /* iterate over all < div >-elements */
navFrames = $content.find( 'div.NavFrame' ).toArray();
+
    var $divs = $content.find( 'div' );
 +
    $divs.each( function ( i, NavFrame ) {
 +
        /* if found a navigation bar */
 +
        if ( $( NavFrame ).hasClass( 'NavFrame' ) ) {
 
   
 
   
// Iterate over all (new) nav frames
+
            indexNavigationBar++;
for ( i = 0; i < navFrames.length; i++ ) {
+
            var NavToggle = document.createElement( 'a' );
navFrame = navFrames[i];
+
            NavToggle.className = 'NavToggle';
// If found a navigation bar
+
            NavToggle.setAttribute( 'id', 'NavToggle' + indexNavigationBar );
indexNavigationBar++;
+
            NavToggle.setAttribute( 'href', '#' );
navToggle = document.createElement( 'a' );
+
            $( NavToggle ).on( 'click', $.proxy( window.toggleNavigationBar, window, indexNavigationBar ) );
navToggle.className = 'NavToggle';
  −
navToggle.setAttribute( 'id', 'NavToggle' + indexNavigationBar );
  −
navToggle.setAttribute( 'href', '#' );
  −
$( navToggle ).on( 'click', $.proxy( toggleNavigationBar, null, indexNavigationBar ) );
   
   
 
   
navToggleText = document.createTextNode( navigationBarHide );
+
            var isCollapsed = $( NavFrame ).hasClass( 'collapsed' );
for ( navChild = navFrame.firstChild; navChild != null; navChild = navChild.nextSibling ) {
+
            /**
if ( $( navChild ).hasClass( 'NavPic' ) || $( navChild ).hasClass( 'NavContent' ) ) {
+
            * Check if any children are already hidden.  This loop is here for backwards compatibility:
if ( navChild.style.display == 'none' ) {
+
            * the old way of making NavFrames start out collapsed was to manually add style="display:none"
navToggleText = document.createTextNode( navigationBarShow );
+
            * to all the NavPic/NavContent elements.  Since this was bad for accessibility (no way to make
break;
+
            * the content visible without JavaScript support), the new recommended way is to add the class
}
+
            * "collapsed" to the NavFrame itself, just like with collapsible tables.
}
+
            */
}
+
            for ( NavChild = NavFrame.firstChild; NavChild != null && !isCollapsed; NavChild = NavChild.nextSibling ) {
 +
                if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) {
 +
                    if ( NavChild.style.display === 'none' ) {
 +
                        isCollapsed = true;
 +
                    }
 +
                }
 +
            }
 +
            if ( isCollapsed ) {
 +
                for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
 +
                    if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) {
 +
                        NavChild.style.display = 'none';
 +
                    }
 +
                }
 +
            }
 +
            var NavToggleText = document.createTextNode( isCollapsed ? NavigationBarShow : NavigationBarHide );
 +
            NavToggle.appendChild( NavToggleText );
 
   
 
   
navToggle.appendChild( navToggleText );
+
            /* Find the NavHead and attach the toggle link (Must be this complicated because Moz's firstChild handling is borked) */
// Find the NavHead and attach the toggle link (Must be this complicated because Moz's firstChild handling is borked)
+
            for( var j = 0; j < NavFrame.childNodes.length; j++ ) {
for ( j = 0; j < navFrame.childNodes.length; j++ ) {
+
                if ( $( NavFrame.childNodes[j] ).hasClass( 'NavHead' ) ) {
if ( $( navFrame.childNodes[j] ).hasClass( 'NavHead' ) ) {
+
                    NavToggle.style.color = NavFrame.childNodes[j].style.color;
navFrame.childNodes[j].appendChild( navToggle );
+
                    NavFrame.childNodes[j].appendChild( NavToggle );
}
+
                }
}
+
            }
navFrame.setAttribute( 'id', 'NavFrame' + indexNavigationBar );
+
            NavFrame.setAttribute( 'id', 'NavFrame' + indexNavigationBar );
}
+
        }
 +
    } );
 
}
 
}
 
   
 
   

Navigation menu