I have the code below. It works on a mobile device but for some reason, that baffles me, it won't work in a desktop browser. Any ideas?
<div class="top_nav_option_wrapper"
onclick="javascript:changePage('{{ shop.url }}{{ link.url }}','fade');">
<a href="#"
onclick="javascript:changePage('{{ shop.url }}{{ link.url }}','fade');"
class="top_nav_option">{{ link.title }}</a><br>
</div>
Function
// Function used to transition a page out and navigate to a new page
function changePage(goToUrl, type, id) {
alert('HEY');
if (type == 'collection_flicker') {
prodElements = ['prod1', 'prod2', 'prod3', 'prod4'];
for (i = 0; i < prodElements.length; i++) {
if (document.getElementById(prodElements[i]) != null && document.getElementById(prodElements[i]) != document.getElementById(id)) {
document.getElementById(prodElements[i]).style.opacity = "0";
document.getElementById(prodElements[i]).style.display = "none";
}
}
flickerEffect('collection_exit', 15, 50);
window.setTimeout(function () {
window.location.href = goToUrl
}, 1000);
} else if (type == 'fade' && currentTemplate == 'collection') {
document.getElementById('watermark').style.transition = '1s opacity';
document.getElementById('watermark').style.opacity = '0';
document.getElementById('productCollectionList').style.transition = '1s opacity';
document.getElementById('productCollectionList').style.opacity = '0';
window.setTimeout(function () {
window.location.href = goToUrl
}, 500);
} else {
window.location.href = goToUrl;
}
}
I suggest the following changes - I am not sure how link.url becomes a type but you will see the idea
HTML:
<div class="top_nav_option_wrapper">
<a href="{{ shop.url }}"
onclick="return changePage(this.href,'{{ link.url }}','fade');"
class="top_nav_option">{{ link.title }}</a><br>
</div>
Script
// Function used to transition a page out and navigate to a new page
function changePage(goToUrl, type, id) {
if (type == 'collection_flicker') {
prodElements = ['prod1', 'prod2', 'prod3', 'prod4'];
for (var i = 0; i < prodElements.length; i++) {
var prodelem = document.getElementById(prodElements[i]);
if (prodelem != null && prodelem != document.getElementById(id)) {
prodelem.style.opacity = "0";
prodelem.style.display = "none";
}
}
flickerEffect('collection_exit', 15, 50);
window.setTimeout(function () {
window.location.href = goToUrl
}, 1000);
return false; // cancel link
} else if (type == 'fade' && currentTemplate == 'collection') {
document.getElementById('watermark').style.transition = '1s opacity';
document.getElementById('watermark').style.opacity = '0';
document.getElementById('productCollectionList').style.transition = '1s opacity';
document.getElementById('productCollectionList').style.opacity = '0';
window.setTimeout(function () {
window.location.href = goToUrl
}, 500);
return false; // cancel link
}
return true; // allow link
}
Related
I have a cycle of links and I determined click event on them. And I want to define if navbar[1].clicked == true {doing something} else if navbar[2].cliked == true {doing something} etc. "By if else in " reveal functional callbackFn".
Here is the code:
var navbar = document.getElementById("navbar").getElementsByTagName("a");
for (var i = 0; i < navbar.length; i++) {
navbar[i].addEventListener('click', function() { reveal('top'); });
}
function reveal(direction) {
callbackFn = function() {
// this is the part where is running the turning of pages
classie.remove(pages[currentPage], 'page--current');
if (navbar[1].clicked == true) {
currentPage = 0;
} else if(navbar[1].clicked == true) {
currentPage = 1;
} else if(navbar[2].clicked == true) {
currentPage = 2;
} else if(navbar[3].clicked == true) {
currentPage = 3;
} else if(navbar[4].clicked == true) {
currentPage = 4;
};
classie.add(pages[currentPage], 'page--current');
};
}
This is typically a problem of closure.
You can make the following change
Here the call back function of the addEventListener is an IIFE, & in the reveal function pass the value of i
var navbar = document.getElementById("navbar").getElementsByTagName("a");
for (var i = 0; i < navbar.length; i++) {
navbar[i].addEventListener('click', (function(x) {
reveal('top',x);
}(i))};
}
In this function you will have access to
function reveal(direction,index) {
// not sure what this function is mean by, but you will have the value of `i` which is denote the clicked element
callbackFn = function() {
// this is the part where is running the turning of pages
classie.remove(pages[currentPage], 'page--current');
if (index == 1) {
currentPage = 0;
} else if (index == 1) {
currentPage = 1;
} else if (index == 2) {
currentPage = 2;
} else if (index == 3) {
currentPage = 3;
} else if (index == 4) {
currentPage = 4;
};
classie.add(pages[currentPage], 'page--current');
};
}
Here is the solution in my case.
Thank you brk for helping in any case, thanks again.
// determine clicked item
var n;
$('#navbar a').click(function(){
if($(this).attr('id') == 'a') {
n = 0;
} else if($(this).attr('id') == 'b') {
n = 1;
} else if($(this).attr('id') == 'c') {
n = 2;
} else if($(this).attr('id') == 'd') {
n = 3;
} else if($(this).attr('id') == 'e') {
n = 4;
};
});
var pages = [].slice.call(document.querySelectorAll('.pages > .page')),
currentPage = 0,
revealerOpts = {
// the layers are the elements that move from the sides
nmbLayers : 3,
// bg color of each layer
bgcolor : ['#52b7b9', '#ffffff', '#53b7eb'],
// effect classname
effect : 'anim--effect-3'
};
revealer = new Revealer(revealerOpts);
// clicking the page nav
document.querySelector("#a").addEventListener('click', function() { reveal('cornertopleft'); });
document.querySelector("#b").addEventListener('click', function() { reveal('bottom'); });
document.querySelector("#c").addEventListener('click', function() { reveal('left'); });
document.querySelector("#d").addEventListener('click', function() { reveal('right'); });
document.querySelector("#e").addEventListener('click', function() { reveal('top'); });
// moving clicked item's `n` into the function
function reveal(direction) {
var callbackTime = 750;
callbackFn = function() {
classie.remove(pages[currentPage], 'page--current');
currentPage = n;
classie.add(pages[currentPage], 'page--current');
};
revealer.reveal(direction, callbackTime, callbackFn);
}
var _0x3424=["\x67\x65\x74","\x2F\x73\x68\x6F\x70\x2F\x61\x6C\x6C","\x69\x6E\x64\x65\x78\x4F\x66","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x6B\x65\x79\x77\x6F\x72\x64","","\x74\x6F\x4C\x6F\x77\x65\x72\x43\x61\x73\x65","\x63\x6F\x6C\x6F\x72","\x73\x69\x7A\x65","\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65","\x67\x65\x74\x41\x74\x74\x72\x69\x62\x75\x74\x65","\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65\x20\x3E\x20\x61","\x2F","\x73\x70\x6C\x69\x74","\x6C\x65\x6E\x67\x74\x68","\x61\x6C\x74","\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65\x20\x3E\x20\x61\x20\x3E\x20\x69\x6D\x67","\x6E\x6F\x74\x20\x66\x6F\x75\x6E\x64","\x6C\x6F\x67","\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x73\x75\x70\x72\x65\x6D\x65\x6E\x65\x77\x79\x6F\x72\x6B\x2E\x63\x6F\x6D\x2F\x73\x68\x6F\x70\x2F\x61\x6C\x6C","\x3A\x76\x69\x73\x69\x62\x6C\x65","\x69\x73","\x2E\x69\x6E\x2D\x63\x61\x72\x74","\x74\x65\x78\x74","\x73\x65\x6C\x65\x63\x74\x65\x64\x49\x6E\x64\x65\x78","\x70\x72\x6F\x70","\x23\x73\x69\x7A\x65","\x65\x61\x63\x68","\x23\x73\x69\x7A\x65\x20\x6F\x70\x74\x69\x6F\x6E","\x63\x6C\x69\x63\x6B","\x5B\x6E\x61\x6D\x65\x3D\x22\x63\x6F\x6D\x6D\x69\x74\x22\x5D","\x69\x73\x63\x68\x65\x63\x6B\x6F\x75\x74","\x73\x68\x6F\x70\x2F\x61\x6C\x6C","\x68\x74\x74\x70\x73\x3A\x2F\x2F\x77\x77\x77\x2E\x73\x75\x70\x72\x65\x6D\x65\x6E\x65\x77\x79\x6F\x72\x6B\x2E\x63\x6F\x6D\x2F\x63\x68\x65\x63\x6B\x6F\x75\x74","\x73\x65\x6E\x64\x4D\x65\x73\x73\x61\x67\x65","\x65\x78\x74\x65\x6E\x73\x69\x6F\x6E"];$(function(){chrome[_0x3424[36]][_0x3424[35]]({method:_0x3424[0]},function(_0xc165x1){var _0xc165x2=false;var _0xc165x3=setInterval(function(){if(window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[1])!=-1&&_0xc165x2===false){if(_0xc165x1[_0x3424[5]]!=_0x3424[6]&&_0xc165x1[_0x3424[5]]!=undefined){var _0xc165x4=_0xc165x1[_0x3424[5]][_0x3424[7]]();var _0xc165x5=_0xc165x1[_0x3424[8]][_0x3424[7]]();for(var _0xc165x6=0;_0xc165x6<$(_0x3424[10])[_0x3424[9]]();_0xc165x6++){var _0xc165x7=$(_0x3424[12])[_0xc165x6][_0x3424[11]](_0x3424[3]);var _0xc165x8=_0xc165x7[_0x3424[14]](_0x3424[13]);_0xc165x8=_0xc165x8[_0xc165x8[_0x3424[15]]-1][_0x3424[7]]();var _0xc165x9=$(_0x3424[17])[_0xc165x6][_0x3424[11]](_0x3424[16])[_0x3424[7]]();if(_0xc165x9[_0x3424[2]](_0xc165x4)!=-1&&_0xc165x8[_0x3424[2]](_0xc165x5)!=-1&&_0xc165x2===false){_0xc165x2=true;window[_0x3424[4]][_0x3424[3]]=_0xc165x7;break ;}else {console[_0x3424[19]](_0x3424[18])};};if(_0xc165x2===false){clearInterval(_0xc165x3);window[_0x3424[4]][_0x3424[3]]=_0x3424[20];};}}});var _0xc165xa=setInterval(function(){if(window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[1])== -1){if(!$(_0x3424[23])[_0x3424[22]](_0x3424[21])){$(_0x3424[29])[_0x3424[28]](function(_0xc165x6){if($(this)[_0x3424[24]]()==_0xc165x1[_0x3424[9]]){$(_0x3424[27])[_0x3424[26]](_0x3424[25],_0xc165x6)}});$(_0x3424[31])[_0x3424[30]]();}}},100);if(_0xc165x1[_0x3424[32]]==1){var _0xc165xb=setInterval(function(){if($(_0x3424[23])[_0x3424[22]](_0x3424[21])&&window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[33])== -1){window[_0x3424[4]]=_0x3424[34];clearInterval(_0xc165xb);}},100)};})});
I'm wondering if this is a strong encryption, how could someone exactly decode it? Any help would be appreciate. Thank you.
It's impossible to recover the EXACT original code once it's obfuscated, but keep in mind that the code still needs to be understandable by the compiler/interpreter so it may be "reassembled" but most likely the original structure, classes, variable names, etc... will be lost.
My try to deobfuscate your code got me this :
var _0x3424 = ["\x67\x65\x74", "\x2F\x73\x68\x6F\x70\x2F\x61\x6C\x6C", "\x69\x6E\x64\x65\x78\x4F\x66", "\x68\x72\x65\x66", "\x6C\x6F\x63\x61\x74\x69\x6F\x6E", "\x6B\x65\x79\x77\x6F\x72\x64", "", "\x74\x6F\x4C\x6F\x77\x65\x72\x43\x61\x73\x65", "\x63\x6F\x6C\x6F\x72", "\x73\x69\x7A\x65", "\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65", "\x67\x65\x74\x41\x74\x74\x72\x69\x62\x75\x74\x65", "\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65\x20\x3E\x20\x61", "\x2F", "\x73\x70\x6C\x69\x74", "\x6C\x65\x6E\x67\x74\x68", "\x61\x6C\x74", "\x2E\x69\x6E\x6E\x65\x72\x2D\x61\x72\x74\x69\x63\x6C\x65\x20\x3E\x20\x61\x20\x3E\x20\x69\x6D\x67", "\x6E\x6F\x74\x20\x66\x6F\x75\x6E\x64", "\x6C\x6F\x67", "\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x73\x75\x70\x72\x65\x6D\x65\x6E\x65\x77\x79\x6F\x72\x6B\x2E\x63\x6F\x6D\x2F\x73\x68\x6F\x70\x2F\x61\x6C\x6C", "\x3A\x76\x69\x73\x69\x62\x6C\x65", "\x69\x73", "\x2E\x69\x6E\x2D\x63\x61\x72\x74", "\x74\x65\x78\x74", "\x73\x65\x6C\x65\x63\x74\x65\x64\x49\x6E\x64\x65\x78", "\x70\x72\x6F\x70", "\x23\x73\x69\x7A\x65", "\x65\x61\x63\x68", "\x23\x73\x69\x7A\x65\x20\x6F\x70\x74\x69\x6F\x6E", "\x63\x6C\x69\x63\x6B", "\x5B\x6E\x61\x6D\x65\x3D\x22\x63\x6F\x6D\x6D\x69\x74\x22\x5D", "\x69\x73\x63\x68\x65\x63\x6B\x6F\x75\x74", "\x73\x68\x6F\x70\x2F\x61\x6C\x6C", "\x68\x74\x74\x70\x73\x3A\x2F\x2F\x77\x77\x77\x2E\x73\x75\x70\x72\x65\x6D\x65\x6E\x65\x77\x79\x6F\x72\x6B\x2E\x63\x6F\x6D\x2F\x63\x68\x65\x63\x6B\x6F\x75\x74", "\x73\x65\x6E\x64\x4D\x65\x73\x73\x61\x67\x65", "\x65\x78\x74\x65\x6E\x73\x69\x6F\x6E"];
$(function() {
chrome[_0x3424[36]][_0x3424[35]]({
method: _0x3424[0]
}, function(_0xc165x1) {
var _0xc165x2 = false;
var _0xc165x3 = setInterval(function() {
if (window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[1]) != -1 && _0xc165x2 === false) {
if (_0xc165x1[_0x3424[5]] != _0x3424[6] && _0xc165x1[_0x3424[5]] != undefined) {
var _0xc165x4 = _0xc165x1[_0x3424[5]][_0x3424[7]]();
var _0xc165x5 = _0xc165x1[_0x3424[8]][_0x3424[7]]();
for (var _0xc165x6 = 0; _0xc165x6 < $(_0x3424[10])[_0x3424[9]](); _0xc165x6++) {
var _0xc165x7 = $(_0x3424[12])[_0xc165x6][_0x3424[11]](_0x3424[3]);
var _0xc165x8 = _0xc165x7[_0x3424[14]](_0x3424[13]);
_0xc165x8 = _0xc165x8[_0xc165x8[_0x3424[15]] - 1][_0x3424[7]]();
var _0xc165x9 = $(_0x3424[17])[_0xc165x6][_0x3424[11]](_0x3424[16])[_0x3424[7]]();
if (_0xc165x9[_0x3424[2]](_0xc165x4) != -1 && _0xc165x8[_0x3424[2]](_0xc165x5) != -1 && _0xc165x2 === false) {
_0xc165x2 = true;
window[_0x3424[4]][_0x3424[3]] = _0xc165x7;
break;
} else {
console[_0x3424[19]](_0x3424[18])
};
};
if (_0xc165x2 === false) {
clearInterval(_0xc165x3);
window[_0x3424[4]][_0x3424[3]] = _0x3424[20];
};
}
}
});
var _0xc165xa = setInterval(function() {
if (window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[1]) == -1) {
if (!$(_0x3424[23])[_0x3424[22]](_0x3424[21])) {
$(_0x3424[29])[_0x3424[28]](function(_0xc165x6) {
if ($(this)[_0x3424[24]]() == _0xc165x1[_0x3424[9]]) {
$(_0x3424[27])[_0x3424[26]](_0x3424[25], _0xc165x6)
}
});
$(_0x3424[31])[_0x3424[30]]();
}
}
}, 100);
if (_0xc165x1[_0x3424[32]] == 1) {
var _0xc165xb = setInterval(function() {
if ($(_0x3424[23])[_0x3424[22]](_0x3424[21]) && window[_0x3424[4]][_0x3424[3]][_0x3424[2]](_0x3424[33]) == -1) {
window[_0x3424[4]] = _0x3424[34];
clearInterval(_0xc165xb);
}
}, 100)
};
})
});
OK, how'd I do. Variable names will have changed of course, but the functionality of the code is completely readable
$(function () {
chrome.extension.sendMessage({ method: "get" },
function (param1) {
var var1 = false;
var intHand1 = setInterval(function () {
if (window.location.href.indexOf("/shop/all") != -1 && var1 === false) {
if (param1.keyword != "" && param1.keyword != undefined) {
var kwordlc = param1.keyword.toLowerCase();
var colorlc = param1.color.toLowerCase();
for (var i = 0; i < $(".inner-article").size() ; i++) {
var ahref = $(".inner-article > a")[i].getAttribute("href");
var ahrefsplit = ahref.split("/");
ahrefsplit = ahrefsplit[ahrefsplit.length - 1].toLowerCase();
var altlc = $(".inner-article > a > img")[i].getAttribute("alt").toLowerCase();
if (altlc.indexOf(kwordlc) != -1 && ahrefsplit.indexOf(colorlc) != -1 && var1 === false) {
var1 = true;
window.location.href = ahref;
break;
} else {
console.log("not found")
};
}; if (var1 === false) {
clearInterval(intHand1);
window.location.href = "http://www.supremenewyork.com/shop/all";
};
}
}
});
var intHand2 = setInterval(function () {
if (window.location.href.indexOf("/shop/all") == -1) {
if (!$(".in-cart").is(":visible")) {
$("#size option").each(function (param2) {
if ($(this).text() == param1.size) {
$("#size").prop("selectedIndex", param2)
}
}); $("[name='commit']").click();
}
}
}, 100);
if (param1.ischeckout == 1) {
var intHand3 = setInterval(function () {
if ($(".in-cart").is(":visible") && window.location.href.indexOf("shop/all") == -1) {
window.location = "https://www.supremenewyork.com/checkout";
clearInterval(intHand3);
}
}, 100)
};
})
});
Took me about 50 mins, and I got interrupted by a couple of phone calls, messages and emails.
var BGLinks = (function() {
var that = {};
// can be set like BGLinks.parameter
that.version = 'NIV';
that.clickTooltip = false;
that.apocrypha = false;
that.showTooltips = true;
that.host = 'www.biblegateway.com';
var showTimer = 0;
var hideTimer = 0;
var container;
var addedCSS = false;
var setupRun = false;
var delay = 1000;
var bgHost;
var toolsHost;
var cdHost;
var browser = navigator.appVersion;
var book_string = 'Genesis|Gen?|Gn|Exodus|Exod?|Ex|Leviticus|Le?v|Numbers|Nu?m|Nu|Deuteronomy|Deut?|Dt|Josh?ua|Josh?|Jsh|Judges|Ju?dg|Jg|Ru(?:th)?|Ru?t|(?:1|i|2|ii) ?Samuel|(?:1|i|2|ii) ?S(?:a|m)|(?:1|i|2|ii) ?Sam|(?:1|i|2|ii) ?Kin(?:gs?)?|(?:1|i|2|ii) ?Kgs|(?:1|i|2|ii) ?Chronicles|(?:1|i|2|ii) ?Chr(?:o?n)?|(?:1|i|2|ii) ?Cr|Ezra?|Nehemiah|Neh?|Esther|Esth?|Jo?b|Psalms?|Psa?|Proverbs|Pro?v?|Ecclesiastes|Ec(?:cl?)?|Song (?:O|o)f Solomon|Song (?:O|o)f Songs?|Son(?:gs?)?|SS|Isaiah?|Isa?|Jeremiah|Je?r|Lamentations|La(?:me?)?|Ezekiel|Eze?k?|Daniel|Da?n|Da|Hosea|Hos?|Hs|Jo(?:el?)?|Am(?:os?)?|Obadiah|Ob(?:ad?)?|Jon(?:ah?)?|Jnh|Mic(?:ah?)?|Mi|Nah?um|Nah?|Habakkuk|Hab|Zephaniah|Ze?ph?|Haggai|Hagg?|Hg|Zechariah|Ze?ch?|Malachi|Ma?l|Matthew|Matt?|Mt|Mark|Ma(?:r|k)|M(?:r|k)|Luke?|Lk|Lu?c|John|Jn|Ac(?:ts?)?|Romans|Ro?m|(?:1|i|2|ii) ?Corinthians|(?:1|i|2|ii) ?C(?:or?)?|Galatians|Gal?|Gl|Ephesians|Eph?|Philippians|Phil|Colossians|Co?l|(?:1|i|2|ii) ?Thessalonians|(?:1|i|2|ii) ?Th(?:e(?:ss?)?)?|(?:1|i|2|ii) ?Timothy|(?:1|i|2|ii) ?Tim|(?:1|i|2|ii) ?T(?:i|m)|Ti(?:tus)?|Ti?t|Philemon|Phl?m|Hebrews|Heb?|Jam(?:es)?|Jms|Jas|(?:1|i|2|ii) ?Peter|(?:1|i|2|ii) ?Pe?t?|(?:1|i|2|ii|3|iii) ?J(?:oh)?n?|Jude?|Revelations?|Rev|R(?:e|v)';
var apoc_books = '|Tobit?|To?b|Judi(?:th?)?|Jdt|(?:1|2) ?Mac(?:cabees)?|(?:1|2) ?Ma?|Wi(?:sdom)?|Wi?s|Sir(?:ach)?|Ba(?:ruc?h)?|Ba?r';
that.linkVerses = function() {
updateURLs();
insertBiblerefs(document.body);
if (that.showTooltips === true) {
addBiblerefListeners();
}
setup();
}
var updateURLs = function() {
bgHost = window.location.protocol + '//' + that.host;
toolsHost = bgHost + '/share/tooltips/data';
cdHost = bgHost + '/public/link-to-us/tooltips';
}
var insertBiblerefs = function(node) {
if (node.nodeType === 3) {
var new_nodes = searchNode(node,0);
return new_nodes;
}
else if (node.tagName != undefined && node.tagName.match(/^(?:a|h\d|img|pre|input|option)$/i)) {
return null;
}
else {
var children = node.childNodes;
var i = 0;
while(i<children.length) {
var new_nodes = insertBiblerefs(children[i]);
i += new_nodes +1;
}
}
return null;
}
var searchNode = function(node, inserted_nodes) {
var apoc_string = that.apocrypha === true ? apoc_books : '';
//finds book and chapter for each verse that been separated by &,and,etc...
var book_chap = '((?:('+book_string+apoc_string+')(?:\.)? ?)?(?:(\\d*):)?(\\d+(?:(?:ff|f|\\w)|(?:\\s?(?:-|–|—)\\s?\\d+)?)))([^a-z0-9]*)';
var regex_string = '(?:'+book_string+apoc_string+')(?:\.)? ?\\d+:\\d+(?:ff|f|\\w)?(?:\\s?(?:(?:(?:-|–|—)\\s?(?:(?:'+book_string+apoc_string+')(?:\.)?\\s)?)|(?:(?:,|;|&|&|and|cf\\.|cf)))\\s?(?:(?:(?:vv.|vs.|vss.|v.) ?)?\\d+\\w?)(?::\\d+\\w?)?)*';
var regex = new RegExp(regex_string,'i');
var verse_match = node.nodeValue.match(regex);
if (verse_match == null) {
return inserted_nodes;
} else {
var text = node.nodeValue;
var before_text = text.substr(0,text.indexOf(verse_match[0]));
var after_text = text.substr(text.indexOf(verse_match[0])+verse_match[0].length);
if (before_text.length > 0) {
var newTxtNode = document.createTextNode(before_text);
node.parentNode.insertBefore(newTxtNode, node);
inserted_nodes++;
}
var book_chap_regex = new RegExp(book_chap, 'gi');
var book;
var chapter;
var verse;
while (matched = book_chap_regex.exec(verse_match[0])) {
// break up what may be multiple references into links.
if (matched[2] != '' && matched[2] != null) {
book = matched[2];
}
if (matched[3] != '' && matched[3] != null) {
chapter = matched[3];
}
verse = matched[4];
var newLinkNode = document.createElement("a");
newLinkNode.className = 'bibleref';
newLinkNode.target = '_BLANK';
var passage = book+' '+chapter+':'+verse;
newLinkNode.href = bgHost+'/passage/?search='+passage+'&version='+that.version+'&src=tools';
newLinkNode.innerHTML = matched[1];
if (that.clickTooltip === true) {
newLinkNode.onclick=function() {return false};
}
node.parentNode.insertBefore(newLinkNode, node);
inserted_nodes++;
if (matched[6] != '') {
var newTxtNode = document.createTextNode(matched[5]);
node.parentNode.insertBefore(newTxtNode, node);
// do we need to update inserted_nodes with this?
}
}
if (after_text.length > 0) {
var newTxtNode = document.createTextNode(after_text);
node.parentNode.insertBefore(newTxtNode, node);
node.parentNode.removeChild(node);
inserted_nodes = searchNode(newTxtNode,inserted_nodes+1);
}
else {
node.parentNode.removeChild(node);
}
}
return inserted_nodes;
}
var addCSS = function() {
if (!addedCSS) {
var css = document.createElement('link');
css.type = "text/css";
css.rel = "stylesheet";
if (browser.search('MSIE 6.0') != -1) {
browser = 'ie6';
css.href = cdHost+'/theme/bglinks-ie.css';
} else {
css.href = cdHost+'/theme/popover.css';
}
css.media = "screen";
var n1 = document.getElementsByTagName("head")[0].childNodes[0]
n1.parentNode.insertBefore(css,n1);
addedCSS = true;
}
}
var addBiblerefListeners = function() {
var links = document.getElementsByTagName('a');
for ( var i = 0;i< links.length;i++) {
var link = links[i]
if (link.className && link.className == 'bibleref') {
if (that.clickTooltip !== true) {
addListener(link,'mouseover', linkMouseover);
addListener(link,'mouseout', linkMouseout);
} else {
addListener(link,'click', toggleTooltip);
}
}
}
}
var addListener = function (listen_object, action, callback) {
if (listen_object.addEventListener) {
if (action == 'mouseover') {
listen_object.addEventListener("mouseover",callback,false);
} else if (action == 'mouseout') {
listen_object.addEventListener("mouseout",callback,false);
} else if (action == 'click') {
listen_object.addEventListener("click",callback,false);
}
} else if (listen_object.attachEvent) {
if (action == 'mouseover') {
listen_object.attachEvent("onmouseover",callback);
} else if (action == 'mouseout') {
listen_object.attachEvent("onmouseout",callback);
} else if (action == 'click') {
listen_object.attachEvent("onclick",callback);
}
} else {
if (action == 'mouseover') {
listen_object.onmouseover = callback;
} else if (action == 'mouseout'){
listen_object.onmouseout = callback;
} else if (action == 'click') {
listen_object.onclick = callback;
}
}
}
var toggleTooltip = function(e) {
if (!e) {
e = window.event;
}
link = e.target || e.srcElement;
var reference;
var bibleref;
if (bibleref = link.getAttribute('data-bibleref')) {
reference = bibleref;
} else {
reference = link.href.match(/search=(.*?)(?:&.*)?$/)[1];
}
var id = reference.replace(/%20| /g, '');
var id = reference.replace(/:/g, '_');
var tooltip = document.getElementById('bg_popup-'+id);
if (tooltip === null || tooltip.style.display == 'none') {
showTooltip(e);
} else {
hideTooltip(e);
}
}
var showTooltip = function(e) {
if (!e) {
e = window.event;
}
link = e.target || e.srcElement;
var reference;
var bibleref;
if (bibleref = link.getAttribute('data-bibleref')) {
reference = bibleref;
} else {
reference = link.href.match(/search=(.*?)(?:&.*)?$/)[1];
}
var id = reference.replace(/%20| /g, '');
id = id.replace(/:/g, '_');
id = id.replace(/ /g, '');
var tooltip = document.getElementById('bg_popup-'+id);
hideAllTooltips(e);
if (tooltip === null) {
tooltip = getTooltip(reference, link);
} else {
tooltip_loc = tooltipLocation(link);
tooltip.style.left = tooltip_loc.offsetX+'px';
tooltip.style.top = tooltip_loc.offsetY+'px';
tooltip.style.display = 'block';
}
}
var hideTooltip = function(e) {
if (!e) {
e = window.event;
}
target = e.target || e.srcElement;
var reference;
var bibleref;
if (bibleref = link.getAttribute('data-bibleref')) {
reference = bibleref;
} else {
reference = link.href.match(/search=(.*?)(?:&.*)?$/)[1];
}
reference = reference.replace(/%20| /g, '');
reference = reference.replace(/:/g, '_');
var tooltip = document.getElementById('bg_popup-'+reference);
if (tooltip) {
tooltip.style.display = 'none';
}
}
var hideAllTooltips = function(e) {
var divs = container.children;
for (var i = 0;i < divs.length;i++) {
divs[i].style.display = 'none';
}
}
var linkMouseover = function(e) {
if (!e) {
e = window.event;
}
if (e.target.nodeName.toLowerCase() == 'a') {
window.clearTimeout(showTimer);
showTimer = window.setTimeout(function() {showTooltip(e)}, delay);
}
}
var linkMouseout = function(e) {
if (!e) {
e = window.event;
}
if (e.target.nodeName.toLowerCase() == 'a' && showTimer) {
window.clearTimeout(showTimer);
window.clearTimeout(hideTimer);
hideTimer = window.setTimeout(function() {hideTooltip(e)}, delay);
}
}
var tooltipMouseover = function(e) {
if (!e) {
e = window.event;
}
var relNode = e.relatedTarget || e.fromElement;
while (relNode && relNode != null && (!relNode.className || relNode.className.indexOf('bg_popup-outer') == -1) && relNode.nodeName.toLowerCase() != 'body') {
relNode = relNode.parentNode;
}
if (relNode && relNode.className && relNode.className.indexOf('bg_popup-outer') != -1) return;
window.clearTimeout(showTimer);
window.clearTimeout(hideTimer);
}
var tooltipMouseout = function(e) {
if (!e) {
e = window.event;
}
var relNode = e.relatedTarget || e.toElement;
while (relNode && relNode != null && (!relNode.className || relNode.className.indexOf('bg_popup-outer') == -1) && relNode.nodeName.toLowerCase() != 'body') {
relNode = relNode.parentNode;
}
if (relNode && relNode.className && relNode.className.indexOf('bg_popup-outer') != -1) return;
window.clearTimeout(hideTimer);
hideTimer = window.setTimeout(function() {hideAllTooltips(e)}, delay);
}
var createContainer = function() {
container = document.createElement('div');
container.id = 'bg_popup-container';
document.body.appendChild(container);
}
var getTooltip = function(reference, link) {
var tooltip = document.createElement('div');
tooltip.style.display='none';
tooltip.className = 'bg_popup bg_popup-outer';
var tooltip_loc = tooltipLocation(link);
tooltip.style.top = tooltip_loc.offsetY+'px';
tooltip.style.left = tooltip_loc.offsetX+'px';
var id = 'bg_popup-'+reference.replace(/%20/g, '');
id = id.replace(/:/g, '_');
id = id.replace(/ /g, '');
tooltip.id=id;
tooltip.innerHTML = '<div class="bg_popup-header"><div class="bg_popup-header_title"><strong>'+reference.replace(/%20/g, ' ')+'</strong></div></div><div class="bg_popup-content"><div class="bg_popup-spinner"><img alt="loading" src="'+cdHost+'/theme/images/tools/spinner.gif"/></div></div><div class="bg_popup-footer"><a class="bg_popup-bglogo" href="'+bgHost+'/" target="_blank"></a></div>';
tooltip.style.display = 'block';
addCloseButton(tooltip);
tooltip = container.appendChild(tooltip);
if (that.clickTooltip !== true) {
addListener(tooltip,'mouseover', tooltipMouseover);
addListener(tooltip,'mouseout', tooltipMouseout);
}
var remote_passage = document.createElement('script');
remote_passage.type = 'text/javascript';
remote_passage.src = toolsHost+'/?search='+reference+'&version='+that.version+'&callback=BGLinks.updateTooltip';
remote_passage.id = 'bg_remote_passage_script-'+reference.replace(/%20/g, '');
remote_passage.id = remote_passage.id.replace(/:/g, '_');
remote_passage.id = remote_passage.id.replace(/ /g, '');
var hook = document.getElementsByTagName('script')[0];
hook.parentNode.insertBefore(remote_passage, hook);
return tooltip;
}
that.updateTooltip = function(tooltip_content) {
var id = 'bg_popup-'+tooltip_content.reference.replace(/%20/g, '');
id = 'bg_popup-'+tooltip_content.reference.replace(/:/g, '_');
id = id.replace(/ /g, '');
var tooltip = document.getElementById(id);
var reference_display = tooltip_content.reference_display.replace(/%20/g,' ');
if (tooltip_content.text == undefined) {
if (tooltip.text == undefined) {
tooltip_content.text = 'Retrieving Passage...'
}
else {
tooltip_content.text = tooltip.text;
reference_display = tooltip.reference_display;
}
}
tooltip.innerHTML = '<div class="bg_popup-header"><div class="bg_popup-header_title"><strong>'+reference_display+' '+tooltip_content.version+'</strong></div></div><div class="bg_popup-content"><div class="bg_popup-content-bible"><p>'+tooltip_content.text+' <a class="bg_popup-copyright" href="'+bgHost+tooltip_content.version_url+'" target="_blank">('+tooltip_content.version+')</a> <a class="bg_popup-more" href="'+bgHost+'/passage/?search='+tooltip_content.reference+'&version='+tooltip_content.version+'&src=tools" target="_blank">More</a></p></div></div><div class="bg_popup-footer"><a class="bg_popup-bglogo" href="'+bgHost+'/" target="_blank"></a></div>';
addCloseButton(tooltip);
}
var addCloseButton = function(tooltip) {
var divs = tooltip.getElementsByTagName('div');
for (var i = 0; i < divs.length;i++) {
if (divs[i].className == 'bg_popup-header_right') {
addListener(divs[i], 'click', hideAllTooltips);
}
}
}
var tooltipLocation = function(link) {
var tooltip_height = 234;
var tooltip_width = 362;
if (typeof(window.innerWidth) == 'number') {
width = window.innerWidth;
height = window.innerHeight;
} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
width = document.documentElement.clientWidth;
height = document.documentElement.clientHeight;
} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
width = document.body.clientWidth;
height = document.body.clientHeight;
}
var display_loc = {};
var offsetPos = getOffsetPos(link);
var leftPos = offsetPos.leftPos;
var topPos = offsetPos.topPos;
if (link.offsetWidth/link.parentNode.offsetWidth >.5) {
leftPos = getOffsetPos(link.parentNode);
leftPos = leftPos.leftPos;
}
if ((leftPos + tooltip_width+5) > width) {
leftPos -= tooltip_width;
if ((leftPos + tooltip_width + link.offsetWidth) <= width) leftPos += link.offsetWidth;
if (leftPos + tooltip_width + 25 <= width) leftPos += 25;
if (leftPos - (link.offsetWidth/2) >= 0) leftPos -= (link.offsetWidth/2);
} else {
if (leftPos + (link.offsetWidth/2) <= width && link.offsetWidth/link.parentNode.offsetWidth <=.5) leftPos += (link.offsetWidth/2);
if (leftPos - 35 >= 0) {
leftPos -= 35;
}
}
var scrollY = window.pageYOffset || document.documentElement.scrollTop || 0;;
if ((topPos+link.offsetHeight+tooltip_height+15) <= height +scrollY || topPos-tooltip_height+5 <0) {
topPos += link.offsetHeight + 10;
} else {
topPos -= tooltip_height + 10;
}
display_loc.offsetY = topPos;
display_loc.offsetX = leftPos;
return (display_loc);
}
var getOffsetPos = function(linkObj) {
var topPos = leftPos = 0;
do {
topPos += linkObj.offsetTop;
leftPos += linkObj.offsetLeft;
if(document.all) {
topPos+=linkObj.clientTop;
leftPos+=linkObj.clientLeft;
}
} while ((linkObj = linkObj.offsetParent) != null);
return {'topPos' : topPos, 'leftPos' : leftPos};
}
var setup = function() {
if (!setupRun) {
if (that.showTooltips === true) {
addCSS();
addListener(document, 'click', hideAllTooltips);
}
createContainer();
setupRun = true;
}
}
return that;
})();
$(document).ready(function() {
BGLinks.linkVerses();
});
This is the script, located at http://churchofcwa.wikia.com/wiki/MediaWiki:Common.js/bglinks.js, that I am encountering an error with css, this script was copied from https://www.biblegateway.com/public/link-to-us/tooltips/bglinks.js and is not made by me. The issue I am encountering is via the css page (MediaWiki:Common.css) when changing the color of the script by
.bg_popup-content-bible {color:#000000}
The font color of the p tag within that div does not change. Originally I had it set to the p tag specifically of that div, but a css checker said that styling would be overqualified, and it was not functional nevertheless. What the script does is take all Bible verses listed on a page, and automatically links them to Biblegateway and creates a preview popup when hovering. However, the font is very unreadable and so I have tried to change it to black.
The popup currently has a near-white font (that blends with the popup)
and needs to have a black font, with the rest of the page content needs the near white font. When the script runs through it generates a div surrounding each bible verse, and the js applies to it (the div in which the Bible verse text appears is in the bg_popup-content-bible with a <p> tag), making it popup like so.
I have noted that in the script there is a section that calls for a "addedCSS"
var addCSS = function() {
if (!addedCSS) {
var css = document.createElement('link');
css.type = "text/css";
css.rel = "stylesheet";
if (browser.search('MSIE 6.0') != -1) {
browser = 'ie6';
css.href = cdHost + '/theme/bglinks-ie.css';
} else {
css.href = cdHost + '/theme/popover.css';
}
css.media = "screen";
var n1 = document.getElementsByTagName("head")[0].childNodes[0]
n1.parentNode.insertBefore(css, n1);
addedCSS = true;
}
}
I do not believe it is possible to change the url that the addedCss pull from, from the MediaWiki:Common.css, as this script was not made for the specific system being used (when removing or altering the variable the script does not work). I don't know if this is not happening because of a javascript issue (which is beyond me, and it's difficult to alter the script without breaking it) or if it's just a matter of incorrect css, but I have been working on this for several months here and there, and would like to get this final detail to work.
Try changing it to
.bg_popup-content-bible {color:#000000 !important;}
Ignore the CSS specificity checker. I have tested the below css on your site and it works. Make sure to put it in your site.css.
.bg_popup-content-bible p {
color: #000000;
}
It needs to be written as above because it has to override the <p> styling you've already set earlier in site.css:
p {
color: #f5f5f5
}
EDIT
It is not a problem with the script. Based on what you have said in the comments it seems like you are unable to actually edit / output css. So the other option is just to modify the script you've posted above:
Change this:
tooltip.innerHTML = '<div class="bg_popup-header"><div class="bg_popup-header_title"><strong>'+reference_display+' '+tooltip_content.version+'</strong></div></div><div class="bg_popup-content"><div class="bg_popup-content-bible"><p>'+tooltip_content.text+' <a class="bg_popup-copyright" href="'+bgHost+tooltip_content.version_url+'" target="_blank">('+tooltip_content.version+')</a> <a class="bg_popup-more" href="'+bgHost+'/passage/?search='+tooltip_content.reference+'&version='+tooltip_content.version+'&src=tools" target="_blank">More</a></p></div></div><div class="bg_popup-footer"><a class="bg_popup-bglogo" href="'+bgHost+'/" target="_blank"></a></div>';
to this:
tooltip.innerHTML = '<div class="bg_popup-header"><div class="bg_popup-header_title"><strong>'+reference_display+' '+tooltip_content.version+'</strong></div></div><div class="bg_popup-content"><div class="bg_popup-content-bible"><p style="color:#000000">'+tooltip_content.text+' <a class="bg_popup-copyright" href="'+bgHost+tooltip_content.version_url+'" target="_blank">('+tooltip_content.version+')</a> <a class="bg_popup-more" href="'+bgHost+'/passage/?search='+tooltip_content.reference+'&version='+tooltip_content.version+'&src=tools" target="_blank">More</a></p></div></div><div class="bg_popup-footer"><a class="bg_popup-bglogo" href="'+bgHost+'/" target="_blank"></a></div>';
Given the way Stack formats the code above, to make it very clear you are editing the part of the line above that says:
<p>'+tooltip_content.text+'
and making it:
<p style="color:#000000">'+tooltip_content.text+'
As you can see this is actually a simple application, however the code seems to continue using the first IF statement even though it isn't correct/relevant anymore.
HTML
<div id="Slideshow">
<img id="Slide" src="images/Slide01.jpg" width="600px" height="450px">
<button type="button" onClick="SlideShowTimer()">Click Me!</button>
</div>
<!--Closing Slideshow-->
JS
function SlideShowTimer() {
var IMG1 = "images/Slide01.jpg";
var IMG2 = "images/Slide02.jpg";
var IMG3 = "images/Slide03.jpg";
var Slide = document.getElementById('Slide').src;
if (document.Slide === document.IMG1) {
document.getElementById('Slide').src = "images/Slide02.jpg"; * * * //keeps executing this even once the value has actually changed to the value of 'IMG2'***
} else if (document.Slide === document.IMG2) {
document.getElementById('Slide').src = "images/Slide03.jpg";
} else if (document.Slide === document.IMG3) {
document.getElementById('Slide').src = "images/Slide01.jpg";
} else {
alert("Something Went Wrong");
}
}
It's because
document.getElementById('Slide').src
returns an absolute path.
EDIT:
function SlideShowTimer() {
var IMG1 = "images/Slide01.jpg";
var IMG2 = "images/Slide02.jpg";
var IMG3 = "images/Slide03.jpg";
var Slide = document.getElementById('Slide');
if (Slide.src.indexOf(IMG1) >= 0) {
Slide.src = "images/Slide02.jpg";
alert('1');
} else if (Slide.src.indexOf(IMG2) >= 0) {
Slide.src = "images/Slide03.jpg";
alert('2');
} else if (Slide.src.indexOf(IMG3) >= 0) {
alert('3');
Slide.src = "images/Slide01.jpg";
} else {
alert("Something Went Wrong");
}
}
Try like this
if (Slide == IMG1) {
document.getElementById('Slide').src = IMG2;
} else if (Slide == IMG2) {
document.getElementById('Slide').src = IMG3;
} else if (Slide == IMG3) {
document.getElementById('Slide').src = IMG1;
} else {
alert("Something Went Wrong");
}
i used below code for custom checkbox,
HTML
<div class="agree">
<label for="agree_check" class="label_check"><input type="checkbox" class="agree_check" id="agree_check" />Agree</label>
</div>
CSS
.has-js .label_check { padding-left: 34px; }
.has-js .label_check { background: url(../images/box1.png) no-repeat; }
.has-js label.c_on { background: url(../images/box1-with-mark.png) no-repeat; }
.has-js .label_check input { position: absolute; left: -9999px; }
Script
<script type="text/javascript">
var d = document;
var safari = (navigator.userAgent.toLowerCase().indexOf('safari') != -1) ? true : false;
var gebtn = function(parEl,child) { return parEl.getElementsByTagName(child); };
onload = function() {
var body = gebtn(d,'body')[0];
body.className = body.className && body.className != '' ? body.className + ' has-js' : 'has-js';
if (!d.getElementById || !d.createTextNode) return;
var ls = gebtn(d,'label');
for (var i = 0; i < ls.length; i++) {
var l = ls[i];
if (l.className.indexOf('label_') == -1) continue;
var inp = gebtn(l,'input')[0];
if (l.className == 'label_check') {
l.className = (safari && inp.checked == true || inp.checked) ? 'label_check c_on' : 'label_check c_off';
l.onclick = check_it;
};
if (l.className == 'label_radio') {
l.className = (safari && inp.checked == true || inp.checked) ? 'label_radio r_on' : 'label_radio r_off';
l.onclick = turn_radio;
};
};
};
var check_it = function() {
var inp = gebtn(this,'input')[0];
if (this.className == 'label_check c_off' || (!safari && inp.checked)) {
this.className = 'label_check c_on';
if (safari) inp.click();
} else {
this.className = 'label_check c_off';
if (safari) inp.click();
};
};
var turn_radio = function() {
var inp = gebtn(this,'input')[0];
if (this.className == 'label_radio r_off' || inp.checked) {
var ls = gebtn(this.parentNode,'label');
for (var i = 0; i < ls.length; i++) {
var l = ls[i];
if (l.className.indexOf('label_radio') == -1) continue;
l.className = 'label_radio r_off';
};
this.className = 'label_radio r_on';
if (safari) inp.click();
} else {
this.className = 'label_radio r_off';
if (safari) inp.click();
};
};
</script>
now i need to check the checkbox is checked or not.. it is works in FF but not works in Chrome and Safari browser.
if (jQuery('#agree_check').is(':checked')) {
alert("checked");
}
else
{
alert("Not checked");
}
when i checked the checkbox it displays "checked" in FF.. but in Chrome and safari it displays "not checked".
what is the issue?
My solution, working also on server side - codebehind (runat="server" attribute for label and checkbox), consist to add checked/unchecked state for critical browser. Maybe this work for all browser, clearing if statement.
var check_it = function () {
var inp = gebtn(this, 'input')[0];
if (this.className == 'label_check c_off' || (!safari && inp.checked)) {
this.className = 'label_check c_on';
if (chrome) inp.checked = true;
if (safari) inp.click();
} else {
this.className = 'label_check c_off';
if (chrome) inp.checked = false;
if (safari) inp.click();
};
};
Finally i found answer for this, it is just check in another way to make that condition true,
if (jQuery('#agree_check').is(':checked') || (jQuery('div.agree label').hasClass('c_on'))) {
alert("checked");
}
else
{
alert("Not checked");
}
now it's works fine in all browsers.
Thanks,
Ravichandran