Difference between revisions of "MediaWiki:Common.js"
From EVE University Wiki
m |
m |
||
Line 143: | Line 143: | ||
mouseY = e.clientY + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); | mouseY = e.clientY + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); | ||
} | } | ||
− | moveTooltip(mouseX, mouseY); | + | moveTooltip(mouseX, mouseY, e); |
} | } | ||
− | function moveTooltip(x, y) { | + | function moveTooltip(x, y, e) { |
if(_activeTooltipIdx != -1) { | if(_activeTooltipIdx != -1) { | ||
var parentObj = document.getElementById('tooltipframeidx-' + _activeTooltipIdx); | var parentObj = document.getElementById('tooltipframeidx-' + _activeTooltipIdx); | ||
− | var parentPos = | + | var parentPos = getRelativeCoordinates(e, parentObj); |
parentObj.style.left = (x - parentPos.x) + 'px'; | parentObj.style.left = (x - parentPos.x) + 'px'; | ||
parentObj.style.top = (y - parentPos.y) + 'px'; | parentObj.style.top = (y - parentPos.y) + 'px'; | ||
Line 154: | Line 154: | ||
return false; | return false; | ||
} | } | ||
− | function | + | function = getRelativeCoordinates(event, reference) { |
− | + | var x, y; | |
− | + | event = event || window.event; | |
− | + | var el = event.target || event.srcElement; | |
− | + | if (!window.opera && typeof event.offsetX != 'undefined') { | |
− | + | // Use offset coordinates and find common offsetParent | |
− | + | var pos = { x: event.offsetX, y: event.offsetY }; | |
− | + | // Send the coordinates upwards through the offsetParent chain. | |
− | + | var e = el; | |
− | + | while (e) { | |
− | + | e.mouseX = pos.x; | |
− | + | e.mouseY = pos.y; | |
− | + | pos.x += e.offsetLeft; | |
+ | pos.y += e.offsetTop; | ||
+ | e = e.offsetParent; | ||
+ | } | ||
− | + | // Look for the coordinates starting from the reference element. | |
− | + | var e = reference; | |
+ | var offset = { x: 0, y: 0 } | ||
+ | while (e) { | ||
+ | if (typeof e.mouseX != 'undefined') { | ||
+ | x = e.mouseX - offset.x; | ||
+ | y = e.mouseY - offset.y; | ||
+ | break; | ||
+ | } | ||
+ | offset.x += e.offsetLeft; | ||
+ | offset.y += e.offsetTop; | ||
+ | e = e.offsetParent; | ||
+ | } | ||
− | + | // Reset stored coordinates | |
− | } | + | e = el; |
+ | while (e) { | ||
+ | e.mouseX = undefined; | ||
+ | e.mouseY = undefined; | ||
+ | e = e.offsetParent; | ||
+ | } | ||
+ | } | ||
+ | else { | ||
+ | // Use absolute coordinates | ||
+ | var pos = getAbsolutePosition(reference); | ||
+ | x = event.pageX - pos.x; | ||
+ | y = event.pageY - pos.y; | ||
+ | } | ||
+ | // Subtract distance to middle | ||
+ | return { x: x, y: y }; | ||
+ | } | ||
function showTooltip(id) { | function showTooltip(id) { | ||
_activeTooltipIdx = id; | _activeTooltipIdx = id; |
Revision as of 12:36, 1 November 2011
/* Any JavaScript here will be loaded for all users on every page load. */ /** Collapsible tables ********************************************************* * * Description: Allows tables to be collapsed, showing only the header. See * http://www.mediawiki.org/wiki/Manual:Collapsible_tables. * Maintainers: [[**MAINTAINERS**]] */ var autoCollapse = 2; var collapseCaption = 'hide'; var expandCaption = 'show'; function collapseTable( 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 MediaWiki:Common.css ButtonLink.style.color = Header.style.color; ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex ); ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" ); ButtonLink.appendChild( ButtonText ); Button.appendChild( document.createTextNode( '[' ) ); Button.appendChild( ButtonLink ); Button.appendChild( document.createTextNode( ']' ) ); Header.insertBefore( Button, Header.childNodes[0] ); tableIndex++; } } for ( var i = 0; i < tableIndex; i++ ) { if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) { collapseTable( i ); } } } addOnloadHook( createCollapseButtons ); /** Test if an element has a certain class ************************************** * * Description: Uses regular expressions and caching for better performance. * Maintainers: [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]] */ var hasClass = (function() { var reCache = {}; return function( element, className ) { return (reCache[className] ? reCache[className] : (reCache[className] = new RegExp("(?:\\s|^)" + className + "(?:\\s|$)"))).test(element.className); }; })(); /** Eve University Tooltip ********************************************************* * * Description: Allows easy use of auto-generated tooltip * http://wiki.eveuniversity.org/Template:Tooltip * Maintainers: Sarah Schneider **********************************************************/ var _tooltipClassName = 'uniwiki-tooltip'; var _tooltipFrameClassName = 'uniwiki-tooltip-frame'; var _activeTooltipIdx = -1; function checkElementByClassComp() { if (document.getElementsByClassName == undefined) { document.getElementsByClassName = function(className) { var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)"); var allElements = document.getElementsByTagName("*"); var results = []; var element; for (var i = 0; (element = allElements[i]) != null; i++) { var elementClass = element.className; if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) results.push(element); } return results; } } } function createTooltipTrigger() { var tooltips = document.getElementsByClassName(_tooltipClassName); for(var i=0;i<tooltips.length;i++) { tooltips[i].setAttribute( 'id', 'tooltipidx-' + i ); tooltips[i].setAttribute( 'onmouseover', 'showTooltip(' + i + ')' ); tooltips[i].setAttribute( 'onmouseout', 'hideTooltip()'); var matchFrameClassName = new RegExp("(?:^|\\s)" + _tooltipFrameClassName + "(?:$|\\s)"); var innerTooltipEls = tooltips[i].getElementsByTagName('*'); for(var j=0;(innerEl = innerTooltipEls[j]) != null;j++) { if(innerEl.className && innerEl.className.indexOf(_tooltipFrameClassName) != -1 && matchFrameClassName.test(innerEl.className)) { innerTooltipEls[j].setAttribute( 'id', 'tooltipframeidx-' + i ); break; } } } } function tooltipMouseHandler(e) { if (!e){ e = window.event; } mouseX = null; mouseY = null; if(e.pageX && e.pageY) { mouseX = e.pageX; mouseY = e.pageY; } else if(e.clientX && e.clientY) { mouseX = e.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); mouseY = e.clientY + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); } moveTooltip(mouseX, mouseY, e); } function moveTooltip(x, y, e) { if(_activeTooltipIdx != -1) { var parentObj = document.getElementById('tooltipframeidx-' + _activeTooltipIdx); var parentPos = getRelativeCoordinates(e, parentObj); parentObj.style.left = (x - parentPos.x) + 'px'; parentObj.style.top = (y - parentPos.y) + 'px'; } return false; } function = getRelativeCoordinates(event, reference) { var x, y; event = event || window.event; var el = event.target || event.srcElement; if (!window.opera && typeof event.offsetX != 'undefined') { // Use offset coordinates and find common offsetParent var pos = { x: event.offsetX, y: event.offsetY }; // Send the coordinates upwards through the offsetParent chain. var e = el; while (e) { e.mouseX = pos.x; e.mouseY = pos.y; pos.x += e.offsetLeft; pos.y += e.offsetTop; e = e.offsetParent; } // Look for the coordinates starting from the reference element. var e = reference; var offset = { x: 0, y: 0 } while (e) { if (typeof e.mouseX != 'undefined') { x = e.mouseX - offset.x; y = e.mouseY - offset.y; break; } offset.x += e.offsetLeft; offset.y += e.offsetTop; e = e.offsetParent; } // Reset stored coordinates e = el; while (e) { e.mouseX = undefined; e.mouseY = undefined; e = e.offsetParent; } } else { // Use absolute coordinates var pos = getAbsolutePosition(reference); x = event.pageX - pos.x; y = event.pageY - pos.y; } // Subtract distance to middle return { x: x, y: y }; } function showTooltip(id) { _activeTooltipIdx = id; document.onmousemove = tooltipMouseHandler; document.getElementById( 'tooltipframeidx-' + id ).style.display = 'block'; } function hideTooltip() { _activeTooltipIdx = -1; document.onmousemove = null; var allTooltip = document.getElementsByClassName(_tooltipFrameClassName); for(var i=0;(tooltipEl = allTooltip[i]) != null;i++) { tooltipEl.style.display = 'none'; } } addOnloadHook(checkElementByClassComp); addOnloadHook(createTooltipTrigger);