60 lines
2.0 KiB
JavaScript
60 lines
2.0 KiB
JavaScript
/* This script acquires all image tags encased in anchor tags that link to an image file then adds onclick events to popup + zoom the image rather than visiting the given link. */
|
|
var img2popup = {
|
|
popup: null,
|
|
focused: false,
|
|
Go: function(ele) {
|
|
if (this.popup == null) this.doSetup();
|
|
this.doParse();
|
|
},
|
|
doParse: function(ele) {
|
|
var context = (typeof ele === 'undefined' ? document.getElementsByTagName("img") : ele.getElementsByTagName("img"));
|
|
for (var i = 0; i < context.length; i++) {
|
|
var p = context[i].parentNode;
|
|
if (p.nodeName == "A") {
|
|
if (p.href.match(/\.(png|jpg|jpeg)$/)) {
|
|
p.onclick = (function(p) { return function(e) {
|
|
if (!e) var e = window.event;
|
|
e.cancelBubble = true; if (e.stopPropagation) e.stopPropagation();
|
|
img2popup.popup.src = p.href;
|
|
return false;
|
|
}})(p);
|
|
}
|
|
}
|
|
}
|
|
},
|
|
doSetup: function() {
|
|
this.popup = document.createElement("img");
|
|
this.popup.style.visibility = "hidden";
|
|
this.popup.id = "popup";
|
|
this.popup.onload = function() {
|
|
img2popup.doResize();
|
|
this.style.visibility = "visible";
|
|
img2popup.focused = true;
|
|
};
|
|
document.body.appendChild(this.popup);
|
|
document.onclick = function() {
|
|
if (img2popup.focused) img2popup.doHide();
|
|
};
|
|
window.onresize = img2popup.doResize;
|
|
},
|
|
doHide: function() {
|
|
this.popup.style.visibility = "hidden";
|
|
this.popup.src = "";
|
|
this.focused = false;
|
|
},
|
|
doResize: function() {
|
|
this.popup.style.width = this.popup.style.height = '';
|
|
var w = this.popup.width;
|
|
var h = this.popup.height;
|
|
var r = Math.min(((window.innerWidth || document.documentElement.clientWidth)-32) / w, ((window.innerHeight || document.documentElement.clientHeight)-32) / h);
|
|
if (r < 1.0) {
|
|
w *= r;
|
|
h *= r;
|
|
}
|
|
this.popup.style.marginLeft = -(w/2)+"px";
|
|
this.popup.style.marginTop = -(h/2)+"px";
|
|
this.popup.style.width = w+"px";
|
|
this.popup.style.height = h+"px";
|
|
}
|
|
};
|