var i               = 0;
var cat             = null;
var startpos        = 0;
var werk            = new Array();
var preloaded       = new Array();
var images          = new Array();
var currentImage    = null;
var leeg            = new Image();
//leeg.src            ='images/noimage.gif';


function setHeight(){


    var myWidth = 0, myHeight = 0;
    if( typeof( window.innerWidth ) == 'number' ) {
        myHeight = window.innerHeight;
    } else if( document.documentElement && ( document.documentElement.clientWidth ||document.documentElement.clientHeight ) ) {
        myHeight = document.documentElement.clientHeight;
    } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
         myHeight = document.body.clientHeight;
    }
    
    containerHeight = (myHeight-461)/2;
    if(containerHeight<0){containerHeight=0;}
    
    if (is.dom){ 
            obj = document.getElementById('top').style; 
            obj.height = containerHeight + 'px'; 
            
            
        } else if(is.ie) { 
            obj = document.all['top'].style; 
            obj.height = containerHeight + 'px'; 
            
    } else if(is.ns4) { 
            obj = document.layers['top']; 
            obj.height = containerHeight + 'px'; 
            
    } 
    
    showDiv('container');   
}

function positionDiv(id,x)
{
        if (is.dom){ 
            document.getElementById(id).style.left =  x + 'px'; 
        } else if(is.ie) { 
            
            document.all[id].style.left = x + 'px'; 
            
        } else if(is.ns4) {  
            document.layers[id].left = x + 'px'; 
        } 
    
}

function positionDiv2(id,y)
{
        if (is.dom){ 
            document.getElementById(id).style.top =  y + 'px'; 
        } else if(is.ie) { 
            
            document.all[id].style.top = y + 'px'; 
            
        } else if(is.ns4) {  
            document.layers[id].top = y + 'px'; 
        } 
    
}


function showDiv(id)
{

if (is.dom){ 
            document.getElementById(id).style.visibility ='visible'; 
        } else if(is.ie) { 
            document.all[id].style.visibility ='visible'; 
    } else if(is.ns4) { 
            document.layers[id].visibility ='visible';
    } 
    
}


function hideDiv(id)
{

if (is.dom){ 
            document.getElementById(id).style.visibility ='hidden'; 
        } else if(is.ie) { 
            document.all[id].style.visibility ='hidden'; 
    } else if(is.ns4) { 
            document.layers[id].visibility ='hidden';
    } 
    
}


//Deze functie onderzoekt wat de desbetreffende browser ondersteunt.
function Is() { 
this.ie = document.all ? 1 : 0
this.ns4 = document.layers ? 1 : 0
this.dom = document.getElementById ? 1 : 0
} 

var is = new Is();

function writeLayer(layerID,txt){

if(document.getElementById){
document.getElementById(layerID).innerHTML=txt;
}else if(document.all){
document.all[layerID].innerHTML=txt;
}else if(document.layers){
with(document.layers[layerID].document){
open();
write(txt);
close();}}

}

function writeContents(richting){


if(werk!="")
    {
    
        //leeg beeld div(IE MAC//
        writeLayer('wrap3','');
        
        //actie op gallery
        if(richting =='next')
        {
            if(i == werk.length-1){i=0;}
            else{i=i+1;}
            currentImage=images['next'];
            
        }
        else if (richting =='prev')
        {
            
            if(i == 0){i = werk.length-1;}
            else{i=i-1;}
            currentImage=images['prev'];
        }
        else if (richting == 'init')
        {
            
            i = 0;
            images['current'] = new Image();
            images['current'].src ='images/'+werk[i][3];
            currentImage = images['current'].src;
        }
        
        //schrijven naar divs
        
        //samenstellen werk gegevens
        geg1 = "<p><b>"+werk[i][0]+" ></b><br>"+werk[i][1]+"</p><br>";
        
        //samenstellen klant gegevens
        geg2 = "<p><b>Klant ></b><br>"+werk[i][2]+"</p>";
        
        //samenstellen totaal tekst
        text = geg1 + geg2;
        
        //schrijf tekst
        setTimeout("writeLayer('tekst',text)",100);


        //als geen plaatje
        if(currentImage.indexOf(".")!=-1){
        writeLayer('wrap3','<img src='+currentImage+'  border=0>');}
        else{
        writeLayer('wrap3','<img src='+leeg.src+'  border=0>');
        }
        
        
        
            if(document.images)
            {
            images = preloadImages(i);
            }   
                
    }
    else
    {
    writeLayer('wrap3','<img src='+leeg.src+'  border=0>');
    writeLayer('tekst','<p><b>Geen werk van dit type vooralsnog!</b></p>');
    images['next']=null;
    images['prev']=null;
    }
    
    
    
}

function preloadImages(a)
{
    
        prevImage = new Image();
        nextImage = new Image();
        
        
        if(a - 1 < 0)
        {
            prevImage.src = 'images/'+werk[werk.length-1][3];
            
        }
        else
        {
            prevImage.src = 'images/'+werk[a-1][3];
            
        }
        
        if(a + 1 > werk.length-1)
        {
            nextImage.src = 'images/'+werk[0][3];
        }
        else
        {
            nextImage.src = 'images/'+werk[a+1][3];
        }
        
        images['next'] = nextImage.src;
        images['prev'] = prevImage.src;
        return images;
}

function initGallery(sel)
{
    
    if(!cat)
    {
    startpos = location.href.indexOf('=');
    sel = location.href.substring(startpos+1,startpos+4);
    cat=sel;
    }
    
    if(sel=='hui'){
        werk = huisstijlen;
    }
    if(sel=='per'){
        werk = periodieken;
    }
    if(sel=='bro'){
        werk = brochures;
    }
    if(sel=='mul'){
        werk = multimedia;
    }
    if(sel=='ill'){
        werk = illustraties;
    }
    if(sel=='div'){
        werk = diversen;
    }
    
    writeContents('init');
}

function getCat(sel)
{
    
    //als portefolio is open en categorie is bekend
    if(cat)
    {
    //init gallery
    initGallery(sel);
    }
    else
    {
    //open portfolio pagina
    location.href = 'portefoliodetail.html?cat='+sel;
    }
    
}