// Preview FUNCTIONS
 
var PreviewActive = false;
var CloseWindowText = "Close window";
var CloseWindowTextAr = "إغلاق";
var DownloadLowText = "Download low resolution image";
var DownloadLowTextAr = "تنزيل صورة قليلة التركيز";
var DownloadHighText = "Download high resolution image";
var DownloadHighTextAr = "تنزيل صور عالية التركيز";


var IsEnglish = true;
 
function showPreview(preview,low,high,title)
{         

    var pageUrl = window.location + "";
    if(pageUrl.indexOf("/ar/")!=-1){ 
        CloseWindowText = CloseWindowTextAr;
        DownloadLowText = DownloadLowTextAr;
        DownloadHighText = DownloadHighTextAr;
        IsEnglish = false;
    }

    if(!PreviewActive) addBlockOut(); 
                
    var previewImage = new Image();
    previewImage.onload = function () {                 
        if(PreviewActive) 
            updatePreview(generatePreviewHtml(previewImage.src,low,high,title),previewImage); 
        else 
            addPreview(generatePreviewHtml(previewImage.src,low,high,title),previewImage);              
    }
    previewImage.src = preview;       
    
    return false;
} 
function hidePreview()
{    
    new Effect.Fade("GalleryPreview", { duration: 0.3, afterFinish: function(){        
        removePreview();
        removeBlockOut();
        PreviewActive = false;    
    }    
    });
}

function addPreview(html,previewImage){

    PreviewActive = true;
    var PreviewDiv = document.createElement('div');    
    PreviewDiv.id = "GalleryPreview";    
    PreviewDiv.innerHTML = html;   
    PreviewDiv.style.visibility = "hidden";
    document.getElementsByTagName('body')[0].appendChild(PreviewDiv);              
 
    if(previewImage.width > 300){   
        PreviewDiv.style.width = (previewImage.width) + "px"; 
    }         
    
    var xPos =  $("Main").cumulativeOffset()[0] + ($("Main").clientWidth/2) - (PreviewDiv.clientWidth/2);
        
    PreviewDiv.style.left = xPos + "px";
    PreviewDiv.style.top = getScroll() + 120 + "px";
    PreviewDiv.style.visibility = "visible";
    PreviewDiv.style.display = "none";
    new Effect.Appear("GalleryPreview", { duration: 1.5});      
    
    TrackImageDownload();
}

function updatePreview(html,previewImage){   
 
    new Effect.Fade("GalleryPreview", { duration: 0.3, afterFinish: function(){    
        var PreviewDiv =  $("GalleryPreview");    
        PreviewDiv.innerHTML = html;     
        new Effect.Appear("GalleryPreview", { duration: 0.3 });     
    }    
    });   
}

function removePreview(){
    $("GalleryPreview").remove();
}


function addBlockOut()
{ 
    var blockOutDiv = document.createElement('div');    
    blockOutDiv.id = "GalleryBlockOut";

	blockOutDiv.style.height=getPageHeight()+"px"; 
			 
    var body = document.getElementsByTagName('body')[0];
	body.appendChild(blockOutDiv);
	
	Event.observe(blockOutDiv, 'click', this.hidePreview.bindAsEventListener(this), false);     
     
    // hide select boxes
    var select = $$('select'); 
    for(i=0; i<select.length; i++)
    {
        select[i].style.visibility = "hidden";
    }
     
}
function removeBlockOut()
{ 
    new Effect.Opacity('GalleryBlockOut', { 
      duration: 0.2,
      transition: Effect.Transitions.linear,
      from: 0.7, 
      to: 0,
      afterFinish: function(){
        $("GalleryBlockOut").remove();
      }
    });        
    
    // show select boxes
    var select = $$('select'); 
    for(i=0; i<select.length; i++)
    {
        select[i].style.visibility = "visible";
    }
}

function generatePreviewHtml(preview,low,high,title)
{
    // header
    html = '<div class="header"><a href="javascript: hidePreview()" class="iconClose">' + CloseWindowText + '</a></div>';    
    
    // content
    html+= '<div class="content clearfix imglib">';
    html+= '<div class="image"><img src="'+ preview + '" alt="Preview" title="Preview" /></div>';
    html+= '<div class="details">';
    if(title!="")  { html+= '<h3>'+title+'</h3>'; }    
    if(low!="")  { html+= '<div><a href="'+low+'" class="arrowRed" target="_blank">' + DownloadLowText + '</a></div>'; }
    if(high!=""){ html+= '<div><a href="'+high+'" class="arrowRed" target="_blank">' + DownloadHighText + '</a></div>'; }
    html+= '</div></div>';
    
    return html;
}

function getScroll()
{

    if(typeof(window.pageYOffset) == 'number') {        	
    	return window.pageYOffset;
  	} else if(document.body && (document.body.scrollLeft || document.body.scrollTop)) {	       
    	return document.body.scrollTop;
	} else if(document.documentElement) {
    	return document.documentElement.scrollTop;
  	}
  	return 0;
}


function getPageHeight(){
    var yScroll;
     
		if (window.innerHeight && window.scrollMaxY) {	 
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){  
			yScroll = document.body.scrollHeight;
		} else {  
			yScroll = document.body.offsetHeight;
		} 
		var windowHeight;
		if (self.innerHeight) {	 
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) { 
		 
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) {  
			windowHeight = document.body.clientHeight;
		}	 
		if(yScroll < windowHeight){
			yScroll = windowHeight;
		}  	 
		return yScroll		
}

function getPageWidth(){
 
    var yScroll;
     
		if (window.innerWidth && window.scrollMaxY) {	 
			yScroll = window.innerWidth + window.scrollMaxY;
		} else if (document.body.scrollWidth > document.body.offsetWidth){  
			yScroll = document.body.scrollWidth;
		} else {  
			yScroll = document.body.offsetWidth;
		} 
		var windowWidth;
		if (self.innerWidth) {	 
			windowWidth = self.innerWidth;
		} else if (document.documentElement && document.documentElement.clientWidth) { 
		 
			windowWidth = document.documentElement.clientWidth;
		} else if (document.body) {  
			windowWidth = document.body.clientWidth;
		}	 
		if(yScroll < windowWidth){
			yScroll = windowWidth;
		}  	 
		return yScroll		
}