var z = 10;
function Zindex(id) {
    document.getElementById(id).style.zIndex = z++;
}

function ZindexDecrease(id) {
    document.getElementById(id).style.zIndex = 0;
}

function ZindexChange(id, zValue) {
    document.getElementById(id).style.zIndex = zValue;
}
//-----------------------------------------------------------------------------
// Set CSS style for the Unordered List Element
function SetClass(ID) {
    var Element = document.getElementById(ID);
    Element.className = "JSborderOn";
   
 
}
function SetClassOff(ImgID) {
    var Element = document.getElementById(ImgID);
    Element.className = "JSborderOff";

}
function AlterPosition(id, NewTopPos, NewLeftPos) {
    var Element = document.getElementById(id);
    Element.style.left = NewLeftPos + "px";
    Element.style.top = NewTopPos + "px";
}


function LimitedSize(ImgID) {
    var i;

    var Element = document.getElementById(id);
    if (Element.filesize > 102400) {
        return false;
    }
} 






//-------------------------------------------------------------------------------
// Get the images within the Table or Div or any other elements
// and increase the width of the images
function ZoomImage(type,whichId,maxW,w,h) {
    var Element = document.getElementById(whichId); 
    var pix = document.getElementById(whichId).getElementsByTagName('img');
   for (i = 0; i < pix.length; i++) {
       // w = pix[i].width;
       // h = pix[i].height;
        if (type=="In" && w < maxW) {
            f = 1 - ((w - maxW) / w);
            pix[i].style.width = (w * f) + "px";
            pix[i].style.height = (h * f) + "px";
        }
        if (type == "Out" && w > maxW) {
            f = 1 - ((w - maxW) / w);
            pix[i].style.width = (w * f) + "px";
            pix[i].style.height = (h * f) + "px";
        }
    }

}

function AlterProcessOnZoomIn(whichId) {
    var Element = document.getElementById(whichId);
    // Alter Each Row by ID
   
    switch (Element.id) {// top , left position
        case 'gallery-1': ZindexChange('gallery-1', '3'); ZoomImage('In', 'gallery-1', '161', '115', '77'); AlterPosition('gallery-1', '0', '0'); SetClass('gallery-1');
            ZindexChange('gallery-2', '2'); ZoomImage('In','gallery-2','148','127','86'); AlterPosition('gallery-2', '33', '30');
            ZindexChange('gallery-3', '1');                                 AlterPosition('gallery-3', '76', '60');
            ZindexChange('gallery-4', '-1'); ZoomImage('Out','gallery-4','127','148','100'); AlterPosition('gallery-4', '126', '90');
            ZindexChange('gallery-5', '-1'); ZoomImage('Out','gallery-5','115','161','109'); AlterPosition('gallery-5', '183', '120'); 
  
        break;

    case 'gallery-2': ZindexChange('gallery-2', '3'); ZoomImage('In','gallery-2','161','127','86'); AlterPosition('gallery-2', '33', '0'); SetClass('gallery-2');
        ZindexChange('gallery-1', '1'); ZoomImage('In','gallery-1', '148','115', '77'); AlterPosition('gallery-1', '0', '30');
        ZindexChange('gallery-3', '2'); AlterPosition('gallery-3', '76', '60');
        ZindexChange('gallery-4', '0'); ZoomImage('Out', 'gallery-4', '127', '148', '100'); AlterPosition('gallery-4', '126', '90');
        ZindexChange('gallery-5', '-1'); ZoomImage('Out', 'gallery-5', '115', '161', '109'); AlterPosition('gallery-5', '183', '120'); 
  
        break;
        
    
     case 'gallery-3': ZindexChange('gallery-3', '3'); ZoomImage('In','gallery-3', '161', '137', '93'); AlterPosition('gallery-3', '76', '0'); SetClass('gallery-3');
         ZindexChange('gallery-1', '1'); ZoomImage('In', 'gallery-1', '137', '115', '77'); AlterPosition('gallery-1', '0', '60');
         ZindexChange('gallery-2', '2'); ZoomImage('In', 'gallery-2', '148', '127', '86'); AlterPosition('gallery-2', '33', '30');
         ZindexChange('gallery-4', '0'); ZoomImage('Out','gallery-4', '127', '148', '100'); AlterPosition('gallery-4', '126', '90');
         ZindexChange('gallery-5', '-1'); ZoomImage('Out', 'gallery-5', '115', '161', '109'); AlterPosition('gallery-5', '183', '120'); 
  
        break;

    case 'gallery-4': ZindexChange('gallery-4', '3'); ZoomImage('In', 'gallery-4', '161', '148', '100'); AlterPosition('gallery-4', '126', '0'); SetClass('gallery-4');
        ZindexChange('gallery-1', '0'); ZoomImage('In', 'gallery-1', '127', '115', '100'); AlterPosition('gallery-1', '0', '120');
        ZindexChange('gallery-2', '1'); ZoomImage('In', 'gallery-2', '137', '127', '77'); AlterPosition('gallery-2', '33', '90');
        ZindexChange('gallery-3', '2'); ZoomImage('In', 'gallery-3', '148', '137', '93'); AlterPosition('gallery-3', '76', '60');
        ZindexChange('gallery-5', '-1'); ZoomImage('Out', 'gallery-5', '115', '161', '109'); AlterPosition('gallery-5', '183', '120');
       
        break;

    case 'gallery-5': SetClass('gallery-5');
        break;
 
    }
    
}

function AlterProcessOnZoomOut(whichId, TotalImages) {
    var Element = document.getElementById(whichId);

    // how many images in a row
    // if there is only two images per row
    switch (Element.id) {
        case 'gallery-1': 
            ZoomImage('Out', 'gallery-1', '115', '161', '109'); AlterPosition('gallery-1', '0', '120'); ZindexChange('gallery-1', '-1'); SetClassOff('gallery-1');
            ZoomImage('Out', 'gallery-2', '127', '148', '100'); AlterPosition('gallery-2', '33', '90'); ZindexChange('gallery-2', '0');
                                                                AlterPosition('gallery-3', '76', '60'); ZindexChange('gallery-3', '1');
            ZoomImage('In', 'gallery-4', '148', '127', '109'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2');
            ZoomImage('In','gallery-5', '161','115','77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
            
            break;



        case 'gallery-2':
            if (TotalImages < 26) {
                ZoomImage('In', 'gallery-5', '161', '115', '77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
                ZoomImage('In', 'gallery-4', '148', '127', '86'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2');
                AlterPosition('gallery-3', '76', '60'); ZindexChange('gallery-3', '1');
                ZoomImage('Out', 'gallery-2', '127', '161', '109'); AlterPosition('gallery-2', '33', '90'); ZindexChange('gallery-2', '0'); SetClassOff('gallery-2');
         }
            ZoomImage('Out', 'gallery-1', '115', '148', '100'); AlterPosition('gallery-1', '0', '120'); ZindexChange('gallery-1', '-1'); SetClassOff('gallery-2');
           

            break;


        case 'gallery-3':
            if (TotalImages < 25) {
                ZoomImage('Out', 'gallery-3', '137', '161', '109'); AlterPosition('gallery-3', '76', '60'); ZindexChange('gallery-3', '1'); SetClassOff('gallery-3');
                ZoomImage('In', 'gallery-4', '148', '127', '86'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2');
                ZoomImage('In', 'gallery-5', '161', '115', '77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
            }
            ZoomImage('Out', 'gallery-3', '137', '161', '109'); AlterPosition('gallery-3', '76', '60'); ZindexChange('gallery-3', '1'); SetClassOff('gallery-3');
            ZoomImage('In', 'gallery-4', '148', '127', '86'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2');
            ZoomImage('In', 'gallery-5', '161', '115', '77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
            ZoomImage('Out', 'gallery-1', '115', '137', '93'); AlterPosition('gallery-1', '0', '120'); ZindexChange('gallery-1', '-1');
            ZoomImage('Out', 'gallery-2', '127', '148', '100'); AlterPosition('gallery-2', '33', '90'); ZindexChange('gallery-2', '0');

            break;


        case 'gallery-4':
            if (TotalImages <= 10) {
                ZoomImage('Out', 'gallery-4', '148', '161', '109'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2'); SetClassOff('gallery-4');
                ZoomImage('In', 'gallery-5', '161', '115', '77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
            }
            if ((TotalImages >= 10) && (TotalImages <= 26)) {
                ZoomImage('Out', 'gallery-3', '137', '148', '100'); AlterPosition('gallery-3', '76', '60'); ZindexChange('gallery-3', '1');
                ZoomImage('Out', 'gallery-4', '148', '161', '109'); AlterPosition('gallery-4', '126', '30'); ZindexChange('gallery-4', '2'); SetClassOff('gallery-4');
                ZoomImage('In', 'gallery-5', '161', '115', '77'); AlterPosition('gallery-5', '183', '0'); ZindexChange('gallery-5', '3');
                ZoomImage('Out', 'gallery-1', '115', '127', '86'); AlterPosition('gallery-1', '0', '120'); ZindexChange('gallery-1', '-1');
                ZoomImage('Out', 'gallery-2', '127', '137', '93'); AlterPosition('gallery-2', '33', '90'); ZindexChange('gallery-2', '0');

            }
            break;
            

        case 'gallery-5': SetClassOff('gallery-5');
            break;
    
    }


}


function GetParams(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regexS = "[\\?&]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec(window.location.href);
    if (results == null) return "";
    else return results[1]; 
    }

    function DisplayImages(ArrayImages) {
        var IdForElements = 5; var MaxRow = 5;
        var NumImages = ArrayImages.length;
        var j = 0;
        var MaxCount = 25;
        if (NumImages >= MaxCount) {NumImages = 25;}
        document.write("<ul id='gallery-" + IdForElements + "' onmouseout=AlterProcessOnZoomOut('gallery-" + IdForElements + "'," + NumImages + ") onmouseover=AlterProcessOnZoomIn('gallery-" + IdForElements + "');>");
        // Get Pageno
        for (i = 0; i < NumImages; i++) {
            if (i == MaxCount) return;
           
            if (j != MaxRow) {
                document.write("<li><a href='" + ImgArray[i] + "'><img src='" + ImgArray[i] + "'/></a></li>");

                if (j == 0) {
                    IdForElements = IdForElements - 1;
                }
                j = j + 1;
            }
            else {
                document.write("</ul><ul id='gallery-" + IdForElements + "' onmouseout=AlterProcessOnZoomOut('gallery-" + IdForElements + "'," + NumImages + ") onmouseover=AlterProcessOnZoomIn('gallery-" + IdForElements + "')>");
                document.write("<li><a href='" + ImgArray[i] + "'><img src='" + ImgArray[i] + "'/></a></li>");
                j = 1;
                IdForElements = IdForElements - 1;
            }



        } //end for loop
        document.write("</ul>");
    }
//---------------------------------------------------------------------------