MediaWiki:Common.js: Difference between revisions
John James (talk | contribs) new collapse code |
John James (talk | contribs) import new jquery collapsible elements |
||
| (5 intermediate revisions by the same user not shown) | |||
| Line 5: | Line 5: | ||
importScript("MediaWiki:Common.js/edit.js") | importScript("MediaWiki:Common.js/edit.js") | ||
} | } | ||
| Line 297: | Line 92: | ||
*/ | */ | ||
self.proofreadpage_disable_wheelzoom=true; | self.proofreadpage_disable_wheelzoom=true; | ||
// makeCollapsible | |||
importStylesheet('MediaWiki:JQuery-makeCollapsible.css'); | |||
importScript('MediaWiki:JQuery-makeCollapsible.js'); | |||
/** Collapsible tables ********************************************************* | |||
* | |||
* Description: Allows tables to be collapsed, showing only the header. See | |||
* [[w:Wikipedia:NavFrame]]. | |||
*/ | |||
var autoCollapse = 2; | |||
var collapseCaption = "hide"; | |||
var expandCaption = "show"; | |||
window.collapseTable = function( tableIndex ){ | |||
var Button = document.getElementById( "collapseButton" + tableIndex ); | |||
var Table = document.getElementById( "collapsibleTable" + tableIndex ); | |||
if ( !Table || !Button ) { | |||
return false; | |||
} | |||
var Rows = Table.rows; | |||
if ( Button.firstChild.data == collapseCaption ) { | |||
for ( var i = 1; i < Rows.length; i++ ) { | |||
Rows[i].style.display = "none"; | |||
} | |||
Button.firstChild.data = expandCaption; | |||
} else { | |||
for ( var i = 1; i < Rows.length; i++ ) { | |||
Rows[i].style.display = Rows[0].style.display; | |||
} | |||
Button.firstChild.data = collapseCaption; | |||
} | |||
} | |||
function createCollapseButtons(){ | |||
var tableIndex = 0; | |||
var NavigationBoxes = new Object(); | |||
var Tables = document.getElementsByTagName( "table" ); | |||
for ( var i = 0; i < Tables.length; i++ ) { | |||
if ( hasClass( Tables[i], "collapsible" ) ) { | |||
/* only add button and increment count if there is a header row to work with */ | |||
var HeaderRow = Tables[i].getElementsByTagName( "tr" )[0]; | |||
if (!HeaderRow) continue; | |||
var Header = HeaderRow.getElementsByTagName( "th" )[0]; | |||
if (!Header) continue; | |||
NavigationBoxes[ tableIndex ] = Tables[i]; | |||
Tables[i].setAttribute( "id", "collapsibleTable" + tableIndex ); | |||
var Button = document.createElement( "span" ); | |||
var ButtonLink = document.createElement( "a" ); | |||
var ButtonText = document.createTextNode( collapseCaption ); | |||
Button.className = "collapseButton"; //Styles are declared in Common.css | |||
ButtonLink.style.color = Header.style.color; | |||
ButtonLink.setAttribute( "id", "collapseButton" + tableIndex ); | |||
ButtonLink.setAttribute( "href", "#" ); | |||
addHandler( ButtonLink, "click", new Function( "evt", "collapseTable(" + tableIndex + " ); return killEvt( evt );") ); | |||
ButtonLink.appendChild( ButtonText ); | |||
Button.appendChild( document.createTextNode( "[" ) ); | |||
Button.appendChild( ButtonLink ); | |||
Button.appendChild( document.createTextNode( "]" ) ); | |||
Header.insertBefore( Button, Header.firstChild ); | |||
tableIndex++; | |||
} | |||
} | |||
for ( var i = 0; i < tableIndex; i++ ) { | |||
if ( hasClass( NavigationBoxes[i], "collapsed" ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], "autocollapse" ) ) ) { | |||
collapseTable( i ); | |||
} | |||
else if ( hasClass( NavigationBoxes[i], "innercollapse" ) ) { | |||
var element = NavigationBoxes[i]; | |||
while (element = element.parentNode) { | |||
if ( hasClass( element, "outercollapse" ) ) { | |||
collapseTable ( i ); | |||
break; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
$( createCollapseButtons ); | |||
/** Test if an element has a certain class ************************************** | |||
* | |||
* Description: Uses regular expressions and caching for better performance. | |||
*/ | |||
var hasClass = ( function() { | |||
var reCache = {}; | |||
return function( element, className ) { | |||
return ( reCache[className] ? reCache[className] : ( reCache[className] = new RegExp( "(?:\\s|^)" + className + "(?:\\s|$)" ) ) ).test( element.className ); | |||
}; | |||
})(); | |||
/** Dynamic Navigation Bars ************************************* | |||
* | |||
* Description: See [[Wikipedia:NavFrame]]. | |||
*/ | |||
// set up the words in your language | |||
var NavigationBarHide = '[' + collapseCaption + ']'; | |||
var NavigationBarShow = '[' + expandCaption + ']'; | |||
// shows and hides content and picture (if available) of navigation bars | |||
// Parameters: | |||
// indexNavigationBar: the index of navigation bar to be toggled | |||
function toggleNavigationBar(indexNavigationBar){ | |||
var NavToggle = document.getElementById("NavToggle" + indexNavigationBar); | |||
var NavFrame = document.getElementById("NavFrame" + indexNavigationBar); | |||
if (!NavFrame || !NavToggle) { | |||
return false; | |||
} | |||
// if shown now | |||
if (NavToggle.firstChild.data == NavigationBarHide) { | |||
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) { | |||
if (hasClass(NavChild, 'NavContent') || hasClass(NavChild, 'NavPic')) { | |||
NavChild.style.display = 'none'; | |||
} | |||
} | |||
NavToggle.firstChild.data = NavigationBarShow; | |||
// if hidden now | |||
} else if (NavToggle.firstChild.data == NavigationBarShow) { | |||
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) { | |||
if (hasClass(NavChild, 'NavContent') || hasClass(NavChild, 'NavPic')) { | |||
NavChild.style.display = 'block'; | |||
} | |||
} | |||
NavToggle.firstChild.data = NavigationBarHide; | |||
} | |||
} | |||
// adds show/hide-button to navigation bars | |||
function createNavigationBarToggleButton(){ | |||
var indexNavigationBar = 0; | |||
// iterate over all < div >-elements | |||
var divs = document.getElementsByTagName("div"); | |||
for (var i = 0; NavFrame = divs[i]; i++) { | |||
// if found a navigation bar | |||
if (hasClass(NavFrame, "NavFrame")) { | |||
indexNavigationBar++; | |||
var NavToggle = document.createElement("a"); | |||
NavToggle.className = 'NavToggle'; | |||
NavToggle.setAttribute('id', 'NavToggle' + indexNavigationBar); | |||
NavToggle.setAttribute('href', 'javascript:toggleNavigationBar(' + indexNavigationBar + ');'); | |||
var isCollapsed = hasClass( NavFrame, "collapsed" ); | |||
/* | |||
* Check if any children are already hidden. This loop is here for backwards compatibility: | |||
* the old way of making NavFrames start out collapsed was to manually add style="display:none" | |||
* to all the NavPic/NavContent elements. Since this was bad for accessibility (no way to make | |||
* 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 (var NavChild = NavFrame.firstChild; NavChild != null && !isCollapsed; NavChild = NavChild.nextSibling) { | |||
if ( hasClass( NavChild, 'NavPic' ) || hasClass( NavChild, 'NavContent' ) ) { | |||
if ( NavChild.style.display == 'none' ) { | |||
isCollapsed = true; | |||
} | |||
} | |||
} | |||
if (isCollapsed) { | |||
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) { | |||
if ( hasClass( NavChild, 'NavPic' ) || hasClass( NavChild, 'NavContent' ) ) { | |||
NavChild.style.display = 'none'; | |||
} | |||
} | |||
} | |||
var NavToggleText = document.createTextNode(isCollapsed ? NavigationBarShow : NavigationBarHide); | |||
NavToggle.appendChild(NavToggleText); | |||
// 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++) { | |||
if (hasClass(NavFrame.childNodes[j], "NavHead")) { | |||
NavToggle.style.color = NavFrame.childNodes[j].style.color; | |||
NavFrame.childNodes[j].appendChild(NavToggle); | |||
} | |||
} | |||
NavFrame.setAttribute('id', 'NavFrame' + indexNavigationBar); | |||
} | |||
} | |||
} | |||
$( createNavigationBarToggleButton ); | |||
Latest revision as of 23:57, 8 September 2012
/* Import more specific scripts if necessary */
if (wgAction == "edit" || wgAction == "submit" || wgPageName == "Special:Upload") //scripts specific to editing pages {
importScript("MediaWiki:Common.js/edit.js")
}
/*
* scripts imported from en.wikisource.org and wikisource.org */
/* messages are configurable here */ self.ws_messages = { 'optlist':'Display options', 'hide_page_numbers':'Hide page links', 'show_page_numbers':'Show page links', 'layout':'Layout', 'author':'Author', 'translator':'Translator', 'editor':'Editor', 'publisher':'Publisher', 'place':'Place', 'volume':'Volume', 'school':'School', 'book':'Book', 'collection':'Collection', 'journal':'Journal or magazine', 'phdthesis':'Thesis, report', 'dictionary':'Dictionary', 'progress':'Progress', 'progress_T':'Done', 'progress_V':'To be validated', 'progress_C':'To be proofread', 'progress_MS':'Ready for Match & Split', 'progress_OCR':'Needs an OCR text layer', 'progress_X':'Source file is an excerpt of a larger volume, or a mixture of several sources', 'progress_L':'Source file is incorrect (missing pages, unordered pages, etc)', '▲':'Return to the top of the page.',
'corr_list':"List of corrections performed on this page" ,
'corr_link':"Corrections" ,
'corr_one':"One typo </a> has been corrected." ,
'corr_many':" typos</a> have been corrected." ,
'corr_close':"Close." ,
'iwtrans':'Its text comes from', 'iwtrans2':'Its text comes from other Wikisource subdomains.' }
/* dynamic layouts from en.wikisource.org*/ self.ws_layouts = {
'Layout 1':{'text-wrap':"position:relative;margin-left:3em;margin-right:3em;",
'#text-container':"width:36em;margin:0px auto;font-family:Georgia,serif;" ,
'#text':"text-align:justify;",
'.sidenote-right':"position:absolute; left:37em;width:16em;text-indent:0em;text-align:left;",
'.sidenote-left':"position:absolute; right:37em;width:16em;text-indent:0em;text-align:right;",
'.editsection':"display:none",
'#headertemplate':"" },
'Layout 2':{'text-wrap':"",
'#text-container':"" ,
'#text':"",
'.sidenote-right':"float:right;margin:0.5em;padding:3px;border:solid 1px gray;max-width:9em;text-indent:0em;text-align:left;",
'.sidenote-left':"float:left;margin:0.5em;padding:3px;border:solid 1px gray;max-width:9em;text-indent:0em;text-align:left;",
'.editsection':"display:none",
'#headertemplate':"" },
'Layout 3':{'text-wrap':"margin-left:3em",
'#text-container':"position:relative; min-width:60em; float:left; width:100%; margin-right:-23em;" ,
'#text':"text-align:justify;margin-right:23em; text-indent:0em; padding-left:0px; padding-right:0px;width:auto;",
'.sidenote-right':"position:absolute; right:-10em; width:9em; background-color:#eeeeee;text-indent:0em;text-align:left;",
'.sidenote-left': "position:absolute; right:-10em; width:9em; background-color:#eeeeee;text-indent:0em;text-align:left;",
'.editsection':"display:none",
'#headertemplate':"position:absolute; top:0em; right:-23em; width:21em;float:right; text-align:left;" }
}
self.proofreadpage_add_container = true;
importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:Base.js&action=raw&ctype=text/javascript'); //importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:OCR.js&action=raw&ctype=text/javascript'); importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:DisplayFooter.js&action=raw&ctype=text/javascript'); importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:PageNumbers.js&action=raw&ctype=text/javascript'); importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:Corrections.js&action=raw&ctype=text/javascript'); importScriptURI('http://wiki.mises.org/mediawiki/index.php?title=MediaWiki:IndexForm.js&action=raw&ctype=text/javascript');
/* From en.wikisource.org Disabling mouse wheel until the problem is fixed. Users that have a configurations where zoom wheel works can override this, by adding "self.proofreadpage_disable_wheelzoom=false;" to their javascript.
- /
self.proofreadpage_disable_wheelzoom=true;
// makeCollapsible importStylesheet('MediaWiki:JQuery-makeCollapsible.css'); importScript('MediaWiki:JQuery-makeCollapsible.js');
/** Collapsible tables *********************************************************
* * Description: Allows tables to be collapsed, showing only the header. See * w:Wikipedia:NavFrame. */
var autoCollapse = 2; var collapseCaption = "hide"; var expandCaption = "show";
window.collapseTable = function( tableIndex ){
var Button = document.getElementById( "collapseButton" + tableIndex );
var Table = document.getElementById( "collapsibleTable" + tableIndex );
if ( !Table || !Button ) {
return false;
}
var Rows = Table.rows;
if ( Button.firstChild.data == collapseCaption ) {
for ( var i = 1; i < Rows.length; i++ ) {
Rows[i].style.display = "none";
}
Button.firstChild.data = expandCaption;
} else {
for ( var i = 1; i < Rows.length; i++ ) {
Rows[i].style.display = Rows[0].style.display;
}
Button.firstChild.data = collapseCaption;
}
}
function createCollapseButtons(){
var tableIndex = 0;
var NavigationBoxes = new Object();
var Tables = document.getElementsByTagName( "table" );
for ( var i = 0; i < Tables.length; i++ ) {
if ( hasClass( Tables[i], "collapsible" ) ) {
/* only add button and increment count if there is a header row to work with */
var HeaderRow = Tables[i].getElementsByTagName( "tr" )[0];
if (!HeaderRow) continue;
var Header = HeaderRow.getElementsByTagName( "th" )[0];
if (!Header) continue;
NavigationBoxes[ tableIndex ] = Tables[i];
Tables[i].setAttribute( "id", "collapsibleTable" + tableIndex );
var Button = document.createElement( "span" );
var ButtonLink = document.createElement( "a" );
var ButtonText = document.createTextNode( collapseCaption );
Button.className = "collapseButton"; //Styles are declared in Common.css
ButtonLink.style.color = Header.style.color;
ButtonLink.setAttribute( "id", "collapseButton" + tableIndex );
ButtonLink.setAttribute( "href", "#" );
addHandler( ButtonLink, "click", new Function( "evt", "collapseTable(" + tableIndex + " ); return killEvt( evt );") );
ButtonLink.appendChild( ButtonText );
Button.appendChild( document.createTextNode( "[" ) );
Button.appendChild( ButtonLink );
Button.appendChild( document.createTextNode( "]" ) );
Header.insertBefore( Button, Header.firstChild );
tableIndex++;
}
}
for ( var i = 0; i < tableIndex; i++ ) {
if ( hasClass( NavigationBoxes[i], "collapsed" ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], "autocollapse" ) ) ) {
collapseTable( i );
}
else if ( hasClass( NavigationBoxes[i], "innercollapse" ) ) {
var element = NavigationBoxes[i];
while (element = element.parentNode) {
if ( hasClass( element, "outercollapse" ) ) {
collapseTable ( i );
break;
}
}
}
}
}
$( createCollapseButtons );
/** Test if an element has a certain class **************************************
* * Description: Uses regular expressions and caching for better performance. */
var hasClass = ( function() {
var reCache = {};
return function( element, className ) {
return ( reCache[className] ? reCache[className] : ( reCache[className] = new RegExp( "(?:\\s|^)" + className + "(?:\\s|$)" ) ) ).test( element.className );
};
})();
/** Dynamic Navigation Bars *************************************
* * Description: See Wikipedia:NavFrame. */
// set up the words in your language var NavigationBarHide = '[' + collapseCaption + ']'; var NavigationBarShow = '[' + expandCaption + ']';
// shows and hides content and picture (if available) of navigation bars // Parameters: // indexNavigationBar: the index of navigation bar to be toggled function toggleNavigationBar(indexNavigationBar){
var NavToggle = document.getElementById("NavToggle" + indexNavigationBar);
var NavFrame = document.getElementById("NavFrame" + indexNavigationBar);
if (!NavFrame || !NavToggle) {
return false;
}
// if shown now
if (NavToggle.firstChild.data == NavigationBarHide) {
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) {
if (hasClass(NavChild, 'NavContent') || hasClass(NavChild, 'NavPic')) {
NavChild.style.display = 'none';
}
}
NavToggle.firstChild.data = NavigationBarShow;
// if hidden now
} else if (NavToggle.firstChild.data == NavigationBarShow) {
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) {
if (hasClass(NavChild, 'NavContent') || hasClass(NavChild, 'NavPic')) {
NavChild.style.display = 'block';
}
}
NavToggle.firstChild.data = NavigationBarHide;
}
}
// adds show/hide-button to navigation bars function createNavigationBarToggleButton(){
var indexNavigationBar = 0;
// iterate over all < div >-elements
var divs = document.getElementsByTagName("div");
for (var i = 0; NavFrame = divs[i]; i++) {
// if found a navigation bar
if (hasClass(NavFrame, "NavFrame")) {
indexNavigationBar++;
var NavToggle = document.createElement("a");
NavToggle.className = 'NavToggle';
NavToggle.setAttribute('id', 'NavToggle' + indexNavigationBar);
NavToggle.setAttribute('href', 'javascript:toggleNavigationBar(' + indexNavigationBar + ');');
var isCollapsed = hasClass( NavFrame, "collapsed" );
/*
* Check if any children are already hidden. This loop is here for backwards compatibility:
* the old way of making NavFrames start out collapsed was to manually add style="display:none"
* to all the NavPic/NavContent elements. Since this was bad for accessibility (no way to make
* 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 (var NavChild = NavFrame.firstChild; NavChild != null && !isCollapsed; NavChild = NavChild.nextSibling) {
if ( hasClass( NavChild, 'NavPic' ) || hasClass( NavChild, 'NavContent' ) ) {
if ( NavChild.style.display == 'none' ) {
isCollapsed = true;
}
}
}
if (isCollapsed) {
for (var NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling) {
if ( hasClass( NavChild, 'NavPic' ) || hasClass( NavChild, 'NavContent' ) ) {
NavChild.style.display = 'none';
}
}
}
var NavToggleText = document.createTextNode(isCollapsed ? NavigationBarShow : NavigationBarHide);
NavToggle.appendChild(NavToggleText);
// 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++) {
if (hasClass(NavFrame.childNodes[j], "NavHead")) {
NavToggle.style.color = NavFrame.childNodes[j].style.color;
NavFrame.childNodes[j].appendChild(NavToggle);
}
}
NavFrame.setAttribute('id', 'NavFrame' + indexNavigationBar);
}
}
}
$( createNavigationBarToggleButton );