// JScript File
var qsParm = new Array();
var xmlHttp;
var i;
var imageselected = "0";
var galleryid = '0';
var STAF_path;
var pagechange = false;
/* This configuration information is moved the code behind file GalleryDetails.ascx:
var maxwidth = 600;
var pagesize = 6;
var thumbWidth = 75;
var thumbHeight = 75;
*/

// Loads images 
function loadImages()
{
  document.getElementById("GalleryWrapper").innerHTML = "<img class='ajax_loader' src='images/ajax_loading_sq.gif' />";
  var currentPage = parseInt(document.getElementById("CurrentPage").innerHTML,10);
  var totalPages = parseInt(document.getElementById("TotalPages").innerHTML,10);
  showLayer("Previous",prevtxt);
  showLayer("Next",nexttxt);  
  if(currentPage <= 1 )
  {
     hideLayer("Previous");
  }
  else 
  {
    if(currentPage >= totalPages)
    {
        hideLayer("Next");
        
    }    
  }
  getImages(currentPage,galleryid);
        
}

// This is a post-back for the initial file load
function getImages_PostBack(response)
{
    try {
    var ds = response.value;
    var s = new Array();
    document.getElementById("GalleryWrapper").innerHTML = "";
    if(ds!=null && typeof(ds) == "object" && ds.Tables!=null) 
	{
        
        document.getElementById("TotalRecs").innerHTML = ds.Tables[0].Rows[0].TotalRecs;
	    document.getElementById("RecsPerPage").innerHTML = ds.Tables[0].Rows[0].RecsPerPage;
	    document.getElementById("TotalPages").innerHTML = ds.Tables[0].Rows[0].TotalPages;
	    document.getElementById("CurrentPage").innerHTML = ds.Tables[0].Rows[0].CurrentPage;
	    document.getElementById("GalleryName").innerHTML = ds.Tables[0].Rows[0].GalleryName;
	    imageselected = ds.Tables[0].Rows[0].FirstImageId;
		var path = ds.Tables[0].Rows[0].FirstImagePath;
		var filename = path.substring(path.lastIndexOf('\/')+1);
	    if(ds.Tables[0].Rows[0].FirstImagePath != '')
	    {
	       
            if(parseInt(ds.Tables[0].Rows[0].FirstImageWidth,10) > maxwidth)
            {
                document.getElementById("FullImage").innerHTML = "<img src='"+ds.Tables[0].Rows[0].FirstImagePath+"' width='"+maxwidth+"' border='0' />";
                //document.getElementById("FullImage").innerHTML = "<img style='background-image:url("+path.replace(filename,"ori_"+filename)+");background-attachment: scroll;background-repeat:no-repeat;' src='images/spacer.gif' width='350px' height='250px' border='0' />";
            }
            else 
            {
                document.getElementById("FullImage").innerHTML = "<img src='"+ds.Tables[0].Rows[0].FirstImagePath+"' width='"+ds.Tables[0].Rows[0].FirstImageWidth+"' height='"+ds.Tables[0].Rows[0].FirstImageHeight+"' border='0' />";
            }   //document.getElementById("FullImage").innerHTML = "<img style='background-image:url("+path.replace(filename,"ori_"+filename)+");background-attachment: scroll;background-repeat:no-repeat;' src='images/spacer.gif' width='350px' height='250px' border='0' />";        
	        
			//alert(path.replace(filename,"ori_"+filename));
			document.getElementById("ImageLink").innerHTML = "<a href='"+path.replace(filename,"ori_"+filename)+"' target='_blank' class='small'>View Full Image</a>"; 
			//document.getElementById("ImageLink").innerHTML = "<a href='"+ds.Tables[0].Rows[0].FirstImagePath+"' target='_blank' class='small'>View Full Image</a>"; 
	        document.getElementById("Caption").innerHTML = ds.Tables[0].Rows[0].FirstImageCaption;
	    }
	    if(ds.Tables[0].Rows[0].TotalRecs == '0')
	    {
	        document.getElementById("GalleryWrapper").innerHTML = "There are no images here yet.";
	        document.getElementById("FullImage").innerHTML = "";
	        document.getElementById("Caption").innerHTML = "";
	        
	        hideLayer("Previous");
	        hideLayer("Next");
	    }
	    else 
	    {
	        if(parseInt(ds.Tables[0].Rows[0].TotalRecs) <= parseInt(ds.Tables[0].Rows[0].RecsPerPage))
	        {
	            hideLayer("Previous");
	            hideLayer("Next");
	        }
	        qs();
	        if(qsParm["page"] != null)
	        {
	            var tp = parseInt(ds.Tables[0].Rows[0].TotalPages,10);
	            var cp = parseInt(qsParm["page"],10);
	            if(cp <= tp)
	            {
	                document.getElementById("CurrentPage").innerHTML = qsParm["page"];	            
	                loadImages();           
	            }
	            else 
	            {
	                getImages('1',galleryid);
	            }
	        }
	        else 
	        {
	            getImages('1',galleryid);
	        }    	        
	       
	    }
	    
	}
	}catch(e)
	{
	    alert(e.description);
	}
}

function showImage(path,width,height,imgid,caption)
{
    
    var ele = document.getElementById("Image_"+imageselected);
    if(ele != null)
    {
        ele.className = "ImageNoBorder";
    }
    imageselected = imgid;
    var filename = path.substring(path.lastIndexOf('\/')+1);
    document.getElementById("Image_"+imgid).className = "ImageBorder";
	if(parseInt(width,10) > maxwidth)
    {
        document.getElementById("FullImage").innerHTML = "<img src='"+path+"' width='"+maxwidth+"' border='0' />";
        //document.getElementById("FullImage").innerHTML = "<img style='background-image:url("+path.replace(filename,"ori_"+filename)+");background-attachment: scroll;background-repeat:no-repeat;' src='images/spacer.gif' width='350px' height='250px' border='0' />";
		//document.getElementById("FullImage").innerHTML = "<img src='"+path.replace(filename,"ori_"+filename)+"' width='"+maxwidth+"' border='0' />"
    }
    else 
    {
        document.getElementById("FullImage").innerHTML = "<img src='"+path+"' width='"+width+"' height='"+height+"' border='0' />";
        //document.getElementById("FullImage").innerHTML = "<img style='background-image:url("+path.replace(filename,"ori_"+filename)+");background-attachment: scroll;background-repeat:no-repeat;' src='images/spacer.gif' width='350px' height='250px' border='0' />";
		//document.getElementById("FullImage").innerHTML = "<img src='"+path.replace(filename,"ori_"+filename)+"'  border='0' />"
    }
    
    /* This old implementation where the Full image is centered.
    if(parseInt(width,10) > maxwidth)
	{
	   var diff = (parseInt(width,10)- maxwidth);
	   document.getElementById("FullImage").innerHTML = "<div class='ImageWrapper' style='background-image: url(" + path + ");background-position:-"+(diff - diff/2)+"px;background-attachment: scroll;'><img src='images/spacer.gif' width='600' height='600' alt='' /></div>";
	}
	else 
	{
	   document.getElementById("FullImage").innerHTML = "<div class='ImageWrapper' style='background-image: url(" + path + ");' ><img src='images/spacer.gif' width='600' height='600' alt='' /></div>";
	}
    */
	
    document.getElementById("ImageLink").innerHTML = "<a href='"+path.replace(filename,"ori_"+filename)+"' target='_blank' >View Full Image</a>";
	//document.getElementById("ImageLink").innerHTML = "<a href='"+path+"' target='_blank' >View Full Image</a>"; 
    if(caption != null)
    document.getElementById("Caption").innerHTML = caption;
    else 
    document.getElementById("Caption").innerHTML = "";
    var cp = document.getElementById("CurrentPage").innerHTML;
    // Send to a friend variable is set 
    STAF_path = window.location.href;
    STAF_path = STAF_path.replace('page=','');
    STAF_path = STAF_path.replace('ImageID=','');
    STAF_path = STAF_path+"&page="+cp+"&ImageID="+imgid;  
    if(useSTAF)
    sf_settargeturl(STAF_path);   
    getImageMetaData(imgid);  
        
}

function getPreviousPage()
{
    pagechange = true;
    var currentPage = parseInt(document.getElementById("CurrentPage").innerHTML,10);
    currentPage = currentPage -1;
    if(currentPage >= 1)
    {
        document.getElementById("CurrentPage").innerHTML = currentPage;
        loadImages();
                
    }
    hideShowDivider();    
}

function getNextPage()
{
    pagechange = true;
    var currentPage = parseInt(document.getElementById("CurrentPage").innerHTML,10);
    currentPage = currentPage + 1;
    var totalPages = parseInt(document.getElementById("TotalPages").innerHTML,10);
    if(currentPage <= totalPages)
    {
        document.getElementById("CurrentPage").innerHTML = currentPage; 
        loadImages();
               
    }
    hideShowDivider();   
}

function showLayer(name,msg)
{
    document.getElementById(name).className = "showMsg";
    document.getElementById(name).innerHTML = msg;
}
function hideLayer(name)
{
     document.getElementById(name).className = "hideMsg";     
}
function callTable(i)
{
    ImageListing.getTableTest(i,callTable_PostBack);
}

function callTable_PostBack(response)
{
   var tb = response.value;
   
}

function createXMLHttpRequest() 
{
    if (window.ActiveXObject) 
    {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } 
    else if (window.XMLHttpRequest) 
    {
        xmlHttp = new XMLHttpRequest();
    }
}


function getImages(currentPage, id)
{
    if(id == '0')
    id = qsParm['GalleryID'];
    var sPath = window.location.pathname;
    //var sPage = sPath.substring(sPath.lastIndexOf('\\') + 1);
    var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
	var submitURL = ""
	+ "galleryXML.aspx?"
	+ "GalleryID="+ id
	+ "&CurrentPage=" + currentPage
	+ "&PageSize=" +pagesize;
	
	createXMLHttpRequest();
		xmlHttp.onreadystatechange = handleStateChange;
		xmlHttp.open("GET", submitURL, true);
		xmlHttp.send(null);
}


function handleStateChange() 
{
   try {
   if(xmlHttp.readyState==4&&xmlHttp.status==200)
      {
          var xmlDoc =  xmlHttp.responseText;
          var parser = new DOMImplementation();

          var domDoc = parser.loadXML(xmlDoc);
             
          var docRoot = domDoc.getDocumentElement();
       
          var els = docRoot.getElementsByTagName("Image");
          
          var s = new Array();
          
          qs();
          
          var qimgPath = "";
          var qimgWidth = ""
          var qimgHeight = "";
          var qimgCaption = "";
         if(els.length > 0)
          {
             if(qsParm["page"] != null && !pagechange )
             {
                qimgPath = docRoot.getElementsByTagName("ImagePath").item(0).getFirstChild().getNodeValue();
                qimgWidth = docRoot.getElementsByTagName("ImageWidth").item(0).getFirstChild().getNodeValue();
                qimgHeight = docRoot.getElementsByTagName("ImageHeight").item(0).getFirstChild().getNodeValue();                                  
             }   
          }        
          
          //s[s.length] = "<div class='ImageItems'>";         
          for(var i=0;i<els.length;i++)
          {
                var imgPath = docRoot.getElementsByTagName("ImagePath").item(i);
                var imgWidth = docRoot.getElementsByTagName("ImageWidth").item(i);
                var imgHeight = docRoot.getElementsByTagName("ImageHeight").item(i);
                var imgCaption = docRoot.getElementsByTagName("ImageCaption").item(i);
                var imgTPath = docRoot.getElementsByTagName("ImageThumbPath").item(i);
                var imgTWidth = docRoot.getElementsByTagName("ImageThumbWidth").item(i);
                var imgTHeight = docRoot.getElementsByTagName("ImageThumbHeight").item(i);
                var width = 0;                
                if(parseInt(imgTWidth,10) > thumbWidth)
                    {
                       var diff = imgTWidth - thumbWidth;
                       width = diff - diff/2; 
                    }
                    else 
                    {
                        width = imgTWidth;
                    }
                var imgID = docRoot.getElementsByTagName("ImageID").item(i);
                if(imgCaption.getFirstChild() == null)
                { 
                    
                   /*
                    s[s.length] = "<div class='ImageItem'>"
			                       +"<div class='ImageThumb'>"
			                       +"<a href=# onclick=showImage('"+imgPath.getFirstChild().getNodeValue()+"','"+imgWidth.getFirstChild().getNodeValue()+"','"+imgHeight.getFirstChild().getNodeValue()+"','"+imgID.getFirstChild().getNodeValue()+"') onmouseover=showBorder('"+imgID.getFirstChild().getNodeValue()+"') onmouseout=hideBorder('"+imgID.getFirstChild().getNodeValue()+"') >"
			                       +"<div class='ThumbWrapper' style='background-image: url(" + imgTPath.getFirstChild().getNodeValue() + ");background-position:center center;background-attachment: scroll;background-repeat:no-repeat;'>"
			                       +"<img  id='Image_"+imgID.getFirstChild().getNodeValue()+"' src='images/spacer.gif' width='"+thumbWidth+"' height='"+thumbHeight+"' alt='' border='0' />"
			                       +"</div>"			                       
			                       +"</a></div>";
			        s[s.length] = "</div>";
			        */
			        s[s.length] =  "<a class='thumbnail' href=javascript:showImage('"+imgPath.getFirstChild().getNodeValue()+"','"+imgWidth.getFirstChild().getNodeValue()+"','"+imgHeight.getFirstChild().getNodeValue()+"','"+imgID.getFirstChild().getNodeValue()+"') onmouseover=showBorder('"+imgID.getFirstChild().getNodeValue()+"') onmouseout=hideBorder('"+imgID.getFirstChild().getNodeValue()+"') >"
			                       //+"<div class='ThumbWrapper' style='background-image: url(" + imgTPath.getFirstChild().getNodeValue() + ");background-position:center center;background-attachment: scroll;background-repeat:no-repeat;'>"
			                       +"<img style='background-image:url(" + imgTPath.getFirstChild().getNodeValue() + ")' id='Image_"+imgID.getFirstChild().getNodeValue()+"' src='images/spacer.gif' width='"+thumbWidth+"' height='"+thumbHeight+"' alt='' border='0' />"
			                       //+"</div>"			                       
			                       +"</a>";
			        			         
			    }
			    else 
			    { 
			         s[s.length] = "<a class='thumbnail' href=javascript:showImage('"+imgPath.getFirstChild().getNodeValue()+"','"+imgWidth.getFirstChild().getNodeValue()+"','"+imgHeight.getFirstChild().getNodeValue()+"','"+imgID.getFirstChild().getNodeValue()+"') onmouseover=showBorder('"+imgID.getFirstChild().getNodeValue()+"') onmouseout=hideBorder('"+imgID.getFirstChild().getNodeValue()+"') >" 
			                       //+"<div class='ImageThumb'><a href=# onclick=showImage('"+imgPath.getFirstChild().getNodeValue()+"','"+imgWidth.getFirstChild().getNodeValue()+"','"+imgHeight.getFirstChild().getNodeValue()+"','"+imgID.getFirstChild().getNodeValue()+"','"+imgCaption.getFirstChild().getNodeValue()+"'); onmouseover=showBorder('"+imgID.getFirstChild().getNodeValue()+"') onmouseout=hideBorder('"+imgID.getFirstChild().getNodeValue()+"') >"
			                       //+"<div class='ThumbWrapper' style='background-image: url(" + imgTPath.getFirstChild().getNodeValue() + ");background-position:center center;background-attachment: scroll;background-repeat:no-repeat;'>"
			                       +"<img  style='background-image: url(" + imgTPath.getFirstChild().getNodeValue() + ")' id='Image_"+imgID.getFirstChild().getNodeValue()+"' src='images/spacer.gif' width='"+thumbWidth+"' height='"+thumbHeight+"' alt='' border='0' />"
			                       //+"</div>"			                     
			                       +"</a>";
			        			        
			        if(qsParm["ImageID"] != null )
		            {
		                if(imgID.getFirstChild().getNodeValue() == qsParm["ImageID"])
		                {
			                qimgCaption = imgCaption.getFirstChild().getNodeValue();
			             }
			        }    
			    }
			    
			    if(qsParm["ImageID"] != null )
		        {
		            if(imgID.getFirstChild().getNodeValue() == qsParm["ImageID"])
		            {
		                qimgPath = imgPath.getFirstChild().getNodeValue();
		                qimgWidth = imgWidth.getFirstChild().getNodeValue();
                        qimgHeight = imgHeight.getFirstChild().getNodeValue();                                                              
		            }		            
		        }		    
			                       
		  }
		       //s[s.length] = "</div>";
		       
		        // display a border around which image is selected during loading of the page.
		        document.getElementById("GalleryWrapper").innerHTML = s.join("");
		        if(qsParm["page"] != null && !pagechange)
		        {
		                if(qsParm["ImageID"] != null)
	                    {
		                      var el = document.getElementById("Image_"+qsParm["ImageID"]);
		                      if(el != null)
		                      imageselected = qsParm["ImageID"];
		                      else 
		                      {
		                          if(els.length > 0)
		                            {
		                               imageselected = docRoot.getElementsByTagName("ImageID").item(0).getFirstChild().getNodeValue();
		                            }   
		                      }		                  	    	            
	                    }
	                    else 
	                    {
	                        if(els.length > 0)
		                    {
		                       imageselected = docRoot.getElementsByTagName("ImageID").item(0).getFirstChild().getNodeValue();
		                    }
	                    }  
		        }
		        
		        		        		        
		        //alert(imageselected);
		        var ele = document.getElementById("Image_"+imageselected);
        	    if(ele != null)
	            {
	                ele.className = "ImageBorder";
	            }
	            
	            // Write Tally information
	               var totalrecs = parseInt(document.getElementById("TotalRecs").innerHTML,10);
	               var totalpages = parseInt(document.getElementById("TotalPages").innerHTML,10);
	               var currentpage = parseInt(document.getElementById("CurrentPage").innerHTML,10);
	               if(recdtally)
	               {
	                   if(totalrecs > (pagesize*(currentpage-1) + pagesize))
	                   document.getElementById("TallyText").innerHTML = "Showing "+(pagesize*(currentpage-1)+1)+" - "+(pagesize*(currentpage-1) + pagesize)+" of "+totalrecs;
	                   else 
	                   document.getElementById("TallyText").innerHTML = "Showing "+(pagesize*(currentpage-1)+1)+" - "+totalrecs+" of "+totalrecs;
	               }
	               if(pagetally)
	               document.getElementById("TallyTextPages").innerHTML = "Page "+currentpage+" of "+totalpages;
	               if(qsParm["ImageID"] != null && !pagechange)
	                {
		                //var el = document.getElementById("Image_"+qsParm["ImageID"]);
		                //if(el != null)
		                    showImage(qimgPath,qimgWidth,qimgHeight,imageselected,qimgCaption);
		                		    	            
	                }
	                
	                                                 
       }
    getImageMetaData(imageselected);
    //hideShowDivider();
      
   }catch(ex)
   {
        alert(ex.descripion);
   }   
}

function initialLoad(id)
{
  showLayer("Next",nexttxt);  
  hideLayer("Previous");
  //hideShowDivider();
  if(id == '0')
  {
    galleryid = qsParm['GalleryID'];   
  }
  else 
  {
    galleryid = id;
  }
    ImageListing.GetPagedImagesByGalleryID(galleryid,"1",pagesize,getImages_PostBack);
}


function qs() 
{
    var query = window.location.search.substring(1);
    var parms = query.split('&');
    for (var i=0; i<parms.length; i++) 
    {
        var pos = parms[i].indexOf('=');
        if (pos > 0) 
        {
        var key = parms[i].substring(0,pos);
        var val = parms[i].substring(pos+1);
        qsParm[key] = val;
        }
    }
}

function showBorder(imgid)
{
    var ele = document.getElementById("Image_"+imgid);
    if(ele != null)
    ele.className = "ImageBorder";
}

function hideBorder(imgid)
{
    var ele = document.getElementById("Image_"+imgid);
    if((ele != null) && (imgid != imageselected))
    ele.className = "ImageNoBorder";
        
}

// Get the dynamic Meta data properties for each image.
function getImageMetaData(imgid)
{
    try 
    {
        //alert("GalleryID: "+galleryid+" ImageID: "+imgid);
        ImageListing.GetImageMetaData(galleryid,imgid,getImageMetaData_Postback);
    }
    catch(ex)
    {
        alert(ex.description);
    }
    
}

function getImageMetaData_Postback(response)
{
    try 
    {
        var ds = response.value;
        var s = new Array();
        document.getElementById("ImageMetaData").innerHTML = "";
        if(ds!=null && typeof(ds) == "object" && ds.Tables!=null) 
	    {
	        if(ds.Tables[0].Columns.length > 16)
	        {
	            for(var i= 17;i<ds.Tables[0].Columns.length;i++)
	            {
	                if(ds.Tables[0].Rows[0][ds.Tables[0].Columns[i].Name] != "")
	                s[s.length] = "<div >"+ds.Tables[0].Columns[i].Name+" "+ds.Tables[0].Rows[0][ds.Tables[0].Columns[i].Name]+"</div>";
	            }
	            document.getElementById("Caption").innerHTML = ds.Tables[0].Rows[0].ImageCaption;
                if(showMeta)
                document.getElementById("ImageMetaData").innerHTML = s.join("");
            }
	    }
	}
	catch(ex)
	{
	    alert(ex.description);
	}
        
}

function hideShowDivider()
{
    if((document.getElementById("Next").className != "hideMsg") && (document.getElementById("Previous").className != "hideMsg"))
    {
       showLayer("Divider","&nbsp;|&nbsp;");                   
    }
    else 
    {
        hideLayer("Divider");  
    }
}