Vai al contenuto

MediaWiki:BibleGet.js: differenze tra le versioni

MediaWiki:BibleGet.js (visualizza wikitesto)

Versione delle 10:20, 26 set 2020

1 744 byte aggiunti ,  3 anni fa
nessun oggetto della modifica
Nessun oggetto della modifica
Nessun oggetto della modifica
 
(4 versioni intermedie di uno stesso utente non sono mostrate)
Riga 9: Riga 9:
console.log("There are " + $('.bibleQuoteRef').length + " bible quotes on this page");
console.log("There are " + $('.bibleQuoteRef').length + " bible quotes on this page");
$('.bibleQuoteRef').each(function(){
$('.bibleQuoteRef').each(function(){
let $span = $(this);
let $el = $(this);
let version = $(this).attr('data-version');
let version = $(this).attr('data-version');
let ref = $(this).attr('data-ref');
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)){
if(bibleQuoteCollection.includes(version+"/"+ref)){
//we already have an instance of this bible quote, avoid creating new div
//we already have an instance of this bible quote, avoid creating new div
Riga 18: Riga 20:
//however since the ajax calls are asynchronous, we probably won't have the actual div at the bottom of the page yet
//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
//so let's look for it inside the mouseover event
if(inline){
$span.on('mouseenter', function(){
$el.on('mouseenter', function(){
let $bGetTIP = $("div[data-version='"+version+"'][data-ref='"+ref+"']");
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');
console.log('I found ' + $bGetTIP.length + ' div(s) at the bottom of the page with this bible quote');
$bGetTIP.removeClass('hidden');
$bGetTIP.removeClass('hidden');
let top = $span.offset().top;
let top = $el.offset().top;
let left = $span.offset().left + $span.outerWidth() + 15;
let left = $el.offset().left + $el.outerWidth() + 15;
$bGetTIP.css({"top":top,"left":left});
$bGetTIP.css({"top":top,"left":left});
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
console.log('This element would have been offscreen!');
console.log('This element would have been offscreen!');
//how far off the bottom of the screen are we?
//how far off the bottom of the screen are we?
let rect = $bGetTIP[0].getBoundingClientRect();
let rect = $bGetTIP[0].getBoundingClientRect();
let excessHeight = (rect.y + rect.height) - window.innerHeight;
let excessHeight = (rect.y + rect.height) - window.innerHeight;
let excessWidth = (rect.x + rect.width) - window.innerWidth;
let excessWidth = (rect.x + rect.width) - window.innerWidth;
//if this amount is less than the distance from the top of the screen,
//if this amount is less than the distance from the top of the screen,
// then let's just move our div up by that much
// then let's just move our div up by that much
if(!$bGetTIP.hasClass('sticky')){
if(!$bGetTIP.hasClass('sticky')){
if(excessHeight > 0 && excessHeight < rect.y){
if(excessWidth > 0 && excessWidth < rect.x){
console.log('This element was off the bottom of the screen');
console.log('This element was off the right hand side of the screen');
let newTop = top - excessHeight;
let newLeft;
$bGetTIP.css({"top":newTop});
if($span.offset().left > rect.width){
newLeft = $span.offset().left - rect.width;
} 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});
}
}
}
if(excessWidth > 0 && excessWidth < rect.x){
}
console.log('This element was off the right hand side of the screen');
});
//let newLeft = left - excessWidth;
let newLeft = $span.offset().left - rect.width;
/*
$bGetTIP.css({"left":newLeft});
$el.on('mousemove', function(){
}
let top = $span.offset().top;
} else {
let left = $span.offset().left + $span.outerWidth();
if(!$bGetTIP.hasClass('sticky')){  
$bGetTIP.css({"top":top,"left":left});
$bGetTIP.addClass('sticky');  
});
$bGetTIP.append($('<div>',{class:'closeButton',text:'x'}));
*/
$bGetTIP.on('click','.closeButton',function(){
$bGetTIP.addClass('hidden');
$el.on('mouseleave', function(){
$bGetTIP.css({"top":'',"left":''});
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"}}));
}
}
//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;
error: function(jqXHR, textStatus, errorThrown){
$bGetTIP.css({"top":newTop});
console.log("There was an error while trying to communicate with the BibleGet server:")
console.log(errorThrown + ' ' + textStatus + ': ' + jqXHR.responseText);
}
}
}
}); //END ajax
});
}
/*
$span.on('mousemove', function(){
let top = $span.offset().top;
let left = $span.offset().left + $span.outerWidth();
$bGetTIP.css({"top":top,"left":left});
});
*/
$span.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 {
} else {
bibleQuoteCollection.push(version+"/"+ref);
bibleQuoteCollection.push(version+"/"+ref);
Riga 93: Riga 120:
console.log(data);
console.log(data);
if(data.hasOwnProperty('html')){
if(data.hasOwnProperty('html')){
let $bGetTIP = $('<div>', {
if(inline){
"class": "bibleGetQuote",
let $bGetTIP = $('<div>', {
"data-version": version,
"class": "bibleGetQuote",
"data-ref": ref,
"data-version": version,
"html": data.html
"data-ref": ref,
});
"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.push($bGetTIP);
//$('body').append($bGetTIP);
BibleQuotesDomElements.push($bGetTIP);
$span.on('mouseenter', function(){
$bGetTIP.removeClass('hidden');
$el.on('mouseenter', function(){
let top = $span.offset().top;
$bGetTIP.removeClass('hidden');
let left = $span.offset().left + $span.outerWidth() + 15;
let top = $el.offset().top;
$bGetTIP.css({"top":top,"left":left});
let left = $el.offset().left + $el.outerWidth() + 15;
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
$bGetTIP.css({"top":top,"left":left});
//are we off the bottom or the right side of the screen, and how much?
if($bGetTIP.hasClass('sticky') || $bGetTIP.is(':offscreen') ){
let rect = $bGetTIP[0].getBoundingClientRect();
//are we off the bottom or the right side of the screen, and how much?
let excessHeight = (rect.y + rect.height) - window.innerHeight;
let rect = $bGetTIP[0].getBoundingClientRect();
let excessWidth = (rect.x + rect.width) - window.innerWidth;
let excessHeight = (rect.y + rect.height) - window.innerHeight;
let excessWidth = (rect.x + rect.width) - window.innerWidth;
//if this amount is less than the distance from the top of the screen,
//if this amount is less than the distance from the top of the screen,
// then let's just move our div up by that much
// then let's just move our div up by that much
if(!$bGetTIP.hasClass('sticky')){
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});
}
if(excessWidth > 0 && excessWidth < rect.x){
console.log('This element was off the right hand side of the screen');
let newLeft = left - excessWidth;
$bGetTIP.css({"left":newLeft});
}
} else {
if(!$bGetTIP.hasClass('sticky')){
if(!$bGetTIP.hasClass('sticky')){
$bGetTIP.addClass('sticky');
if(excessWidth > 0 && excessWidth < rect.x){
$bGetTIP.append($('<div>',{class:'closeButton',text:'x'}));
console.log('This element was off the right hand side of the screen');
$bGetTIP.on('click','.closeButton',function(){
let newLeft;
$bGetTIP.addClass('hidden');
if($span.offset().left > rect.width){
$bGetTIP.css({"top":'',"left":''});
newLeft = $span.offset().left - rect.width;
});
} 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});
}
}
}
//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(){
$span.on('mousemove', function(){
let top = $span.offset().top;
let top = $span.offset().top;
let left = $span.offset().left + $span.outerWidth();
let left = $span.offset().left + $span.outerWidth();
$bGetTIP.css({"top":top,"left":left});
$bGetTIP.css({"top":top,"left":left});
});
});
*/
*/
$el.on('mouseleave', function(){
$span.on('mouseleave', function(){
if(!$bGetTIP.hasClass('sticky') ){
if(!$bGetTIP.hasClass('sticky') ){
setTimeout(function(){  
setTimeout(function(){  
$bGetTIP.addClass('hidden');
$bGetTIP.addClass('hidden');
$bGetTIP.css({"top":'',"left":''});
$bGetTIP.css({"top":'',"left":''});
},500);
},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:");
//console.log("Injected Bible quote for ref = " + ref + " with value obtained from BibleGet service:");
Estratto da "https://it.seminaverbi.bibleget.io/wiki/Speciale:DiffMobile/3143...3188"