﻿window.onload = function()
{
    loadXML("../Canvas/Canvas.xml", xmlDoc_onload);  
}

var xmlDoc;
var brashTabs;
function loadXML(path, onload)
{   
    // code for IE
    if (window.ActiveXObject)
    {
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async=false;
        xmlDoc.load(path);                
        onload();
    }
    // code for Mozilla, etc.
    else if (document.implementation && document.implementation.createDocument)
    {
        xmlDoc= document.implementation.createDocument("","",null);
        xmlDoc.load(path);
        xmlDoc.onload = onload;
    }
    else
    {
        alert('Your browser cannot handle this script');
    }           
}

function xmlDoc_onload()
{
    brashTabs = new BrashTabs(document.getElementById("templateNav"), xmlDoc, 140, 560 );
    brashTabs.Draw();
    LoadFonts();            
    DrawCanvas()
}

//Font Selector and Color Picker methods
function LoadFonts()
{
    var xmlNode = xmlDoc.getElementsByTagName('font');  
    var slcFonts = document.getElementById("fonts") ;         
    
    var i;
    for (i=0; i < xmlNode.length;i++)
    {
        if (xmlNode[i].nodeType != 1) continue;  
        var newOpt = new Option(xmlNode[i].getAttribute('name'), xmlNode[i].getAttribute('id'), false, false);         
        slcFonts.options[i] = newOpt;
    }        
    fontChanged();
    colorChanged("#000");
}

function PreviewFont(fontName)
{
    var bgImage = "../Images/Canvas/Fonts/" + fontName + ".png";
    if(document.body.filters)
    {
        document.getElementById('fontPreview').style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + bgImage + '", sizingMethod="scale");';
    }
    else
    {
        document.getElementById('fontPreview').innerHTML = "";
        
        var imgFont = document.createElement('img');
        imgFont.src = bgImage;
        document.getElementById('fontPreview').appendChild(imgFont);                
    }  
}

var currentColor;
function colorChanged(color)
{
    currentColor = color;
    document.getElementById('fontPreview').style.backgroundColor = color;
}

function fontChanged()
{
    var slcFonts = document.getElementById('fonts');
    PreviewFont(slcFonts.options[slcFonts.selectedIndex].value);
}

//Draws the canvas background image and then sends a query string
//contaning text rendering parameters to the server
function DrawCanvas()
{
    var bgImage = "../Images/Canvas/" + brashTabs.activeTemplate + ".jpg";
    var pnlResults = document.getElementById("resultPanel");
    var imgBg = document.createElement("img");
                
    imgBg.src = bgImage;
    pnlResults.innerHTML = "";
    pnlResults.appendChild(imgBg);
    
    SendMessageToServer(BuildQueryString());
}

//when we recived the answer from the server we can draw out text
function GetMessageResultFromServer(result, context){
    textImage = "ImageHandler.ashx?rnd=" + result;
    DrawText(textImage);
}

function DrawText(textImage)
{
    var pnlResults = document.getElementById("resultPanel");
    var divText = document.createElement("div");
    divText.className = "txtimage";
    pnlResults.style.width =  divText.style.width = brashTabs.canvasWidth + "px";
    pnlResults.style.height =  divText.style.height = brashTabs.canvasHeight + "px";
    pnlResults.appendChild(divText);
    
    if(document.body.filters)
    { 
        divText.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + textImage + '", sizingMethod="scale");';
    }
    else
    {               
        var imgText = document.createElement("img");
        imgText.src = textImage;                
        divText.appendChild(imgText);
    }           
}

function BuildQueryString()
{
    var i;
    var result;          
    var slcFonts =  document.getElementById("fonts");
    var slcFontSize = document.getElementById("fontSize");
    var txtMsg = document.getElementById("txtMessage");
    var rdAlign = document.getElementsByName("rbAlign");
    var rdVAlign = document.getElementsByName("rbVAlign");
    var cbBold = document.getElementById("chkBold");
    var cbItalic = document.getElementById("chkItalic");
    var cbUnderline = document.getElementById("chkUnderline");
    
    result = "templateId:=" + brashTabs.activeTemplate;
    result += "||msg:=" +  txtMsg.value;
    result += "||font:=" + slcFonts.options[slcFonts.selectedIndex].value;
    result += "||size:=" + slcFontSize.options[slcFontSize.selectedIndex].value;
    result += "||color:=" + currentColor
               
    for(i = 0; i < 3; ++i)
        if(rdAlign[i].checked)
            result += "||align:=" + rdAlign[i].value;
            
    for(i = 0; i < 3; ++i)
        if(rdVAlign[i].checked)
            result += "||valign:=" + rdVAlign[i].value;    
            
    if(cbBold.checked)
        result += "||bold:=true";
        
    if(cbItalic.checked)
        result += "||italic:=true";    
        
    if(cbUnderline.checked)
        result += "||underline:=true"; 

    return result;
}

function OpenSaveWindow()
{
    window.open("SaveBox.aspx", "SaveDialog", "width=420,height=300,left=200,top=180,resizable=yes,scrollbars=yes");
}

