var fadebgcolor="white"
var fadearray  = new Array() //array to cache fadeshow instances
var fadeclear  = new Array() //array to cache corresponding clearinterval pointers
var rotateid  = new Array() //array to cache corresponding clearinterval pointers
var agt        = navigator.userAgent.toLowerCase()
var ie         = (agt.indexOf('msie') != -1);
//var ie         = ((agt.indexOf('opera')== -1)) ? false: ie;
var iebrowser  = document.all;
var dom        = (document.getElementById) //modern dom browsers
var fade_url   = 'http://'+window.location.hostname+'/getfadeinfo.php';
var detitel    = document.title;
var fadenr     = 0
//var Rotateid   = "";

function fade_info(functie, idd, taal){
var pars='op='+functie+'&id=' + idd + '&taal='+taal;
//alert();
var myAjax = new Ajax.Request(
             fade_url,
{
             method: 'get',
             parameters: pars,
             onComplete: showResponse
});

}


function showResponse(originalRequest){

new getFaded(originalRequest);
}

function ssetPosition(breedte){

           var sliderEl=$('slideshow');

           if(breedte=298){
           var slide_y = getOffsetTop(sliderEl);
           var slide_x = getOffsetLeft (sliderEl);
           var correctie=parseInt(breedte)-25;

           }else{
           var slide_y = getOffsetTop(sliderEl);
           var slide_x = getOffsetLeft (sliderEl);
           //var correctie=parseInt(breedte)-25;
           }
           //var deleft=sliderEl.offsetHeight

           //window.status=correctie;
           $('canvas0_0').style.top = slide_y+"px";
           $('canvas0_0').style.left= slide_x+"px";

           $('canvas0_1').style.top = slide_y+"px";
           $('canvas0_1').style.left= slide_x+"px";

           $('controls').style.width = "30px";
           $('controls').style.top = slide_y+230+"px";
           $('controls').style.left= slide_x+correctie+"px";
           
           var menu_top  = getOffsetTop ($('header'));
	var menu_left = getOffsetLeft ($('header'));

	$('logo_div').style.top      = menu_top+9+"px";
	$('logo_div').style.left     = menu_left+10+"px";
	$('logo_div').style.display = "block";
           
	$('k1_div').style.top      = menu_top-6+"px";
	$('k1_div').style.left     = menu_left+260+"px";
	$('k1_div').style.display = "block";

	$('k2_div').style.top      = menu_top-9+"px";
	$('k2_div').style.left     = menu_left+360+"px";
	$('k2_div').style.display = "block";
	
	$('k3_div').style.top      = menu_top-3+"px";
	$('k3_div').style.left     = menu_left+530+"px";
	$('k3_div').style.display = "block";
	
           window.onresize=function(){setPosition(breedte)}
           //logo();
}

var breedte=0;
var getFaded = Class.create();

getFaded.prototype = {

initialize: function(originalRequest) {

           this.originalRequest= originalRequest;

           this.response       = originalRequest.responseXML.documentElement;
           this.responset      = originalRequest.responseText;
           //alert(this.responset);
           this.slideshow      = originalRequest.responseXML.getElementsByTagName('slideshow');

           this.fadewidth      = this.slideshow[0].getElementsByTagName('breedte')[0].firstChild.nodeValue;
           this.breedte        = this.fadewidth

           this.curcanvas="canvas0_0";
           fadenr++;
           if(fadenr>1){
           $('canvas0_0').style.zIndex=0;
           $('canvas0_1').style.zIndex=0;

           window.clearTimeout(rotateid[0]);
           window.clearInterval(fadeclear[0]);
           window.clearTimeout(fadeclear[0]);
           }


           setPosition(this.breedte);


           window.onresize=function(){setPosition(breedte)}//
           /******* verwerken request naar vars ***************/

           this.response_parts = "";
           this.fadeimages     = new Array()


           /******* voorbereiden overige vars ***************/

           this.fadeimages         = new Array();
           this.imageborder        = 0;
           this.fadewidth          = 584;
           this.fadeheight         = 189;
           this.delay              = 3500;
           this.pausecheck         = 1;
           this.status             = 1;
           this.mouseovercheck     = 0;
           this.degree             = 10; //initial opacity degree (10%)
           this.curimageindex      = 0;
           this.nextimageindex     = 1;
           this.titel_inner        = "";


           //alert(this.slideshow.length);
           fadearray[0]=this;

           this.slideshowid=fadearray.length-1;
           this.canvasbase="canvas"+this.slideshowid;



           for (var i=0;i<this.slideshow.length;i++){
           this.illustratie=new Image();
           this.illustratienaam = this.slideshow[i].getElementsByTagName('bestandsnaam')[0].firstChild.nodeValue;
           this.map             = this.slideshow[i].getElementsByTagName('map')[0].firstChild.nodeValue;

           this.illustratie.src = "http://"+window.location.hostname+"/images/"+this.map+"/"+this.illustratienaam;

           this.titel           = this.slideshow[i].getElementsByTagName('titel')[0].firstChild.nodeValue;
           this.url_title       = this.slideshow[i].getElementsByTagName('titel')[0].firstChild.nodeValue;
           this.url             = this.slideshow[i].getElementsByTagName('url')[0].firstChild.nodeValue;


           this.fadeimages[i]=[this.illustratie.src, this.url, this.url_title, this.titel];
           }

           this.startit();
           },



rotate_title: function(){
             var detitels=$('titels').getElementsByTagName('DIV')
             //window.status=;
             for(i=0; i<detitels.length; i++){
             this.div=detitels[i];
             if(i==this.curimageindex){
             this.div.style.fontWeight="bold";
             this.div.onclick     = this.no_slide.bindAsEventListener(this.div);
             this.div.onmouseover = this.nopointer.bindAsEventListener(this.div);
             }else{
             this.div.style.fontWeight="normal";
             this.div.onclick     = this.next_slide.bindAsEventListener(this.div);
             this.div.onmouseover = this.pointer.bindAsEventListener(this.div);
             }

             }

             },


next_slide: function(){
           var objee=fadearray[0]
           objee.resetit();
           objee.mouseovercheck2();
           var rcrossobj=iebrowser? iebrowser[objee.nextcanvas] : $(objee.nextcanvas);
           this.clickID= this.id.split('_');
           objee.curimageindex = parseInt(this.clickID[1]);

           window.clearInterval(fadeclear);
           window.clearTimeout(fadeclear);
           window.clearTimeout(rotateid[0]);

           objee.nextimageindex=(objee.curimageindex<objee.fadeimages.length-1)? objee.curimageindex+1 : 0
           objee.populateslide(rcrossobj, objee.curimageindex)
           fadearray[objee.slideshowid].rotateimage();
           objee.mouseovercheck1();
           //setTimeout(function(){objee.mouseovercheck1();}, objee.delay)
           //objee.playbutton.onclick     = objee.startit.bindAsEventListener(objee);

           //window.status=objee.playbutton;
            },

no_slide: function(){
            window.status="hold";

            },


startit: function(){
            var crossobj=iebrowser? iebrowser[this.curcanvas] : $(this.curcanvas)
            //alert(this.illustratie.src);
            $('controls').innerHTML="";

            this.stopbutton             = document.createElement("IMG");
            this.stopbutton.src         = "http://"+window.location.hostname+"/images/stop_on.gif";
            this.stopbutton.style.margin= "0px 3px 0px 0px";
            this.stopbutton.alt         = "slideshow stoppen";
            this.stopbutton.id          = "stopbutton";
            Event.observe(this.stopbutton, 'mousedown', this.mouseovercheck1, false);
            Event.observe(this.stopbutton, 'mouseover', this.pointer, false);


            this.playbutton             = document.createElement("IMG");
            this.playbutton.src         =   "http://"+window.location.hostname+"/images/play.gif";
            this.playbutton.alt         = "slideshow gestart";
            this.playbutton.id          = "playbutton";
            Event.observe(this.playbutton, 'mousedown', this.mouseovercheck2, false);
            Event.observe(this.playbutton, 'mouseover', this.nopointer, false);

            $('controls').appendChild(this.stopbutton);
            $('controls').appendChild(this.playbutton);
            /**/

            //this.populateslide(crossobj, this.curimageindex)
            if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
            Event.observe($('master0'), 'mouseover', this.mouseovercheck1, false);
            Event.observe($('master0'), 'mouseout', this.mouseovercheck2, false);
            }
            this.populateslide(crossobj, this.curimageindex)
            this.rotateimage()

            },


stopit: function(){

           window.clearInterval(fadeclear);
           window.clearTimeout(fadeclear);
           window.clearTimeout(rotateid[0]);
           },

mouseovercheck1: function(evt){
           fadearray[0].mouseovercheck=1;
           fadearray[0].stopbutton.src         =  "http://"+window.location.hostname+"/images/stop.gif";
           fadearray[0].stopbutton.alt         = "slideshow gestopt";
           fadearray[0].stopbutton.onmouseover = fadearray[0].nopointer.bindAsEventListener(this.stopbutton);

           fadearray[0].playbutton.src         =  "http://"+window.location.hostname+"/images/play_on.gif";
           fadearray[0].playbutton.onmouseover = fadearray[0].pointer.bindAsEventListener(this.playbutton);
           fadearray[0].playbutton.alt         = "slideshow starten";
           },

mouseovercheck2: function(evt){
           fadearray[0].mouseovercheck=0;

           fadearray[0].stopbutton.src         =  "http://"+window.location.hostname+"/images/stop_on.gif";
           fadearray[0].stopbutton.alt         = "slideshow stoppen";
           fadearray[0].stopbutton.onmouseover = fadearray[0].pointer.bindAsEventListener(this.stopbutton);

           fadearray[0].playbutton.src         =  "http://"+window.location.hostname+"/images/play.gif";
           fadearray[0].playbutton.onmouseover = fadearray[0].nopointer.bindAsEventListener(this.playbutton);
           fadearray[0].playbutton.alt         = "slideshow gestart";


           },

resetit: function(){

            this.degree=10
            var crossobj=$(this.curcanvas);//iebrowser? iebrowser[this.curcanvas] : document.getElementById
            if (crossobj.filters&&crossobj.filters[0]){
            if (typeof crossobj.filters[0].opacity=="number") //if IE6+
            crossobj.filters(0).opacity=this.degree
            else //else if IE5.5-
            crossobj.style.filter="alpha(opacity="+this.degree+")"
            }
            else if (crossobj.style.opacity)
            crossobj.style.opacity=this.degree/101
            else if (crossobj.style.opacity)
            crossobj.style.opacity=obj.degree/100

            },


rotateimage: function(){

             //window.status=this.mouseovercheck;
             if (this.pausecheck==1) //if pause onMouseover enabled, cache object
             var cacheobj=this
             if (this.mouseovercheck==1)
             setTimeout(function(){cacheobj.rotateimage()}, 100)
             else if (iebrowser&&dom||dom){
             this.resetit()

             //var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : $(this.curcanvas)

             $(this.curcanvas).style.zIndex++
             //window.status=$('canvas0_0').style.zIndex+" | "+$('canvas0_1').style.zIndex;
             fadeclear[this.slideshowid]=setInterval("fadearray["+this.slideshowid+"].fadepic()", 50)

             this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
             }
             else{
             var ns4imgobj=document.images['defaultslide'+this.slideshowid]
             ns4imgobj.src=this.postimages[this.curimageindex].src
             }

             if (this.mouseovercheck!=1){
             this.rotate_title();
             this.curimageindex=(this.curimageindex<this.fadeimages.length-1)? this.curimageindex+1 : 0
             }


             },


            //$(obj.curcanvas).style.filter="alpha(opacity="+obj.degree+")"
fadepic: function(){
             var obj=this
             var scrossobj=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
             var scrossobj=$(scrossobj);
             //this.scrossobj=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
             //alert(scrossobj);



             if (obj.degree<100){
             obj.degree+=10

             if (scrossobj.filters&&scrossobj.filters[0]){

             if (typeof scrossobj.filters[0].opacity=="number"){ //if IE6+
             scrossobj.style.filter="alpha(opacity="+obj.degree+")" //obj.tempobj.filters[0].opacity=obj.degree
             }else{ //else if IE5.5-
             scrossobj.style.filter="alpha(opacity="+obj.degree+")"
             }


             }else if (scrossobj.style.MozOpacity){

             scrossobj.style.MozOpacity=obj.degree/101;

             }else if (scrossobj.style.opacity)     { //
             scrossobj.style.opacity=obj.degree/100

             }

             }else{
             //document.title=detitel+" - "+this.fadeimages[this.curimageindex][3];
             //alert($(scrossobj).style.KhtmlOpacity)

             clearInterval(fadeclear[obj.slideshowid])
             obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
             //obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : $(obj.nextcanvas)
             obj.populateslide($(obj.nextcanvas)  , obj.nextimageindex);
             obj.nextimageindex=(obj.nextimageindex<obj.fadeimages.length-1)? obj.nextimageindex+1 : 0
             //document.getElementById("test").innerHTML=obj.tempobj.childNodes[0].title;
             rotateid[this.slideshowid]=setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)

             }
            /* */

             },


populateslide: function(picobj, picindex){

             this.slideHTML=""

             if (this.fadeimages[picindex][1]!="" && this.fadeimages[picindex][1]!="..."){ //if associated link exists for image
             this.popupp="enlarge.php";
             this.slideHTML+="<a style='cursor:pointer' onclick=window.open('../enlarge.php?src="+this.fadeimages[picindex][0]+"')>";
             //"window.open("enlarge.php?img=aap", "grootbeeld", " width=800,height=700,scrollbars=yes,toolbar=yes,location=no, resizable=yes"); return false
             //href="'+this.fadeimages[picindex][1]+'" target="_self" 
             }
             this.slideHTML+='<img src="'+this.fadeimages[picindex][0]+'" alt="'+this.fadeimages[picindex][3]+'" border="'+this.imageborder+'px">'
             if (this.fadeimages[picindex][1]!="" && this.fadeimages[picindex][1]!="..."){ //if associated link exists for image
             //alert(this.fadeimages[picindex][1]);
             this.slideHTML+='</a>'
             //alert(slideHTML);
             }
             picobj.innerHTML=this.slideHTML;


             }
             ,


pointer: function(){
            this.style.cursor='pointer';
            },


nopointer: function(){
            this.style.cursor='default';
            }





}