/*  Zoom JavaScript uses Prototype JavaScript framework, version 1.6.0.2
 *  (c) 2008 Dexter Balboa - www.belvg.com
 *
 * Zoom 8.12.8
 *  Zoom is free.
 *  For details, see the BELVG web site: http://www.belvg.com/
 *
 *--------------------------------------------------------------------------*/
// var zoomIndex = 0;
 var indicator = 1;
 
 function beforeZoom(image, imageZoomW, imageZoomH) 
{
    /*$('imageZoom').value = image;
    $('imageZoomW').value = imageZoomW;
    $('imageZoomH').value = imageZoomH;
    Zoom();*/alert("Frame it!")
}

function getDimensionsScreen()
{

    if(screen.width < 1280 && screen.height < 1024)
    {
        zoomIndex = 1.1;
    }
    else
    {
        zoomIndex = 1.5;
    }
}
/*
function ZoomMolding(molding)
{
    if($('popZoomMolding'))
    {
        $('popZoomShadow').setStyle({display: "block"});
        if(indicator == 1)
        {
            $('popZoomLoading').setStyle({display: "block"});
        }

        var par = "";
        if(molding.enlarge1_path)
            par +='path1=../../resources/' + molding.enlarge1_path;
        if(molding.enlarge2_path)
            par +='&path2=../../resources/' + molding.enlarge2_path;
        
            new Ajax.Request("ajax/getimagesize.php",
            {method: 'get', parameters: par, onComplete: function(req){

                var widthImageElarge1 = 240 * zoomIndex;
                var heightImageElarge1 = 240 * zoomIndex;
                var widthImageElarge2 = 240 * zoomIndex;
                var heightImageElarge2 = 240 * zoomIndex;
            
                var ajaxData = eval('(' + req.responseText + ')');
                if(ajaxData['result'] == 1)
                {
                    if(ajaxData['resolution1'] != false)
                    {
                        var factor1 = ajaxData['resolution1'][0]/ajaxData['resolution1'][1];
                        
                        if(ajaxData['resolution1'][0] > ajaxData['resolution1'][1])
                        {
                            heightImageElarge1 = widthImageElarge1/factor1;
                        }
                        
                        if(ajaxData['resolution1'][0] < ajaxData['resolution1'][1])
                        {
                            widthImageElarge1 = heightImageElarge1*factor1;
                        }
                    }
                    
                    if(ajaxData['resolution1'] != false)
                    {
                        var factor2 = ajaxData['resolution2'][0]/ajaxData['resolution2'][1];

                        if(ajaxData['resolution2'][0] > ajaxData['resolution2'][1])
                        {
                            heightImageElarge2 = widthImageElarge2/factor2;
                        }
                        
                        if(ajaxData['resolution2'][0] < ajaxData['resolution2'][1])
                        {
                            widthImageElarge2 = heightImageElarge2*factor2;
                        }
                    }
                }

                $('popZoomMolding').setStyle({visibility : "hidden"});
                $('popZoomMolding').className = "popZoomMolding";
                
                ////////
                var popZoomMoldingDiv = "<div id='popZoomMolding' style='background-color:#E0D3B3'>";

                    popZoomMoldingDiv += "<table class='table_mprofileinformation'>";
                
                    popZoomMoldingDiv += "<tr>";
                if(!molding.enlarge1_path || !molding.enlarge2_path)
                {
                    popZoomMoldingDiv +=        "<td colspan='8' style='text-align:center'>";
                }
                else
                {
                    popZoomMoldingDiv +=        "<td colspan='4' style='text-align:center'>";
                }
                if(molding.enlarge1_path)
                {
                    popZoomMoldingDiv += "<img border='0' width='" + widthImageElarge1 +"' height='" + heightImageElarge1 + "' src='../resources/" + molding.enlarge1_path + "' />";
                }
                if(molding.enlarge1_path && molding.enlarge2_path)
                {
                    popZoomMoldingDiv +=        "</td>";
                    popZoomMoldingDiv +=        "<td colspan='4' style='text-align:center'>";
                }
                if(molding.enlarge2_path)
                {
                    popZoomMoldingDiv += "<img border='0' width='" + widthImageElarge2 +"' height='" + heightImageElarge2 + "' src='../resources/" + molding.enlarge2_path + "' />";
                }
                    popZoomMoldingDiv +=        "</td>";
                    popZoomMoldingDiv += "</tr>";
                    
                    popZoomMoldingDiv += "<tr>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Profile:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.description;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Width:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.width;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Color:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.color;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Finish:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.finish;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv += "</tr>";
                    
                    popZoomMoldingDiv += "<tr>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Material:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.material;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Height:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding.height;
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Class:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  molding['class'];
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv +=     "<td>";
                    popZoomMoldingDiv +=     "Price:";
                    popZoomMoldingDiv +=     "</td>";
                    popZoomMoldingDiv +=      "<td style='text-align:left'>";
                    popZoomMoldingDiv +=  $F(molding.type + '_prices');
                    popZoomMoldingDiv +=      "</td>";
                    popZoomMoldingDiv += "</tr>";
                    popZoomMoldingDiv += "<tr><td colspan='8'></td></tr>";

                    popZoomMoldingDiv += "</table>";
                    

                    popZoomMoldingDiv += "<div id='textdo' style='background-color: #7B6D6A; text-align:center; margin: 0px -10px 0px -10px;'>";
                    popZoomMoldingDiv += "<table style='width:100%; font-weight:bold;'>";
                    popZoomMoldingDiv += "<tr>";
                    popZoomMoldingDiv += "<td style='width:55%;text-align:right;font-size:12px!important; color:#fff!important;'>";
                    popZoomMoldingDiv += "Frame details";
                    popZoomMoldingDiv += "</td>";
                    popZoomMoldingDiv += "<td style='width:45%; text-align:right; font-size:12px!important;'>";
                    popZoomMoldingDiv += "<span style='cursor:pointer;'>close</span> or Esc Key";
                    popZoomMoldingDiv += "</td>";
                    popZoomMoldingDiv += "</tr>";
                    popZoomMoldingDiv += "</table>";
                    popZoomMoldingDiv += "</div>";
                    
                    popZoomMoldingDiv += "<\/div>";

                    new Insertion.Top('popZoomMolding', popZoomMoldingDiv);
                
                var heightPopZoomMolding = heightImageElarge1;
                
                if(heightImageElarge1 < heightImageElarge2)
                {
                    heightPopZoomMolding = heightImageElarge2;
                }

                
                $('popZoomMolding').setStyle({
                   width          : 770 + "px",
                   height         : heightPopZoomMolding + 100 + "px",
                   "margin-left"  : "-" + 770/2 + "px",
                   "margin-top"   : "-" + heightPopZoomMolding/2 - 40 + "px",
                   overflow       : "hidden"
                });
                //////////
                
                if (indicator == 1)
                {
                    window.setTimeout(function() {
                                $('popZoomMolding').setStyle({visibility: "visible"});
                                $('popZoomLoading').setStyle({display: "none"});
                                Event.observe(document, 'keypress', function (event) {
                                idicator = 0;
                                        if(event.keyCode == 27 && $('popZoomMolding').getStyle('visibility') == 'visible')
                                        {
                                            ZoomOff();
                                        }
                                });
                        }, 1000);
                }
                else
                {
                    $('popZoomMolding').setStyle({visibility: "visible"});
                    
                    Event.observe(document, 'keypress', function (event) {
                        if(event.keyCode == 27 && $('popZoomMolding').getStyle('visibility') == 'visible')
                        {
                            indicator = 0;
                            ZoomOff();
                        }
                    });
                }
            }});
    }
}
*/
 
function ZoomFrame() 
{
    var tmpWidth = 0;
    var tmpHeigth = 0;
    var controlFullZoom = 1;
    var imageholdermarginleft = '';
    var imageholdermargintop = '';

    if($('popZoom'))
    {
        var zoomWidth = CANVAS_WINDOW_W * zoomIndex;
        var zoomHeight = CANVAS_WINDOW_H * zoomIndex;
    
        $('popZoomShadow').setStyle({display: "block"});
        if(indicator == 1)
        {
            $('popZoomLoading').setStyle({display: "block"});
        }
    

        $('popZoom').setStyle({visibility : "hidden"});
        $('popZoom').className = "popZoom";

        var MoiZoom = new artProject('popZoom', {canvasW: zoomWidth, canvasH: zoomHeight});
        MoiZoom.wallcolor.style.backgroundColor;
        MoiZoom.drawProject();
        
        var DimentionsDivs = MoiZoom.getDimensions();

        var wallcolor = this.$('wallcolor');
        var frameHolder = this.$('frameHolder');
        var filletHolder = this.$('filletHolder');
        var topMatHolder = this.$('topMatHolder');
        var mmatHolder = this.$('mmatHolder');
        var bottommatHolder = this.$('bottommatHolder');
        var vgHolder = this.$('vgHolder');
        var linerHolder = this.$('linerHolder');
        var imgHolder = this.$('imgHolder');
        
        var AClip = new Object();
                
        clipsImage = imgHolder.getStyle('clip');
        controlFullZoom = 0;
        clipsImage = clipsImage.replace(/^rect\((.*)\).*$/, "$1");
        clipsImage = clipsImage.replace(/,/g, "");
        clipsImage = clipsImage.replace(/px/g, "");
        clipsImage = clipsImage.split(' ');


        for (var c=0; c < clipsImage.length; c++)
        {
            if (clipsImage[c] == "auto")
            {
                AClip[c] = 0;
            }
            else
            {
                AClip[c] = parseInt(clipsImage[c]);
            }
        }

        wallcolor.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.wallcolor.width + "px",
               height         : DimentionsDivs.wallcolor.height + "px",
               "margin-left"  : "-" + DimentionsDivs.wallcolor.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.wallcolor.height/2 - 20 + "px"
        });
        frameHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.frameHolder.width + "px",
               height         : DimentionsDivs.frameHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.frameHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.frameHolder.height/2 - 20 + "px"
        });
        filletHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.filletHolder.width + "px",
               height         : DimentionsDivs.filletHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.filletHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.filletHolder.height/2 - 20 + "px"
        });
        topMatHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.topMatHolder.width + "px",
               height         : DimentionsDivs.topMatHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.topMatHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.topMatHolder.height/2 - 20 + "px"
        });
        mmatHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.mmatHolder.width + "px",
               height         : DimentionsDivs.mmatHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.mmatHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.mmatHolder.height/2 - 20 + "px"
        });
        bottommatHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.bottommatHolder.width + "px",
               height         : DimentionsDivs.bottommatHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.bottommatHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.bottommatHolder.height/2 - 20 + "px"
        });
        vgHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.vgHolder.width + "px",
               height         : DimentionsDivs.vgHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.vgHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.vgHolder.height/2 - 20 + "px"
        });
        linerHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.linerHolder.width + "px",
               height         : DimentionsDivs.linerHolder.height + "px",
               "margin-left"  : "-" + DimentionsDivs.linerHolder.width/2 + "px",
               "margin-top"   : "-" + DimentionsDivs.linerHolder.height/2 - 20 + "px"
        });

        imageholdermarginleft = "-" + ((eval(AClip[1]) - (eval(AClip[3])))/2) - (eval(AClip[3]));

        if (eval(AClip[1]) == 0)
        {
            imageholdermarginleft = ((((eval(DimentionsDivs.imgHolder.width)/2) - eval(AClip[3])) - (eval(AClip[3])/2)) - (DimentionsDivs.imgHolder.width - eval(AClip[3]) ));
        }
        
        if (eval(AClip[3]) == 0 && eval(AClip[1]) == 0)
        {
            imageholdermarginleft = "-" + DimentionsDivs.imgHolder.width/2;
        }
        
        imageholdermargintop = "-" + ((eval(AClip[2]) - (eval(AClip[0])))/2) - 20 - (eval(AClip[0]));

        if (eval(AClip[2]) == 0)
        {
            imageholdermargintop = (((((eval(DimentionsDivs.imgHolder.height)/2) - eval(AClip[0])) - (eval(AClip[0])/2)) - (DimentionsDivs.imgHolder.height - eval(AClip[0]) )) -20 );
        }
        else if (eval(AClip[0]) == 0 && eval(AClip[2]) == 0)
        {
            imageholdermargintop = "-" + DimentionsDivs.imgHolder.height/2 - 20;
        }
        
        imgHolder.setStyle({
               top            : "50%",
               left           : "50%",
               width          : DimentionsDivs.imgHolder.width + "px",
               height         : DimentionsDivs.imgHolder.height + "px",

               "margin-left"  : imageholdermarginleft  + "px",
               "margin-top"   : imageholdermargintop  + "px"
        });

        var popZoomDimensions = popZoomDim(DimentionsDivs);

        if(zoomIndex == 1.1)
        {
            $('popZoom').setStyle({
                   width          : popZoomDimensions.width + 30 + "px",
                   height         : popZoomDimensions.height + 65 + "px",
                   "margin-left"  : "-" + popZoomDimensions.width/2 + "px",
                   "margin-top"   : "-" + popZoomDimensions.height/2 - 30 + "px"
            });
        }
        else
        {
            $('popZoom').setStyle({
                   width          : popZoomDimensions.width + 30 + "px",
                   height         : popZoomDimensions.height + 65 + "px",
                   "margin-left"  : "-" + popZoomDimensions.width/2 + "px",
                   "margin-top"   : "-" + popZoomDimensions.height/2 + "px"
            });
        }
        
        popZoomText = "<div id='textCopyR' style='margin-top:" + ((popZoomDimensions.height/2) + 80) + "px;'></div>";
        new Insertion.After('popZoom', popZoomText);
        
        $('textCopyR').className = 'copyRight';
        
        if (indicator == 1)
        {
            window.setTimeout(function() {
                        $('popZoom').setStyle({visibility: "visible"});
                        $('popZoomLoading').setStyle({display: "none"});

                        Event.observe(document, 'keypress', function (event) {
                        idicator = 0;
                                if(event.keyCode == 27 && $('popZoom').getStyle('visibility') == 'visible')
                                {
                                    ZoomOff();
                                }
                        });
                }, 5000);
        }
        else
        {
            $('popZoom').setStyle({visibility: "visible"});
         
            Event.observe(document, 'keypress', function (event) {
                if(event.keyCode == 27 && $('popZoom').getStyle('visibility') == 'visible')
                {
                    indicator = 0;
                    ZoomOff();
                }
            });
        }
    }
}


function popZoomDim(DimentionsDivs)
{
    var popZoomDimensions = [];
    
    for (var i in DimentionsDivs)
    {
        if(DimentionsDivs.hasOwnProperty(i))
        {
            if(i == "wallcolor")
            {
                continue;
            }
            else
            {
                if(DimentionsDivs[i]["width"] > 0)
                {
                    popZoomDimensions["width"] = DimentionsDivs[i]["width"];
                    popZoomDimensions["height"] = DimentionsDivs[i]["height"];
                    
                    return popZoomDimensions;
                }
                else
                {
                    continue;
                }
            }
            
        }
    }
}

function ZoomOff()
{
    indicator = 0;
    $('popZoomShadow').setStyle({display: "none"});
    $('popZoomLoading').setStyle({display: "none"});
    $('popZoom').setStyle({visibility: "hidden"});
//    $('popZoomMolding').setStyle({visibility: "hidden"});
//    $('popZoomMolding').update();
    
    if($('textCopyR'))
    $('textCopyR').remove();
    
    Event.unloadCache();
}