﻿
// *** all prices are excluding tax ***

var ROUND_TO_NEAREST = 5;
var FIXED_BORDER_SIZES = true;
var FIXED_SIZE_PER_INCH = 20;

function GetLargest(num1, num2)
{
    return num1 > num2 ? num1 : num2;
}

function GetElementById(id)
{
	if      (document.getElementById)   return document.getElementById(id);
  	else if (document.all)              return document.all[id];
	else if (document.layers)           return document.layers[id];
	else                                return null;
}

function NewImage(src)
{
    var img = new Image();
    img.src = src;
    return img;
}

function GetParentElement(currentElement, parentElementName)
{
    parentElementName = parentElementName.toLowerCase();
    
    while((currentElement = currentElement.parentNode) != null)
    {
        if(currentElement.tagName && currentElement.tagName.toLowerCase() == parentElementName)
            return currentElement
    }
    return null;
}

function SetDisabled(element, disabled)
{
    // Stupid disabled, for all of ASP.Net's good, sometimes it really can be quite annoying
    // Helpfull link: http://www.andrewconnell.com/blog/archive/2004/10/07/523.aspx
    if(disabled)    element.setAttribute("disabled", "disabled");
    else            element.removeAttribute("disabled");
}


//----------------
// Main FramePrint Class
function FramePrint(pictureWidthPx, pictureHeightPx, sizes, frameIds, borders, taxRate, conversionRate, currencySymbol, totalPriceLabelId, sizeOptionsList, frameOptionsList, mountOptionsList)
{
    this.PictureWidthPx = pictureWidthPx;
    this.PictureHeightPx = pictureHeightPx;
    this.Sizes = sizes;
    this.FrameIds = frameIds;
    this.Borders = borders;
    this.TaxRate = taxRate;
    this.CurrencySymbol = currencySymbol;
    this.TotalPriceLabel = GetElementById(totalPriceLabelId);
    this.SizeOptionsList = sizeOptionsList;
    this.FrameOptionsList = frameOptionsList;
    this.MountOptionsList = mountOptionsList;
    
    // BorderImages functionality
    this.BorderImagesList = new Array();
    this.GetBorderImages = function(borderId, borderImageSize)
    {
        for(var i = 0; i < this.BorderImagesList.length; i++)
        {
            var borderImage = this.BorderImagesList[i];
            if(borderImage.BorderId == borderId && borderImage.BorderImageSize == borderImageSize)
                return borderImage;
        }
        return null;
    }
    
    // Refresh page functionality
    this.GetSize = function(sizeId)
    {
        for(var i = 0; i < this.Sizes.length; i++)
        {
            if(this.Sizes[i].SizeId == sizeId)
                return this.Sizes[i];
        }
        return null;
    }
    
    this.GetFrameIndex = function(frameId)
    {
        for(var i = 0; i < this.FrameIds.length; i++)
        {
            if(this.FrameIds[i] == frameId)
                return i;
        }
        return -1;
    }
    
    this.GetBorderIndex = function(borderId)
    {
        for(var i = 0; i < this.Borders.length; i++)
        {
            if(this.Borders[i].BorderId == borderId)
                return i;
        }
        return -1;
    }
    
    this.SetFrameAndMountStyles = function(styles)
    {
        var styleElement = GetElementById("frameAndMountStyles");
        
        if(styleElement != null)
        {
            // very handy help from Fredrik Johansson - http://www.quirksmode.org/bugreports/archives/2006/01/IE_wont_allow_documentcreateElementstyle.html
            if(styleElement.styleSheet)     styleElement.styleSheet.cssText = styles;
            else                            styleElement.innerHTML = styles;
        }
    }

    this.BuildBorderStyles = function(borderTablePrefix, borderImg)
    {
        var size = borderImg.BorderImageSize;
        return  "#" + borderTablePrefix + "_TR     { width: " + size + "px; height: " + size + "px; background-image: url(" + borderImg.TRImg.src + "); }\n" +
                "#" + borderTablePrefix + "_TL     { width: " + size + "px; height: " + size + "px; background-image: url(" + borderImg.TLImg.src + "); }\n" +
                "#" + borderTablePrefix + "_BR     { width: " + size + "px; height: " + size + "px; background-image: url(" + borderImg.BRImg.src + "); }\n" +
                "#" + borderTablePrefix + "_BL     { width: " + size + "px; height: " + size + "px; background-image: url(" + borderImg.BLImg.src + "); }\n" +
                "#" + borderTablePrefix + "_Top    { background-image: url(" + borderImg.TopImg.src + "); }\n" +
                "#" + borderTablePrefix + "_Left   { background-image: url(" + borderImg.LeftImg.src + "); }\n" +
                "#" + borderTablePrefix + "_Right  { background-image: url(" + borderImg.RightImg.src + "); }\n" +
                "#" + borderTablePrefix + "_Bottom { background-image: url(" + borderImg.BottomImg.src + "); }\n\n";
    }
    
    // RefreshPage function
    this.RefreshPage = function()
    {
        var selectedSizeId = this.SizeOptionsList.GetSelectedValue();
        var selectedSize = this.GetSize(selectedSizeId);
        if(selectedSize == null)
            throw "RefreshPage(): SizeId of '" + selectedSizeId + "' not found!";
        
        var unitPrice = selectedSize.Price;
        var selectedFrameId = this.FrameOptionsList.GetSelectedValue();
        var selectedMountId = this.MountOptionsList.GetSelectedValue()
        var selectedFrameIndex = this.GetFrameIndex(selectedFrameId);
        
        if(selectedFrameIndex == -1)
        {
            this.MountOptionsList.SetEnabled(false, "Mount options are only available if you select a frame.");
            this.SetFrameAndMountStyles("");
        }
        else
        {
            this.MountOptionsList.SetEnabled(true, "");
            
            var frameSize = selectedSize.BorderImageSizes[this.GetBorderIndex(selectedFrameId)];
            var mountSize = selectedSize.BorderImageSizes[this.GetBorderIndex(selectedMountId)];
            
            // pictureWidth is a global! yes its a hack 
            var fixWidth = pictureWidth + (frameSize * 2) + (mountSize * 2);
            var fixWidthCSS = "table#pictureTable { width: " + fixWidth + "px; }\n";
            
            this.SetFrameAndMountStyles(
                fixWidthCSS +
                "table#pictureTable img { border: none !important; }\n" +
                this.BuildBorderStyles("frameTable", this.GetBorderImages(selectedFrameId, frameSize)) +
                this.BuildBorderStyles("mountTable", this.GetBorderImages(selectedMountId, mountSize)));
            
            unitPrice += selectedSize.FramePrices[selectedFrameIndex];
        }
        
        if(this.TotalPriceLabel != null)
        {
			var totalPrice = unitPrice * (1 + this.TaxRate)
            this.TotalPriceLabel.innerHTML = this.CurrencySymbol + totalPrice.toFixed(2);
        }
    }
    
    //****
    // Initialisation
    
    // Calculate the BorderImageSizes for each Border at each Size
    for(var sizeIndex = 0; sizeIndex < this.Sizes.length; sizeIndex++)
    {
        var size = this.Sizes[sizeIndex];
        var picturePPI = GetLargest(this.PictureWidthPx, this.PictureHeightPx) / GetLargest(size.WidthInches, size.HeightInches);
        
        for(var borderIndex = 0; borderIndex < this.Borders.length; borderIndex++)
        {
            var border = this.Borders[borderIndex];
            var borderSize;
            
            if(FIXED_BORDER_SIZES)
            {
                borderSize = FIXED_SIZE_PER_INCH * border.ThicknessInches;
            }
            else
            {
                var resizeFactor = 1 / (border.BorderPPI / picturePPI); // resize the border so that it is at the same PPI (Pixels Per Inch) as the picture
                var borderSizeUnrounded = border.ThicknessPixels * resizeFactor;
                
                borderSize = Math.round(borderSizeUnrounded / ROUND_TO_NEAREST) * ROUND_TO_NEAREST;
            }
            
            size.BorderImageSizes.push(borderSize);
            
            if(this.GetBorderImages(border.BorderId, borderSize) == null)
            {
                this.BorderImagesList.push(new BorderImages(border.BorderId, borderSize));
            }
        }
    }
    
    // Update the page for the first time
    this.RefreshPage();
    
    // All this JavaScript won't work if we can't get at page elements, so only hide the refresh page section if we can get at page elements
    var refreshPageSection = GetElementById("refreshPageSection");
    if(refreshPageSection != null && refreshPageSection.style != null)
    {
        refreshPageSection.style.display = "none";
    }
    
    /*
    // display debug
    var s = "";
    
    for(var j=0; j<this.BorderImagesList.length; j++)
    {
        var borderImages = this.BorderImagesList[j];
        s += borderImages.BorderId + " - " + borderImages.BorderImageSize + " - " + borderImages.TopImg.src + "\n";
    }
    
    alert(s);
    */
}

//----------------
// Size Class
function Size(sizeId, widthInches, heightInches, price, framePrices)
{
    this.SizeId = sizeId;
    this.WidthInches = widthInches;
    this.HeightInches = heightInches;
    this.Price = price;
    this.FramePrices = framePrices;
    this.BorderImageSizes = new Array(); // array of border image sizes, in pixels, for each border at this size - to be calc'd by NewFramePrint()
}

//----------------
// Border Class
function Border(borderId, thicknessPixels, thicknessInches, borderPPI)
{
    this.BorderId = borderId;
    this.ThicknessPixels = thicknessPixels;
    this.ThicknessInches = thicknessInches;
    this.BorderPPI = borderPPI; // PPI == Pixels Per Inch
}

//----------------
// BorderImages Class
function BorderImages(borderId, borderImageSize)
{
    this.BorderId = borderId;
    this.BorderImageSize = borderImageSize;
    
    borderId = borderId.replace(/ /g, "-");
    
    this.TopImg     = NewImage("GetBorderImg/" + borderId + "/Top/" + borderImageSize + "/img.ashx");
    this.BottomImg  = NewImage("GetBorderImg/" + borderId + "/Bottom/" + borderImageSize + "/img.ashx");
    this.LeftImg    = NewImage("GetBorderImg/" + borderId + "/Left/" + borderImageSize + "/img.ashx");
    this.RightImg   = NewImage("GetBorderImg/" + borderId + "/Right/" + borderImageSize + "/img.ashx");
    
    this.TRImg = NewImage("GetBorderImg/" + borderId + "/TR/" + borderImageSize + "/img.ashx");
    this.TLImg = NewImage("GetBorderImg/" + borderId + "/TL/" + borderImageSize + "/img.ashx");
    this.BRImg = NewImage("GetBorderImg/" + borderId + "/BR/" + borderImageSize + "/img.ashx");
    this.BLImg = NewImage("GetBorderImg/" + borderId + "/BL/" + borderImageSize + "/img.ashx");
}

//----------------
// RadioList Class
function RadioList(idPrefix, count)
{
    this.radios = new Array();
    
    for(var i = 0; i < count; i++)
    {
        var radio = GetElementById(idPrefix + "_" + i);
        
        if(radio != null)
            this.radios.push(radio);
    }
    
    this.GetSelectedValue = function()
    {
        var selectedIndex = this.GetSelectedIndex();
        return selectedIndex == -1 ? "" : this.radios[selectedIndex].value;
    }
    
    this.GetSelectedIndex = function()
    {
        for(var i = 0; i < this.radios.length; i++)
        {
            if(this.radios[i].checked) return i;
        }
        return -1;
    }
    
    this.SetEnabled = function(enabled, tooltip)
    {
        if(this.radios.length > 0) // because framing can be disabled for some countries, the no radios may exist
        {
            var table = GetParentElement(this.radios[0], "table");
            table.title = tooltip
            SetDisabled(table, !enabled);
        }
        
        for(var i = 0; i < this.radios.length; i++)
        {
            var span = GetParentElement(this.radios[i], "span")
            if(span)
            {
                SetDisabled(span, !enabled);
            }
            
            this.radios[i].disabled = !enabled;
        }
    }
}

