MediaWiki:Common.js
From LOTR-TCG Wiki
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */
var tooltips = document.querySelectorAll('.tooltip > span');
for (var i = 0; i < tooltips.length; i++){
//tooltips with card images in them tend to be big and in some contexts,
// they might cover up the screen and make it difficult to un-hover. In
// those cases, the image can be clicked to temporarily disable the hover
// for 1 second, which gives the system time to realize the mouse has moved.
// On mobile...
tooltips[i].addEventListener("click", function(e)
{
this.classList.add("click-disabled");
document.body.tabIndex = "-1";
document.body.focus();
var that = this;
setTimeout(function() {
that.classList.remove("click-disabled");
}, 1000);
}, false);
}
window.onmousemove = function (e) {
var xoffset = (e.clientX + 20),
yoffset = (e.clientY + 20);
for (var i = 0; i < tooltips.length; i++) {
var tooltip_rect = tooltips[i].getBoundingClientRect();
if(tooltip_rect.width == 0)
continue;
var x = xoffset, y = yoffset;
// console.log(tooltip_rect);
// console.log("Width: " + window.innerWidth);
// console.log("Height: " + window.innerHeight);
// console.log("X: " + x);
// console.log("Y: " + y);
if ((xoffset + tooltip_rect.width) > window.innerWidth) // Out on the right
x = window.innerWidth - tooltip_rect.width;
if ((yoffset + tooltip_rect.height) > window.innerHeight) // Out on the bottom
y = window.innerHeight - tooltip_rect.height;
// console.log("X: " + x);
// console.log("Y: " + y);
tooltips[i].style.top = y + 'px';
tooltips[i].style.left = x + 'px';
}
};