var WGalPrevImg=baseUrl+'/public/images/leftArrow.gif';
var WGalNextImg=baseUrl+'/public/images/rightArrow.gif'; 

var WGal = Class.create();

WGal.prototype = {

	initialize: function() {	
		
		objWGal = document.createElement("div");
		objWGal.setAttribute('id','WGal');
			
		var objContainer = document.createElement("div");
		objContainer.setAttribute('id','WGalImageContainer');
		objWGal.appendChild(objContainer);

            WGalImage = document.createElement("img");
	        WGalImage.setAttribute('id','WGalImage');
	   	    WGalImage.setAttribute('alt','[IMG]');
		    objContainer.appendChild(WGalImage);
	
		    var objImageData = document.createElement("div");
//		    objImageData.setAttribute('class','imageData');
		    objImageData.className='imageData';
		    objContainer.appendChild(objImageData);
	
    		    WGalPopis = document.createElement("p");
//    		    WGalPopis.setAttribute('class','popis');
                WGalPopis.className='popis';
    		    objImageData.appendChild(WGalPopis);

    		    WGalZdroj = document.createElement("p");
//    		    WGalZdroj.setAttribute('class','zdroj');
                WGalZdroj.className='zdroj';
    		    objImageData.appendChild(WGalZdroj);

		var objNavigator = document.createElement("div");
//		objNavigator.setAttribute('class','navigator');
        objNavigator.className='navigator';
		objWGal.appendChild(objNavigator);
	
    		var objPrevLink = document.createElement("a");
//    		objPrevLink.setAttribute('class','prev');
            objPrevLink.className='prev';
    		objPrevLink.setAttribute('href','#');
			objPrevLink.onclick = function () {myWGal.go(-1); return false;}
    		objNavigator.appendChild(objPrevLink);

        	   var objPrevImg = document.createElement("img");
		       objPrevImg.setAttribute('alt','<');
		       objPrevImg.setAttribute('src',WGalPrevImg);
		       objPrevLink.appendChild(objPrevImg);                
		
    		WGalPosition = document.createElement("span");
//    		WGalPosition.setAttribute('class','position');
            WGalPosition.className='position';  		
    		objNavigator.appendChild(WGalPosition);

    		var objNextLink = document.createElement("a");
//    		objNextLink.setAttribute('class','next');
            objNextLink.className='next';
    		objNextLink.setAttribute('href','#');
			objNextLink.onclick = function () {myWGal.go(1); return false;}
    		objNavigator.appendChild(objNextLink);
	
        	   var objNextImg = document.createElement("img");
		       objNextImg.setAttribute('alt','>');
		       objNextImg.setAttribute('src',WGalNextImg);
		       objNextLink.appendChild(objNextImg);                

		WGalThumbnails = document.createElement("div");
		WGalThumbnails.setAttribute('id','WGalThumbnails');
		objWGal.appendChild(WGalThumbnails);
		    		
		this.updateImageList();
		
        var WGalImages = document.getElementById('WGalImages');
        if (WGalImages)
            WGalImages.parentNode.replaceChild(objWGal,WGalImages);
	},

	updateImageList: function() {	
		if (!document.getElementsByTagName){ return; }

		var WGalImages = document.getElementById('WGalImages');
        
        if (WGalImages)
        {
            var images= WGalImages.getElementsByTagName('div');

		    var thumbnails = WGalThumbnails;

		    WGalImageArray = [];

            WGalWGalImageNum = 0;
        
            WGalActiveImage = -1;		

            // loop through all div tags

            for (var i=0; i<images.length; i++){
			    var image = images[i];
			
			    var thumbSrc = (image.getElementsByTagName('a')[0].getElementsByTagName('img')[0].getAttribute('src'));
			    var bigSrc = (image.getElementsByTagName('a')[0].getAttribute('href'));

    		    var pcka = image.getElementsByTagName('p');
                                                
                var popis='&nbsp;';
                var zdroj='&nbsp;';

                for (var p=0; p<pcka.length; p++){
	                var pcko = pcka[p];

                    if ((pcko.className=='popis')){
                        popis = pcko.innerHTML;
                    }

                    if ((pcko.className=='zdroj')){
                        zdroj = pcko.innerHTML;
                    }

/*
                if ((pcko.getAttribute('class')=='popis')){
                    popis = pcko.innerHTML;
                }

                if ((pcko.getAttribute('class')=='zdroj')){
                    zdroj = pcko.innerHTML;
                }
*/
                }
//            var popis = (image.getElementsByTagName('p')[0].getInnerHtml());
//            var zdroj = (image.getElementsByTagName('p')[1].getInnerHtml());

			    WGalImageArray[i]=(new Array(thumbSrc, bigSrc, popis, zdroj));
			
    		    var newLink = document.createElement("a");
    		    newLink.setAttribute('href','#');
			    newLink.onclick = function () {myWGal.showImage(this.imageNumber); return false;}
                newLink.imageNumber=i; // Je toto mozne pouzit?
                thumbnails.appendChild(newLink);
    		            
                var newImage = document.createElement("img");
	   	        newImage.setAttribute('src',thumbSrc);
	   	        newImage.setAttribute('alt','[THM]');
	       	    newLink.appendChild(newImage);	       	
		    }		

   		    var clir = document.createElement("div");
//   		clir.setAttribute('class','clir');
            clir.className='clir';
            thumbnails.appendChild(clir);
		
		    this.showImage(0);
		}
	},
	
	go: function(offset){
        if (((WGalActiveImage + offset) >= 0) && ((WGalActiveImage + offset) < WGalImageArray.length))
            this.showImage(WGalActiveImage + offset);
	},	
		
	showImage: function(i){        
		
		WGalImage.setAttribute('src',WGalImageArray[i][1]);
		
		WGalActiveImage = i;
		
		WGalPopis.innerHTML=WGalImageArray[i][2];
          
		WGalZdroj.innerHTML=WGalImageArray[i][3];
           
		  		  
		WGalPosition.innerHTML = ('Bild '+(i+1)+'/'+WGalImageArray.length);

		this.preloadNeighborImages();
	},

	preloadNeighborImages: function(){

		if((WGalImageArray.length - 1) > WGalActiveImage){
			preloadNextImage = new Image();
			preloadNextImage.src = WGalImageArray[WGalActiveImage + 1][0];
		}

		if(WGalActiveImage > 0){
			preloadPrevImage = new Image();
			preloadPrevImage.src = WGalImageArray[WGalActiveImage - 1][0];
		}	
	},

	end: function() {
	}
}

function initWGal() { myWGal = new WGal(); }
Event.observe(window, 'load', initWGal, false);