MediaWiki:Common.js
Jump to navigation
Jump to search
Note: After saving, 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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* Any JavaScript here will be loaded for all users on every page load. */
var id, timeOut, origin, mouseWhere='',
container = $("body"),
count=0;
// endvar
function dragElement(elmnt) {
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
if ($('#'+elmnt[0].id + "header")) {
/* if present, the header is where you move the DIV from:*/
$('#'+elmnt[0].id + "header").on('mousedown', dragMouseDown);
} else {
/* otherwise, move the DIV from anywhere inside the DIV:*/
elmnt.on('mousedown',dragMouseDown);
}
function dragMouseDown(e) {
e = e || window.event;
e.preventDefault();
// get the mouse cursor position at startup:
pos3 = e.clientX;
pos4 = e.clientY;
$(document).on('mouseup',closeDragElement);
// call a function whenever the cursor moves:
$(document).on('mousemove',elementDrag);
}
function elementDrag(e) {
e = e || window.event;
e.preventDefault();
// calculate the new cursor position:
pos1 = pos3 - e.clientX;
pos2 = pos4 - e.clientY;
pos3 = e.clientX;
pos4 = e.clientY;
// set the element's new position:
elmnt.css('top', (elmnt[0].offsetTop - pos2) + "px");
elmnt.css('left', (elmnt[0].offsetLeft - pos1) + "px");
}
function closeDragElement() {
/* stop moving when mouse button is released:*/
$(document).off('mouseup',closeDragElement);
$(document).off('mousemove',elementDrag);
}
}
function clickClose(i) { $('#close-'+ i).trigger('click'); }
function getID(el) { return el.text().replace(' ', '').replace(':','').replace('-',''); }
function showHover(hover, lnk) {
var posleft = lnk.offset().left; posleft = posleft <= 50 ? 10 : posleft - 50;
var postop = lnk.offset().top; postop = postop <= 200 ? 10 : postop - 200;
hover.css({"z-index":count,
"left":posleft+"px",
"top":postop+"px",
"visibility":"visible"})
.addClass("mwe-popups-fade-in-up");
}
$(document)
.on( 'mouseover keyup', '.verse', function ( event ) {
var lnk = $(this);
// delay showing the verse hover box
setTimeout(function(){
verse = lnk.text();
id = getID(lnk);
var hover = $('#' + id);
count++;
if (hover.length === 0) {
lnk.after('<div id="' + id +'" class="hover"><div id="'+ id +'header" class="header">' + verse + '<div id="close-' + id + '" class="close">×</div></div><div class="content"><img src="/natnee/images/6.gif" /></div></div>');
$.ajax({
url: '/chronology/index.php?route=common/home/sa',
type: 'get',
data: '&verse=' + verse,
dataType: 'html',
beforeSend: function() {
// set the verse hover box: content is loading
},
success: function(json) {
// verse hover box: content is the verse
$('#' + id + ' .content').html(json);
// important to redefine the hover; it becomes null if it isn't defined
hover = $('#' + id);
origin = 'top';
showHover(hover, lnk);
// make it draggable
dragElement(hover);
// when [x] of verse hover is clicked
$('#close-'+id).on('click',
function() {
if (origin == 'top') hover.removeClass("mwe-popups-fade-in-up").addClass("mwe-popups-fade-out-down");
else hover.removeClass("mwe-popups-fade-in-down").hover.addClass("mwe-popups-fade-out-up");
hover.on("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
function(e){ hover.off(e);
if (hover.attr('class').indexOf('mwe-popups-fade-out') >= 0 ) {
hover.removeClass("mwe-popups-fade-out-down").css({'visibility':'hidden','top':'0','left':'0', 'z-index':'0'});
}
}
);//end hover animation
}
);//end close on click
return false;
}, error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
} else if (hover.css('visibility') == 'hidden') { showHover(hover, lnk); }
}, 700);
})
.on( 'mouseout blur', '.verse', function () { timeOut = setTimeout( clickClose, 1000, getID($(this))); })
.on( 'mouseover', '.hover', function() { clearTimeout( timeOut ); })
.on( 'mouseout', '.hover', function() { timeOut = setTimeout( clickClose, 1000, $(this)[0].id ); });
// end document
$('bak.verse').on('click', function(){
var lnk = $(this);
verse = lnk.text();
id = getID(lnk);
var hover = $('#' + id);//$('#hover-'+title);
if ($('#' + id).length === 0) {
$.ajax({
url: '/chronology/index.php?route=common/home/sa',
type: 'get',
data: '&verse=' + verse,
dataType: 'html',
beforeSend: function() { },
success: function(json) {
lnk.after('<div id="' + id +'" class="hover"><div id="'+ id +'header" class="header">' + verse + '<div id="close-' + id + '" class="close">×</div></div><div class="content">' + json + '</div></div>');
hover = $('#' + id);
origin = 'top';
var posleft = lnk.offset().left;
var postop = lnk.offset().top;
posleft = posleft <= 50 ? 10 : posleft - 50;
postop = postop <= 200 ? 10 : postop - 200;
hover.css({"z-index":count,"left":posleft+"px","top":postop+"px","visibility":"visible"})
.addClass("mwe-popups-fade-in-up");
dragElement(hover);
$('#close-'+id).on('click', function() {
if (origin == 'top') hover.removeClass("mwe-popups-fade-in-up").addClass("mwe-popups-fade-out-down");
else hover.removeClass("mwe-popups-fade-in-down").hover.addClass("mwe-popups-fade-out-up");
hover.on("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", function(e){ hover.off(e);
if (hover.attr('class').indexOf('mwe-popups-fade-out') >= 0 ) {
hover.removeClass("mwe-popups-fade-out-down").css({'visibility':'hidden','top':'0','left':'0', 'z-index':'0'});
} });
} );
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
} else {
$('#' + id).css('visibility', 'visible');
}
});
