How to read the blockadblock script?

How to read the blockadblock script? - javascript

I'm wondering how to decode the script, I'm trying to customize the design but its so hard to read the code
there script is here:
https://blockadblock.com/blockadblock_basic_script.php

It's just encrypted inline with a function, no "obfuscation with a key"
Run the function without the initial "eval" here: http://www.webtoolkitonline.com/javascript-tester.html
and you'll get the code:
Result = ;
var xcJQCflAmpis = '',
KkUCuxqIgh = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
for (var i = 0; i < 12; i++) xcJQCflAmpis += KkUCuxqIgh.charAt(Math.floor(Math.random() * KkUCuxqIgh.length));
var VABjXzYzJp = 8,
WSpSwDLzQd = 91,
nsJjjBITZC = 178,
neMuFFBFgq = 19,
rMwHazIJjv = function(t) {
var o = !1,
i = function() {
if (document.addEventListener) {
document.removeEventListener('DOMContentLoaded', e);
window.removeEventListener('load', e)
} else {
document.detachEvent('onreadystatechange', e);
window.detachEvent('onload', e)
}
},
e = function() {
if (!o && (document.addEventListener || event.type === 'load' || document.readyState === 'complete')) {
o = !0;
i();
t()
}
};
if (document.readyState === 'complete') {
t()
} else if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', e);
window.addEventListener('load', e)
} else {
document.attachEvent('onreadystatechange', e);
window.attachEvent('onload', e);
var n = !1;
try {
n = window.frameElement == null && document.documentElement
} catch (r) {};
if (n && n.doScroll) {
(function a() {
if (o) return;
try {
n.doScroll('left')
} catch (e) {
return setTimeout(a, 50)
};
o = !0;
i();
t()
})()
}
}
};
window['' + xcJQCflAmpis + ''] = (function() {
var t = {
t$: 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=',
encode: function(e) {
var d = '',
l, r, i, s, c, a, n, o = 0;
e = t.n$(e);
while (o < e.length) {
l = e.charCodeAt(o++);
r = e.charCodeAt(o++);
i = e.charCodeAt(o++);
s = l >> 2;
c = (l & 3) << 4 | r >> 4;
a = (r & 15) << 2 | i >> 6;
n = i & 63;
if (isNaN(r)) {
a = n = 64
} else if (isNaN(i)) {
n = 64
};
d = d + this.t$.charAt(s) + this.t$.charAt(c) + this.t$.charAt(a) + this.t$.charAt(n)
};
return d
},
decode: function(e) {
var n = '',
l, c, d, s, r, i, a, o = 0;
e = e.replace(/[^A-Za-z0-9\+\/\=]/g, '');
while (o < e.length) {
s = this.t$.indexOf(e.charAt(o++));
r = this.t$.indexOf(e.charAt(o++));
i = this.t$.indexOf(e.charAt(o++));
a = this.t$.indexOf(e.charAt(o++));
l = s << 2 | r >> 4;
c = (r & 15) << 4 | i >> 2;
d = (i & 3) << 6 | a;
n = n + String.fromCharCode(l);
if (i != 64) {
n = n + String.fromCharCode(c)
};
if (a != 64) {
n = n + String.fromCharCode(d)
}
};
n = t.e$(n);
return n
},
n$: function(t) {
t = t.replace(/;/g, ';');
var n = '';
for (var o = 0; o < t.length; o++) {
var e = t.charCodeAt(o);
if (e < 128) {
n += String.fromCharCode(e)
} else if (e > 127 && e < 2048) {
n += String.fromCharCode(e >> 6 | 192);
n += String.fromCharCode(e & 63 | 128)
} else {
n += String.fromCharCode(e >> 12 | 224);
n += String.fromCharCode(e >> 6 & 63 | 128);
n += String.fromCharCode(e & 63 | 128)
}
};
return n
},
e$: function(t) {
var o = '',
e = 0,
n = c1 = c2 = 0;
while (e < t.length) {
n = t.charCodeAt(e);
if (n < 128) {
o += String.fromCharCode(n);
e++
} else if (n > 191 && n < 224) {
c2 = t.charCodeAt(e + 1);
o += String.fromCharCode((n & 31) << 6 | c2 & 63);
e += 2
} else {
c2 = t.charCodeAt(e + 1);
c3 = t.charCodeAt(e + 2);
o += String.fromCharCode((n & 15) << 12 | (c2 & 63) << 6 | c3 & 63);
e += 3
}
};
return o
}
};
var a = ['YWQtbGVmdA==', 'YWRCYW5uZXJXcmFw', 'YWQtZnJhbWU=', 'YWQtaGVhZGVy', 'YWQtaW1n', 'YWQtaW5uZXI=', 'YWQtbGFiZWw=', 'YWQtbGI=', 'YWQtZm9vdGVy', 'YWQtY29udGFpbmVy', 'YWQtY29udGFpbmVyLTE=', 'YWQtY29udGFpbmVyLTI=', 'QWQzMDB4MTQ1', 'QWQzMDB4MjUw', 'QWQ3Mjh4OTA=', 'QWRBcmVh', 'QWRGcmFtZTE=', 'QWRGcmFtZTI=', 'QWRGcmFtZTM=', 'QWRGcmFtZTQ=', 'QWRMYXllcjE=', 'QWRMYXllcjI=', 'QWRzX2dvb2dsZV8wMQ==', 'QWRzX2dvb2dsZV8wMg==', 'QWRzX2dvb2dsZV8wMw==', 'QWRzX2dvb2dsZV8wNA==', 'RGl2QWQ=', 'RGl2QWQx', 'RGl2QWQy', 'RGl2QWQz', 'RGl2QWRB', 'RGl2QWRC', 'RGl2QWRD', 'QWRJbWFnZQ==', 'QWREaXY=', 'QWRCb3gxNjA=', 'QWRDb250YWluZXI=', 'Z2xpbmtzd3JhcHBlcg==', 'YWRUZWFzZXI=', 'YmFubmVyX2Fk', 'YWRCYW5uZXI=', 'YWRiYW5uZXI=', 'YWRBZA==', 'YmFubmVyYWQ=', 'IGFkX2JveA==', 'YWRfY2hhbm5lbA==', 'YWRzZXJ2ZXI=', 'YmFubmVyaWQ=', 'YWRzbG90', 'cG9wdXBhZA==', 'YWRzZW5zZQ==', 'Z29vZ2xlX2Fk', 'b3V0YnJhaW4tcGFpZA==', 'c3BvbnNvcmVkX2xpbms='],
y = Math.floor(Math.random() * a.length),
Y = t.decode(a[y]),
b = Y,
C = 1,
f = '#EEEEEE',
r = '#777777',
g = '#adb8ff',
w = '#FFFFFF',
Q = '',
W = 'Welcome!',
v = 'It looks like you\'re using an ad blocker. That\'s okay. Who doesn\'t?',
p = 'But without advertising-income, we can\'t keep making this site awesome.',
s = 'I understand, I have disabled my ad blocker. Let me in!',
o = 0,
u = 0,
n = 'moc.kcolbdakcolb',
l = 0,
M = e() + '.jpg';
function h(t) {
if (t) t = t.substr(t.length - 15);
var n = document.getElementsByTagName('script');
for (var o = n.length; o--;) {
var e = String(n[o].src);
if (e) e = e.substr(e.length - 15);
if (e === t) return !0
};
return !1
};
function m(t) {
if (t) t = t.substr(t.length - 15);
var e = document.styleSheets;
x = 0;
while (x < e.length) {
thisurl = e[x].href;
if (thisurl) thisurl = thisurl.substr(thisurl.length - 15);
if (thisurl === t) return !0;
x++
};
return !1
};
function e(t) {
var o = '',
e = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
t = t || 30;
for (var n = 0; n < t; n++) o += e.charAt(Math.floor(Math.random() * e.length));
return o
};
function i(o) {
var i = ['YWRuLmViYXkuY29t', 'YWQubWFpbC5ydQ==', 'anVpY3lhZHMuY29t', 'YWQuZm94bmV0d29ya3MuY29t', 'cGFydG5lcmFkcy55c20ueWFob28uY29t', 'YS5saXZlc3BvcnRtZWRpYS5ldQ==', 'YWdvZGEubmV0L2Jhbm5lcnM=', 'YWR2ZXJ0aXNpbmcuYW9sLmNvbQ==', 'Y2FzLmNsaWNrYWJpbGl0eS5jb20=', 'cHJvbW90ZS5wYWlyLmNvbQ==', 'YWRzLnlhaG9vLmNvbQ==', 'YWRzLnp5bmdhLmNvbQ==', 'YWRzYXR0LmFiY25ld3Muc3RhcndhdmUuY29t', 'YWRzYXR0LmVzcG4uc3RhcndhdmUuY29t', 'YXMuaW5ib3guY29t', 'cGFydG5lcmFkcy55c20ueWFob28uY29t'],
r = ['ZmF2aWNvbi5pY28=', 'YmFubmVyLmpwZw==', 'NDY4eDYwLmpwZw==', 'NzIweDkwLmpwZw==', 'c2t5c2NyYXBlci5qcGc=', 'MTM2N19hZC1jbGllbnRJRDI0NjQuanBn', 'YWRjbGllbnQtMDAyMTQ3LWhvc3QxLWJhbm5lci1hZC5qcGc=', 'Q0ROLTMzNC0xMDktMTM3eC1hZC1iYW5uZXI=', 'ZmF2aWNvbi5pY28=', 'YWQtbGFyZ2UucG5n', 'c3F1YXJlLWFkLnBuZw==', 'ZmF2aWNvbjEuaWNv', 'YmFubmVyX2FkLmdpZg==', 'bGFyZ2VfYmFubmVyLmdpZg==', 'd2lkZV9za3lzY3JhcGVyLmpwZw==', 'YWR2ZXJ0aXNlbWVudC0zNDMyMy5qcGc='];
x = 0;
spimg = [];
while (x < o) {
c = i[Math.floor(Math.random() * i.length)];
d = r[Math.floor(Math.random() * r.length)];
c = t.decode(c);
d = t.decode(d);
var a = Math.floor(Math.random() * 2) + 1;
if (a == 1) {
n = '//' + c + '/' + d
} else {
n = '//' + c + '/' + e(Math.floor(Math.random() * 20) + 4) + '.jpg'
};
spimg[x] = new Image();
spimg[x].onerror = function() {
var t = 1;
while (t < 7) {
t++
}
};
spimg[x].src = n;
x++
}
};
function A(t) {};
return {
ekgBSgaBPk: function(t, r) {
if (typeof document.body == 'undefined') {
return
};
var o = '0.1',
r = b,
e = document.createElement('DIV');
e.id = r;
e.style.position = 'absolute';
e.style.left = '-5000px';
e.style.top = '-5000px';
e.style.height = '60px';
e.style.width = '468px';
var d = document.body.childNodes,
a = Math.floor(d.length / 2);
if (a > 15) {
var n = document.createElement('div');
n.style.position = 'absolute';
n.style.height = '0px';
n.style.width = '0px';
n.style.top = '-5000px';
n.style.left = '-5000px';
document.body.insertBefore(n, document.body.childNodes[a]);
n.appendChild(e);
var i = document.createElement('DIV');
i.id = 'banner_ad';
i.style.position = 'absolute';
i.style.left = '-5000px';
i.style.top = '-5000px';
document.body.appendChild(i)
} else {
e.id = 'banner_ad';
document.body.appendChild(e)
};
l = setInterval(function() {
if (e) {
t((e.clientHeight == 0), o);
t((e.clientWidth == 0), o);
t((e.display == 'hidden'), o);
t((e.visibility == 'none'), o);
t((e.opacity == 0), o)
} else {
t(!0, o)
}
}, 1000)
},
bPqodbIKMt: function(e, m) {
if ((e) && (o == 0)) {
o = 1;
window['' + xcJQCflAmpis + ''].NhnwYPCjqO();
window['' + xcJQCflAmpis + ''].bPqodbIKMt = function() {
return
}
} else {
var p = t.decode('aW5zLmFkc2J5Z29vZ2xl'),
c = document.querySelector(p);
if ((c) && (o == 0)) {
if ((WSpSwDLzQd % 3) == 0) {
var d = 'Ly9wYWdlYWQyLmdvb2dsZXN5bmRpY2F0aW9uLmNvbS9wYWdlYWQvanMvYWRzYnlnb29nbGUuanM=';
d = t.decode(d);
if (h(d)) {
if (c.innerHTML.replace(/\s/g, '').length == 0) {
o = 1;
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
}
}
}
};
var f = !1;
if (o == 0) {
if ((nsJjjBITZC % 3) == 0) {
if (!window['' + xcJQCflAmpis + ''].ranAlready) {
var l = ['Ly93d3cuZ29vZ2xlLmNvbS9hZHNlbnNlL3N0YXJ0L2ltYWdlcy9mYXZpY29uLmljbw==', 'Ly93d3cuZ3N0YXRpYy5jb20vYWR4L2RvdWJsZWNsaWNrLmljbw==', 'Ly9hZHZlcnRpc2luZy55YWhvby5jb20vZmF2aWNvbi5pY28=', 'Ly9hZHMudHdpdHRlci5jb20vZmF2aWNvbi5pY28=', 'Ly93d3cuZG91YmxlY2xpY2tieWdvb2dsZS5jb20vZmF2aWNvbi5pY28='],
s = l.length,
r = l[Math.floor(Math.random() * s)],
n = r;
while (r == n) {
n = l[Math.floor(Math.random() * s)]
};
r = t.decode(r);
n = t.decode(n);
i(Math.floor(Math.random() * 2) + 1);
var a = new Image(),
u = new Image();
a.onerror = function() {
i(Math.floor(Math.random() * 2) + 1);
u.src = n;
i(Math.floor(Math.random() * 2) + 1)
};
u.onerror = function() {
o = 1;
i(Math.floor(Math.random() * 3) + 1);
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
};
a.src = r;
if ((neMuFFBFgq % 3) == 0) {
a.onload = function() {
if ((a.width < 8) && (a.width > 0)) {
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
}
}
};
i(Math.floor(Math.random() * 3) + 1);
window['' + xcJQCflAmpis + ''].ranAlready = !0
};
window['' + xcJQCflAmpis + ''].bPqodbIKMt = function() {
return
}
}
}
}
},
NhnwYPCjqO: function() {
if (u == 1) {
var C = sessionStorage.getItem('babn');
if (C > 0) {
return !0
} else {
sessionStorage.setItem('babn', (Math.random() + 1) * 1000)
}
};
var c = 'Ly95dWkueWFob29hcGlzLmNvbS8zLjE4LjEvYnVpbGQvY3NzcmVzZXQvY3NzcmVzZXQtbWluLmNzcw==';
c = t.decode(c);
if (!m(c)) {
var h = document.createElement('link');
h.setAttribute('rel', 'stylesheet');
h.setAttribute('type', 'text/css');
h.setAttribute('href', c);
document.getElementsByTagName('head')[0].appendChild(h)
};
clearInterval(l);
document.body.innerHTML = '';
document.body.style.cssText += 'margin:0px !important';
document.body.style.cssText += 'padding:0px !important';
var Q = document.documentElement.clientWidth || window.innerWidth || document.body.clientWidth,
y = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight,
a = document.createElement('DIV'),
b = e();
a.id = b;
a.style.position = 'fixed';
a.style.left = '0';
a.style.top = '0';
a.style.width = Q + 'px';
a.style.height = y + 'px';
a.style.backgroundColor = f;
a.style.zIndex = '9999';
document.body.appendChild(a);
var d = '<a href="http://blockadblock.com"><svg id="FILLVECTID1" width="160" height="40"><image id="FILLVECTID2" width="160" height="40" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAoCAMAAABO8gGqAAAB+1BMVEXr6+sAAADr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+sAAADMAAAsKysKCgokJCRycnIEBATq6uoUFBTMzMzr6urjqqoSEhIGBgaxsbHcd3dYWFg0NDTmw8PZY2M5OTkfHx+enp7TNTUoJyfm5ualpaV5eXkODg7k5OTaamoqKSnc3NzZ2dmHh4dra2tHR0fVQUFAQEDPExPNBQXo6Ohvb28ICAjp19fS0tLnzc29vb25ubm1tbWWlpaNjY3dfX1oaGhUVFRMTEwaGhoXFxfq5ubh4eHe3t7Hx8fgk5PfjY3eg4OBgYF+fn5EREQ9PT3SKSnV1dXks7OsrKypqambmpqRkZFdXV1RUVHRISHQHR309PTq4eHp3NzPz8/Ly8vKysrDw8O4uLjkt7fhnJzgl5d7e3tkZGTYVlZPT08vLi7OCwu/v792dnbbdHTZYWHZXl7YWlpZWVnVRkYnJib8/PzNzc3myMjlurrjsLDhoaHdf3/aa2thYWHXUFDUPDzUOTno0dHipqbceHjaZ2dCQkLSLy/v7+/b29vlvb2xn5/ejIzabW26SkqgMDA7HByRAADoM7kjAAAAInRSTlM6ACT4xhkPtY5iNiAI9PLv6drSpqGYclpM5bengkQ8NDAnsGiGMwAABetJREFUWMPN2GdTE1EYhmFQ7L339

You can partially deobfuscate it simply by removing the eval() that the code is wrapped inside. The entirety of the code that's inside the eval() will return the stringified code so you just need to run it to get that string.
Sidenote: I usually use the JsFormat plugin for Sublime Text for that. It evaluates the content of the eval() and also nicely formats the code afterwards.

Here is a full blockadblock standard script that you ask, just copy it and paste anywehere after open "body" and before closed "body" tag. Also you can change everything in this code, like: bgcolor, font, text, logo, button, delay time... everything.. in the end of the script. You'll see.
Your page code must be like this:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript" charset="utf-8">
// Place this code snippet near the footer of your page before the close of the /body tag
// LEGAL NOTICE: The content of this website and all associated program code are protected under the Digital Millennium Copyright Act. Intentionally circumventing this code may constitute a violation of the DMCA.
eval(function(p,a,c,k,e,d){
e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){
while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}
return p});
var xcJQCflAmpis = '',
KkUCuxqIgh = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
for (var i = 0; i < 12; i++) xcJQCflAmpis += KkUCuxqIgh.charAt(Math.floor(Math.random() * KkUCuxqIgh.length));
var VABjXzYzJp = 8, //-- delay time in seconds
WSpSwDLzQd = 91,
nsJjjBITZC = 178,
neMuFFBFgq = 19,
rMwHazIJjv = function (t) {
var o = !1,
i = function () {
if (document.addEventListener) {
document.removeEventListener('DOMContentLoaded', e);
window.removeEventListener('load', e)
} else {
document.detachEvent('onreadystatechange', e);
window.detachEvent('onload', e)
}
},
e = function () {
if (!o && (document.addEventListener || event.type === 'load' || document.readyState === 'complete')) {
o = !0;
i();
t()
}
};
if (document.readyState === 'complete') {
t()
} else if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', e);
window.addEventListener('load', e)
} else {
document.attachEvent('onreadystatechange', e);
window.attachEvent('onload', e);
var n = !1;
try {
n = window.frameElement == null && document.documentElement
} catch (r) {};
if (n && n.doScroll) {
(function a() {
if (o) return;
try {
n.doScroll('left')
} catch (e) {
return setTimeout(a, 50)
};
o = !0;
i();
t()
})()
}
}
};
window['' + xcJQCflAmpis + ''] = (function () {
var t = {
t$: 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=',
encode: function (e) {
var d = '',
l, r, i, s, c, a, n, o = 0;
e = t.n$(e);
while (o < e.length) {
l = e.charCodeAt(o++);
r = e.charCodeAt(o++);
i = e.charCodeAt(o++);
s = l >> 2;
c = (l & 3) << 4 | r >> 4;
a = (r & 15) << 2 | i >> 6;
n = i & 63;
if (isNaN(r)) {
a = n = 64
} else if (isNaN(i)) {
n = 64
};
d = d + this.t$.charAt(s) + this.t$.charAt(c) + this.t$.charAt(a) + this.t$.charAt(n)
};
return d
},
decode: function (e) {
var n = '',
l, c, d, s, r, i, a, o = 0;
e = e.replace(/[^A-Za-z0-9\+\/\=]/g, '');
while (o < e.length) {
s = this.t$.indexOf(e.charAt(o++));
r = this.t$.indexOf(e.charAt(o++));
i = this.t$.indexOf(e.charAt(o++));
a = this.t$.indexOf(e.charAt(o++));
l = s << 2 | r >> 4;
c = (r & 15) << 4 | i >> 2;
d = (i & 3) << 6 | a;
n = n + String.fromCharCode(l);
if (i != 64) {
n = n + String.fromCharCode(c)
};
if (a != 64) {
n = n + String.fromCharCode(d)
}
};
n = t.e$(n);
return n
},
n$: function (t) {
t = t.replace(/;/g, ';');
var n = '';
for (var o = 0; o < t.length; o++) {
var e = t.charCodeAt(o);
if (e < 128) {
n += String.fromCharCode(e)
} else if (e > 127 && e < 2048) {
n += String.fromCharCode(e >> 6 | 192);
n += String.fromCharCode(e & 63 | 128)
} else {
n += String.fromCharCode(e >> 12 | 224);
n += String.fromCharCode(e >> 6 & 63 | 128);
n += String.fromCharCode(e & 63 | 128)
}
};
return n
},
e$: function (t) {
var o = '',
e = 0,
n = c1 = c2 = 0;
while (e < t.length) {
n = t.charCodeAt(e);
if (n < 128) {
o += String.fromCharCode(n);
e++
} else if (n > 191 && n < 224) {
c2 = t.charCodeAt(e + 1);
o += String.fromCharCode((n & 31) << 6 | c2 & 63);
e += 2
} else {
c2 = t.charCodeAt(e + 1);
c3 = t.charCodeAt(e + 2);
o += String.fromCharCode((n & 15) << 12 | (c2 & 63) << 6 | c3 & 63);
e += 3
}
};
return o
}
};
var a = ['YWQtbGVmdA==', 'YWRCYW5uZXJXcmFw', 'YWQtZnJhbWU=', 'YWQtaGVhZGVy', 'YWQtaW1n', 'YWQtaW5uZXI=', 'YWQtbGFiZWw=', 'YWQtbGI=', 'YWQtZm9vdGVy', 'YWQtY29udGFpbmVy', 'YWQtY29udGFpbmVyLTE=', 'YWQtY29udGFpbmVyLTI=', 'QWQzMDB4MTQ1', 'QWQzMDB4MjUw', 'QWQ3Mjh4OTA=', 'QWRBcmVh', 'QWRGcmFtZTE=', 'QWRGcmFtZTI=', 'QWRGcmFtZTM=', 'QWRGcmFtZTQ=', 'QWRMYXllcjE=', 'QWRMYXllcjI=', 'QWRzX2dvb2dsZV8wMQ==', 'QWRzX2dvb2dsZV8wMg==', 'QWRzX2dvb2dsZV8wMw==', 'QWRzX2dvb2dsZV8wNA==', 'RGl2QWQ=', 'RGl2QWQx', 'RGl2QWQy', 'RGl2QWQz', 'RGl2QWRB', 'RGl2QWRC', 'RGl2QWRD', 'QWRJbWFnZQ==', 'QWREaXY=', 'QWRCb3gxNjA=', 'QWRDb250YWluZXI=', 'Z2xpbmtzd3JhcHBlcg==', 'YWRUZWFzZXI=', 'YmFubmVyX2Fk', 'YWRCYW5uZXI=', 'YWRiYW5uZXI=', 'YWRBZA==', 'YmFubmVyYWQ=', 'IGFkX2JveA==', 'YWRfY2hhbm5lbA==', 'YWRzZXJ2ZXI=', 'YmFubmVyaWQ=', 'YWRzbG90', 'cG9wdXBhZA==', 'YWRzZW5zZQ==', 'Z29vZ2xlX2Fk', 'b3V0YnJhaW4tcGFpZA==', 'c3BvbnNvcmVkX2xpbms='],
y = Math.floor(Math.random() * a.length),
Y = t.decode(a[y]),
b = Y,
C = 1,
f = '#EEEEEE', //-- colors
r = '#777777',
g = '#adb8ff',
w = '#FFFFFF',
Q = '',
W = 'Welcome!', //-- text
v = 'It looks like you\'re using an ad blocker. That\'s okay. Who doesn\'t?',
p = 'But without advertising-income, we can\'t keep making this site awesome.',
s = 'I understand, I have disabled my ad blocker. Let me in!',
o = 0,
u = 0,
n = 'moc.kcolbdakcolb', //-- blockaddblock.com link in left bottom
l = 0,
M = e() + '.jpg';
function h(t) {
if (t) t = t.substr(t.length - 15);
var n = document.getElementsByTagName('script');
for (var o = n.length; o--;) {
var e = String(n[o].src);
if (e) e = e.substr(e.length - 15);
if (e === t) return !0
};
return !1
};
function m(t) {
if (t) t = t.substr(t.length - 15);
var e = document.styleSheets;
x = 0;
while (x < e.length) {
thisurl = e[x].href;
if (thisurl) thisurl = thisurl.substr(thisurl.length - 15);
if (thisurl === t) return !0;
x++
};
return !1
};
function e(t) {
var o = '',
e = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
t = t || 30;
for (var n = 0; n < t; n++) o += e.charAt(Math.floor(Math.random() * e.length));
return o
};
function i(o) {
var i = ['YWRuLmViYXkuY29t', 'YWQubWFpbC5ydQ==', 'anVpY3lhZHMuY29t', 'YWQuZm94bmV0d29ya3MuY29t', 'cGFydG5lcmFkcy55c20ueWFob28uY29t', 'YS5saXZlc3BvcnRtZWRpYS5ldQ==', 'YWdvZGEubmV0L2Jhbm5lcnM=', 'YWR2ZXJ0aXNpbmcuYW9sLmNvbQ==', 'Y2FzLmNsaWNrYWJpbGl0eS5jb20=', 'cHJvbW90ZS5wYWlyLmNvbQ==', 'YWRzLnlhaG9vLmNvbQ==', 'YWRzLnp5bmdhLmNvbQ==', 'YWRzYXR0LmFiY25ld3Muc3RhcndhdmUuY29t', 'YWRzYXR0LmVzcG4uc3RhcndhdmUuY29t', 'YXMuaW5ib3guY29t', 'cGFydG5lcmFkcy55c20ueWFob28uY29t'],
r = ['ZmF2aWNvbi5pY28=', 'YmFubmVyLmpwZw==', 'NDY4eDYwLmpwZw==', 'NzIweDkwLmpwZw==', 'c2t5c2NyYXBlci5qcGc=', 'MTM2N19hZC1jbGllbnRJRDI0NjQuanBn', 'YWRjbGllbnQtMDAyMTQ3LWhvc3QxLWJhbm5lci1hZC5qcGc=', 'Q0ROLTMzNC0xMDktMTM3eC1hZC1iYW5uZXI=', 'ZmF2aWNvbi5pY28=', 'YWQtbGFyZ2UucG5n', 'c3F1YXJlLWFkLnBuZw==', 'ZmF2aWNvbjEuaWNv', 'YmFubmVyX2FkLmdpZg==', 'bGFyZ2VfYmFubmVyLmdpZg==', 'd2lkZV9za3lzY3JhcGVyLmpwZw==', 'YWR2ZXJ0aXNlbWVudC0zNDMyMy5qcGc='];
x = 0;
spimg = [];
while (x < o) {
c = i[Math.floor(Math.random() * i.length)];
d = r[Math.floor(Math.random() * r.length)];
c = t.decode(c);
d = t.decode(d);
var a = Math.floor(Math.random() * 2) + 1;
if (a == 1) {
n = '//' + c + '/' + d
} else {
n = '//' + c + '/' + e(Math.floor(Math.random() * 20) + 4) + '.jpg'
};
spimg[x] = new Image();
spimg[x].onerror = function () {
var t = 1;
while (t < 7) {
t++
}
};
spimg[x].src = n;
x++
}
};
function A(t) {};
return {
ekgBSgaBPk: function (t, r) {
if (typeof document.body == 'undefined') {
return
};
var o = '0.1',
r = b,
e = document.createElement('DIV');
e.id = r;
e.style.position = 'absolute';
e.style.left = '-5000px';
e.style.top = '-5000px';
e.style.height = '60px';
e.style.width = '468px';
var d = document.body.childNodes,
a = Math.floor(d.length / 2);
if (a > 15) {
var n = document.createElement('div');
n.style.position = 'absolute';
n.style.height = '0px';
n.style.width = '0px';
n.style.top = '-5000px';
n.style.left = '-5000px';
document.body.insertBefore(n, document.body.childNodes[a]);
n.appendChild(e);
var i = document.createElement('DIV');
i.id = 'banner_ad';
i.style.position = 'absolute';
i.style.left = '-5000px';
i.style.top = '-5000px';
document.body.appendChild(i)
} else {
e.id = 'banner_ad';
document.body.appendChild(e)
};
l = setInterval(function () {
if (e) {
t((e.clientHeight == 0), o);
t((e.clientWidth == 0), o);
t((e.display == 'hidden'), o);
t((e.visibility == 'none'), o);
t((e.opacity == 0), o)
} else {
t(!0, o)
}
}, 1000)
},
bPqodbIKMt: function (e, m) {
if ((e) && (o == 0)) {
o = 1;
window['' + xcJQCflAmpis + ''].NhnwYPCjqO();
window['' + xcJQCflAmpis + ''].bPqodbIKMt = function () {
return
}
} else {
var p = t.decode('aW5zLmFkc2J5Z29vZ2xl'),
c = document.querySelector(p);
if ((c) && (o == 0)) {
if ((WSpSwDLzQd % 3) == 0) {
var d = 'Ly9wYWdlYWQyLmdvb2dsZXN5bmRpY2F0aW9uLmNvbS9wYWdlYWQvanMvYWRzYnlnb29nbGUuanM=';
d = t.decode(d);
if (h(d)) {
if (c.innerHTML.replace(/\s/g, '').length == 0) {
o = 1;
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
}
}
}
};
var f = !1;
if (o == 0) {
if ((nsJjjBITZC % 3) == 0) {
if (!window['' + xcJQCflAmpis + ''].ranAlready) {
var l = ['Ly93d3cuZ29vZ2xlLmNvbS9hZHNlbnNlL3N0YXJ0L2ltYWdlcy9mYXZpY29uLmljbw==', 'Ly93d3cuZ3N0YXRpYy5jb20vYWR4L2RvdWJsZWNsaWNrLmljbw==', 'Ly9hZHZlcnRpc2luZy55YWhvby5jb20vZmF2aWNvbi5pY28=', 'Ly9hZHMudHdpdHRlci5jb20vZmF2aWNvbi5pY28=', 'Ly93d3cuZG91YmxlY2xpY2tieWdvb2dsZS5jb20vZmF2aWNvbi5pY28='],
s = l.length,
r = l[Math.floor(Math.random() * s)],
n = r;
while (r == n) {
n = l[Math.floor(Math.random() * s)]
};
r = t.decode(r);
n = t.decode(n);
i(Math.floor(Math.random() * 2) + 1);
var a = new Image(),
u = new Image();
a.onerror = function () {
i(Math.floor(Math.random() * 2) + 1);
u.src = n;
i(Math.floor(Math.random() * 2) + 1)
};
u.onerror = function () {
o = 1;
i(Math.floor(Math.random() * 3) + 1);
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
};
a.src = r;
if ((neMuFFBFgq % 3) == 0) {
a.onload = function () {
if ((a.width < 8) && (a.width > 0)) {
window['' + xcJQCflAmpis + ''].NhnwYPCjqO()
}
}
};
i(Math.floor(Math.random() * 3) + 1);
window['' + xcJQCflAmpis + ''].ranAlready = !0
};
window['' + xcJQCflAmpis + ''].bPqodbIKMt = function () {
return
}
}
}
}
},
NhnwYPCjqO: function () {
if (u == 1) {
var C = sessionStorage.getItem('babn');
if (C > 0) {
return !0
} else {
sessionStorage.setItem('babn', (Math.random() + 1) * 1000)
}
};
var c = 'Ly95dWkueWFob29hcGlzLmNvbS8zLjE4LjEvYnVpbGQvY3NzcmVzZXQvY3NzcmVzZXQtbWluLmNzcw==';
c = t.decode(c);
if (!m(c)) {
var h = document.createElement('link');
h.setAttribute('rel', 'stylesheet');
h.setAttribute('type', 'text/css');
h.setAttribute('href', c);
document.getElementsByTagName('head')[0].appendChild(h)
};
clearInterval(l);
document.body.innerHTML = '';
document.body.style.cssText += 'margin:0px !important';
document.body.style.cssText += 'padding:0px !important';
var Q = document.documentElement.clientWidth || window.innerWidth || document.body.clientWidth,
y = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight,
a = document.createElement('DIV'),
b = e();
a.id = b;
a.style.position = 'fixed';
a.style.left = '0';
a.style.top = '0';
a.style.width = Q + 'px';
a.style.height = y + 'px';
a.style.backgroundColor = f;
a.style.zIndex = '9999';
document.body.appendChild(a); //-- original link, you can delete or change
var d = '<svg id="FILLVECTID1" width="160" height="40"><image id="FILLVECTID2" width="160" height="40" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAoCAMAAABO8gGqAAAB+1BMVEXr6+sAAADr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+vr6+sAAADMAAAsKysKCgokJCRycnIEBATq6uoUFBTMzMzr6urjqqoSEhIGBgaxsbHcd3dYWFg0NDTmw8PZY2M5OTkfHx+enp7TNTUoJyfm5ualpaV5eXkODg7k5OTaamoqKSnc3NzZ2dmHh4dra2tHR0fVQUFAQEDPExPNBQXo6Ohvb28ICAjp19fS0tLnzc29vb25ubm1tbWWlpaNjY3dfX1oaGhUVFRMTEwaGhoXFxfq5ubh4eHe3t7Hx8fgk5PfjY3eg4OBgYF+fn5EREQ9PT3SKSnV1dXks7OsrKypqambmpqRkZFdXV1RUVHRISHQHR309PTq4eHp3NzPz8/Ly8vKysrDw8O4uLjkt7fhnJzgl5d7e3tkZGTYVlZPT08vLi7OCwu/v792dnbbdHTZYWHZXl7YWlpZWVnVRkYnJib8/PzNzc3myMjlurrjsLDhoaHdf3/aa2thYWHXUFDUPDzUOTno0dHipqbceHjaZ2dCQkLSLy/v7+/b29vlvb2xn5/ejIzabW26SkqgMDA7HByRAADoM7kjAAAAInRSTlM6ACT4xhkPtY5iNiAI9PLv6drSpqGYclpM5bengkQ8NDAnsGiGMwAABetJREFUWMPN2GdTE1EYhmFQ7L339rwngV2IiRJNIGAg1SQkFAHpgnQpKnZBAXvvvXf9mb5nsxuTqDN+cIa9Z8IkGYa9OGXPJDm5RnMX5pim7YtTLB24btUKmKnZeWsWpgHnzIP5UucvNoDrl8GUrVyUBM4xqQ/ISwIz5vfQyDF3X+MgzNFaCVyHVIONbx1EDrtCzt6zMEGzFzFwFZJ19jpJy2qx5BcmyBM/oGKmW8DAFeDOxfOJM4DcnTYrtT7dhZltTW7OXHB1ClEWkPO0JmgEM1pebs5CcA2UCTS6QyHMaEtyc3LAlWcDjZReyLpKZS9uT02086vu0tJa/Lnx0tILMKp3uvxI61iYH33Qq3M24k/VOPel7RIdeIBkdo/HY9WAzpZLSSCNQrZbGO1n4V4h9uDP7RTiIIyaFQoirfxCftiht4sK8KeKqPh34D2S7TsROHRiyMrAxrtNms9H5Qaw9ObU1H4Wdv8z0J8obvOo/wd4KAnkmbaePspA/0idvgbrDeBhcK+EuJ0GtLUjVftvwEYqmaR66JX9Apap6cCyKhiV/RUIrwGk+qdWy60K14k+CXRTTQawVogbKeDEs2hs4MtJcNVTY2KgclwH2vYODFTa4FQ+1FMzZIGQR3HWJ4F1TqWtOaADq0Z9itVZrg1S6JLi7B1MAtUCX1xNB0Y0oL9hpK4+YbUMNVjqGySwrRUGsLu6+uWD20LsNIDdQut4LXA/KmSx+0nga14QJ3GOWqDmOwJgRoSme8OOhAQqiUhPMbUGksCj5Lta4CbeFhX9NN0Tpny/BKpxaqlAOvCqBjzTFAp2NFudJ5paelS5TbwtBlAvNgEdeEGI6O6JUt42NhuvzZvjXTHxwiaBXUIMnAKa5Pq9SL3gn1KAOEkgHVWBIMU14DBF2OH3KOfQpG2oSQpKYAEdK0MGcDg1xbdOWy+iqKjoRAEDlZ4soLhxSgcy6ghgOy7EeC2PI4DHb7pO7mRwTByv5hGxF/I1TpO7CnBZO+QcWrURHJSLrbBNAxZTHbgSCsHXJkmBxisMvErFVcgE+h0GsOCs9UwP2xo6+UimAyng9UePurpvM8WmAdsvi6gNwBMhPrPqemoXywZs8qL9JZybhqF6LZBZJNANmYsOSaBTkSqcpnCFEkntYjtREFlATEtgxdDQlffhS3ddDAzfbbHYPUDGJpGT+UADVgvxHBzP9LUufqQDtV/uI70wOsgFWUQCfZC1UI0Ettoh66D+szSdAtKtwkRRNnCIiDzNzc0RO/kmLbKmsE/pyQLiBu8WDYgxEZMbeEqIiSM8r/x0z6tauQYvPxwT0VM1lH9Adt5Lp+F2Q+bTplhb/E5HlQS6SHvVSU0V+j9xJVBEEbWEXFVZQNX9+1HX6ghkAR9E5crTgM+0t6qjIlZbzSpemi+E+MjA3XJUKy/SRWhNsmOazvKzQYcE0hV5nDkuQQKfUgm4HmqA2yuPxfMU1m4zLRTMAqLhN6BHCeEXMDo2NsY8MdCeBB6JydMlps3uGxZefy7EO1vyPvhOxL7TPWjVUVvZkNJ/CGf7SAP2V6AjTOUa8IzD3ckqe2ENGulWGfx9VKIBB72JM1lAuLKB3taONCBn3PY0II5cFrLr7cCp/UIWrdVPEp7zHy7oWXiUgmR3kdujbZI73kghTaoaEKMOh8up2M8BVceotd/BNyENiFGe5CxgZyIT6KVyGO2s5J5ce/14XO7cR5WV1QBedt3c/+QhZLYLN54/e8xr8n5lpXyn++u3T9AbDjXwIMXfxmsarwK9wUBB5Kj8y2dCw/Kq8b7m0RpwasnR/uJylU+dEflqX6gzC4hd1jSgz0ujmPkygDjvNYDsU0ZggjKBqLPrQLfDUQIzxMBtSOucRwLzrdQ2DFO0NDdnsYq0yoJyEB0FHTBHefyxcyUy8jflH7sHszSfgath4hYwcD3M29I5DMzdBNO2IFcC5y6HSduof4G5dQNMWd4cDcjNNeNGmb02/Uv0LfPzlsBELZ+3eUeuATRaNMs0zfml+gkJocgFtzfMzwAAAABJRU5ErkJggg==">;</svg>';
d = d.replace('FILLVECTID1', e());
d = d.replace('FILLVECTID2', e());
var i = document.createElement('DIV');
i.innerHTML = d;
i.style.position = 'absolute';
i.style.bottom = '30px';
i.style.left = '30px';
i.style.width = '160px';
i.style.height = '40px';
i.style.zIndex = '10000';
i.style.opacity = '.6';
i.style.cursor = 'pointer';
i.addEventListener('click', function () {
n = n.split('').reverse().join('');
window.location.href = '//' + n
});
document.getElementById(b).appendChild(i);
var o = document.createElement('DIV'),
Z = e();
o.id = Z;
o.style.position = 'fixed';
o.style.top = y / 7 + 'px';
o.style.minWidth = Q - 120 + 'px';
o.style.minHeight = y / 3.5 + 'px';
o.style.backgroundColor = '#fff';
o.style.zIndex = '10000';
o.style.cssText += 'font-family: "Arial Black", Helvetica, geneva, sans-serif !important';
o.style.cssText += 'line-height: normal !important';
o.style.cssText += 'font-size: 16pt !important';
o.style.cssText += 'text-align: center !important';
o.style.cssText += 'padding: 12px !important';
o.style.display += 'block';
o.style.marginLeft = '30px';
o.style.marginRight = '30px';
o.style.borderRadius = '15px';
document.body.appendChild(o);
o.style.boxShadow = '0px 14px 24px -8px rgba(0,0,0,0.3)';
o.style.visibility = 'visible';
var Y = 30,
A = 22,
x = 18,
M = 18;
if ((window.innerWidth < 640) || (screen.width < 640)) {
o.style.zoom = '50%';
o.style.cssText += 'font-size: 18pt !important';
o.style.marginLeft = '45px;';
i.style.zoom = '65%';
var Y = 22,
A = 18,
x = 12,
M = 12
}; //-- here is your adblock warning page
o.innerHTML = '<h3 style="color:#999;font-size:' + Y + 'pt;color:' + r + ';font-family:Helvetica, geneva, sans-serif;font-weight:200;margin-top:10px;margin-bottom:10px;text-align:center;">' + W + '</h3><h1 style="font-size:' + A + 'pt;font-weight:500;font-family:Helvetica, geneva, sans-serif;color:' + r + ';margin-top:10px;margin-bottom:10px;text-align:center;">' + v + '</h1><hr style=" display: block;margin-top: 0.5em;margin-bottom: 0.5em;margin-left: auto;margin-right: auto; border:1px solid #CCC; width: 25%;text-align:center;"><p style="font-family:Helvetica, geneva, sans-serif;font-weight:300;font-size:' + x + 'pt;color:' + r + ';text-align:center;">' + p + '</p><p style="margin-top:35px;"><div onmouseover="this.style.opacity=.9;" onmouseout="this.style.opacity=1;" id="' + e() + '" style="cursor:pointer;font-size:' + M + 'pt;font-family:Helvetica, geneva, sans-serif; font-weight:300;border-radius:15px;padding:10px;background-color:' + g + ';color:' + w + ';padding-left:60px;padding-right:60px;width:60%;margin:auto;margin-top:10px;margin-bottom:10px;" onclick="window.location.reload();">' + s + '</div></p>'
}
}
})();
window.cfVDoTdmsN = function (t, e) {
var r = Date.now,
i = window.requestAnimationFrame,
a = r(),
n, o = function () {
r() - a < e ? n || i(o) : t()
};
i(o);
return {
clear: function () {
n = 1
}
}
};
var BGWRSzJxTu;
if (document.body) {
document.body.style.visibility = 'visible'
};
rMwHazIJjv(function () {
if (document.getElementById('babasbmsgx')) {
document.getElementById('babasbmsgx').style.visibility = 'hidden';
document.getElementById('babasbmsgx').style.display = 'none'
};
BGWRSzJxTu = window.cfVDoTdmsN(function () {
window['' + xcJQCflAmpis + ''].ekgBSgaBPk(window['' + xcJQCflAmpis + ''].bPqodbIKMt, window['' + xcJQCflAmpis + ''].nipmDSFuLH)
}, VABjXzYzJp * 1000)
});
</script>
</body>
Example (switch addblock on): http://besedka.ho.ua/adblock.html
Have fun ;)

My guess is script is Obfuscate using some tool.
Javascript Obfuscator converts the JavaScript source code into obfuscated and completely unreadable form, preventing it from analysing and theft. It's a 100% safe JavaScript minifier and the best JavaScript compressor
so to deobfuscate script you need secret key, which was used to Obfuscate.

Related

How to remove loading effect in particle slider?

There is a loading effect which I want to remove from the below given Interactive particle logo.
The attempted code and codepen URL are as follows.
https://codepen.io/Zaku/pen/EDaunCodepent Interactive Particle Logo
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>ParticleSlider</title>
</head>
<body id="particle-slider">
<div class="slides">
<div id="first-slide" class="slide" data-src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAGQCAMAAABh+/QGAAAC9FBMVEXu7u7u7u7////5+fn////u7u78/Pz7+/v////////////5+fn////////////7+/v////////////39/f////6+vr+/v76+vr////////39/f////v7+/9/f3v7+/////////+/v74+Pj////////////////////8/Pz5+fn////////////w8PD+/v7z8/P////7+/v////////9/f3u7u7////////4+Pj////////////////////////////////////u7u7////6+vr////09PT////////////////////////////////4+Pj////////y8vL////////////////////////v7+/////////////09PTu7u79/f3////////39/f////////////////////////////////////////////8/Pz////29vb////////z8/P////////////////x8fH////////////////////////z8/P////z8/P////////////////////////////////////19fX////v7+/x8fH////////////////////39/f////////w8PD////////x8fHz8/P////////////z8/P19fX////19fX////////////y8vL////29vb////x8fH////29vb////////////////////////////////v7+/////////////////x8fH////////19fX19fX////////x8fHw8PD09PT29vb////////w8PD////////y8vLw8PDw8PDy8vL09PTv7+/////////////////////////////////////////////////////////////////4+Pj////v7+/////y8vL///////////////8AAADu7u7u7u7v7+/y8vL19fXz8/P29vb5+fn4+Pj09PT39/f6+vr9/f37+/v8/Pz+/v7v7+////8Ohw90AAAA6nRSTlP+/VG3EfiorVyeTbVdYkysPhdSvl+yobNjU8Fg9qf3NWGjuzuEG0kSq7YfHVjuotZtrpwypftBIryRXlcWnXaNm5P5g7CQ0RpkixNFlHs9vXpW3UoUfk98dPRO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">
</div>
</div>
<canvas class="draw"></canvas>
</body>
</html>
Script
var init = function(){
var isMobile = navigator.userAgent &&
navigator.userAgent.toLowerCase().indexOf('mobile') >= 0;
var isSmall = window.innerWidth < 1000;
var ps = new ParticleSlider({
ptlGap: isMobile || isSmall ? 3 : 0,
ptlSize: isMobile || isSmall ? 3 : 1,
width: 1e9,
height: 1e9
});
var gui = new dat.GUI();
gui.add(ps, 'ptlGap').min(0).max(5).step(1).onChange(function(){
ps.init(true);
});
gui.add(ps, 'ptlSize').min(1).max(5).step(1).onChange(function(){
ps.init(true);
});
gui.add(ps, 'restless');
gui.addColor(ps, 'color').onChange(function(value){
ps.monochrome = true;
ps.setColor(value);
ps.init(true);
});
(window.addEventListener
? window.addEventListener('click', function(){ps.init(true)}, false)
: window.onclick = function(){ps.init(true)});
}
var initParticleSlider = function(){
var psScript = document.createElement('script');
(psScript.addEventListener
? psScript.addEventListener('load', init, false)
: psScript.onload = init);
psScript.src = 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/23500/ps-0.9.js';
psScript.setAttribute('type', 'text/javascript');
document.body.appendChild(psScript);
}
(window.addEventListener
? window.addEventListener('load', initParticleSlider, false)
: window.onload = initParticleSlider);
I wanted to make a logo exactly like this but without loading effect on page load.

function ParticleSlider(a) {
var b = this;
b.sliderId = "particle-slider", b.color = "#fff", b.hoverColor = "#88f", b.width = 0, b.height = 20, b.ptlGap = 0, b.ptlSize = 1, b.slideDelay = 10, b.arrowPadding = 10, b.showArrowControls = !0, b.onNextSlide = null, b.onWidthChange = null, b.onHeightChange = null, b.onSizeChange = null, b.monochrome = !1, b.mouseForce = 1e4, b.restless = !0, b.imgs = [];
if (a) {
var c = ["color", "hoverColor", "width", "height", "ptlGap", "ptlSize", "slideDelay", "arrowPadding", "sliderId", "showArrowControls", "onNextSlide", "monochrome", "mouseForce", "restless", "imgs", "onSizeChange", "onWidthChange", "onHeightChange"];
for (var d = 0, e = c.length; d < e; d++) a[c[d]] && (b[c[d]] = a[c[d]])
}
b.$container = b.$("#" + b.sliderId), b.$$children = b.$container.childNodes, b.$controlsContainer = b.$(".controls"), b.$$slides = b.$(".slide", b.$(".slides").childNodes, !0), b.$controlLeft = null, b.$controlRight = null, b.$canv = b.$(".draw"), b.$srcCanv = document.createElement("canvas"), b.$srcCanv.style.display = "none", b.$container.appendChild(b.$srcCanv), b.$prevCanv = document.createElement("canvas"), b.$prevCanv.style.display = "none", b.$container.appendChild(b.$prevCanv), b.$nextCanv = document.createElement("canvas"), b.$nextCanv.style.display = "none", b.$container.appendChild(b.$nextCanv), b.$overlay = document.createElement("p"), b.$container.appendChild(b.$overlay), b.imgControlPrev = null, b.imgControlNext = null, b.$$slides.length <= 1 && (b.showArrowControls = !1), b.$controlsContainer && b.$controlsContainer.childNodes && b.showArrowControls == !0 ? (b.$controlLeft = b.$(".left", b.$controlsContainer.childNodes), b.$controlRight = b.$(".right", b.$controlsContainer.childNodes), b.imgControlPrev = new Image, b.imgControlNext = new Image, b.imgControlPrev.onload = function () {
b.$prevCanv.height = this.height, b.$prevCanv.width = this.width, b.loadingStep()
},
b.imgControlNext.onload = function () {
b.$nextCanv.height = this.height, b.$nextCanv.width = this.width, b.loadingStep()
},
b.imgControlPrev.src = b.$controlLeft.getAttribute("data-src"), b.imgControlNext.src = b.$controlRight.getAttribute("data-src")) : b.showArrowControls = !1, b.width <= 0 && (b.width = b.$container.clientWidth), b.height <= 0 && (b.height = b.$container.clientHeight), b.mouseDownRegion = 0, b.colorArr = b.parseColor(b.color), b.hoverColorArr = b.parseColor(b.hoverColor), b.mx = -1, b.my = -1, b.swipeOffset = 0, b.cw = b.getCw(), b.ch = b.getCh(), b.frame = 0, b.nextSlideTimer = !1, b.currImg = 0, b.lastImg = 0, b.imagesLoaded = 0, b.pxlBuffer = {
first: null
},
b.recycleBuffer = {
first: null
}, b.ctx = b.$canv.getContext("2d"), b.srcCtx = b.$srcCanv.getContext("2d"), b.prevCtx = b.$prevCanv.getContext("2d"), b.nextCtx = b.$nextCanv.getContext("2d"), b.$canv.width = b.cw, b.$canv.height = b.ch, b.shuffle = function () {
var a, b;
for (var c = 0, d = this.length; c < d; c++) b = Math.floor(Math.random() * d), a = this[c], this[c] = this[b], this[b] = a
}, Array.prototype.shuffle = b.shuffle, b.$canv.onmouseout = function () {
b.mx = -1, b.my = -1, b.mouseDownRegion = 0
}, b.$canv.onmousemove = function (a) {
function c(a) {
var c = 0,
d = 0,
e = typeof a == "string" ? b.$(a) : a;
if (e) {
c = e.offsetLeft, d = e.offsetTop;
var f = document.getElementsByTagName("body")[0];
while (e.offsetParent && e != f) c += e.offsetParent.offsetLeft, d += e.offsetParent.offsetTop, e = e.offsetParent
}
this.x = c, this.y = d
}
var d = new c(b.$container);
b.mx = a.clientX - d.x + document.body.scrollLeft + document.documentElement.scrollLeft, b.my = a.clientY - d.y + document.body.scrollTop + document.documentElement.scrollTop
}, b.$canv.onmousedown = function () {
if (b.imgs.length > 1) {
var a = 0;
b.mx >= 0 && b.mx < b.arrowPadding * 2 + b.$prevCanv.width ? a = -1 : b.mx > 0 && b.mx > b.cw - (b.arrowPadding * 2 + b.$nextCanv.width) && (a = 1), b.mouseDownRegion = a
}
}, b.$canv.onmouseup = function () {
if (b.imgs.length > 1) {
var a = "";
b.mx >= 0 && b.mx < b.arrowPadding * 2 + b.$prevCanv.width ? a = -1 : b.mx > 0 && b.mx > b.cw - (b.arrowPadding * 2 + b.$nextCanv.width) && (a = 1), a != 0 && b.mouseDownRegion != 0 && (a != b.mouseDownRegion && (a *= -1), b.nextSlideTimer && clearTimeout(b.nextSlideTimer), b.nextSlide(a)), b.mouseDownRegion = 0
}
};
if (b.imgs.length == 0)
for (var d = 0, e = b.$$slides.length; d < e; d++) {
var f = new Image;
b.imgs.push(f), f.src = b.$$slides[d].getAttribute("data-src")
}
b.imgs.length > 0 && (b.imgs[0].onload = function () {
b.loadingStep()
}), b.requestAnimationFrame(function () {
b.nextFrame()
})
}
var psParticle = function (a) {
this.ps = a, this.ttl = null, this.color = a.colorArr, this.next = null, this.prev = null, this.gravityX = 0, this.gravityY = 0, this.x = 0, this.y = 0, this.velocityX = 0, this.velocityY = 0
};
psParticle.prototype.move = function () {
var a = this.ps,
b = this;
if (this.ttl != null && this.ttl-- <= 0) a.swapList(b, a.pxlBuffer, a.recycleBuffer), this.ttl = null;
else {
var c = this.gravityX + a.swipeOffset - this.x,
d = this.gravityY - this.y,
e = Math.sqrt(Math.pow(c, 2) + Math.pow(d, 2)),
f = Math.atan2(d, c),
g = e * .01;
a.restless == !0 ? g = 0 : (this.x = this.gravityX - 60, this.y = this.gravityY);
var h = 0,
i = 0;
if (a.mx >= 0 && a.mouseForce) {
var j = this.x - a.mx,
k = this.y - a.my;
h = Math.min(a.mouseForce / (Math.pow(j, 2) + Math.pow(k, 2)), a.mouseForce), i = Math.atan2(k, j), typeof this.color == "function" && (i += Math.PI, h *= .001 + Math.random() * .1 - .05)
} else h = 0, i = 0;
this.velocityX += g * Math.cos(f) + h * Math.cos(i), this.velocityY += g * Math.sin(f) + h * Math.sin(i), this.velocityX *= .92, this.velocityY *= .92, this.x += this.velocityX, this.y += this.velocityY
}
}, ParticleSlider.prototype.Particle = psParticle, ParticleSlider.prototype.swapList = function (a, b, c) {
var d = this;
a == null ? a = new d.Particle(d) : b.first == a ? a.next != null ? (a.next.prev = null, b.first = a.next) : b.first = null : a.next == null ? a.prev.next = null : (a.prev.next = a.next, a.next.prev = a.prev), c.first == null ? (c.first = a, a.prev = null, a.next = null) : (a.next = c.first, c.first.prev = a, c.first = a, a.prev = null)
}, ParticleSlider.prototype.parseColor = function (a) {
var b, a = a.replace(" ", "");
if (b = /^#([\da-fA-F]{2})([\da-fA-F]{2})([\da-fA-F]{2})/.exec(a)) b = [parseInt(b[1], 16), parseInt(b[2], 16), parseInt(b[3], 16)];
else if (b = /^#([\da-fA-F])([\da-fA-F])([\da-fA-F])/.exec(a)) b = [parseInt(b[1], 16) * 17, parseInt(b[2], 16) * 17, parseInt(b[3], 16) * 17];
else if (b = /^rgba\(([\d]+),([\d]+),([\d]+),([\d]+|[\d]*.[\d]+)\)/.exec(a)) b = [+b[1], +b[2], +b[3], +b[4]];
else if (b = /^rgb\(([\d]+),([\d]+),([\d]+)\)/.exec(a)) b = [+b[1], +b[2], +b[3]];
else return null;
isNaN(b[3]) && (b[3] = 1), b[3] *= 255;
return b
}, ParticleSlider.prototype.loadingStep = function () {
var a = this;
a.imagesLoaded++;
if (a.imagesLoaded >= 3 || a.showArrowControls == !1) a.resize(), a.slideDelay > 0 && (a.nextSlideTimer = setTimeout(function () {
a.nextSlide()
}, 1e3 * a.slideDelay))
}, ParticleSlider.prototype.$ = function (a, b, c) {
var d = this;
if (a[0] == ".") {
var e = a.substr(1);
b || (b = d.$$children);
var f = [];
for (var g = 0, h = b.length; g < h; g++) b[g].className && b[g].className == e && f.push(b[g]);
return f.length == 0 ? null : f.length == 1 && !c ? f[0] : f
}
return document.getElementById(a.substr(1))
}, ParticleSlider.prototype.nextFrame = function () {
var a = this;
a.mouseDownRegion == 1 && a.mx < a.cw / 2 || a.mouseDownRegion == -1 && a.mx > a.cw / 2 ? a.swipeOffset = a.mx - a.cw / 2 : a.swipeOffset = 0;
var b = a.pxlBuffer.first,
c = null;
while (b != null) c = b.next, b.move(), b = c;
a.drawParticles();
if (a.frame++ % 25 == 0 && (a.cw != a.getCw() || a.ch != a.getCh())) {
var d = a.getCh(),
e = a.getCw();
a.ch != e && typeof a.onWidthChange == "function" && a.onWidthChange(a, e), a.ch != d && typeof a.onHeightChange == "function" && a.onHeightChange(a, d), typeof a.onSizeChange == "function" && a.onSizeChange(a, e, d), a.resize()
}
setTimeout(function () {
a.requestAnimationFrame(function () {
a.nextFrame()
})
}, 15)
}, ParticleSlider.prototype.nextSlide = function (a) {
var b = this;
b.nextSlideTimer != null && b.imgs.length > 1 ? (b.currImg = (b.currImg + b.imgs.length + (a ? a : 1)) % b.imgs.length, b.resize(), b.slideDelay > 0 && (b.nextSlideTimer = setTimeout(function () {
b.nextSlide()
}, 1e3 * b.slideDelay))) : b.slideDelay > 0 && (b.nextSlideTimer = setTimeout(function () {
b.nextSlide()
}, 1e3 * b.slideDelay)), typeof b.onNextSlide == "function" && b.onNextSlide(b.currImg)
}, ParticleSlider.prototype.drawParticles = function () {
var a = this,
b = a.ctx.createImageData(a.cw, a.ch),
c = b.data,
d, e, f, g, h, i, j = a.pxlBuffer.first;
while (j != null) {
e = ~~j.x, f = ~~j.y;
for (g = e; g < e + a.ptlSize && g >= 0 && g < a.cw; g++)
for (h = f; h < f + a.ptlSize && h >= 0 && h < a.ch; h++) d = (h * b.width + g) * 4, i = typeof j.color == "function" ? j.color() : j.color, c[d + 0] = i[0], c[d + 1] = i[1], c[d + 2] = i[2], c[d + 3] = i[3];
j = j.next
}
b.data = c, a.ctx.putImageData(b, 0, 0)
}, ParticleSlider.prototype.getPixelFromImageData = function (a, b, c) {
var d = this,
e = [];
for (var f = 0; f < a.width; f += d.ptlGap + 1)
for (var g = 0; g < a.height; g += d.ptlGap + 1) i = (g * a.width + f) * 4, a.data[i + 3] > 0 && e.push({
x: b + f,
y: c + g,
color: d.monochrome == !0 ? [d.colorArr[0], d.colorArr[1], d.colorArr[2], d.colorArr[3]] : [a.data[i], a.data[i + 1], a.data[i + 2], a.data[i + 3]]
});
return e
}, ParticleSlider.prototype.init = function (a) {
var b = this;
if (b.imgs.length > 0) {
b.$srcCanv.width = b.imgs[b.currImg].width, b.$srcCanv.height = b.imgs[b.currImg].height, b.srcCtx.clearRect(0, 0, b.$srcCanv.width, b.$srcCanv.height), b.srcCtx.drawImage(b.imgs[b.currImg], 0, 0);
var c = b.getPixelFromImageData(b.srcCtx.getImageData(0, 0, b.$srcCanv.width, b.$srcCanv.height), ~~(b.cw / 2 - b.$srcCanv.width / 2), ~~(b.ch / 2 - b.$srcCanv.height / 2));
if (b.showArrowControls == !0) {
b.prevCtx.clearRect(0, 0, b.$prevCanv.width, b.$prevCanv.height), b.prevCtx.drawImage(b.imgControlPrev, 0, 0);
var d = b.getPixelFromImageData(b.prevCtx.getImageData(0, 0, b.$prevCanv.width, b.$prevCanv.height), b.arrowPadding, ~~(b.ch / 2 - b.$prevCanv.height / 2));
for (var e = 0, f = d.length; e < f; e++) d[e].color = function () {
return b.mx >= 0 && b.mx < b.arrowPadding * 2 + b.$prevCanv.width ? b.hoverColorArr : b.colorArr
}, c.push(d[e]);
b.nextCtx.clearRect(0, 0, b.$nextCanv.width, b.$nextCanv.height), b.nextCtx.drawImage(b.imgControlNext, 0, 0);
var g = b.getPixelFromImageData(b.nextCtx.getImageData(0, 0, b.$nextCanv.width, b.$nextCanv.height), b.cw - b.arrowPadding - b.$nextCanv.width, ~~(b.ch / 2 - b.$nextCanv.height / 2));
for (var e = 0, f = g.length; e < f; e++) g[e].color = function () {
return b.mx > 0 && b.mx > b.cw - (b.arrowPadding * 2 + b.$nextCanv.width) ? b.hoverColorArr : b.colorArr
}, c.push(g[e])
}
if (b.currImg != b.lastImg || a == !0) c.shuffle(), b.lastImg = b.currImg;
var h = b.pxlBuffer.first;
for (var e = 0, f = c.length; e < f; e++) {
var i = null;
h != null ? (i = h, h = h.next) : (b.swapList(b.recycleBuffer.first, b.recycleBuffer, b.pxlBuffer), i = b.pxlBuffer.first), i.gravityX = c[e].x, i.gravityY = c[e].y, i.color = c[e].color
}
while (h != null) h.ttl = ~~(Math.random() * 10), h.gravityY = ~~(b.ch * Math.random()), h.gravityX = ~~(b.cw * Math.random()), h = h.next;
b.$overlay.innerHTML = b.$$slides[b.currImg].innerHTML
}
}, ParticleSlider.prototype.getCw = function () {
var a = this;
return Math.min(document.body.clientWidth, a.width, a.$container.clientWidth)
}, ParticleSlider.prototype.getCh = function () {
var a = this;
return Math.min(document.body.clientHeight, a.height, a.$container.clientHeight)
}, ParticleSlider.prototype.resize = function () {
var a = this;
a.cw = a.getCw(), a.ch = a.getCh(), a.$canv.width = a.cw, a.$canv.height = a.ch, a.init(!0)
}, ParticleSlider.prototype.setColor = function (a) {
var b = this;
b.colorArr = b.parseColor(a)
}, ParticleSlider.prototype.setHoverColor = function (a) {
var b = this;
b.hoverColorArr = b.parseColor(a)
}, ParticleSlider.prototype.requestAnimationFrame = function (a) {
var b = this,
c = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (a) {
window.setTimeout(a, 1e3 / 60)
};
c(a)
};
I had updated the particle.js file to remove loading animation.try this..

Formatting the phone number for multiple asp:TextBox in Javascript

This might be very basic problem. I found the similar solution on Stack Overflow for formatting the phone number and I used it for asp:TextBox control, but I want this code to be work for multiple phone number textbox control rather than passing IDs directly. I have five different phone field and all those textbox are asp:TextBox. I want to call the same code from all those filed. (I am looking this solution in JavaScript only)
Here is my JS code:
/*Start of phone number formating */
var n;
var p;
var p1;
function format_phone() {
p = p1.value
if (p.length == 3) {
pp = p;
d4 = p.indexOf('(')
d5 = p.indexOf(')')
if (d4 == -1) {
pp = "(" + pp;
}
if (d5 == -1) {
pp = pp + ") ";
}
document.getElementById('<%=HomePhone.ClientID%>').value = "";
document.getElementById('<%=HomePhone.ClientID%>').value = pp;
}
if (p.length > 3) {
d1 = p.indexOf('(')
d2 = p.indexOf(')')
if (d2 == -1) {
l30 = p.length;
p30 = p.substring(0, 4);
p30 = p30 + ") "
p31 = p.substring(5, l30);
pp = p30 + p31;
document.getElementById('<%=HomePhone.ClientID%>').value = "";
document.getElementById('<%=HomePhone.ClientID%>').value = pp;
}
}
if (p.length > 7) {
p11 = p.substring(d1 + 1, d2);
if (p11.length > 4) {
p12 = p11;
l12 = p12.length;
l15 = p.length
p13 = p11.substring(0, 4);
p14 = p11.substring(4, l12);
p15 = p.substring(d2 + 1, l15);
document.getElementById('<%=HomePhone.ClientID%>').value = "";
pp = "(" + p13 + ") " + p14 + p15;
document.getElementById('<%=HomePhone.ClientID%>').value = pp;
}
l16 = p.length;
p16 = p.substring(d2 + 2, l16);
l17 = p16.length;
if (l17 > 3 && p16.indexOf('-') == -1) {
p17 = p.substring(d2 + 1, d2 + 5);
p18 = p.substring(d2 + 5, l16);
p19 = p.substring(0, d2 + 1);
pp = p19 + p17 + "-" + p18;
document.getElementById('<%=HomePhone.ClientID%>').value = "";
document.getElementById('<%=HomePhone.ClientID%>').value = pp;
}
}
setTimeout(format_phone, 100)
}
function getIt(m) {
n = m.name;
p1 = m;
format_phone()
}
/* End of phone number formating */
and asp:TextBox as
<asp:TextBox MaxLength="14"
runat="server" ID="HomePhone"
placeholder="(xxx) xxx-xxxx"
onFocus="if(this.value==this.defaultValue)this.value='';" onclick="javascript:getIt(this)"
onkeypress='return event.charCode >= 48 && event.charCode <= 57'/>
And I have other similar four textboxes for phone field and I want to use the same formatting logic for all those. What is the best way to use this or any alternative JavaScript code from multiple textbox. Any help would be highly appreciated.

I don't remember where I found this solution but, it might help you out to format the phone fields:
<script type="text/javascript">
//Phone validation
var zChar = new Array(' ', '(', ')', '-', '.');
var maxphonelength = 13;
var phonevalue1;
var phonevalue2;
var cursorposition;
function ParseForNumber1(object) {
phonevalue1 = ParseChar(object.value, zChar);
}
function ParseForNumber2(object) {
phonevalue2 = ParseChar(object.value, zChar);
}
function backspacerUP(object, e) {
if (e) {
e = e
} else {
e = window.event
}
if (e.which) {
var keycode = e.which
} else {
var keycode = e.keyCode
}
ParseForNumber1(object)
if (keycode >= 48) {
ValidatePhone(object)
}
}
function backspacerDOWN(object, e) {
if (e) {
e = e
} else {
e = window.event
}
if (e.which) {
var keycode = e.which
} else {
var keycode = e.keyCode
}
ParseForNumber2(object)
}
function GetCursorPosition() {
var t1 = phonevalue1;
var t2 = phonevalue2;
var bool = false
for (i = 0; i < t1.length; i++) {
if (t1.substring(i, 1) != t2.substring(i, 1)) {
if (!bool) {
cursorposition = i
bool = true
}
}
}
}
function ValidatePhone(object) {
var p = phonevalue1
p = p.replace(/[^\d]*/gi, "")
if (p.length < 3) {
object.value = p
} else if (p.length == 3) {
pp = p;
d4 = p.indexOf('(')
d5 = p.indexOf(')')
if (d4 == -1) {
pp = "(" + pp;
}
if (d5 == -1) {
pp = pp + ")";
}
object.value = pp;
} else if (p.length > 3 && p.length < 7) {
p = "(" + p;
l30 = p.length;
p30 = p.substring(0, 4);
p30 = p30 + ")"
p31 = p.substring(4, l30);
pp = p30 + p31;
object.value = pp;
} else if (p.length >= 7) {
p = "(" + p;
l30 = p.length;
p30 = p.substring(0, 4);
p30 = p30 + ")"
p31 = p.substring(4, l30);
pp = p30 + p31;
l40 = pp.length;
p40 = pp.substring(0, 8);
p40 = p40 + "-"
p41 = pp.substring(8, l40);
ppp = p40 + p41;
object.value = ppp.substring(0, maxphonelength);
}
GetCursorPosition()
if (cursorposition >= 0) {
if (cursorposition == 0) {
cursorposition = 2
} else if (cursorposition <= 2) {
cursorposition = cursorposition + 1
} else if (cursorposition <= 5) {
cursorposition = cursorposition + 2
} else if (cursorposition == 6) {
cursorposition = cursorposition + 2
} else if (cursorposition == 7) {
cursorposition = cursorposition + 4
e1 = object.value.indexOf(')')
e2 = object.value.indexOf('-')
if (e1 > -1 && e2 > -1) {
if (e2 - e1 == 4) {
cursorposition = cursorposition - 1
}
}
} else if (cursorposition < 11) {
cursorposition = cursorposition + 3
} else if (cursorposition == 11) {
cursorposition = cursorposition + 1
} else if (cursorposition >= 12) {
cursorposition = cursorposition
}
var txtRange = object.createTextRange();
txtRange.moveStart("character", cursorposition);
txtRange.moveEnd("character", cursorposition - object.value.length);
txtRange.select();
}
}
function ParseChar(sStr, sChar) {
if (sChar.length == null) {
zChar = new Array(sChar);
}
else zChar = sChar;
for (i = 0; i < zChar.length; i++) {
sNewStr = "";
var iStart = 0;
var iEnd = sStr.indexOf(sChar[i]);
while (iEnd != -1) {
sNewStr += sStr.substring(iStart, iEnd);
iStart = iEnd + 1;
iEnd = sStr.indexOf(sChar[i], iStart);
}
sNewStr += sStr.substring(sStr.lastIndexOf(sChar[i]) + 1, sStr.length);
sStr = sNewStr;
}
return sNewStr;
}
</script>
And call this on your asp:TextBox as
<asp:TextBox MaxLength="14"
runat="server" ID="HomePhone"
placeholder="(xxx) xxx-xxxx"
onkeydown="javascript:backspacerDOWN(this,event);"
onkeyup="javascript:backspacerUP(this,event);" />
And If you want to insert space after ')' you can use the following trick
function markSpace(field) {
if (field.value.includes(")")) {
field.value = field.value.split(')').join(') ');
}
if (field.value.includes(") ")) {
field.value = field.value.replace(/ +/g, ' ');
}
}
and call this as onblur="markSpace(this);" But I personally prefer using JQuery :)

jquery webcam plugin TypeError: webcam.capture is not a function thrown occasionally

Quite often I am getting the error above per the subject line.
The piece of code that this is thrown at is as follows (the function in the else section).
if ($('#clicktosnap').is('.disabled'))
{
alert ("Please enable the camera first, then press allow on the dialog above.");
}
else
{
webcam.capture();
}
I have tried moving the code in a beginning script tag and at in the end as well (pre and post initialization with no joy) the things is that this doesn't happen all the time so I am confused, it seems to happen when I first visit the page and then it normally goes away after the first refresh.
I have tried to compare the source when this works and when it doesn't and it is exactly the same..
Whole code below:
JS
<div id="webcam" style="display:none" >
<object width="218" height="240" data="assets/js/webcam/jscam_canvas_only.swf" type="application/x-shockwave-flash" id="XwebcamXobjectX"><param value="assets/js/webcam/jscam_canvas_only.swf" name="movie"><param value="mode=callback&quality=85" name="FlashVars"><param value="always" name="allowScriptAccess"></object>
<div class="takepic">
<a class="clicktosnap disabled" id="clicktosnap"> Take a picture now! </a>
</div>
<canvas width="320" height="240" id="canvas" ></canvas>
<img id="primaryweb" width="220" style="display: none;" height="220" src="http://127.0.0.1/ex/main//upload/copy/">
</div>
JS
<script type="text/javascript" src="assets/js/webcam/jquery.webcam.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var pos = 0;
var ctx = null;
var cam = null;
var image = null;
var filter_on = false;
var filter_id = 0;
function changeFilter() {
if (filter_on) {
filter_id = (filter_id + 1) & 7;
}
}
function toggleFilter(obj) {
if (filter_on =!filter_on) {
obj.parentNode.style.borderColor = "#c00";
} else {
obj.parentNode.style.borderColor = "#333";
}
}
jQuery("#webcam").webcam({
width: 320,
height: 240,
mode: "callback",
swffile: "/assets/js/webcam/jscam_canvas_only.swf",
onTick: function(remain) {
if (0 == remain) {
jQuery("#status").text("Cheese!");
} else {
jQuery("#status").text(remain + " seconds remaining...");
}
},
onSave: function(data) {
var col = data.split(";");
var img = image;
if (false == filter_on) {
for(var i = 0; i < 320; i++) {
var tmp = parseInt(col[i]);
img.data[pos + 0] = (tmp >> 16) & 0xff;
img.data[pos + 1] = (tmp >> 8) & 0xff;
img.data[pos + 2] = tmp & 0xff;
img.data[pos + 3] = 0xff;
pos+= 4;
}
} else {
var id = filter_id;
var r,g,b;
var r1 = Math.floor(Math.random() * 255);
var r2 = Math.floor(Math.random() * 255);
var r3 = Math.floor(Math.random() * 255);
for(var i = 0; i < 320; i++) {
var tmp = parseInt(col[i]);
/* Copied some xcolor methods here to be faster than calling all methods inside of xcolor and to not serve complete library with every req */
if (id == 0) {
r = (tmp >> 16) & 0xff;
g = 0xff;
b = 0xff;
} else if (id == 1) {
r = 0xff;
g = (tmp >> 8) & 0xff;
b = 0xff;
} else if (id == 2) {
r = 0xff;
g = 0xff;
b = tmp & 0xff;
} else if (id == 3) {
r = 0xff ^ ((tmp >> 16) & 0xff);
g = 0xff ^ ((tmp >> 8) & 0xff);
b = 0xff ^ (tmp & 0xff);
} else if (id == 4) {
r = (tmp >> 16) & 0xff;
g = (tmp >> 8) & 0xff;
b = tmp & 0xff;
var v = Math.min(Math.floor(.35 + 13 * (r + g + b) / 60), 255);
r = v;
g = v;
b = v;
} else if (id == 5) {
r = (tmp >> 16) & 0xff;
g = (tmp >> 8) & 0xff;
b = tmp & 0xff;
if ((r+= 32) < 0) r = 0;
if ((g+= 32) < 0) g = 0;
if ((b+= 32) < 0) b = 0;
} else if (id == 6) {
r = (tmp >> 16) & 0xff;
g = (tmp >> 8) & 0xff;
b = tmp & 0xff;
if ((r-= 32) < 0) r = 0;
if ((g-= 32) < 0) g = 0;
if ((b-= 32) < 0) b = 0;
} else if (id == 7) {
r = (tmp >> 16) & 0xff;
g = (tmp >> 8) & 0xff;
b = tmp & 0xff;
r = Math.floor(r / 255 * r1);
g = Math.floor(g / 255 * r2);
b = Math.floor(b / 255 * r3);
}
img.data[pos + 0] = r;
img.data[pos + 1] = g;
img.data[pos + 2] = b;
img.data[pos + 3] = 0xff;
pos+= 4;
}
}
if (pos >= 0x4B000) {
ctx.putImageData(img, 0, 0);
pos = 0;
document.getElementById('my_hidden').value = canvas.toDataURL('image/png');
$('#primaryweb').hide();
$('#canvas').show();
}
},
onCapture: function () {
webcam.save();
jQuery("#flash").css("display", "block");
jQuery("#flash").fadeOut(100, function () {
jQuery("#flash").css("opacity", 1);
});
},
//debug: function (type, string) {
// jQuery("#status").html(type + ": " + string);
//console.log(type + ": " + string);
//},
onLoad: function () {
var cams = webcam.getCameraList();
if ((cams.length)>=1)
{
//we are ok enoguh cams
}
else
{
$('#webcam').hide();
$('#filesystem').prop('checked', true);
$( "#filesystem" ).trigger( "click" );
$( "#section-source" ).hide();
}
for(var i in cams) {
jQuery("#cams").append("<li>" + cams[i] + "</li>");
//IF NOT HERE ENABLE CAMERA OTHERWISE DISABLE
}
},
debug: function(type, string) {
//console.log(type + ": " + string);
if (string === "Camera started") {
window.webcam.started = true;
if (window.webcam.onStarted) { window.webcam.onStarted(); }
}
if (string === "Camera stopped") {
window.webcam.started = false;
if (window.webcam.onStarted) { window.webcam.onStopped(); }
}
}
});
function getPageSize() {
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if(document.documentElement.clientWidth){
windowWidth = document.documentElement.clientWidth;
} else {
windowWidth = self.innerWidth;
}
windowHeight = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
// for small pages with total height less then height of the viewport
if(yScroll < windowHeight){
pageHeight = windowHeight;
} else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
if(xScroll < windowWidth){
pageWidth = xScroll;
} else {
pageWidth = windowWidth;
}
return [pageWidth, pageHeight];
}
window.addEventListener("load", function() {
jQuery("body").append("<div id=\"flash\"></div>");
var canvas = document.getElementById("canvas");
if (canvas.getContext) {
ctx = document.getElementById("canvas").getContext("2d");
ctx.clearRect(0, 0, 320, 240);
var img = new Image();
img.src = "/image/logo.gif";
img.onload = function() {
ctx.drawImage(img, 129, 89);
}
image = ctx.getImageData(0, 0, 320, 240);
}
var pageSize = getPageSize();
jQuery("#flash").css({ height: pageSize[1] + "px" });
}, false);
window.addEventListener("resize", function() {
var pageSize = getPageSize();
jQuery("#flash").css({ height: pageSize[1] + "px" });
}, false);
window.webcam.onStarted = function () {
// alert("Whey, the webcam started");
$('#clicktosnap').removeClass("disabled");
};
window.webcam.onStopped = function () {
// alert("Whey, the webcam started");
$('#webcam').hide();
$('#filesystem').prop('checked', true);
$( "#filesystem" ).trigger( "click" );
$( "#section-source" ).hide();
};
$('#filesystem').click(function(){
var somvar = $("#pic-selector-wrapper").html();
$("#pic-selector-wrapper").show();
$('#webcam').hide();
$('#more-pics').show();
$('.addmorepics .custom-input-file').show();
});
$('#camera').click(function(){
$('#more-pics').hide();
$("#pic-selector-wrapper").hide();
$('#webcam').show();
$('.addmorepics .custom-input-file').hide();
});
$('#clicktosnap').click(function(){
if ($('#clicktosnap').is('.disabled'))
{
alert ("Please enable the camera first, then press allow on the dialog above.");
}
else
{
webcam.capture();
}
});
});
</script>

I had the same issue and I used this workaround:
document.getElementById('XwebcamXobjectX').capture();
document.getElementById('XwebcamXobjectX').save();
That should have a similar effect.

How do I get rid of this JS error: TypeError: $(...).validate is not a function

I am using the following JS code from the fiddle provided in the answer here:
How to display messages from jQuery Validate plugin inside of Tooltipster tooltips?
Here's the fiddle: http://jsfiddle.net/kyK4G/
The error shows up on line 36, which is: submitHandler: function (form) { // for demo
And this is the error:
TypeError: $(...).validate is not a function
submitHandler: function (form) { // for demo
Code:
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
$(document).ready(function () {
// initialize tooltipster on text input elements
$('#myform input[type="text"]').tooltipster({
trigger: 'custom',
onlyOne: false,
position: 'right'
});
// initialize validate plugin on the form
$('#myform').validate({
errorPlacement: function (error, element) {
$(element).tooltipster('update', $(error).text());
$(element).tooltipster('show');
},
success: function (label, element) {
$(element).tooltipster('hide');
},
rules: {
field1: {
required: true,
email: true
},
field2: {
required: true,
minlength: 5
}
},
submitHandler: function (form) { // for demo
alert('valid form');
return false;
}
});
});
// no CDN - including plugin below
(function (d, f, g, b) {
var e = "tooltipster",
c = {
animation: "fade",
arrow: true,
arrowColor: "",
content: "",
delay: 200,
fixedWidth: 0,
maxWidth: 0,
functionBefore: function (l, m) {
m()
},
functionReady: function (l, m) {},
functionAfter: function (l) {},
icon: "(?)",
iconDesktop: false,
iconTouch: false,
iconTheme: ".tooltipster-icon",
interactive: false,
interactiveTolerance: 350,
offsetX: 0,
offsetY: 0,
onlyOne: true,
position: "top",
speed: 350,
timer: 0,
theme: ".tooltipster-default",
touchDevices: true,
trigger: "hover"
};
function h(m, l) {
this.element = m;
this.options = d.extend({}, c, l);
this._defaults = c;
this._name = e;
this.init()
}
function j() {
return !!("ontouchstart" in f)
}
function a() {
var l = g.body || g.documentElement;
var n = l.style;
var o = "transition";
if (typeof n[o] == "string") {
return true
}
v = ["Moz", "Webkit", "Khtml", "O", "ms"], o = o.charAt(0).toUpperCase() + o.substr(1);
for (var m = 0; m < v.length; m++) {
if (typeof n[v[m] + o] == "string") {
return true
}
}
return false
}
var k = true;
if (!a()) {
k = false
}
h.prototype = {
init: function () {
var r = d(this.element);
var n = this;
var q = true;
if ((n.options.touchDevices == false) && (j())) {
q = false
}
if (g.all && !g.querySelector) {
q = false
}
if (q == true) {
if ((this.options.iconDesktop == true) && (!j()) || ((this.options.iconTouch == true) && (j()))) {
var m = r.attr("title");
r.removeAttr("title");
var p = n.options.iconTheme;
var o = d('<span class="' + p.replace(".", "") + '" title="' + m + '">' + this.options.icon + "</span>");
o.insertAfter(r);
r.data("tooltipsterIcon", o);
r = o
}
var l = d.trim(n.options.content).length > 0 ? n.options.content : r.attr("title");
r.data("tooltipsterContent", l);
r.removeAttr("title");
if ((this.options.touchDevices == true) && (j())) {
r.bind("touchstart", function (t, s) {
n.showTooltip()
})
} else {
if (this.options.trigger == "hover") {
r.on("mouseenter.tooltipster", function () {
n.showTooltip()
});
if (this.options.interactive == true) {
r.on("mouseleave.tooltipster", function () {
var t = r.data("tooltipster");
var u = false;
if ((t !== b) && (t !== "")) {
t.mouseenter(function () {
u = true
});
t.mouseleave(function () {
u = false
});
var s = setTimeout(function () {
if (u == true) {
t.mouseleave(function () {
n.hideTooltip()
})
} else {
n.hideTooltip()
}
}, n.options.interactiveTolerance)
} else {
n.hideTooltip()
}
})
} else {
r.on("mouseleave.tooltipster", function () {
n.hideTooltip()
})
}
}
if (this.options.trigger == "click") {
r.on("click.tooltipster", function () {
if ((r.data("tooltipster") == "") || (r.data("tooltipster") == b)) {
n.showTooltip()
} else {
n.hideTooltip()
}
})
}
}
}
},
showTooltip: function (m) {
var n = d(this.element);
var l = this;
if (n.data("tooltipsterIcon") !== b) {
n = n.data("tooltipsterIcon")
}
if ((d(".tooltipster-base").not(".tooltipster-dying").length > 0) && (l.options.onlyOne == true)) {
d(".tooltipster-base").not(".tooltipster-dying").not(n.data("tooltipster")).each(function () {
d(this).addClass("tooltipster-kill");
var o = d(this).data("origin");
o.data("plugin_tooltipster").hideTooltip()
})
}
n.clearQueue().delay(l.options.delay).queue(function () {
l.options.functionBefore(n, function () {
if ((n.data("tooltipster") !== b) && (n.data("tooltipster") !== "")) {
var w = n.data("tooltipster");
if (!w.hasClass("tooltipster-kill")) {
var s = "tooltipster-" + l.options.animation;
w.removeClass("tooltipster-dying");
if (k == true) {
w.clearQueue().addClass(s + "-show")
}
if (l.options.timer > 0) {
var q = w.data("tooltipsterTimer");
clearTimeout(q);
q = setTimeout(function () {
w.data("tooltipsterTimer", b);
l.hideTooltip()
}, l.options.timer);
w.data("tooltipsterTimer", q)
}
if ((l.options.touchDevices == true) && (j())) {
d("body").bind("touchstart", function (B) {
if (l.options.interactive == true) {
var D = d(B.target);
var C = true;
D.parents().each(function () {
if (d(this).hasClass("tooltipster-base")) {
C = false
}
});
if (C == true) {
l.hideTooltip();
d("body").unbind("touchstart")
}
} else {
l.hideTooltip();
d("body").unbind("touchstart")
}
})
}
}
} else {
d("body").css("overflow-x", "hidden");
var x = n.data("tooltipsterContent");
var u = l.options.theme;
var y = u.replace(".", "");
var s = "tooltipster-" + l.options.animation;
var r = "-webkit-transition-duration: " + l.options.speed + "ms; -webkit-animation-duration: " + l.options.speed + "ms; -moz-transition-duration: " + l.options.speed + "ms; -moz-animation-duration: " + l.options.speed + "ms; -o-transition-duration: " + l.options.speed + "ms; -o-animation-duration: " + l.options.speed + "ms; -ms-transition-duration: " + l.options.speed + "ms; -ms-animation-duration: " + l.options.speed + "ms; transition-duration: " + l.options.speed + "ms; animation-duration: " + l.options.speed + "ms;";
var o = l.options.fixedWidth > 0 ? "width:" + l.options.fixedWidth + "px;" : "";
var z = l.options.maxWidth > 0 ? "max-width:" + l.options.maxWidth + "px;" : "";
var t = l.options.interactive == true ? "pointer-events: auto;" : "";
var w = d('<div class="tooltipster-base ' + y + " " + s + '" style="' + o + " " + z + " " + t + " " + r + '"><div class="tooltipster-content">' + x + "</div></div>");
w.appendTo("body");
n.data("tooltipster", w);
w.data("origin", n);
l.positionTooltip();
l.options.functionReady(n, w);
if (k == true) {
w.addClass(s + "-show")
} else {
w.css("display", "none").removeClass(s).fadeIn(l.options.speed)
}
var A = x;
var p = setInterval(function () {
var B = n.data("tooltipsterContent");
if (d("body").find(n).length == 0) {
w.addClass("tooltipster-dying");
l.hideTooltip()
} else {
if ((A !== B) && (B !== "")) {
A = B;
w.find(".tooltipster-content").html(B);
w.css({
width: "",
"-webkit-transition-duration": l.options.speed + "ms",
"-moz-transition-duration": l.options.speed + "ms",
"-o-transition-duration": l.options.speed + "ms",
"-ms-transition-duration": l.options.speed + "ms",
"transition-duration": l.options.speed + "ms",
"-webkit-transition-property": "-webkit-transform",
"-moz-transition-property": "-moz-transform",
"-o-transition-property": "-o-transform",
"-ms-transition-property": "-ms-transform",
"transition-property": "transform"
}).addClass("tooltipster-content-changing");
setTimeout(function () {
w.removeClass("tooltipster-content-changing");
setTimeout(function () {
w.css({
"-webkit-transition-property": "",
"-moz-transition-property": "",
"-o-transition-property": "",
"-ms-transition-property": "",
"transition-property": ""
})
}, l.options.speed)
}, l.options.speed);
tooltipWidth = w.outerWidth(false);
tooltipInnerWidth = w.innerWidth();
tooltipHeight = w.outerHeight(false);
l.positionTooltip()
}
}
if ((d("body").find(w).length == 0) || (d("body").find(n).length == 0)) {
clearInterval(p)
}
}, 200);
if (l.options.timer > 0) {
var q = setTimeout(function () {
w.data("tooltipsterTimer", b);
l.hideTooltip()
}, l.options.timer + l.options.speed);
w.data("tooltipsterTimer", q)
}
if ((l.options.touchDevices == true) && (j())) {
d("body").bind("touchstart", function (B) {
if (l.options.interactive == true) {
var D = d(B.target);
var C = true;
D.parents().each(function () {
if (d(this).hasClass("tooltipster-base")) {
C = false
}
});
if (C == true) {
l.hideTooltip();
d("body").unbind("touchstart")
}
} else {
l.hideTooltip();
d("body").unbind("touchstart")
}
})
}
w.mouseleave(function () {
l.hideTooltip()
})
}
});
n.dequeue()
})
},
hideTooltip: function (m) {
var p = d(this.element);
var l = this;
if (p.data("tooltipsterIcon") !== b) {
p = p.data("tooltipsterIcon")
}
var o = p.data("tooltipster");
if (o == b) {
o = d(".tooltipster-dying")
}
p.clearQueue();
if ((o !== b) && (o !== "")) {
var q = o.data("tooltipsterTimer");
if (q !== b) {
clearTimeout(q)
}
var n = "tooltipster-" + l.options.animation;
if (k == true) {
o.clearQueue().removeClass(n + "-show").addClass("tooltipster-dying").delay(l.options.speed).queue(function () {
o.remove();
p.data("tooltipster", "");
d("body").css("verflow-x", "");
l.options.functionAfter(p)
})
} else {
o.clearQueue().addClass("tooltipster-dying").fadeOut(l.options.speed, function () {
o.remove();
p.data("tooltipster", "");
d("body").css("verflow-x", "");
l.options.functionAfter(p)
})
}
}
},
positionTooltip: function (O) {
var A = d(this.element);
var ab = this;
if (A.data("tooltipsterIcon") !== b) {
A = A.data("tooltipsterIcon")
}
if ((A.data("tooltipster") !== b) && (A.data("tooltipster") !== "")) {
var ah = A.data("tooltipster");
ah.css("width", "");
var ai = d(f).width();
var B = A.outerWidth(false);
var ag = A.outerHeight(false);
var al = ah.outerWidth(false);
var m = ah.innerWidth() + 1;
var M = ah.outerHeight(false);
var aa = A.offset();
var Z = aa.top;
var u = aa.left;
var y = b;
if (A.is("area")) {
var T = A.attr("shape");
var af = A.parent().attr("name");
var P = d('img[usemap="#' + af + '"]');
var n = P.offset().left;
var L = P.offset().top;
var W = A.attr("coords") !== b ? A.attr("coords").split(",") : b;
if (T == "circle") {
var N = parseInt(W[0]);
var r = parseInt(W[1]);
var D = parseInt(W[2]);
ag = D * 2;
B = D * 2;
Z = L + r - D;
u = n + N - D
} else {
if (T == "rect") {
var N = parseInt(W[0]);
var r = parseInt(W[1]);
var q = parseInt(W[2]);
var J = parseInt(W[3]);
ag = J - r;
B = q - N;
Z = L + r;
u = n + N
} else {
if (T == "poly") {
var x = [];
var ae = [];
var H = 0,
G = 0,
ad = 0,
ac = 0;
var aj = "even";
for (i = 0; i < W.length; i++) {
var F = parseInt(W[i]);
if (aj == "even") {
if (F > ad) {
ad = F;
if (i == 0) {
H = ad
}
}
if (F < H) {
H = F
}
aj = "odd"
} else {
if (F > ac) {
ac = F;
if (i == 1) {
G = ac
}
}
if (F < G) {
G = F
}
aj = "even"
}
}
ag = ac - G;
B = ad - H;
Z = L + G;
u = n + H
} else {
ag = P.outerHeight(false);
B = P.outerWidth(false);
Z = L;
u = n
}
}
}
}
if (ab.options.fixedWidth == 0) {
ah.css({
width: m + "px",
"padding-left": "0px",
"padding-right": "0px"
})
}
var s = 0,
V = 0;
var X = parseInt(ab.options.offsetY);
var Y = parseInt(ab.options.offsetX);
var p = "";
function w() {
var an = d(f).scrollLeft();
if ((s - an) < 0) {
var am = s - an;
s = an;
ah.data("arrow-reposition", am)
}
if (((s + al) - an) > ai) {
var am = s - ((ai + an) - al);
s = (ai + an) - al;
ah.data("arrow-reposition", am)
}
}
function t(an, am) {
if (((Z - d(f).scrollTop() - M - X - 12) < 0) && (am.indexOf("top") > -1)) {
ab.options.position = an;
y = am
}
if (((Z + ag + M + 12 + X) > (d(f).scrollTop() + d(f).height())) && (am.indexOf("bottom") > -1)) {
ab.options.position = an;
y = am;
V = (Z - M) - X - 12
}
}
if (ab.options.position == "top") {
var Q = (u + al) - (u + B);
s = (u + Y) - (Q / 2);
V = (Z - M) - X - 12;
w();
t("bottom", "top")
}
if (ab.options.position == "top-left") {
s = u + Y;
V = (Z - M) - X - 12;
w();
t("bottom-left", "top-left")
}
if (ab.options.position == "top-right") {
s = (u + B + Y) - al;
V = (Z - M) - X - 12;
w();
t("bottom-right", "top-right")
}
if (ab.options.position == "bottom") {
var Q = (u + al) - (u + B);
s = u - (Q / 2) + Y;
V = (Z + ag) + X + 12;
w();
t("top", "bottom")
}
if (ab.options.position == "bottom-left") {
s = u + Y;
V = (Z + ag) + X + 12;
w();
t("top-left", "bottom-left")
}
if (ab.options.position == "bottom-right") {
s = (u + B + Y) - al;
V = (Z + ag) + X + 12;
w();
t("top-right", "bottom-right")
}
if (ab.options.position == "left") {
s = u - Y - al - 12;
myLeftMirror = u + Y + B + 12;
var K = (Z + M) - (Z + A.outerHeight(false));
V = Z - (K / 2) - X;
if ((s < 0) && ((myLeftMirror + al) > ai)) {
var o = parseFloat(ah.css("border-width")) * 2;
var l = (al + s) - o;
ah.css("width", l + "px");
M = ah.outerHeight(false);
s = u - Y - l - 12 - o;
K = (Z + M) - (Z + A.outerHeight(false));
V = Z - (K / 2) - X
} else {
if (s < 0) {
s = u + Y + B + 12;
ah.data("arrow-reposition", "left")
}
}
}
if (ab.options.position == "right") {
s = u + Y + B + 12;
myLeftMirror = u - Y - al - 12;
var K = (Z + M) - (Z + A.outerHeight(false));
V = Z - (K / 2) - X;
if (((s + al) > ai) && (myLeftMirror < 0)) {
var o = parseFloat(ah.css("border-width")) * 2;
var l = (ai - s) - o;
ah.css("width", l + "px");
M = ah.outerHeight(false);
K = (Z + M) - (Z + A.outerHeight(false));
V = Z - (K / 2) - X
} else {
if ((s + al) > ai) {
s = u - Y - al - 12;
ah.data("arrow-reposition", "right")
}
}
}
if (ab.options.arrow == true) {
var I = "tooltipster-arrow-" + ab.options.position;
if (ab.options.arrowColor.length < 1) {
var R = ah.css("background-color")
} else {
var R = ab.options.arrowColor
}

It sounds like you don't have the validate plugin script on the page:
http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js

It looks like you are not including the jQuery plugin that provides the .validate() method. You should include it after jQuery:
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"><script>
Generally, if you have an object, you can try and access different attributes using dot notation as follows:
var myAwesomeObject = {
coolProperty: "whooooa!"
, coolMethod: function() {return this;}
};
myAwesomeObject.coolProperty; // "whooooa!"
myAwesomeObject.coolMethod; // function(){return this;}
If the property happens to be a method, you can call it like:
myAwesomeObject.coolMethod(); // Object {coolProperty: ...
If the property you are trying to access doesn't exist on the object, you will get back undefined
myAwesomeObject.missingProperty; // undefined
Since undefined is not a function, trying to call a missing property as a method will result in the error you saw:
myAwesomeObject.missingMethod(); // TypeError: you messed up.

I also got this problem. I have fixed this problem other way. That I got in the documentation
To fix the problem you have to declared a specific class.
Using the
mfp-TYPE CSS class (where TYPE is the desired content type). For example: <a class="mfp-image image-link">Open image</a>, $('.image-link').magnificPopup().
Another Example: <a class="mfp-iframe video-link">Open Video</a>, $('.video-link').magnificPopup().

Stripchart using raphael.js only partially functioning in IE8

I'm using Raphael.js to help in creating a Stripchart, but unfortunately it's not displaying the actual data in IE8. The grid for the chart is displaying but that's about it. Does anything in the code jump out at you as to why this may be an issue? Just looking for a second set of eyes, thanks!
/*
* accelerometer charts, needs raphael-min.js
*/
function Stripchart(element) {
var ret = new SChart(element);
return ret;
}
function SChart(element) {
vpwidth = element.offsetWidth;
vpheight = element.offsetHeight;
tzero = 0;
mspertick = 100.0;
bwidth = 0;
bheight = 0;
mgperpx = 1000.0 / 30.0;
chanwidth = 2;
labelheight = 8;
labelevery = 30000;
arraymax = vpwidth * (mspertick/5) * 2;
xchan = new Array(arraymax);
ychan = new Array(arraymax);
zchan = new Array(arraymax);
clock = new Array(arraymax);
head = 0;
tail = 0;
Paper = Raphael(element, vpwidth, vpheight);
this.svg_line = function(x1, y1, x2, y2) {
var ret = "M" + parseInt(x1) + " " + parseInt(y1) + " L" + parseInt(x2) + " " + parseInt(y2);
return ret;
}
this.clear = function() {
Paper.clear();
}
this.draw_grid = function(torigin) {
epsilon = this.clockToTick(torigin-tzero) % 10;
yzero = vpheight / 2;
tline = 0;
tlast = (parseInt(torigin/labelevery) + 1) * labelevery;
for (i = vpwidth-bwidth - epsilon ; i > bwidth; i-= 10) {
svg = this.svg_line(i, bheight, i, vpheight-bheight);
l = Paper.path(svg);
l.attr("stroke", "#eee");
l.attr("stroke-width", "1");
l.attr("opacity", 0.75);
}
for (i = 0; i < torigin-tzero; i += labelevery) {
if(i > torigin - this.tickToClock(vpwidth-bwidth*2) - tzero) {
xpos = vpwidth - bwidth - this.clockToTick(torigin - tzero - i);
minutes = parseInt(i/60000);
seconds = parseInt((i%60000)/1000);
if(seconds < 10) {
seconds = "0" + seconds;
}
timestring = "" + minutes + ":" + seconds;
Paper.text(xpos, vpheight-bheight-(labelheight/2)-1, timestring);
}
}
for (i = yzero; i > bheight; i -= 15) {
svg = this.svg_line(bwidth, i, vpwidth-bwidth, i);
l = Paper.path(svg);
l.attr("stroke", "#eee");
l.attr("stroke-width", "1");
l.attr("opacity", 0.75);
}
for (i = yzero; i < vpheight-bheight; i += 15) {
svg = this.svg_line(bwidth, i, vpwidth-bwidth, i);
l = Paper.path(svg);
l.attr("stroke", "#eee");
l.attr("stroke-width", "1");
l.attr("opacity", 0.75);
}
var svg = this.svg_line(bwidth, yzero, vpwidth-bwidth, yzero);
var l = Paper.path(svg);
l.attr("stroke-width", "1");
l.attr("stroke", "#ddd");
l.attr("opacity", 0.75);
var r = Paper.rect(bwidth, bheight, vpwidth-bwidth*2, vpheight-bheight*2);
r.attr("stroke-width", "2");
r.attr("stroke", "#ccc");
r.attr("opacity", 0.75);
}
this.draw_channel = function(data, color) {
var now;
var svg_path = ""
var mean_datum = 0;
var this_tick;
var prev_tick;
var count;
var xorig = vpwidth-bwidth;
var yorig = vpheight / 2;
// this.text(150, 40, "head = " + head + " tail = " + tail);
if (head == tail) {
return;
}
i = this.prev(head);
now = this.clockToTick(clock[i]);
prev_tick = now;
count = 0;
mean_datum = 0;
// this.text(150, 30, now + " " + i);
// console.log("Start " + this.prev(head) + " end " + this.prev(tail) + " max " + arraymax);
for(i = this.prev(head); i != this.prev(tail); i = this.prev(i)) {
this_tick = this.clockToTick(clock[i]);
if(this_tick == prev_tick) {
mean_datum += data[i];
++count;
} else {
mean_datum = parseInt(mean_datum / count);
if(svg_path.length == 0) {
svg_path = "M";
} else {
svg_path += "L";
}
svg_path += parseInt(xorig - now + prev_tick) + " ";
yplot = yorig - this.chanToPx(mean_datum);
if(yplot < 1) {
yplot = 1;
} else if(yplot > vpheight - bheight) {
yplot = vpheight - bheight;
}
svg_path += parseInt(yplot);
mean_datum = data[i];
count = 1;
prev_tick = this_tick;
}
if(xorig - now + this_tick <= bwidth) {
break;
}
}
var chan_path = Paper.path(svg_path);
if(color == "#00f") {
// console.log(svg_path);
}
chan_path.attr("stroke", color);
chan_path.attr("stroke-path", 1);
chan_path.attr("stroke-width", chanwidth);
chan_path.attr("opacity", 0.9);
}
this.text = function(x, y, s) {
Paper.text(x, y, s);
}
this.prev = function(index) {
var ret;
ret = index - 1;
if(ret <= 0) {
ret += arraymax;
}
return ret;
}
this.next = function(index) {
var ret;
ret = index + 1;
if(ret >= arraymax) {
ret -= arraymax;
}
return ret;
}
this.dequeue = function() {
if(head != tail) {
tail = this.next(tail);
}
}
this.enqueue = function() {
var ret = head;
head = this.next(head);
// detect collision
if(this.next(head) == tail) {
this.dequeue();
}
return ret;
}
this.add_datum = function(time, x, y, z) {
// assume java applet has already handled clock rollover
var entry = this.enqueue();
if(tzero == 0) {
tzero = parseInt(time);
}
clock[entry] = parseInt(time);
xchan[entry] = parseInt(x);
ychan[entry] = parseInt(y);
zchan[entry] = parseInt(z);
// console.log("Adding datum " + entry + " head " + head + " tail " + tail);
// clock[head] = parseInt((parseInt(time) + (mspertick / 2)) / mspertick);
// xchan[head] = parseInt((parseInt(x) + (mgperpx / 2)) / mgperpx);
// ychan[head] = parseInt((parseInt(y) + (mgperpx / 2)) / mgperpx);
// zchan[head] = parseInt((parseInt(z) + (mgperpx / 2)) / mgperpx);
// this.text(150, 30, "(" + clock[head] + ", " + xchan[head] + ", " + ychan[head] + ", " + zchan[head] + ")");
// while(clock[head] - clock[tail] > vpwidth - (bwidth * 2)) {
// tail++;
// if (tail >= arraymax) {
// tail -= arraymax;
// }
// }
}
this.tickToClock = function(tick) {
ret = tick * mspertick;
return ret;
}
this.clockToTick = function(clock_ms) {
ret = parseInt(((mspertick / 2) + clock_ms) / mspertick);
return ret;
}
this.chanToPx = function(chan) {
ret = parseInt((chan + (mgperpx / 2)) / mgperpx);
return ret;
}
this.draw = function() {
var top = this.prev(head);
this.clear();
this.draw_grid(clock[top]);
this.draw_channel(xchan, "#00f");
this.draw_channel(ychan, "#0f0");
this.draw_channel(zchan, "#f00");
}
this.reset = function() {
tzero = 0;
head = 0;
tail = 0;
}
this.add_test_datum = function(tick) {
// add some jitter +/- 16ms
time = tick * mspertick + 16 - Math.floor(Math.random() * 32);
x = Math.floor(Math.random() * 1000) - Math.floor(Math.random() * 1000);
y = 1000 + Math.floor(Math.random() * 1000) - Math.floor(Math.random() * 1000);
z = -1000 + Math.floor(Math.random() * 1000) - Math.floor(Math.random() * 1000);
time = "" + time;
x = "" + x;
y = "" + y;
z = "" + z;
this.add_datum(time, x, y, z);
}
this.test_animate = function(self) {
var tid;
var tcount = 0;
var tmax = 500;
function interval_display() {
for (i=0 ; i<10; i++) {
tcount++;
self.add_test_datum(tcount);
}
self.draw(tcount);
if(tcount > tmax) {
clearInterval(tid);
}
}
tid = setInterval(interval_display, 2500);
}
}

We Keep Coding

JavaScript is the programming language of the Web.

How to read the blockadblock script? - javascript

I'm wondering how to decode the script, I'm trying to customize the design but its so hard to read the code there script is here: https://blockadblock.com/blockadblock_basic_script.php

Related

How to remove loading effect in particle slider?

Formatting the phone number for multiple asp:TextBox in Javascript

jquery webcam plugin TypeError: webcam.capture is not a function thrown occasionally

How do I get rid of this JS error: TypeError: $(...).validate is not a function

Stripchart using raphael.js only partially functioning in IE8

Categories

Resources