function fade_info(idd, d_id){
var pars="functie=opdracht&id="+idd+"&d_id="+d_id;


var myAjax = new Ajax.Request(
           fade_url,
           {
           method: 'get',
           parameters: pars,
           onComplete: getFadeinfo
           });

if(idd!=0){
$('opdrachtcontent').style.display="block";
$('container').style.display="none";
var myAjax = new Ajax.Updater(
           {success: $('opdrachtcontent')},
           menu_url,
           {
           method: 'get',
           parameters: pars,
           onFailure: reportError
           });

}


}

function reportError(request){
alert('Sorry. Er was een fout.');
}

function getFadeinfo(originalRequest){

new getFaded(originalRequest);
}

var getFaded = Class.create();
getFaded.prototype = {

initialize: function(originalRequest) {
           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]);
           document.title=detitel;
           }

           $('contact').style.display="none";
           /******* verwerken request naar vars ***************/

           this.originalRequest= originalRequest;
           this.response       = originalRequest.responseXML.documentElement;
           this.responset      = originalRequest.responseText;
           this.response_parts = "";
           this.fadeimages     = new Array()
           this.illustraties   = originalRequest.responseXML.getElementsByTagName('illustraties');
           this.opdrachtinfo   = originalRequest.responseXML.getElementsByTagName('opdrachtinfo');

           /******* voorbereiden overige vars ***************/
           this.fadeimages         = new Array();
           this.imageborder        = 0;
           this.fadewidth          = 443;
           this.fadeheight         = 443;
           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        = "";



           fadearray[0]=this;

           this.slideshowid=fadearray.length-1;
           this.canvasbase="canvas"+this.slideshowid;



           if(this.illustraties.length>0){
           for (var i=0;i<this.illustraties.length;i++){
           if(i==0){
           this.map=this.illustraties[i].getElementsByTagName('map')[0].firstChild.nodeValue;
           }
           this.opdracht=this.illustraties[i].getElementsByTagName('opdracht')[0].firstChild.nodeValue;


           this.illustratienaam=this.illustraties[i].getElementsByTagName('illustratie')[0].firstChild.nodeValue;
           this.illustratie=new Image();
           this.illustratie.src="images/portfolio/"+this.map+"/"+this.illustratienaam;
           //window.status=window.status+" | "+this.illustratie.src;
           this.titel=this.illustraties[i].getElementsByTagName('titel')[0].firstChild.nodeValue;
           this.url=this.illustraties[i].getElementsByTagName('url')[0].firstChild.nodeValue;
           this.url_title=this.illustraties[i].getElementsByTagName('url_title')[0].firstChild.nodeValue;
           this.fadeimages[i]=[this.illustratie.src, this.url, this.url_title, this.titel]


            if(i==0){//<hr width='114px'> <span id='opdracht_titel'>"+this.opdracht+"</span>
            this.titel_inner+="<b style='color:#303030'>"+this.opdracht+"</b><br>";
            this.titel_inner+="<span id='link_"+i+"' style='color:#0071b9'>"+this.fadeimages[i][3]+"</span> ";

            }else{
            if(this.opdracht!=this.vorige_opdracht){
            this.titel_inner+="<br><br><b>"+this.opdracht+"</b><br>";
            this.titel_inner+=" <span id='link_"+i+"'>"+this.fadeimages[i][3]+"</span>";

            }else{
            this.titel_inner+=" - <span id='link_"+i+"'>"+this.fadeimages[i][3]+"</span>";
            }

            }

            this.vorige_opdracht=this.opdracht;

           }


           $('titels').innerHTML=this.titel_inner; //+"<hr width='114px'>"


           this.startit();
           }
           },


rotate_title: function(){
             var detitels=$('titels').getElementsByTagName('SPAN')

             for(i=0; i<detitels.length; i++){
             this.div=detitels[i];
             if(i==this.curimageindex){
             this.div.style.color="#0071b9";
             this.div.onclick     = this.no_slide.bindAsEventListener(this.div);
             this.div.onmouseover = this.nopointer.bindAsEventListener(this.div);
             }else{
             this.div.style.color="#303030";
             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= $(objee.nextcanvas); //iebrowser? iebrowser[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();

            },

no_slide: function(){
            window.status="hold";

            },


startit: function(){
            var crossobj=$(this.curcanvas)      //iebrowser? iebrowser[this.curcanvas] :

            $('controls').innerHTML="";
            //this.stopbutton             = new Image()
            this.stopbutton               = document.createElement("IMG");
            this.stopbutton.src           = "images/portfolio/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);
            //$('titels').innerHTML="";

            //this.playbutton             = new Image()
            this.playbutton               = document.createElement("IMG");
            this.playbutton.src           = "images/portfolio/play.gif";
            this.playbutton.alt           = "slideshow gestart";
            this.playbutton.id            = "playbutton";
            //this.playbutton.onclick     = this.mouseovercheck2.bindAsEventListener(this);

            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);

            //$('master0').onmouseover=this.mouseovercheck1.bindAsEventListener(this);   //function(){cacheobj.mouseovercheck=1}
            //$('master0').onmouseout=this.mouseovercheck2.bindAsEventListener(this);   //function(){cacheobj.mouseovercheck=0}
            }

            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;
           //alert(fadearray[0].stopbutton);
           fadearray[0].stopbutton.src         = "images/portfolio/stop.gif";

           fadearray[0].stopbutton.alt         = "slideshow gestopt";
           fadearray[0].stopbutton.onmouseover = fadearray[0].nopointer.bindAsEventListener(this.stopbutton);

           fadearray[0].playbutton.src         = "images/portfolio/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         = "images/portfolio/stop_on.gif";
           fadearray[0].stopbutton.alt         = "slideshow stoppen";
           fadearray[0].stopbutton.onmouseover = fadearray[0].pointer.bindAsEventListener(this.stopbutton);

           fadearray[0].playbutton.src         = "images/portfolio/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){

             var slideHTML=""

             if (this.fadeimages[picindex][1]!="..."){ //if associated link exists for image
             this.surl=this.fadeimages[picindex][1];

             if(this.surl.match('http://')!=null){
             slideHTML+='<a href="'+this.surl+'" target="'+this.fadeimages[picindex][2]+'" title="'+this.fadeimages[picindex][3]+'">'
             }else{                   //fade_info('$o_id', '')
             slideHTML+='<a onclick="fade_info('+this.surl+', 0)" target="'+this.fadeimages[picindex][2]+'" title="'+this.fadeimages[picindex][3]+'">'
             }


             }

             slideHTML+='<img style="cursor:pointer" alt="'+this.fadeimages[picindex][3]+'" src="'+this.fadeimages[picindex][0]+'" border="'+this.imageborder+'px">'
             if (this.fadeimages[picindex][1]!="..."){ //if associated link exists for image
             slideHTML+='</a>'
             }
             picobj.innerHTML=slideHTML;


             }
             ,


pointer: function(){

            this.style.cursor='pointer';
            },


nopointer: function(){
            this.style.cursor='default';
            }





}