function getKey(event) {
event = event || window.event;
var keycode = event.keyCode || e.which;
if (keycode == 37) { lbrotate(e,'<'); }
if (keycode == 39) { lbrotate(e,'>'); }
if (keycode == 27) { hideLightbox(); }
}

/*
setup = {
"el" : node, // required - id OR target node for attribute extract (bigimg)
"up" : int, // the number of ups to parent node for look around for rotate
};
*/

function lb(setup) {
cur=0;
var up = setup.up || 0;
if (typeof setup.el === 'object') {el=setup.el} else {el=document.getElementById(el)}
if (el.parentNode.tagName.toLowerCase()=='a') {return} // for gallery
if (el.querySelector('a')) {return} // skip img-links

var bigimg=el.getAttribute('bigimg');

var removerotate;
nodez=el.closest('.rotate') || el.closest('.page');
if (el.closest('.rotate')) {} else {removerotate=1}
nodez=Array.from(nodez.querySelectorAll(".zimgw"));
for (var i=0; i < nodez.length; i++) {
if (removerotate && nodez[i].closest('.rotate')) {nodez.splice(i,1); i--; continue;}
if (bigimg===nodez[i].getAttribute('bigimg')) {cur=i}
}

document.onkeyup = getKey;
var body = document.getElementsByTagName("body").item(0);

var lightbox = document.createElement("div");
lightbox.setAttribute('id','lightbox');
lightbox.style.position = 'fixed';
lightbox.style.textAlign = 'center';
lightbox.style.whiteSpace='nowrap';
lightbox.style.width = '100%';
lightbox.style.height = '100%';
lightbox.style.zIndex = '1000';
lightbox.style.paddingTop = '3%';
try{lightbox.style.background='rgba(0,0,0,0.8)';}catch(e){}
// lightbox.style.background='yellow';
lightbox.onclick = function (e) {e.stopPropagation(); hideLightbox(); return false;}
body.insertBefore(lightbox, body.firstChild);

var lightboxprev = document.createElement("div");
lightboxprev.setAttribute('id','lightboxprev');
lightboxprev.style.cursor = 'pointer';
lightboxprev.style.position='fixed';
lightboxprev.style.zindex='2000';
lightboxprev.style.width='50%';
lightboxprev.style.height='75%';
try{lightboxprev.style.background='rgba(0,0,0,0.0001)';}catch(e){}
// lightboxprev.style.background='red';
if (nodez.length>1) {
lightboxprev.onclick = function (e) {lbrotate(e,'<');}
lightboxprev.onmouseover = function () {lbprevbut.style.opacity='1';lbnextbut.style.opacity='0';}
}
lightbox.appendChild(lightboxprev);

var lightboxnext = document.createElement("div");
lightboxnext.setAttribute('id','lightboxnext');
lightboxnext.style.cursor = 'pointer';
lightboxnext.style.position='fixed';
lightboxnext.style.zindex='2000';
lightboxnext.style.left='50%';
lightboxnext.style.width='50%';
lightboxnext.style.height='75%';
try{lightboxnext.style.background='rgba(0,0,0,0.0001)';}catch(e){}
// lightboxnext.style.background='green';
if (nodez.length>1) {
lightboxnext.onclick = function (e) {lbrotate(e,'>')}
lightboxnext.onmouseover = function () {lbnextbut.style.opacity='1';lbprevbut.style.opacity='0';}
}
lightbox.appendChild(lightboxnext);


if (nodez.length>1) {
var lbprevbut = document.createElement("div");
lbprevbut.setAttribute('id','lbprevbut');
lbprevbut.innerHTML='<';
lbprevbut.style.transition='opacity 0.2s ease';
lbprevbut.style.display='inline-block';
lbprevbut.style.marginRight='16px';
lbprevbut.style.verticalAlign='middle';
lbprevbut.style.background='#242424';
lbprevbut.style.color='#ccc';
lbprevbut.style.fontWeight='bold';
lbprevbut.style.boxShadow='0 0 1px 1px #ccc';
lbprevbut.style.fontFamily='Arial, sans-serif';
lbprevbut.style.fontSize='19pt';
lbprevbut.style.lineHeight='1.2';
lbprevbut.style.borderRadius='14px';
lbprevbut.style.width='28px';
lbprevbut.style.height='28px';
lbprevbut.style.textAlign='center';
lightbox.appendChild(lbprevbut);
}

var lbimgwm = document.createElement("div");
lbimgwm.setAttribute('id','lbimgwm');
lbimgwm.style.verticalAlign='middle';
lbimgwm.style.display='inline-block';
lbimgwm.style.background='url(img/lightbox-wm.png)';
// lbimgwm.style.width='800px';
// lbimgwm.style.height='600px';
lbimgwm.style.position='absolute';
lbimgwm.style.transition='all 0s';
lightbox.appendChild(lbimgwm);

var lbimg = document.createElement("img");
lbimg.setAttribute('id','lbimg');
lbimg.style.background='#fff';
lbimg.style.verticalAlign='middle';
lbimg.style.padding='0';
lbimg.style.margin='0';
lbimg.style.borderRadius='10px';
lbimg.style.boxShadow='0px 0px 10px 1px rgba(0,0,0,1)';
lbimg.style.maxWidth='85%';
lbimg.style.maxHeight='88%';
lbimg.onload=function () {
 lbdesc.style.width=lbimg.width-5+'px';
 if (nodez.length>1) {var hcur=cur+1; lbdesc.innerHTML='<div style=float:left>'+hcur+'/'+nodez.length+'</div>'+(nodez[cur].getAttribute('alt')||"")}
setTimeout(function(){lbimgwm.style.width=lbimg.offsetWidth+'px'}, 0);
setTimeout(function(){lbimgwm.style.height=lbimg.offsetHeight+'px'}, 0);
}
lightbox.appendChild(lbimg);

setTimeout(function(){lbimgwm.style.width=lbimg.offsetWidth+'px'}, 35);
setTimeout(function(){lbimgwm.style.height=lbimg.offsetHeight+'px'}, 35);


var lbclose = document.createElement("div");
lbclose.setAttribute('id','lbclose');
lbclose.style.cursor = 'pointer';
lbclose.innerHTML='x';
lbclose.style.display='inline-block';
lbclose.style.verticalAlign='top';
lbclose.style.position='relative';
lbclose.style.left='-10px';
lbclose.style.top='-10px';
lbclose.style.background='#242424';
lbclose.style.color='#fff';
lbclose.style.fontWeight='bold';
lbclose.style.boxShadow='0 0 1px 1px #fff';
lbclose.style.fontFamily='Arial, sans-serif';
lbclose.style.fontSize='18pt';
lbclose.style.borderRadius='15px';
lbclose.style.width='30px';
lbclose.style.height='30px';
lbclose.style.textAlign='center';
lbclose.style.lineHeight='normal';
lbclose.onclick = function (e) {e.stopPropagation(); hideLightbox(); return false;}
lightbox.appendChild(lbclose);

if (nodez.length>1) {
var lbnextbut = document.createElement("div");
lbnextbut.setAttribute('id','lbnextbut');
lbnextbut.innerHTML='>';
lbnextbut.style.transition='opacity 0.2s ease';
lbnextbut.style.display='inline-block';
lbnextbut.style.verticalAlign='middle';
lbnextbut.style.background='#242424';
lbnextbut.style.color='#ccc';
lbnextbut.style.fontWeight='bold';
lbnextbut.style.boxShadow='0 0 1px 1px #ccc';
lbnextbut.style.fontFamily='Arial, sans-serif';
lbnextbut.style.fontSize='19pt';
lbnextbut.style.lineHeight='1.2';
lbnextbut.style.borderRadius='14px';
lbnextbut.style.width='28px';
lbnextbut.style.height='28px';
lbnextbut.style.textAlign='center';
lightbox.appendChild(lbnextbut);
}

var lbdesc = document.createElement("div");
lbdesc.setAttribute('id','lbdesc');
lbdesc.innerHTML=el.getAttribute('alt');
lbdesc.position='absolute';
lbdesc.style.maxWidth='90%';
lbdesc.style.color='#ccc';
lbdesc.style.fontWeight='bold';
lbdesc.style.margin='8px auto 0 auto';
lbdesc.style.textAlign='center';
lbdesc.style.minHeight='60px';
// lbdesc.style.background='green';
lbdesc.style.whiteSpace='normal';
lightbox.appendChild(lbdesc);


lbimg.src = bigimg;
}


function lbrotate(event,direction) {
event = event || window.event;
event.stopPropagation ? event.stopPropagation() : (event.cancelBubble=true);
if (direction === '<') {cur--; if (cur<0) {cur=nodez.length-1}}
else {cur++; if (cur>nodez.length-1) {cur=0}}
lbimg.src=nodez[cur].getAttribute('bigimg');
}

function hideLightbox()
{
document.getElementById('lightbox').remove();
cur=0;
}