Seeds of the Word

MediaWiki:BibleGet.js: Difference between revisions

Browse history interactively
← Older edit
Content deleted Content added
No edit summary
No edit summary
 
(14 intermediate revisions by the same user not shown)
Line 9:
console.log("There are " + $('.bibleQuoteRef').length + " bible quotes on this page");
$('.bibleQuoteRef').each(function(){
let $spanel = $(this);
let version = $(this).attr('data-version');
let ref = $(this).attr('data-ref');
let inline = ($(this).attr('data-inline') == "true");
console.log("data-ref = " + ref + " data-inline = " + inline);
if(bibleQuoteCollection.includes(version+"/"+ref)){
//we already have an instance of this bible quote, avoid creating new div
Line 18 ⟶ 20:
//however since the ajax calls are asynchronous, we probably won't have the actual div at the bottom of the page yet
//so let's look for it inside the mouseover event
if(inline){
$spanel.on('mouseenter', function(){
let $bGetTIP = $("div[data-version='"+version+"'][data-ref='"+ref+"']");
console.log('I found ' + $bGetTIP.length + ' div(s) at the bottom of the page with this bible quote');
$bGetTIP.removeClass('hidden');
let top = $spanel.offset().top;
let left = $spanel.offset().left + $spanel.outerWidth() + 15;
$bGetTIP.css({"top":top,"left":left});
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
});
console.log('This element would have been offscreen!');
//how far off the bottom of the screen are we?
/*
let rect = $bGetTIP[0].getBoundingClientRect();
$span.on('mousemove', function(){
let topexcessHeight = $span.offset(rect.y + rect.height) - window.topinnerHeight;
let leftexcessWidth = $span.offset()rect.leftx + $spanrect.outerWidth(width) - window.innerWidth;
//if this amount is less than the distance from the top of the screen,
$bGetTIP.css({"top":top,"left":left});
// then let's just move our div up by that much
});
if(!$bGetTIP.hasClass('sticky')){
*/
if(excessWidth > 0 && excessWidth < rect.x){
console.log('This element was off the right hand side of the screen');
$span.on('mouseleave', function(){
let newLeft;
let $bGetTIP = $("div[data-version='"+version+"'][data-ref='"+ref+"']");
if($span.offset().left > rect.width){
//console.log('I found ' + $bGetTIP.length + ' div(s) at the bottom of the page with this bible quote');
newLeft = $span.offset().left - rect.width;
setTimeout(function(){
} else {
$bGetTIP.addClass('hidden');
newLeft = $span.offset().left - rect.width / 2; //center it on the span as a last resort!
$bGetTIP.css({"top":'',"left":''});
},500);
$bGetTIP.css({"left":newLeft});
});
}
if(excessHeight > 0 && excessHeight < rect.y){
console.log('This element was off the bottom of the screen');
let newTop = top - excessHeight;
$bGetTIP.css({"top":newTop});
} else if (excessHeight > rect.y){
$bGetTIP.addClass('sticky');
$bGetTIP.append($('<div>',{class:'closeButton',text:'x'}));
$bGetTIP.on('click','.closeButton',function(){
$bGetTIP.addClass('hidden');
$bGetTIP.css({"top":'',"left":''});
});
//distance of the top of the current window from the top of the document
let newTop = (window.pageYOffset || (document.documentElement || document.body.parentNode || document.body).scrollTop) + 20;
$bGetTIP.css({"top":newTop});
}
}
}
});
/*
$el.on('mousemove', function(){
let top = $span.offset().top;
let left = $span.offset().left + $span.outerWidth();
$bGetTIP.css({"top":top,"left":left});
});
*/
$el.on('mouseleave', function(){
let $bGetTIP = $("div[data-version='"+version+"'][data-ref='"+ref+"']");
//console.log('I found ' + $bGetTIP.length + ' div(s) at the bottom of the page with this bible quote');
if(!$bGetTIP.hasClass('sticky') ){
setTimeout(function(){
$bGetTIP.addClass('hidden');
$bGetTIP.css({"top":'',"left":''});
},500);
}
});
} else {
//if it's not inline we do have to deal with it again
$.ajax({
method: 'POST',
url: '../w/bgetHelper.php',
data: {
"version": version,
"ref": ref
},
success: function(data){
if(data.hasOwnProperty('html')){
$el.empty();
$el.css({"background-color":"white"});
$el.append(data.html);
$el.append($('<p>',{"text": " — powered by BibleGet I/O","css":{"font-size":".9em","text-align":"right","font-style":"italic","font-weight":"bold","color":"gray"}}));
}
},
error: function(jqXHR, textStatus, errorThrown){
console.log("There was an error while trying to communicate with the BibleGet server:")
console.log(errorThrown + ' ' + textStatus + ': ' + jqXHR.responseText);
}
}); //END ajax
}
} else {
bibleQuoteCollection.push(version+"/"+ref);
Line 57 ⟶ 120:
console.log(data);
if(data.hasOwnProperty('html')){
let $bGetTIP = $if('<div>', inline){
"class":let "bibleGetQuote"$bGetTIP = $('<div>', {
"data-versionclass": version"bibleGetQuote",
"data-refversion": refversion,
"htmldata-ref": data.htmlref,
}); "html": data.html
});
$bGetTIP.append($('<p>',{"text": " — powered by BibleGet I/O","css":{"font-size":".9em","text-align":"right","font-style":"italic","font-weight":"bold","color":"gray"}}));
$bGetTIP.append($('<p>',{"text": " — powered by BibleGet I/O","css":{"font-size":".9em","text-align":"right","font-style":"italic","font-weight":"bold","color":"gray"}}));
//$('body').append($bGetTIP);
BibleQuotesDomElements //$('body').pushappend($bGetTIP);
BibleQuotesDomElements.push($bGetTIP);
$span.on('mouseenter', function(){
$bGetTIPel.removeClasson('hiddenmouseenter', function();{
let top = $spanbGetTIP.offsetremoveClass('hidden').top;
let lefttop = $spanel.offset().left + $span.outerWidth() + 15top;
let left = $bGetTIPel.cssoffset({"top":top,").left":left} + $el.outerWidth() + 15;
$bGetTIP.css({"top":top,"left":left});
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
//are we off the bottom or the right side of the screen, and how much?
/*
let rect = $bGetTIP[0].getBoundingClientRect();
$span.on('mousemove', function(){
let topexcessHeight = $span.offset(rect.y + rect.height) - window.topinnerHeight;
let leftexcessWidth = $span.offset()rect.leftx + $spanrect.outerWidth(width) - window.innerWidth;
//if this amount is less than the distance from the top of the screen,
$bGetTIP.css({"top":top,"left":left});
// then let's just move our div up by that much
});
if(!$bGetTIP.hasClass('sticky')){
*/
if(excessWidth > 0 && excessWidth < rect.x){
console.log('This element was off the right hand side of the screen');
$span.on('mouseleave', function(){
setTimeout(function(){ let newLeft;
if($bGetTIPspan.addClassoffset('hidden');.left > rect.width){
newLeft = $span.offset().left - rect.width;
$bGetTIP.css({"top":'',"left":''});
},500); else {
newLeft = $span.offset().left - rect.width / 2; //center it on the span as a last resort!
});
}
$bGetTIP.css({"left":newLeft});
}
if(excessHeight > 0 && excessHeight < rect.y){
console.log('This element was off the bottom of the screen');
let newTop = top - excessHeight;
$bGetTIP.css({"top":newTop});
} else if (excessHeight >= rect.y){
$bGetTIP.addClass('sticky');
$bGetTIP.append($('<div>',{class:'closeButton',text:'x'}));
$bGetTIP.on('click','.closeButton',function(){
$bGetTIP.addClass('hidden');
$bGetTIP.css({"top":'',"left":''});
});
//distance of the top of the current window from the top of the document
let newTop = (window.pageYOffset || (document.documentElement || document.body.parentNode || document.body).scrollTop) + 20;
$bGetTIP.css({"top":newTop});
}
}
}
});
/*
$el.on('mousemove', function(){
let top = $span.offset().top;
let left = $span.offset().left + $span.outerWidth();
$bGetTIP.css({"top":top,"left":left});
});
*/
$el.on('mouseleave', function(){
if(!$bGetTIP.hasClass('sticky') ){
setTimeout(function(){
$bGetTIP.addClass('hidden');
$bGetTIP.css({"top":'',"left":''});
},500);
}
});
} else {
$el.empty();
$el.css({"background-color":"white"});
$el.append(data.html);
$el.append($('<p>',{"text": " — powered by BibleGet I/O","css":{"font-size":".9em","text-align":"right","font-style":"italic","font-weight":"bold","color":"gray"}}));
}
}
//console.log("Injected Bible quote for ref = " + ref + " with value obtained from BibleGet service:");
Line 201 ⟶ 308:
jQuery(this).addClass('ready hidden');
});
};
 
jQuery.expr.filters.offscreen = function(el) {
let rect = el.getBoundingClientRect();
return ( rect.x < 0 || rect.y < 0 ||
(rect.x + rect.width) > window.innerWidth ||
(rect.y + rect.height) > window.innerHeight );
};
Retrieved from "https://en.seminaverbi.bibleget.io/wiki/MediaWiki:BibleGet.js"