var xfault = new Array(0,0,0);var yfault = new Array(0,0,0);var wfault = new Array(0,0,0);var hfault = new Array(0,0,0);
var GID=document.getElementById;
var newimx=0;
var newimy=0;
var imx=0;
var imy=0;
var picture="" ;
var winopen=0;
var factor=0;
var xfault = new Array(0,0,0);
var yfault = new Array(0,0,0);
var wfault = new Array(0,0,0);
var hfault = new Array(0,0,0);
var bigimage=0;
var xscroll=0;
var yscroll=0;
var teller=0;
var intervalID=0;

function init(){
plaatfout = new Image();
loupe0=new Image();
loupe1=new Image();
loupe2=new Image();
loupe0.src='http://www.kalf999.com/ico/loupe0.gif';
loupe1.src='http://www.kalf999.com/ico/loupe1.gif';
loupe2.src='http://www.kalf999.com/ico/loupe2.gif';
var stamp=document.getElementById('stamp');
var win=document.getElementById('win');
var bar=document.getElementById('bar');
var pic=document.getElementById('pic');
win.style.visibility='hidden';
win.style.position='absolute';
win.style.border='2px solid gray' ;
win.style.zIndex=80;
win.style.backgroundColor='#222244';
win.style.visibility='hidden';
bar.style.position='absolute';
bar.style.left=0;
bar.style.top=0;
bar.style.width='100%';
bar.style.height='30px';
bar.style.zIndex=80;
bar.style.backgroundColor='#CC0000';
bar.style.borderBottom='1px solid #AAAAAA';
bar.innerHTML='<img ID="L1" src="http://www.kalf999.com/ico/loupe1.gif" onclick="imagezoom(0)" STYLE="position:absolute;top:6px;left:6px;Z-index:5;"><img ID="L2" src="http://www.kalf999.com/ico/loupe2.gif" onclick="startview()" STYLE="position:absolute;top:6px;left:30px;Z-index:5;"><img src = "http://www.kalf999.com/ico/end1.gif" STYLE="position:absolute;top:6px;left:54px;"onclick="HideWin()">'
var L1=document.getElementById('L1');
var L2=document.getElementById('L2');
pic.style.position='absolute';
pic.style.backgroundColor='#222244';
pic.style.left=10;
pic.style.top=40;
pic.style.zIndex=80;
stamp.style.position='absolute';
document.getElementById('ps0').style.position='absolute';document.getElementById('ps0').style.top=0;document.getElementById('ps0').style.left=0;document.getElementById('ps0').style.height=0;document.getElementById('ps0').style.width=0;document.getElementById('ps0').style.border='1px solid black';document.getElementById('ps0').style.zIndex=100;
document.getElementById('ps1').style.position='absolute';document.getElementById('ps1').style.top=0;document.getElementById('ps1').style.left=0;document.getElementById('ps1').style.height=0;document.getElementById('ps1').style.width=0;document.getElementById('ps1').style.border='1px solid black';document.getElementById('ps1').style.zIndex=100;
document.getElementById('ps2').style.position='absolute';document.getElementById('ps2').style.top=0;document.getElementById('ps2').style.left=0;document.getElementById('ps2').style.height=0;document.getElementById('ps2').style.width=0;document.getElementById('ps2').style.border='1px solid black';document.getElementById('ps2').style.zIndex=100;
}

function loadpic(picture,text,xx,phpx,phpy){
clearInterval(intervalID);
document.getElementById('ps0').style.visibility='hidden';document.getElementById('ps1').style.visibility='hidden';document.getElementById('ps2').style.visibility='hidden';stamp.style.visibility='hidden';
plaatfout.src=picture;
stamp.src=plaatfout.src;
stamp.onload = ShowWin;

imx=parseInt(phpx);
imy=parseInt(phpy);

yscroll = document.body.scrollTop;
xscroll = document.body.scrollLeft;
CH=document.body.clientHeight;CW=document.body.clientWidth;
factor=Math.min((CW-100)/imx,(CH-100)/imy ,1);
newimy=imy*factor;
newimx=imx*factor;
pointer=factor*90;

fault_init(xx);
stamp_show(0,0,0);
fault_show();
zoomuit();
}
function stamp_show(incborder,incx,incy){
        win.style.left= parseInt(xscroll+(CW-( newimx+24))/2) ;
        win.style.top= yscroll+(CH-( newimy+54))/2 ;
        win.style.width=(( newimx+24) +(2*incborder)+incx);
        win.style.height=( newimy+54) +(2*incborder)+incy;
        pic.style.width=newimx+incx;
        pic.style.height=newimy+incy;
        pic.style.left=10+incborder;
        pic.style.top=40+incborder;
        stamp.style.width=newimx+incx;
        stamp.style.height=newimy+incy;
        stamp.style.top=0;
        stamp.style.left=0;
        stamp.style.clip='rect(auto)';
}




function clicked (){
clearInterval(intervalID);
if  (bigimage==0)
{
        cx = cursorx();cy=cursory();fault=0;
        for (i=0;i<xfault.length;i++){
                xs=((xfault[i]-1)*pointer)-10*factor;xe=xs +(wfault[i]*pointer)+20*factor;
                ys=((yfault[i]-1)*pointer)-10*factor;ye=ys +(hfault[i]*pointer)+20*factor;
                if  ( cx >=xs && cx <=xe && cy>=ys && cy <=ye) {fault_zoom (xfault[i],yfault[i],wfault[i],hfault[i]);fault=1; break; }
                }
                if (fault==0) {HideWin();}
}
else if (bigimage>0)
{
        zoomuit();
        stamp_show(0,0,0);
        fault_show(0);
}

}
function startview(){
clearInterval(intervalID);
if (bigimage>0){
        zoomuit();
        stamp_show(0,0,0);
        fault_show(0);
        }
else{
    if (xfault.length >0 ){zoomaan(2);intervalID=setInterval('slide()',2000);}
    }
}
function slide(){
if (teller==xfault.length){teller=0;}
fault_zoom (xfault[teller],yfault[teller],wfault[teller],hfault[teller]);
teller++;
}

function fault_zoom(xs,ys,bx,by){

zoomaan(2);

// Error size + Locator (Prima !!!)
var Xinside=(bx*180)+40;var Yinside=(by*180)+40;
var Xclip=newimx;var Yclip=newimy;

if  (Xinside+180>Xclip){incx=(Xinside+180)-Xclip;Xclip=Xinside+180;}else {incx=0;}
if  (Yinside+180>Yclip){incy=(Yinside+180)-Yclip;Yclip=Yinside+180;}else {incy=0;}

// Offsets voor Pointer in het midden
PsXoffset=(Xclip-Xinside)/2;
PsYoffset=(Yclip-Yinside)/2;

// x,y start-values in big picture
XP=(((xs-1)*180)-20)-PsXoffset;
XO=0;
if (XP<0) {XO=-XP;}
if ( (XP+Xclip) > (imx*2)) {XO=(imx*2)-(XP+Xclip);}

YP=(((ys-1)*180)-20)-PsYoffset;
YO=0;
if (YP<0) {YO=-YP;}
if ( (YP+Yclip) > (imy*2)) {YO=(imy*2)-(YP+Yclip);}

PsXoffset = PsXoffset - XO;
PsYoffset = PsYoffset - YO;

// movement big picture
XM=-XP-XO;
YM=-YP-YO;

PicX=XP+XO;
PicY=YP+YO;

ExtraY=0;
ExtraPosY=0;
if ( PsYoffset <0) {ExtraY=15;ExtraPosY=15;}
if ( PsYoffset+220 >Yclip) {ExtraY=(PsYoffset+220)-Yclip-5;}
ExtraX=0;
ExtraPosX=0;
if ( PsXoffset <0) {ExtraX=15;ExtraPosX=15;}
if ( PsXoffset+220 >Xclip) {ExtraX=(PsXoffset+220)-Xclip-5;}

document.getElementById('ps1').style.visibility="hidden";document.getElementById('ps2').style.visibility="hidden";
document.getElementById('ps0').style.width=Xinside-ExtraX;
document.getElementById('ps0').style.height=Yinside-ExtraY;
document.getElementById('ps0').style.top=PsYoffset+ExtraPosY;document.getElementById('ps0').style.left=PsXoffset+ExtraPosX;

//rectangular.clip
var x1=PicX;
var x2=x1+Xclip;
var y1=PicY;
var y2=y1+Yclip;

stamp_show(0,incx,incy);
stamp.style.width=imx*2;stamp.style.height=imy*2;
stamp.style.top=YM;
stamp.style.left=XM;
stamp.style.clip="rect("+y1+"px " + x2 +"px "+y2 + "px "+ x1+ "px)";
}

function zoomaan(x){if (x==1) {bigimage=1;L1.src=loupe0.src;  L2.style.visibility='hidden';}if (x==2) {bigimage=2;L2.src=loupe0.src;  L1.style.visibility='hidden';}}
function zoomuit(){L1.src=loupe1.src;L1.style.visibility='visible'; L2.src=loupe2.src;L2.style.visibility='visible'; bigimage=0;}

function imagezoom(stat){
clearInterval(intervalID);
if (stat==1 && bigimage==0) {return;}
else if (stat==0 && bigimage==1) {zoomuit();stamp_show(0,0,0);fault_show();return;}
else if (stat==0 && bigimage==0) {
        Xclip=parseInt(pic.style.width);Yclip=parseInt(pic.style.height);
        Xend=(imx*2);Yend=(imy*2);PPP=((imx*2)-Xclip)/Xclip;
        zoomaan(1);
        HidePs();stamp.style.width=Xend;stamp.style.height=Yend;
        window.status= Xclip;
        stamp.style.clip="rect(0px "+Xclip +"px "+Yclip + "px 0px)";
        }
else if (stat==1 && bigimage==1) {
        PicX =(xscroll+window.event.clientX -parseInt(win.style.left)-parseInt(pic.style.left)-4)*PPP;
        PicY =(yscroll+window.event.clientY -parseInt(win.style.top)-parseInt(pic.style.top)-4)*PPP;
        window.status = window.event.clientY +":"+ parseInt(win.style.top)+":"+ parseInt(pic.style.top);
        //rectangular.clip
        var x1=PicX;        var x2=x1+Xclip;var y1=PicY;var y2=y1+Yclip;
        stamp.style.top=-PicY;stamp.style.left=-PicX;
        stamp.style.clip="rect("+y1+"px " + x2 +"px "+y2 + "px "+ x1+ "px)";
        }
}
function cursorx (){cx=(window.event.offsetX);return cx;}
function cursory() {cy=(window.event.offsetY);return cy;}
function ShowWin(){win.style.visibility='visible';stamp.style.visibility='visible';}
function HideWin(){clearInterval(intervalID);win.style.visibility="hidden";stamp.style.visibility="hidden";HidePs();zoomuit();L2.style.visibility='hidden';L1.style.visibility='hidden';}
function HidePs(){document.getElementById('ps0').style.visibility="hidden";document.getElementById('ps1').style.visibility="hidden";        document.getElementById('ps2').style.visibility="hidden";}

function fault_init(detail){
        yfault.length=0;xfault.length=0;wfault.length=0;hfault.length=0;
        x1=detail.split(" ");
        if (x1==""){return};
        for (i=0;i<x1.length;i++){
                x2=x1[i].split("-");
                yfault[i]=((x2[0].charCodeAt(0))-64);if  (x2.length>1) {hfault[i]= x2[1].charCodeAt(0)-64-yfault[i]+1;} else {hfault[i]=1;}
                xfault[i]=x2[0].substr(1,x2[0].length);if  (x2.length>1) {wfault[i]= x2[1].substr(1,x2[1].length)-xfault[i]+1;} else {wfault[i]=1;}
                }
}
function fault_show(){
if (xfault.length>0){
for (i=0;i<xfault.length;i++){
     document.getElementById('ps'+i).style.visibility="visible";
     document.getElementById('ps'+i).style.width=(wfault[i]*pointer)+(20*factor);
     document.getElementById('ps'+i).style.height=(hfault[i]*pointer)+(20*factor);
     document.getElementById('ps'+i).style.top=((yfault[i]-1)*pointer)-(10*factor);
     document.getElementById('ps'+i).style.left= ((xfault[i]-1)*pointer)-(10*factor);
     }
}
}
