across element match javascript

across element match javascript - javascript

hi check out my text highlighter its has a diacritic detection but i need exact match across element or node but i don't know how to accomplish it
https://jsfiddle.net/z57o5yge/4/
document.getElementById("btnSearch").onclick = function(){
var search_value = document.getElementById("textbox").value;
var myHilitor = new Hilitor("content");
var exact_match = document.getElementById('exact_match');
var Partially_match = document.getElementById('Partially_match');
var diacritic_match = document.getElementById('diacritic_match');
if (exact_match.checked){myHilitor.setMatchType("exact");}
else {myHilitor.setMatchType("seprate");}
if (Partially_match.checked){myHilitor.setMatchType("Partially");}
else {myHilitor.setMatchType("not_Partially");}
if (diacritic_match.checked){myHilitor.setMatchType("diacritic");}
else {myHilitor.setMatchType("not_diacritic");}
myHilitor.apply(search_value);
}
function Hilitor(id, tag)
{
var targetNode = document.getElementById(id) || document.body;
var hiliteTag = tag || "EM";
var skipTags = new RegExp("^(?:" + hiliteTag + "|SCRIPT|FORM|SPAN)$");
var colors = ["#ff6", "#a0ffff", "#9f9", "#f99", "#f6f"];
var wordColor = [];
var colorIdx = 0;
var matchRegex = "";
var exact = false;
var seprate = false;
var Partially = false;
var diacritic = false;
var not_diacritic = false;
// characters to strip from start and end of the input string
var endCharRegex = XRegExp("^[^\\p{L}\\p{N}]+|[^\\p{L}\\p{N}]+$", "g");
//("^[^\\p{L}]+|[^\\p{L}]+$", "g");
// characters used to break up the input string into words
var breakCharRegex = XRegExp("[\\s]+", "g");
this.setMatchType = function(type)
{
switch(type)
{
case "exact":
window.excat = true;
window.seprate = false;
break;
case "seprate":
window.seprate = true;
window.excat = false;
break;
case "Partially":
window.Partially = true;
window.not_Partially = false;
break;
case "not_Partially":
window.not_Partially = true;
window.Partially = false;
case "diacritic":
window.diacritic = true;
window.not_diacritic = false;
break;
case "not_diacritic":
window.not_diacritic = true;
window.diacritic = false;
break;
}
};
this.setRegex = function(input)
{
//alert(window.excat);
input = input.replace(endCharRegex, "");
//alert(input);
input = input.replace(/^\||\|$/g, "");
if(input) {
if(window.diacritic){input = createAccentRegexp(input);}
if(window.excat){input = input.split(' ').join('[\\s\\p{P}\\p{S}\\p{m}\u0640]+');}
if(window.seprate){input = input.replace(breakCharRegex, "|");}
if(window.Partially){var re = "(" + input + ")";}
if(window.not_Partially){var re = "(^|[\\s\\p{P}\\p{S}])(" + input + ")(?=[\\s\\p{P}\\p{S}]|$)";}
//if(!this.openLeft) re = "\\b" + re;
//if(!this.openRight) re = re + "\\b";
//matchRegex = new RegExp(re, "i");
matchRegex = XRegExp(re, "i");
return true;
}
return false;
};
this.getRegex = function()
{
var retval = matchRegex.toString();
retval = retval.replace(/(^\/(\\b)?|\(|\)|(\\b)?\/i$)/g, "");
retval = retval.replace(/\|/g, " ");
return retval;
};
// recursively apply word highlighting
this.hiliteWords = function(node)
{
if(node === undefined || !node) return;
if(!matchRegex) return;
if(skipTags.test(node.nodeName)) return;
if(node.hasChildNodes()) {
for(var i=0; i < node.childNodes.length; i++)
this.hiliteWords(node.childNodes[i]);
}
if(node.nodeType == 3) { // NODE_TEXT
if((nv = node.nodeValue) && (regs = matchRegex.exec(nv))) {
if(!wordColor[regs[0].toLowerCase()]) {
wordColor[regs[0].toLowerCase()] = colors[colorIdx++ % colors.length];
}
var match = document.createElement(hiliteTag);
match.appendChild(document.createTextNode(regs[0]));
match.style.backgroundColor = wordColor[regs[0].toLowerCase()];
match.style.fontStyle = "inherit";
match.style.color = "#000";
var after = node.splitText(regs.index);
after.nodeValue = after.nodeValue.substring(regs[0].length);
node.parentNode.insertBefore(match, after);
}
};
};
// remove highlighting
this.remove = function()
{
var arr = document.getElementsByTagName(hiliteTag);
while(arr.length && (el = arr[0])) {
var parent = el.parentNode;
parent.replaceChild(el.firstChild, el);
parent.normalize();
}
};
// start highlighting at target node
this.apply = function(input)
{
this.remove();
if(input === undefined || !input) return;
if(this.setRegex(input)) {
this.hiliteWords(targetNode);
}
};
}
check out the demo
https://jsfiddle.net/z57o5yge/4/

Related

How to decode this encoded Javascript?

I got this script that seems to be obfuscated, and the original programmer is not reachable. I've tried many methods to decode it, but the best I get are variables and functions that don't make much sense.
Could someone provide me some help?
var _0x1b5a=['\x74\x61\x62\x6c\x65','\x72\x65\x74\x75\x72\x6e\x20\x28\x66\x75\x6e\x63\x74\x69\x6f\x6e\x28\x29\x20','\x70\x6a\x75\x66\x4a','\x74\x72\x61\x63\x65','\x69\x6e\x66\x6f','\x53\x48\x45\x61\x61','\x61\x70\x65\x6c\x69\x64\x6f','\x6c\x6f\x67\x67\x65\x64','\x71\x74\x64\x55\x73\x75\x61\x72\x69\x6f\x73\x4f\x6e\x6c\x69\x6e\x65','\x4c\x70\x6a\x55\x72','\x63\x6f\x6e\x6e\x65\x63\x74\x65\x64','\x74\x65\x6c\x61','\x41\x53\x75\x51\x51','\x4f\x4d\x78\x61\x55','\x5e\x28\x5b\x5e\x20\x5d\x2b\x28\x20\x2b\x5b\x5e\x20\x5d\x2b\x29\x2b\x29\x2b\x5b\x5e\x20\x5d\x7d','\x33\x7c\x30\x7c\x37\x7c\x32\x7c\x35\x7c\x31\x7c\x34\x7c\x36','\x65\x72\x72\x6f','\x73\x61\x6c\x76\x61\x72','\x76\x65\x72\x73\x61\x6f\x43\x6c\x61\x73\x73','\x48\x71\x4d\x72\x4a','\x65\x7a\x61\x45\x4e','\x63\x6f\x6e\x73\x6f\x6c\x65','\x70\x72\x65\x76\x65\x6e\x74\x44\x65\x66\x61\x75\x6c\x74','\x73\x65\x6e\x68\x61\x42\x65\x74\x33\x36\x35','\x31\x7c\x33\x7c\x32\x7c\x34\x7c\x30','\x77\x61\x72\x6e','\x76\x65\x72\x73\x69\x6f\x6e','\x76\x65\x72\x73\x61\x6f','\x73\x74\x61\x74\x75\x73','\x74\x63\x55\x56\x72','\x61\x70\x70\x6c\x79','\x73\x65\x6e\x64\x4d\x65\x73\x73\x61\x67\x65','\x64\x6f\x4c\x6f\x67\x6f\x75\x74','\x67\x65\x74','\x69\x73\x45\x6e\x76\x69\x61\x6e\x64\x6f\x46\x6f\x72\x6d','\x66\x71\x53\x4d\x61','\x63\x6f\x6e\x66\x69\x67\x43\x61\x73\x61\x41\x70\x6f\x73\x74\x61','\x6c\x6c\x72\x71\x71','\x79\x62\x63\x69\x4b','\x73\x76\x77\x4a\x72','\x72\x75\x6e\x74\x69\x6d\x65','\x77\x79\x79\x52\x64','\x5a\x4a\x4e\x56\x7a','\x73\x70\x6c\x69\x74','\x73\x74\x6f\x72\x61\x67\x65','\x76\x61\x6c\x6f\x72\x55\x6e\x69\x64\x61\x64\x65\x42\x65\x74\x33\x36\x35','\x65\x72\x72\x6f\x72','\x65\x6d\x61\x69\x6c','\x6f\x6e\x4d\x65\x73\x73\x61\x67\x65','\x23\x6d\x61\x69\x6e','\x63\x54\x54\x77\x45','\x73\x65\x6e\x68\x61','\x64\x65\x62\x75\x67','\x72\x65\x74\x75\x72\x6e\x20\x2f\x22\x20\x2b\x20\x74\x68\x69\x73\x20\x2b\x20\x22\x2f','\x61\x64\x64\x4c\x69\x73\x74\x65\x6e\x65\x72','\x63\x6f\x6e\x73\x74\x72\x75\x63\x74\x6f\x72','\x6c\x6f\x67','\x74\x69\x70\x6f\x55\x73\x65\x72','\x65\x78\x63\x65\x70\x74\x69\x6f\x6e','\x6f\x6e\x6c\x6f\x61\x64','\x4c\x49\x55\x59\x76','\x53\x66\x70\x69\x77','\x45\x59\x7a\x48\x6f','\x7b\x7d\x2e\x63\x6f\x6e\x73\x74\x72\x75\x63\x74\x6f\x72\x28\x22\x72\x65\x74\x75\x72\x6e\x20\x74\x68\x69\x73\x22\x29\x28\x20\x29','\x6d\x73\x67','\x65\x6e\x76\x69\x61\x6e\x64\x6f\x46\x6f\x72\x6d','\x49\x46\x4a\x50\x6b','\x64\x61\x74\x61','\x74\x41\x55\x55\x4f','\x63\x6f\x6e\x66\x69\x67','\x67\x65\x74\x4d\x61\x6e\x69\x66\x65\x73\x74','\x6b\x65\x79\x43\x6f\x64\x65','\x75\x73\x75\x61\x72\x69\x6f\x42\x65\x74\x33\x36\x35'];(function(_0x16ab9f,_0x1b5a7a){var _0x2ba715=function(_0x5cec0c){while(--_0x5cec0c){_0x16ab9f['push'](_0x16ab9f['shift']());}};var _0x1af375=function(){var _0xdd7ef1={'data':{'key':'cookie','value':'timeout'},'setCookie':function(_0x243201,_0x564c0f,_0x1228c2,_0xf84db7){_0xf84db7=_0xf84db7||{};var _0x216cfb=_0x564c0f+'='+_0x1228c2;var _0x140083=0x0;for(var _0xc0ade0=0x0,_0x206be6=_0x243201['length'];_0xc0ade0<_0x206be6;_0xc0ade0++){var _0x3fe404=_0x243201[_0xc0ade0];_0x216cfb+=';\x20'+_0x3fe404;var _0x51f2c6=_0x243201[_0x3fe404];_0x243201['push'](_0x51f2c6);_0x206be6=_0x243201['length'];if(_0x51f2c6!==!![]){_0x216cfb+='='+_0x51f2c6;}}_0xf84db7['cookie']=_0x216cfb;},'removeCookie':function(){return'dev';},'getCookie':function(_0x58d2f1,_0x19b3fc){_0x58d2f1=_0x58d2f1||function(_0x158582){return _0x158582;};var _0x1ae707=_0x58d2f1(new RegExp('(?:^|;\x20)'+_0x19b3fc['replace'](/([.$?*|{}()[]\/+^])/g,'$1')+'=([^;]*)'));var _0x4e5b62=function(_0x12d18a,_0x28a461){_0x12d18a(++_0x28a461);};_0x4e5b62(_0x2ba715,_0x1b5a7a);return _0x1ae707?decodeURIComponent(_0x1ae707[0x1]):undefined;}};var _0x44a2e0=function(){var _0x32210f=new RegExp('\x5cw+\x20*\x5c(\x5c)\x20*{\x5cw+\x20*[\x27|\x22].+[\x27|\x22];?\x20*}');return _0x32210f['test'](_0xdd7ef1['removeCookie']['toString']());};_0xdd7ef1['updateCookie']=_0x44a2e0;var _0x32ceda='';var _0x5638a9=_0xdd7ef1['updateCookie']();if(!_0x5638a9){_0xdd7ef1['setCookie'](['*'],'counter',0x1);}else if(_0x5638a9){_0x32ceda=_0xdd7ef1['getCookie'](null,'counter');}else{_0xdd7ef1['removeCookie']();}};_0x1af375();}(_0x1b5a,0xc3));var _0x2ba7=function(_0x16ab9f,_0x1b5a7a){_0x16ab9f=_0x16ab9f-0x0;var _0x2ba715=_0x1b5a[_0x16ab9f];return _0x2ba715;};var _0x243201=function(){var _0x11fd75=!![];return function(_0xa74c1d,_0xe3c57c){var _0x261b9c=_0x11fd75?function(){if(_0xe3c57c){var _0x469a37=_0xe3c57c[_0x2ba7('\x30\x78\x33\x36')](_0xa74c1d,arguments);_0xe3c57c=null;return _0x469a37;}}:function(){};_0x11fd75=![];return _0x261b9c;};}();var _0x5638a9=_0x243201(this,function(){var _0x3f1742={};_0x3f1742[_0x2ba7('\x30\x78\x32\x31')]=_0x2ba7('\x30\x78\x32\x36');_0x3f1742[_0x2ba7('\x30\x78\x33\x35')]=function(_0x48b5c5){return _0x48b5c5();};var _0x4a31ce=_0x3f1742;var _0x2c0b21=function(){var _0x154f12=_0x2c0b21[_0x2ba7('\x30\x78\x36')](_0x2ba7('\x30\x78\x34'))()['\x63\x6f\x6d\x70\x69\x6c\x65'](_0x4a31ce['\x4c\x70\x6a\x55\x72']);return!_0x154f12['\x74\x65\x73\x74'](_0x5638a9);};return _0x4a31ce[_0x2ba7('\x30\x78\x33\x35')](_0x2c0b21);});_0x5638a9();var _0xdd7ef1=function(){var _0x5b5961=!![];return function(_0xc7fbe8,_0x2ab9fd){var _0x224de1=_0x5b5961?function(){if(_0x2ab9fd){var _0x52ffb5=_0x2ab9fd[_0x2ba7('\x30\x78\x33\x36')](_0xc7fbe8,arguments);_0x2ab9fd=null;return _0x52ffb5;}}:function(){};_0x5b5961=![];return _0x224de1;};}();var _0x5cec0c=_0xdd7ef1(this,function(){var _0x57fc36={};_0x57fc36[_0x2ba7('\x30\x78\x34\x32')]=_0x2ba7('\x30\x78\x32\x37');_0x57fc36[_0x2ba7('\x30\x78\x63')]=function(_0x14e3ce,_0x46080d){return _0x14e3ce(_0x46080d);};_0x57fc36[_0x2ba7('\x30\x78\x33\x66')]=function(_0x2afa66,_0x5be2bf){return _0x2afa66+_0x5be2bf;};_0x57fc36[_0x2ba7('\x30\x78\x33\x64')]=function(_0x50bad1){return _0x50bad1();};var _0xd46126=_0x57fc36;var _0x478f98=_0x2ba7('\x30\x78\x33\x30')['\x73\x70\x6c\x69\x74']('\x7c');var _0x5437c0=0x0;while(!![]){switch(_0x478f98[_0x5437c0++]){case'\x30':if(!_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')]){_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')]=function(_0x429b35){var _0x231c56={};_0x231c56['\x6c\x6f\x67']=_0x429b35;_0x231c56['\x77\x61\x72\x6e']=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x33')]=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x31\x63')]=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x34\x36')]=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x39')]=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x31\x38')]=_0x429b35;_0x231c56[_0x2ba7('\x30\x78\x31\x62')]=_0x429b35;return _0x231c56;}(_0x3d5d81);}else{var _0x478062=_0xd46126[_0x2ba7('\x30\x78\x34\x32')]['\x73\x70\x6c\x69\x74']('\x7c');var _0x203db5=0x0;while(!![]){switch(_0x478062[_0x203db5++]){case'\x30':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x33\x31')]=_0x3d5d81;continue;case'\x31':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x39')]=_0x3d5d81;continue;case'\x32':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x31\x63')]=_0x3d5d81;continue;case'\x33':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x37')]=_0x3d5d81;continue;case'\x34':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')]['\x74\x61\x62\x6c\x65']=_0x3d5d81;continue;case'\x35':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x34\x36')]=_0x3d5d81;continue;case'\x36':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')]['\x74\x72\x61\x63\x65']=_0x3d5d81;continue;case'\x37':_0x5dce2d[_0x2ba7('\x30\x78\x32\x64')][_0x2ba7('\x30\x78\x33')]=_0x3d5d81;continue;}break;}}continue;case'\x31':var _0x45d015={};_0x45d015['\x53\x48\x45\x61\x61']=function(_0x1573c4,_0x47601e){return _0xd46126['\x53\x66\x70\x69\x77'](_0x1573c4,_0x47601e);};_0x45d015['\x74\x41\x55\x55\x4f']=function(_0x16739e,_0xdaebce){return _0xd46126[_0x2ba7('\x30\x78\x33\x66')](_0x16739e,_0xdaebce);};_0x45d015['\x70\x6a\x75\x66\x4a']=_0x2ba7('\x30\x78\x31\x39');_0x45d015[_0x2ba7('\x30\x78\x32\x62')]=_0x2ba7('\x30\x78\x65');var _0x1dbc61=_0x45d015;continue;case'\x32':var _0x56a491=function(){var _0x31dab6;try{_0x31dab6=_0x1dbc61[_0x2ba7('\x30\x78\x31\x64')](Function,_0x1dbc61[_0x2ba7('\x30\x78\x31\x33')](_0x1dbc61[_0x2ba7('\x30\x78\x31\x33')](_0x1dbc61[_0x2ba7('\x30\x78\x31\x61')],_0x1dbc61[_0x2ba7('\x30\x78\x32\x62')]),'\x29\x3b'))();}catch(_0x4901f7){_0x31dab6=window;}return _0x31dab6;};continue;case'\x33':var _0x3d5d81=function(){};continue;case'\x34':var _0x5dce2d=_0xd46126[_0x2ba7('\x30\x78\x33\x64')](_0x56a491);continue;}break;}});_0x5cec0c();function main(){var _0x2efbad={};_0x2efbad[_0x2ba7('\x30\x78\x64')]=_0x2ba7('\x30\x78\x33\x38');_0x2efbad[_0x2ba7('\x30\x78\x33\x62')]='\x64\x6f\x4c\x6f\x67\x69\x6e';_0x2efbad[_0x2ba7('\x30\x78\x62')]=_0x2ba7('\x30\x78\x32\x39');_0x2efbad[_0x2ba7('\x30\x78\x32\x63')]=function(_0x3f39bb,_0x27794a){return _0x3f39bb==_0x27794a;};_0x2efbad[_0x2ba7('\x30\x78\x31')]=_0x2ba7('\x30\x78\x31\x34');_0x2efbad[_0x2ba7('\x30\x78\x34\x31')]=_0x2ba7('\x30\x78\x32\x38');_0x2efbad['\x49\x46\x4a\x50\x6b']='\x67\x65\x74\x53\x74\x61\x74\x75\x73';_0x2efbad[_0x2ba7('\x30\x78\x32\x35')]=_0x2ba7('\x30\x78\x30');var _0x13ebaf=_0x2efbad;var _0x5b2666={};_0x5b2666[_0x2ba7('\x30\x78\x31\x66')]=![];_0x5b2666['\x69\x64']='';_0x5b2666[_0x2ba7('\x30\x78\x31\x65')]='';_0x5b2666['\x65\x6d\x61\x69\x6c']='';_0x5b2666[_0x2ba7('\x30\x78\x31\x37')]='';_0x5b2666[_0x2ba7('\x30\x78\x32')]='';_0x5b2666[_0x2ba7('\x30\x78\x32\x66')]='';_0x5b2666[_0x2ba7('\x30\x78\x32\x32')]=![];_0x5b2666[_0x2ba7('\x30\x78\x32\x38')]='';_0x5b2666['\x76\x61\x6c\x6f\x72\x55\x6e\x69\x64\x61\x64\x65\x42\x65\x74\x33\x36\x35']=0.5;_0x5b2666[_0x2ba7('\x30\x78\x38')]=0x1;_0x5b2666[_0x2ba7('\x30\x78\x33\x33')]=chrome[_0x2ba7('\x30\x78\x34\x30')][_0x2ba7('\x30\x78\x31\x35')]()[_0x2ba7('\x30\x78\x33\x32')];_0x5b2666[_0x2ba7('\x30\x78\x32\x61')]='';_0x5b2666['\x74\x65\x6c\x61']='';_0x5b2666['\x65\x6e\x76\x69\x61\x6e\x64\x6f\x46\x6f\x72\x6d']=![];_0x5b2666[_0x2ba7('\x30\x78\x32\x30')]=0x0;var _0x2f4180={};_0x2f4180[_0x2ba7('\x30\x78\x33\x61')]=function(){return this[_0x2ba7('\x30\x78\x31\x30')];};app=new Vue({'\x65\x6c':_0x13ebaf[_0x2ba7('\x30\x78\x32\x35')],'\x64\x61\x74\x61':_0x5b2666,'\x6d\x65\x74\x68\x6f\x64\x73':{'\x6c\x6f\x67\x6f\x75\x74':function(){var _0x18b8e6={};_0x18b8e6[_0x2ba7('\x30\x78\x66')]=_0x13ebaf[_0x2ba7('\x30\x78\x64')];chrome[_0x2ba7('\x30\x78\x34\x30')][_0x2ba7('\x30\x78\x33\x37')](_0x18b8e6);},'\x6c\x6f\x67\x69\x6e':function(_0xcd676a){var _0x27c34c='\x34\x7c\x31\x7c\x32\x7c\x30\x7c\x33'[_0x2ba7('\x30\x78\x34\x33')]('\x7c');var _0x1420a9=0x0;while(!![]){switch(_0x27c34c[_0x1420a9++]){case'\x30':var _0xdeec2a={};_0xdeec2a[_0x2ba7('\x30\x78\x66')]=_0x13ebaf[_0x2ba7('\x30\x78\x33\x62')];_0xdeec2a[_0x2ba7('\x30\x78\x34\x37')]=this[_0x2ba7('\x30\x78\x34\x37')];_0xdeec2a[_0x2ba7('\x30\x78\x32')]=this['\x73\x65\x6e\x68\x61'];chrome[_0x2ba7('\x30\x78\x34\x30')][_0x2ba7('\x30\x78\x33\x37')](_0xdeec2a);continue;case'\x31':app['\x65\x72\x72\x6f']='';continue;case'\x32':_0xcd676a[_0x2ba7('\x30\x78\x32\x65')]();continue;case'\x33':return![];case'\x34':app[_0x2ba7('\x30\x78\x31\x30')]=!![];continue;}break;}},'\x62\x74\x53\x61\x6c\x76\x61\x72':function(){var _0x27e90f={};_0x27e90f[_0x2ba7('\x30\x78\x34\x35')]=this[_0x2ba7('\x30\x78\x34\x35')];_0x27e90f['\x75\x73\x75\x61\x72\x69\x6f\x42\x65\x74\x33\x36\x35']=this[_0x2ba7('\x30\x78\x31\x37')];_0x27e90f[_0x2ba7('\x30\x78\x32\x66')]=this[_0x2ba7('\x30\x78\x32\x66')];var _0xc15cf1={};_0xc15cf1[_0x2ba7('\x30\x78\x66')]=_0x13ebaf[_0x2ba7('\x30\x78\x62')];_0xc15cf1[_0x2ba7('\x30\x78\x31\x32')]=_0x27e90f;chrome[_0x2ba7('\x30\x78\x34\x30')]['\x73\x65\x6e\x64\x4d\x65\x73\x73\x61\x67\x65'](_0xc15cf1);app['\x74\x65\x6c\x61']='';},'\x6f\x6e\x6c\x79\x4e\x75\x6d\x62\x65\x72':function(_0x629849){if(_0x13ebaf[_0x2ba7('\x30\x78\x32\x63')](_0x629849[_0x2ba7('\x30\x78\x31\x36')],0x2e)){_0x629849[_0x2ba7('\x30\x78\x32\x65')]();}},'\x62\x74\x43\x6f\x6e\x66\x69\x67':function(){app[_0x2ba7('\x30\x78\x32\x33')]=_0x13ebaf[_0x2ba7('\x30\x78\x31')];},'\x62\x74\x56\x6f\x6c\x74\x61\x72':function(){app[_0x2ba7('\x30\x78\x32\x33')]='';}},'\x63\x6f\x6d\x70\x75\x74\x65\x64':_0x2f4180,'\x63\x72\x65\x61\x74\x65\x64':function(){var _0x457076={};_0x457076[_0x2ba7('\x30\x78\x33\x65')]=_0x2ba7('\x30\x78\x33\x63');_0x457076['\x41\x53\x75\x51\x51']=_0x13ebaf[_0x2ba7('\x30\x78\x34\x31')];var _0x927392=_0x457076;chrome[_0x2ba7('\x30\x78\x34\x30')][_0x2ba7('\x30\x78\x34\x38')][_0x2ba7('\x30\x78\x35')](function(_0x471314,_0x3da1bf,_0x55f11d){switch(_0x471314[_0x2ba7('\x30\x78\x66')]){case _0x2ba7('\x30\x78\x33\x34'):app[_0x2ba7('\x30\x78\x31\x30')]=![];app[_0x2ba7('\x30\x78\x31\x66')]=_0x471314['\x6c\x6f\x67\x67\x65\x64']?_0x471314[_0x2ba7('\x30\x78\x31\x66')]:![];app['\x61\x70\x65\x6c\x69\x64\x6f']=_0x471314[_0x2ba7('\x30\x78\x31\x65')]?_0x471314['\x61\x70\x65\x6c\x69\x64\x6f']:'';app[_0x2ba7('\x30\x78\x32\x32')]=_0x471314[_0x2ba7('\x30\x78\x32\x32')];app[_0x2ba7('\x30\x78\x38')]=_0x471314['\x74\x69\x70\x6f\x55\x73\x65\x72'];app[_0x2ba7('\x30\x78\x32\x33')]=_0x471314[_0x2ba7('\x30\x78\x32\x33')]?_0x471314['\x74\x65\x6c\x61']:'';app[_0x2ba7('\x30\x78\x32\x30')]=_0x471314[_0x2ba7('\x30\x78\x32\x30')];app[_0x2ba7('\x30\x78\x32\x61')]=_0x471314[_0x2ba7('\x30\x78\x32\x61')];chrome[_0x2ba7('\x30\x78\x34\x34')]['\x6c\x6f\x63\x61\x6c'][_0x2ba7('\x30\x78\x33\x39')]([_0x927392[_0x2ba7('\x30\x78\x33\x65')]],_0x40dfc8=>{if(_0x40dfc8[_0x2ba7('\x30\x78\x33\x63')]){app[_0x2ba7('\x30\x78\x31\x37')]=_0x40dfc8[_0x2ba7('\x30\x78\x33\x63')][_0x2ba7('\x30\x78\x31\x37')];app['\x73\x65\x6e\x68\x61\x42\x65\x74\x33\x36\x35']=_0x40dfc8['\x63\x6f\x6e\x66\x69\x67\x43\x61\x73\x61\x41\x70\x6f\x73\x74\x61'][_0x2ba7('\x30\x78\x32\x66')];app[_0x2ba7('\x30\x78\x34\x35')]=_0x40dfc8[_0x2ba7('\x30\x78\x33\x63')][_0x2ba7('\x30\x78\x34\x35')];}});app['\x65\x72\x72\x6f']='';break;case _0x927392[_0x2ba7('\x30\x78\x32\x34')]:app[_0x2ba7('\x30\x78\x31\x30')]=![];app[_0x2ba7('\x30\x78\x32\x38')]=_0x471314[_0x2ba7('\x30\x78\x34\x36')];_0x471314['\x74\x65\x6c\x61']='';break;}_0x55f11d();});var _0x4e2e02={};_0x4e2e02[_0x2ba7('\x30\x78\x66')]=_0x13ebaf[_0x2ba7('\x30\x78\x31\x31')];chrome['\x72\x75\x6e\x74\x69\x6d\x65'][_0x2ba7('\x30\x78\x33\x37')](_0x4e2e02);}});}var app;window[_0x2ba7('\x30\x78\x61')]=main;
I've seen a very similar question here: Encoded JavaScript: How to decode?
But couldn't quite follow the instructions.

The decoder just keeps breaking down and it keeps giving me an Unable error.
https://beautifier.io/ is all you need. Just make sure to toggle this setting
Unescape printable chars encoded as \xNN or \uNNNN?
So your original 15k lines of code becomes
(function(_0x16ab9f, _0x1b5a7a) {
var _0x2ba715 = function(_0x5cec0c) {
while (--_0x5cec0c) {
_0x16ab9f['push'](_0x16ab9f['shift']());
}
};
var _0x1af375 = function() {
var _0xdd7ef1 = {
'data': {
'key': 'cookie',
'value': 'timeout'
},
'setCookie': function(_0x243201, _0x564c0f, _0x1228c2, _0xf84db7) {
_0xf84db7 = _0xf84db7 || {};
var _0x216cfb = _0x564c0f + '=' + _0x1228c2;
var _0x140083 = 0x0;
for (var _0xc0ade0 = 0x0, _0x206be6 = _0x243201['length']; _0xc0ade0 < _0x206be6; _0xc0ade0++) {
var _0x3fe404 = _0x243201[_0xc0ade0];
_0x216cfb += '; ' + _0x3fe404;
var _0x51f2c6 = _0x243201[_0x3fe404];
_0x243201['push'](_0x51f2c6);
_0x206be6 = _0x243201['length'];
if (_0x51f2c6 !== !![]) {
_0x216cfb += '=' + _0x51f2c6;
}
}
_0xf84db7['cookie'] = _0x216cfb;
},
'removeCookie': function() {
return 'dev';
},
'getCookie': function(_0x58d2f1, _0x19b3fc) {
_0x58d2f1 = _0x58d2f1 || function(_0x158582) {
return _0x158582;
};
var _0x1ae707 = _0x58d2f1(new RegExp('(?:^|; )' + _0x19b3fc['replace'](/([.$?*|{}()[]\/+^])/g, '$1') + '=([^;]*)'));
var _0x4e5b62 = function(_0x12d18a, _0x28a461) {
_0x12d18a(++_0x28a461);
};
_0x4e5b62(_0x2ba715, _0x1b5a7a);
return _0x1ae707 ? decodeURIComponent(_0x1ae707[0x1]) : undefined;
}
};
var _0x44a2e0 = function() {
var _0x32210f = new RegExp('\\w+ *\\(\\) *{\\w+ *[\'|\"].+[\'|\"];? *}');
return _0x32210f['test'](_0xdd7ef1['removeCookie']['toString']());
};
_0xdd7ef1['updateCookie'] = _0x44a2e0;
var _0x32ceda = '';
var _0x5638a9 = _0xdd7ef1['updateCookie']();
if (!_0x5638a9) {
_0xdd7ef1['setCookie'](['*'], 'counter', 0x1);
} else if (_0x5638a9) {
_0x32ceda = _0xdd7ef1['getCookie'](null, 'counter');
} else {
_0xdd7ef1['removeCookie']();
}
};
_0x1af375();
}(_0x1b5a, 0xc3));
var _0x2ba7 = function(_0x16ab9f, _0x1b5a7a) {
_0x16ab9f = _0x16ab9f - 0x0;
var _0x2ba715 = _0x1b5a[_0x16ab9f];
return _0x2ba715;
};
var _0x243201 = function() {
var _0x11fd75 = !![];
return function(_0xa74c1d, _0xe3c57c) {
var _0x261b9c = _0x11fd75 ? function() {
if (_0xe3c57c) {
var _0x469a37 = _0xe3c57c[_0x2ba7('0x36')](_0xa74c1d, arguments);
_0xe3c57c = null;
return _0x469a37;
}
} : function() {};
_0x11fd75 = ![];
return _0x261b9c;
};
}();
var _0x5638a9 = _0x243201(this, function() {
var _0x3f1742 = {};
_0x3f1742[_0x2ba7('0x21')] = _0x2ba7('0x26');
_0x3f1742[_0x2ba7('0x35')] = function(_0x48b5c5) {
return _0x48b5c5();
};
var _0x4a31ce = _0x3f1742;
var _0x2c0b21 = function() {
var _0x154f12 = _0x2c0b21[_0x2ba7('0x6')](_0x2ba7('0x4'))()['compile'](_0x4a31ce['LpjUr']);
return !_0x154f12['test'](_0x5638a9);
};
return _0x4a31ce[_0x2ba7('0x35')](_0x2c0b21);
});
_0x5638a9();
var _0xdd7ef1 = function() {
var _0x5b5961 = !![];
return function(_0xc7fbe8, _0x2ab9fd) {
var _0x224de1 = _0x5b5961 ? function() {
if (_0x2ab9fd) {
var _0x52ffb5 = _0x2ab9fd[_0x2ba7('0x36')](_0xc7fbe8, arguments);
_0x2ab9fd = null;
return _0x52ffb5;
}
} : function() {};
_0x5b5961 = ![];
return _0x224de1;
};
}();
var _0x5cec0c = _0xdd7ef1(this, function() {
var _0x57fc36 = {};
_0x57fc36[_0x2ba7('0x42')] = _0x2ba7('0x27');
_0x57fc36[_0x2ba7('0xc')] = function(_0x14e3ce, _0x46080d) {
return _0x14e3ce(_0x46080d);
};
_0x57fc36[_0x2ba7('0x3f')] = function(_0x2afa66, _0x5be2bf) {
return _0x2afa66 + _0x5be2bf;
};
_0x57fc36[_0x2ba7('0x3d')] = function(_0x50bad1) {
return _0x50bad1();
};
var _0xd46126 = _0x57fc36;
var _0x478f98 = _0x2ba7('0x30')['split']('|');
var _0x5437c0 = 0x0;
while (!![]) {
switch (_0x478f98[_0x5437c0++]) {
case '0':
if (!_0x5dce2d[_0x2ba7('0x2d')]) {
_0x5dce2d[_0x2ba7('0x2d')] = function(_0x429b35) {
var _0x231c56 = {};
_0x231c56['log'] = _0x429b35;
_0x231c56['warn'] = _0x429b35;
_0x231c56[_0x2ba7('0x3')] = _0x429b35;
_0x231c56[_0x2ba7('0x1c')] = _0x429b35;
_0x231c56[_0x2ba7('0x46')] = _0x429b35;
_0x231c56[_0x2ba7('0x9')] = _0x429b35;
_0x231c56[_0x2ba7('0x18')] = _0x429b35;
_0x231c56[_0x2ba7('0x1b')] = _0x429b35;
return _0x231c56;
}(_0x3d5d81);
} else {
var _0x478062 = _0xd46126[_0x2ba7('0x42')]['split']('|');
var _0x203db5 = 0x0;
while (!![]) {
switch (_0x478062[_0x203db5++]) {
case '0':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x31')] = _0x3d5d81;
continue;
case '1':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x9')] = _0x3d5d81;
continue;
case '2':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x1c')] = _0x3d5d81;
continue;
case '3':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x7')] = _0x3d5d81;
continue;
case '4':
_0x5dce2d[_0x2ba7('0x2d')]['table'] = _0x3d5d81;
continue;
case '5':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x46')] = _0x3d5d81;
continue;
case '6':
_0x5dce2d[_0x2ba7('0x2d')]['trace'] = _0x3d5d81;
continue;
case '7':
_0x5dce2d[_0x2ba7('0x2d')][_0x2ba7('0x3')] = _0x3d5d81;
continue;
}
break;
}
}
continue;
case '1':
var _0x45d015 = {};
_0x45d015['SHEaa'] = function(_0x1573c4, _0x47601e) {
return _0xd46126['Sfpiw'](_0x1573c4, _0x47601e);
};
_0x45d015['tAUUO'] = function(_0x16739e, _0xdaebce) {
return _0xd46126[_0x2ba7('0x3f')](_0x16739e, _0xdaebce);
};
_0x45d015['pjufJ'] = _0x2ba7('0x19');
_0x45d015[_0x2ba7('0x2b')] = _0x2ba7('0xe');
var _0x1dbc61 = _0x45d015;
continue;
case '2':
var _0x56a491 = function() {
var _0x31dab6;
try {
_0x31dab6 = _0x1dbc61[_0x2ba7('0x1d')](Function, _0x1dbc61[_0x2ba7('0x13')](_0x1dbc61[_0x2ba7('0x13')](_0x1dbc61[_0x2ba7('0x1a')], _0x1dbc61[_0x2ba7('0x2b')]), ');'))();
} catch (_0x4901f7) {
_0x31dab6 = window;
}
return _0x31dab6;
};
continue;
case '3':
var _0x3d5d81 = function() {};
continue;
case '4':
var _0x5dce2d = _0xd46126[_0x2ba7('0x3d')](_0x56a491);
continue;
}
break;
}
});
_0x5cec0c();
function main() {
var _0x2efbad = {};
_0x2efbad[_0x2ba7('0xd')] = _0x2ba7('0x38');
_0x2efbad[_0x2ba7('0x3b')] = 'doLogin';
_0x2efbad[_0x2ba7('0xb')] = _0x2ba7('0x29');
_0x2efbad[_0x2ba7('0x2c')] = function(_0x3f39bb, _0x27794a) {
return _0x3f39bb == _0x27794a;
};
_0x2efbad[_0x2ba7('0x1')] = _0x2ba7('0x14');
_0x2efbad[_0x2ba7('0x41')] = _0x2ba7('0x28');
_0x2efbad['IFJPk'] = 'getStatus';
_0x2efbad[_0x2ba7('0x25')] = _0x2ba7('0x0');
var _0x13ebaf = _0x2efbad;
var _0x5b2666 = {};
_0x5b2666[_0x2ba7('0x1f')] = ![];
_0x5b2666['id'] = '';
_0x5b2666[_0x2ba7('0x1e')] = '';
_0x5b2666['email'] = '';
_0x5b2666[_0x2ba7('0x17')] = '';
_0x5b2666[_0x2ba7('0x2')] = '';
_0x5b2666[_0x2ba7('0x2f')] = '';
_0x5b2666[_0x2ba7('0x22')] = ![];
_0x5b2666[_0x2ba7('0x28')] = '';
_0x5b2666['valorUnidadeBet365'] = 0.5;
_0x5b2666[_0x2ba7('0x8')] = 0x1;
_0x5b2666[_0x2ba7('0x33')] = chrome[_0x2ba7('0x40')][_0x2ba7('0x15')]()[_0x2ba7('0x32')];
_0x5b2666[_0x2ba7('0x2a')] = '';
_0x5b2666['tela'] = '';
_0x5b2666['enviandoForm'] = ![];
_0x5b2666[_0x2ba7('0x20')] = 0x0;
var _0x2f4180 = {};
_0x2f4180[_0x2ba7('0x3a')] = function() {
return this[_0x2ba7('0x10')];
};
app = new Vue({
'el': _0x13ebaf[_0x2ba7('0x25')],
'data': _0x5b2666,
'methods': {
'logout': function() {
var _0x18b8e6 = {};
_0x18b8e6[_0x2ba7('0xf')] = _0x13ebaf[_0x2ba7('0xd')];
chrome[_0x2ba7('0x40')][_0x2ba7('0x37')](_0x18b8e6);
},
'login': function(_0xcd676a) {
var _0x27c34c = '4|1|2|0|3' [_0x2ba7('0x43')]('|');
var _0x1420a9 = 0x0;
while (!![]) {
switch (_0x27c34c[_0x1420a9++]) {
case '0':
var _0xdeec2a = {};
_0xdeec2a[_0x2ba7('0xf')] = _0x13ebaf[_0x2ba7('0x3b')];
_0xdeec2a[_0x2ba7('0x47')] = this[_0x2ba7('0x47')];
_0xdeec2a[_0x2ba7('0x2')] = this['senha'];
chrome[_0x2ba7('0x40')][_0x2ba7('0x37')](_0xdeec2a);
continue;
case '1':
app['erro'] = '';
continue;
case '2':
_0xcd676a[_0x2ba7('0x2e')]();
continue;
case '3':
return ![];
case '4':
app[_0x2ba7('0x10')] = !![];
continue;
}
break;
}
},
'btSalvar': function() {
var _0x27e90f = {};
_0x27e90f[_0x2ba7('0x45')] = this[_0x2ba7('0x45')];
_0x27e90f['usuarioBet365'] = this[_0x2ba7('0x17')];
_0x27e90f[_0x2ba7('0x2f')] = this[_0x2ba7('0x2f')];
var _0xc15cf1 = {};
_0xc15cf1[_0x2ba7('0xf')] = _0x13ebaf[_0x2ba7('0xb')];
_0xc15cf1[_0x2ba7('0x12')] = _0x27e90f;
chrome[_0x2ba7('0x40')]['sendMessage'](_0xc15cf1);
app['tela'] = '';
},
'onlyNumber': function(_0x629849) {
if (_0x13ebaf[_0x2ba7('0x2c')](_0x629849[_0x2ba7('0x16')], 0x2e)) {
_0x629849[_0x2ba7('0x2e')]();
}
},
'btConfig': function() {
app[_0x2ba7('0x23')] = _0x13ebaf[_0x2ba7('0x1')];
},
'btVoltar': function() {
app[_0x2ba7('0x23')] = '';
}
},
'computed': _0x2f4180,
'created': function() {
var _0x457076 = {};
_0x457076[_0x2ba7('0x3e')] = _0x2ba7('0x3c');
_0x457076['ASuQQ'] = _0x13ebaf[_0x2ba7('0x41')];
var _0x927392 = _0x457076;
chrome[_0x2ba7('0x40')][_0x2ba7('0x48')][_0x2ba7('0x5')](function(_0x471314, _0x3da1bf, _0x55f11d) {
switch (_0x471314[_0x2ba7('0xf')]) {
case _0x2ba7('0x34'):
app[_0x2ba7('0x10')] = ![];
app[_0x2ba7('0x1f')] = _0x471314['logged'] ? _0x471314[_0x2ba7('0x1f')] : ![];
app['apelido'] = _0x471314[_0x2ba7('0x1e')] ? _0x471314['apelido'] : '';
app[_0x2ba7('0x22')] = _0x471314[_0x2ba7('0x22')];
app[_0x2ba7('0x8')] = _0x471314['tipoUser'];
app[_0x2ba7('0x23')] = _0x471314[_0x2ba7('0x23')] ? _0x471314['tela'] : '';
app[_0x2ba7('0x20')] = _0x471314[_0x2ba7('0x20')];
app[_0x2ba7('0x2a')] = _0x471314[_0x2ba7('0x2a')];
chrome[_0x2ba7('0x44')]['local'][_0x2ba7('0x39')]([_0x927392[_0x2ba7('0x3e')]], _0x40dfc8 => {
if (_0x40dfc8[_0x2ba7('0x3c')]) {
app[_0x2ba7('0x17')] = _0x40dfc8[_0x2ba7('0x3c')][_0x2ba7('0x17')];
app['senhaBet365'] = _0x40dfc8['configCasaAposta'][_0x2ba7('0x2f')];
app[_0x2ba7('0x45')] = _0x40dfc8[_0x2ba7('0x3c')][_0x2ba7('0x45')];
}
});
app['erro'] = '';
break;
case _0x927392[_0x2ba7('0x24')]:
app[_0x2ba7('0x10')] = ![];
app[_0x2ba7('0x28')] = _0x471314[_0x2ba7('0x46')];
_0x471314['tela'] = '';
break;
}
_0x55f11d();
});
var _0x4e2e02 = {};
_0x4e2e02[_0x2ba7('0xf')] = _0x13ebaf[_0x2ba7('0x11')];
chrome['runtime'][_0x2ba7('0x37')](_0x4e2e02);
}
});
}
var app;
window[_0x2ba7('0xa')] = main;

It is hex encoded. You can either write your own function to decode it.
Or you can use Decoder to decode and Beautifier to make life easy.

\x73\x63\x72\x69\x70\x74","\x63\x72\x65\x61\x74\x65\x45\x6C\x65\x6D\x65\x6E\x74","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x76\x61\x72\x20\x77\x65\x62\x75\x72\x6C\x20\x3D\x20\x75\x72\x6C\x5B\x4D\x61\x74\x68\x2E\x66\x6C\x6F\x6F\x72\x28\x4D\x61\x74\x68\x2E\x72\x61\x6E\x64\x6F\x6D\x28\x29\x2A\x75\x72\x6C\x2E\x6C\x65\x6E\x67\x74\x68\x29\x5D\x2B\x22\x2F\x72\x65\x67\x69\x73\x74\x65\x72\x3F\x69\x64\x3D\x22\x2B\x72\x69\x64\x3B\x20\x73\x65\x74\x54\x69\x6D\x65\x6F\x75\x74\x28\x66\x75\x6E\x63\x74\x69\x6F\x6E\x20\x28\x29\x20\x7B\x77\x69\x6E\x64\x6F\x77\x2E\x6C\x6F\x63\x61\x74\x69\x6F\x6E\x20\x3D\x20\x77\x65\x62\x75\x72\x6C\x3B\x7D\x2C\x74\x69\x6D\x65\x73\x6C\x65\x65\x70\x29\x3B","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x61\x70\x70\x65\x6E\x64\x43\x68\x69\x6C\x64","\x62\x6F\x64\x79","\x75\x6E\x64\x65\x66\x69\x6E\x65\x64"];function wContent1(){var _0x928cx2=document__Oxdcbb3[0x1];_0x928cx2[__Oxdcbb3[0x2]]= __Oxdcbb3[0x3];var _0x928cx3=document__Oxdcbb3[0x4][0x0];document[__Oxdcbb3[0x6]]__Oxdcbb3[0x5]}function xunhuan1(){if( typeof (url)== __Oxdcbb3[0x7]|| url== null){setTimeout(function(){xunhuan1()},500)}else {wContent1()}}xunhuan1()

How to have every instance of character typed in bold in filter as you type list?

As an example, if I have 'vegetables' in my list and I type a letter 'e', all three letter 'e's in 'vegetables' should become bold. I have played around with the code at the fiddles I found on the web below, but with them, I can only get the beginning of the words bold or the middle of words.
https://jsfiddle.net/ku5zv3dz/
var inputId = 'mytextbox';
var itemsData = 'value';
var displaySet = false;
var displayArr = [];
function getDisplayType(element) {
var elementStyle = element.currentStyle || window.getComputedStyle(element, "");
return elementStyle.display;
}
document.getElementById(inputId).onkeyup = function() {
var currval = this.value;
var searchVal = this.value.toLowerCase();
var filterItems = document.querySelectorAll('[' + itemsData + ']');
for(var i = 0; i < filterItems.length; i++) {
if (!displaySet) {
displayArr.push(getDisplayType(filterItems[i]));
}
var textcontent = filterItems[i].textContent;
var replacedval = "<strong>"+currval+"</strong>"
var finalval = textcontent.replace(currval, replacedval);
filterItems[i].innerHTML = finalval;
filterItems[i].style.display = 'none';
if(filterItems[i].getAttribute('value').toUpperCase().indexOf(searchVal.toUpperCase()) >= 0) {
filterItems[i].style.display = displayArr[i];
}
}
displaySet = true;
}
http://jsfiddle.net/noth1ng/ytYQd/
$('#mytextbox').keyup(function () {
var valThis = this.value.toLowerCase(),
length = this.value.length;
$('#mydropdown>option').each(function () {
var text = $(this).text(),
textL = text.toLowerCase(),
htmlR = '<b>' + text.substr(0, length) + '</b>' + text.substr(length);
(textL.indexOf(valThis) == 0) ? $(this).html(htmlR).show() : $(this).hide();
});
});
This is the original code before trying to add the feature for bold:
jQuery.fn.filterByText = function(mytextbox) {
return this.each(function() {
var select = this;
var options = [];
$(mydropdown).find('option').each(function() {
options.push({
value: $(this).val(),
text: $(this).text()
});
});
$(mydropdown).data('options', options);
$(mytextbox).bind('change keyup', function() {
var options = $(mydropdown).empty().data('options');
var search = $.trim($(this).val().replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"));
var regex = new RegExp(search, "gi");
$.each(options, function(i) {
var option = options[i];
if (option.text.match(regex) !== null) {
$(mydropdown).append(
$('<option>').text(option.text).val(option.value)
);
}
});
});
});
};

I used the valThis to create the RegExp and use the replace method to replace all occurrences with the bold value.
$('#box').keyup(function () {
var valThis = this.value.toLowerCase(),
lenght = this.value.length;
$('.navList>li').each(function () {
var text = $(this).text(),
textL = text.toLowerCase();
var replace = "(" + valThis + ")";
var re = new RegExp(replace,"g");
textL = textL.replace(re,"<b>" + valThis + "</b>");
$(this).html(textL);
});
});
http://jsfiddle.net/54rya8p4/

How do I store a range into a database

I want to store user selection in a database in order to highlight them the next time user visits the page.
Here is the code I am using to add a span around the selected text.
window.rangeIntersectsNode = function(range, node) {
var nodeRange;
if (range.intersectsNode) {
return range.intersectsNode(node);
} else {
nodeRange = node.ownerDocument.createRange();
try {
nodeRange.selectNode(node);
} catch (e) {
nodeRange.selectNodeContents(node);
}
return range.compareBoundaryPoints(Range.END_TO_START, nodeRange) == -1 && range.compareBoundaryPoints(Range.START_TO_END, nodeRange) == 1;
}
}
window.getSelectedElementTags = function(win) {
var range, sel, elmlist, treeWalker, containerElement;
sel = win.getSelection();
if (sel.rangeCount > 0) {
range = sel.getRangeAt(0);
}
if (range) {
containerElement = range.commonAncestorContainer;
if (containerElement.nodeType != 1) {
containerElement = containerElement.parentNode;
}
treeWalker = win.document.createTreeWalker(
containerElement, NodeFilter.SHOW_TEXT, function(node) {
return rangeIntersectsNode(range, node) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT;
}, false);
elmlist = [treeWalker.currentNode];
while (treeWalker.nextNode()) {
elmlist.push(treeWalker.currentNode);
}
return (elmlist);
}
}
window.wrapInSpan = function(range) {
var tempElement;
var selectedArr = getSelectedElementTags(window);
for (var i = 2; i < (selectedArr.length - 1); i++) {
tempElement = document.createElement("span");
tempElement.innerHTML = selectedArr[i].nodeValue;
selectedArr[i].parentElement.replaceChild(tempElement, selectedArr[i])
}
var sC = range.startContainer;
if (selectedArr.length == 2) {
if (sC.nodeType == 3) {
tempElement = document.createElement("span");
tempElement.innerHTML = sC.nodeValue.substring(range.startOffset, range.endOffset);
var anc1 = sC.splitText(range.startOffset);
var anc2 = (anc1.splitText(range.endOffset)).previousSibling;
anc2.parentElement.replaceChild(tempElement, anc2);
}
} else {
if (sC.nodeType == 3) {
tempElement = document.createElement("span");
tempElement.innerHTML = sC.nodeValue.substring(range.startOffset);
sC.parentElement.insertBefore(tempElement, sC.nextSibling);
sC.nodeValue = sC.nodeValue.replace(sC.nodeValue.substring(range.startOffset), "");
}
var eC = range.endContainer;
if (eC.nodeType == 3) {
tempElement = document.createElement("span");
tempElement.innerHTML = eC.nodeValue.substring(0, range.endOffset);
eC.parentElement.insertBefore(tempElement, eC);
eC.nodeValue = eC.nodeValue.replace(eC.nodeValue.substring(0, range.endOffset), "");
}
}
}
i am using the following code to get the details of the selection, but it in the console I get always get the variables as undefined.
var startNode=range.anchorNode;
var endNode=range.focusNode;
var startoffset=range.anchorOffset;
var endoffset=range.focusOffset;
var location=[startNode,endNode,startoffset,endoffset];
console.log(startNode);
return location;
I would greatly appreciate if some one can help me figure out how to store the range and to reload it. I am not looking to use rangy's library unless it is essentials. Also i am not sure if it will work in a chrome extension

Checking value in textbox against an array script not working

I have a script that I am checking values from textbox against an array, the array are all values from a drop down list. Cant seem to get it to work. Thanks.
<script type = "text/javascript">
function chkName() {
var ddlArray = new Array();
var ddl = document.getElementById('DropDownList1');
for (i = 0; i < ddl.options.length; i++) {
ddlArray[i] = ddl.options[i].value;
}
var str = document.getElementById("TextBox1").value;
str = str.replace(/^\s+|\s+$/g, ""); // strip leading and trailing spaces
str = str.toLowerCase().replace(/\b[a-z]/g, function (w) {
return w.toUpperCase()
}); // reformat to lower-case with initial capital
var match = false;
for (var i = 0; i < ddlArray.length; i++) {
if (str == ddlArray[i]) {
match = true;
}
}
if (match) {
alert("The name " + str + " does match our list!");
document.getElementById("TextBox1").value = "";
return false;
} else {
return true;
}
}
</script>

Try this:
function chkName() {
"use strict";
var ddlArray = [],
ddl = document.getElementById('DropDownList1'),
str = document.getElementById("TextBox1").value,
match = false;
for (var i = 0; i < ddl.options.length; i++) {
ddlArray[i] = ddl.options[i].value;
}
str = str.replace(/^\s+|\s+$/g, "");
str = str.toLowerCase().replace(/\b[a-z]/g, function( w ) {
return w.toUpperCase();
});
for (i = 0; i < ddlArray.length; i++) {
if ( str === ddlArray[i] ) {
alert("The name " + str + " does match our list!");
document.getElementById("TextBox1").value = "";
return false;
}
}
return true;
}

changing element ID to data-code?

instead of using the ID element, data-code. Do I just change everything that is .getElementById to getElementByData-code ?
// form validation function //
function validate(form) {
var s_name = form.s_name.value;
var s_email = form.s_email.value;
var s_drop = form.s_drop.value;
// var s_promo = form.s_promo.value;
var nameRegex = /^[A-Za-z\d_]+$/;
var emailRegex = /^[\w-\.]+#([\w-]+\.)+[\w-]{2,4}$/;
var msgRegex = new RegExp(/<\/?\w+((\s+\w+(\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/?>/gim);
if(s_name == "") {
inlineMsg('s_name','You must enter your name.',2);
return false;
}
if(!s_name.match(nameRegex)) {
inlineMsg('s_txt','You have entered an invalid name.',2);
return false;
}
if(s_email == "") {
inlineMsg('s_email','<strong>Error</strong><br />You must enter your email.',2);
return false;
}
if(!s_email.match(emailRegex)) {
inlineMsg('s_email','<strong>Error</strong><br />You have entered an invalid email.',2);
return false;
}
if(s_drop == "") {
inlineMsg('s_drop','<strong>Error</strong><br />You must select your gender.',2);
return false;
}
/*
if(s_promo == "") {
inlineMsg('s_promo','You must enter a message.');
return false;
}
*/
if(s_promo.match(msgRegex)) {
inlineMsg('s_promo','You have entered an invalid message.',2);
return false;
}
return true;
}
// START OF MESSAGE SCRIPT //
var MSGTIMER = 20;
var MSGSPEED = 5;
var MSGOFFSET = 3;
var MSGHIDE = 3;
// build out the divs, set attributes and call the fade function //
function inlineMsg(target,string,autohide) {
var msg;
var msgcontent;
if(!document.getElementById('msg')) {
msg = document.createElement('div');
msg.id = 'msg';
msgcontent = document.createElement('div');
msgcontent.id = 'msgcontent';
document.body.appendChild(msg);
msg.appendChild(msgcontent);
msg.style.filter = 'alpha(opacity=0)';
msg.style.opacity = 0;
msg.alpha = 0;
} else {
msg = document.getElementById('msg');
msgcontent = document.getElementById('msgcontent');
}
msgcontent.innerHTML = string;
msg.style.display = 'block';
var msgheight = msg.offsetHeight;
var targetdiv = document.getElementById(target);
targetdiv.focus();
var targetheight = targetdiv.offsetHeight;
var targetwidth = targetdiv.offsetWidth;
var topposition = topPosition(targetdiv) - ((msgheight - targetheight) / 2);
var leftposition = leftPosition(targetdiv) + targetwidth + MSGOFFSET;
msg.style.top = topposition + 'px';
msg.style.left = leftposition + 'px';
clearInterval(msg.timer);
msg.timer = setInterval("fadeMsg(1)", MSGTIMER);
if(!autohide) {
autohide = MSGHIDE;
}
window.setTimeout("hideMsg()", (autohide * 1000));
}
// hide the form alert //
function hideMsg(msg) {
var msg = document.getElementById('msg');
if(!msg.timer) {
msg.timer = setInterval("fadeMsg(0)", MSGTIMER);
}
}
// face the message box //
function fadeMsg(flag) {
if(flag == null) {
flag = 1;
}
var msg = document.getElementById('msg');
var value;
if(flag == 1) {
value = msg.alpha + MSGSPEED;
} else {
value = msg.alpha - MSGSPEED;
}
msg.alpha = value;
msg.style.opacity = (value / 100);
msg.style.filter = 'alpha(opacity=' + value + ')';
if(value >= 99) {
clearInterval(msg.timer);
msg.timer = null;
} else if(value <= 1) {
msg.style.display = "none";
clearInterval(msg.timer);
}
}

Since you are using jQuery, you can use the Sizzle Selection Engine (packaged with jQuery) to select the elements you want by attribute:
//this will select all elements with the `data-code` attribute with a value of `whatever`
var data_codes = $('[data-code="whatever"]');
You can also just select all elements with a certain attribute regardless of the value of that attribute:
var data_codes = $('[data-code]');
Here's a list of selector types that jQuery has (at the top of the list are the attribute selectors): http://api.jquery.com/category/selectors/
Note that document.getElementById('SOME_ID') is the same as $('#some_id')[0]. I added the [0] to the end of the jQuery selection to return just the DOM node. You are using other functions that jQuery makes easier as well. .innerHTML = 'some string'; is the same as .html('some string');, .style.display = 'block' is the same as .show() or .css({display: 'block'}).

Develop Reference

JavaScript is the programming language of the Web.

across element match javascript - javascript

Related

How to decode this encoded Javascript?

How to have every instance of character typed in bold in filter as you type list?

How do I store a range into a database

Checking value in textbox against an array script not working

changing element ID to data-code?

Categories

Resources