/* Cast Metal Sign Builder by (c) 2008 Ray Yates */
var basepath = "http://www.alphabetsigns.com/sign_builder/";
var img_src = basepath + "font_image_cm.php?text=%1&font=%2&r=%3&g=%4&b=%5&size=%6&aa=%7";

var material_prompt = "";
var thickness_code = "";
var thickness_prompt = "";

var finish_code = "";
var finish_template = "";
var attrcount = "";
var finish_prompt = "";
var finish_markup = 1.0;
var finish_isBronze = false;

var color_code = "";
var color_prompt = "";

var linenum = "1"
var colors = "";

var characters = new Array("","","","");
var charset = new Array("","[ A-Za-z0-9&,.-]","[ A-Za-z0-9&,.-]","[ A-Za-z0-9&,.-]");
var charcase = new Array("","L","L","L");
var savechar = new Array("","","","");

var antialias = "1";
var preview_width = 0;
var sign_width = 0;
var preview_height = 0;
var sign_height = 0;

var timer1 = "";
var timer2 = "";
var timer3 = "";
var timer4 = "";
var save = "";
var basketDB = new Array();

function BasketRec() {
    basketDB.prodcode = "";
    basketDB.charcount = 0;
    basketDB.price = 0;
    basketDB.phrase = "";
    basketDB.fontcode = "";
}
function start_SignBuilder(){
    for(i=0; i<3; i++){
        // Create empty data structure to hold the data added to the basket.
        basketDB[basketDB.length] = new BasketRec();
        if(i>0){
            // manually clear text boxes because Firefox keeps forms populated after refresh.
            var obj_txt = document.forms["sign_builder"].elements["sign_text"+i];
            obj_txt.value = "";
            obj_txt.disabled=true;
        }
    }
    finish_code = "";
    color_code = "";
    thickness_code= "";
    bg_update();
    document.getElementById("mount_pattern").checked = "";
}

function img_update(obj,ndx){
    linenum = ndx;
    var text;
    var font;
    var sizes;
    var obj_size;
/* obsolete
    if(charcase[ndx]=='U' && savechar[ndx].length==0){
        savechar[ndx] = document.forms["sign_builder"].elements["sign_text"+ndx].value;
        document.forms["sign_builder"].elements["sign_text"+ndx].value = savechar[ndx].toUpperCase();
    } else if(charcase[ndx]=='L' && savechar[ndx].length>0){
        document.forms["sign_builder"].elements["sign_text"+ndx].value = savechar[ndx];
        savechar[ndx] = "";
    }
*/
    document.getElementById("message").innerHTML = "&nbsp;";

    if(document.forms["sign_builder"].elements["sign_text1"].value){
        text = document.forms["sign_builder"].elements["sign_text1"].value; // text
        obj_font = document.forms["sign_builder"].elements["font_name1"];
        font = obj_font.options[obj_font.selectedIndex].title; // font file
        obj_size = document.forms["sign_builder"].elements["chr_height1"];
        sizes = obj_size.options[obj_size.selectedIndex].innerHTML // font size
        document.forms["sign_builder"].elements["sign_text2"].disabled=false;

        if(document.forms["sign_builder"].elements["sign_text2"].value){
            text = text + ":" +document.forms["sign_builder"].elements["sign_text2"].value;
            obj_font = document.forms["sign_builder"].elements["font_name2"];
            font = font + ":" + obj_font.options[obj_font.selectedIndex].title;
            obj_size = document.forms["sign_builder"].elements["chr_height2"];
            sizes = sizes + ":" +obj_size.options[obj_size.selectedIndex].innerHTML;
           document.forms["sign_builder"].elements["sign_text3"].disabled=false;

            if(document.forms["sign_builder"].elements["sign_text3"].value){
                text = text + ":" +document.forms["sign_builder"].elements["sign_text3"].value;
                obj_font = document.forms["sign_builder"].elements["font_name3"];
                font = font + ":" + obj_font.options[obj_font.selectedIndex].title;
                obj_size = document.forms["sign_builder"].elements["chr_height3"];
                sizes = sizes + ":" +obj_size.options[obj_size.selectedIndex].innerHTML;
            }
        }
    }

    if(text){
        text = text.replace(/&/g,"_");
        characters = text.replace(/ /g,"").split(':',3);
        if (colors==""){
            colors = "rgb(0,0,0)";
        }
        colors = colors.replace("rgb(","").replace(")","");
        var color = new Array();
        var color = colors.split(",");

        var img_url = img_src.replace("%1",text);
        img_url = img_url.replace("%2",font);
        img_url = img_url.replace("%3",color[0]);
        img_url = img_url.replace("%4",color[1]);
        img_url = img_url.replace("%5",color[2]);
        img_url = img_url.replace("%6",sizes);
        img_url = img_url.replace("%7",antialias);

        url=img_url.replace("font_image_cm.php","font_data1.php");
        //document.getElementById("debugspan").innerHTML="<a href='" + img_url.replace("aa=-1","aa=1") + "' target='_blank'>" + img_url.replace("aa=-1","aa=1") + "</a>";

        loaddata(url);

        document.getElementById("preview").src=img_url;
        summary_update();
    }


}

function summary_update(){
var ln = 0;
var char_count = 0;
var sum_char_count = 0;
var punct_count = 0;
var lcase_count = 0;
var ucase_count = 0;
var priceunit = 0;
var priceprod = 0.00;
var priceoptn = 0.00;
var price = 0.00;
var total = 0.00;

    summary_clear();
    summary_caption();

    for (ndx=1; ndx<=3; ndx++){
        // characters[] is the array that holds each line of text
        if(ndx<=characters.length){
            if(characters[ndx-1].length>0){

               //alert(ndx-1 + " : " +characters[ndx-1].length);

                basketDB[ndx-1].phrase = document.forms["sign_builder"].elements["sign_text"+ndx].value;
                // Print the phrase
                //document.getElementById("sum_"+ndx+"1").innerHTML=basketDB[ndx-1].phrase;

                var fontsel = document.forms["sign_builder"].elements["font_name" + ndx];
                basketDB[ndx-1].fontcode = fontsel.value;
                var fontName = fontsel.options[fontsel.selectedIndex].text;
                // Print the Font Name
                //document.getElementById("sum_"+ndx+"2").innerHTML=fontName;

                var sizesel = document.forms["sign_builder"].elements["chr_height" + ndx]
                basketDB[ndx-1].prodcode = sizesel.value;

                var fontSize = sizesel.options[sizesel.selectedIndex].text;
                // Print the Font size
                //document.getElementById("sum_"+ndx+"3").innerHTML=fontSize;

                // Legacy code: counts each character type.
                ln = characters[ndx-1].length;
                punct_count = ln - characters[ndx-1].replace(/[,.-]/g, '').length;
                lcase_count = ln - characters[ndx-1].replace(/[a-z]/g, '').length;
                ucase_count = ln - lcase_count - punct_count;
                char_count = punct_count + lcase_count + ucase_count;
                sum_char_count = sum_char_count + char_count;

                //lookup from prodDB Where basketDB[].prodcode = prodDB[].prodcode and thickness_code = prodDB[].options[].code
                //prodDB[] :  catcode, material, prodcode, height, option Array;
                for(i=0; i<prodDB.length; i++){
                    if(basketDB[ndx-1].prodcode==prodDB[i].prodcode) {
                        // Lookup the option price
                        for (j=0; j<prodDB[i].option.length; j++){
                            if(thickness_code==prodDB[i].option[j].code){
                                priceoptn = +prodDB[i].option[j].price;
                                priceprod = +prodDB[i].price;
                                priceunit = priceprod + priceoptn;
                                break;
                }   }   }   }

                price = priceunit * char_count * finish_markup;
                total = total + price;
                basketDB[ndx-1].char_count = char_count;
                basketDB[ndx-1].price = price;

//document.getElementById("debugspan").innerHTML='finish_markup = ' + finish_markup;

//document.getElementById("debugspan").innerHTML=priceprod + " " + priceoptn + " = " + priceunit; + " * " + char_count;

                // document.getElementById("sum_"+ndx+"4").innerHTML=ucase_count;
                // document.getElementById("sum_"+ndx+"5").innerHTML=lcase_count + punct_count;
                document.getElementById("sum_"+ndx+"6").innerHTML="$" + String(price.toFixed(2));
                document.getElementById("sum").innerHTML="$" + String(total.toFixed(2));
            } else {
                basketDB[ndx-1].prodcode = "";
            }
        } else {
            basketDB[ndx-1].prodcode = "";
        }
    }
    if(document.getElementById("mount_pattern").checked){
        mount_pattern_total = sum_char_count * mount_pattern_price;
        total = total + mount_pattern_total;
        document.getElementById("pattern").innerHTML="$" + String(mount_pattern_total.toFixed(2));
        document.getElementById("sum").innerHTML="$" + String(total.toFixed(2));
    } else {
        document.getElementById("pattern").innerHTML = "$0.00";
    }
}

function summary_clear(){
var row = 0;
    for (row=1; row<=3; row++){
            document.getElementById("sum_"+row+"6").innerHTML="&nbsp;";
    }
    document.getElementById("sum").innerHTML="$0.00";
}

function summary_caption(){
    document.getElementById("summary_txt").innerHTML = "&nbsp;";
    var caption = material_name;
    if(thickness_prompt.length>0){ caption = caption + " " + thickness_prompt; }
    if(finish_prompt.length>0){ caption = caption + ", Finish: " + finish_prompt; }
    if(color_prompt.length>0){ caption = caption + ", Color: " + color_prompt; }
    document.getElementById("summary_txt").innerHTML = caption;
}

function validkey(e, row){
    var keynum;
    var keyboardchars = /[\x00\x08]/;
    var validchars = new RegExp(charset[row]);
    if(window.event){
      // IE
        keynum = e.keyCode;
    } else if(e.which) {
      // Netscape/Firefox/Opera
        keynum = e.which;
    }
    if(charcase[row]=="U"){
      var keychar = String.fromCharCode(keynum).toUpperCase();
      savechar[row] = "";
    } else {
      var keychar = String.fromCharCode(keynum);
  }
    if (!validchars.test(keychar) && !keyboardchars.test(keychar)){
        return false
    } else {
      if(window.event){
          e.keyCode = keychar.charCodeAt(0);
      } else if(e.which) {

          e.which = keychar.charCodeAt(0);

      }
        return true;
    }
}

function loaddata(url){

}

function bg_update(){
    var bg = document.forms["sign_builder"].elements["tdbackground"].value;
    document.getElementById("preview_bg").style.backgroundImage = 'url("' + basepath + "tiles/" + bg + '")';
    if(bg) {
        antialias = "-1";
    } else {
        antialias = "1";
    }
    img_update('',1)
}

function loaddata(url){
   var head= document.getElementsByTagName('head')[0];
   var script= document.createElement('script');
   script.type= 'text/javascript';
   script.src= url;
   head.appendChild(script);
   timer1=setTimeout("show_data()",500);
   timer2=setTimeout("show_data()",2500);
}

function show_data(){
    try {
        //get preview_width and preview_height in pixels
        get_font_data();
        msg = document.getElementById("preview_msg");
        /* Per Dan, multiply width by a factor of 1.5 10/2/2008 */
        var sw = sign_width * 1.5;
        msg.innerHTML = "For Font Style Preview Only, Sign Dimensions Are Not Exact<br><b><font color='red'>Approximate</font> = " + String(sw.toFixed(2)) + " in. wide x " + sign_height + " in. high</b>";
        document.getElementById("preview_bg").style.height = preview_height+12+"px";
        clearTimeout(timer2);
        clearTimeout(timer1);
    } catch(err) {
        clearTimeout(timer1);
    }
}

function isEmpty(){
    if(document.forms["sign_builder"].elements["sign_text1"].value == "") {
		characters[0]="";
		characters[1]="";
		characters[2]="";
        document.forms["sign_builder"].elements["sign_text2"].value = "";
        document.forms["sign_builder"].elements["sign_text2"].disabled=true;
        document.forms["sign_builder"].elements["sign_text3"].value = "";
        document.forms["sign_builder"].elements["sign_text3"].disabled=true;
        basketDB[0].price = 0;
        summary_clear();
        document.getElementById("preview").src="/sign_builder/font_image_cm.php?text=Enter%20your%20text%20above&font=GT-Helvetica.ttf&r=0&g=0&b=0&size=2&aa=1";

    } else if(document.forms["sign_builder"].elements["sign_text2"].value == "") {
		characters[0]="";
		characters[1]="";
        document.forms["sign_builder"].elements["sign_text3"].value = "";
        document.forms["sign_builder"].elements["sign_text3"].disabled=true;
    } else if(document.forms["sign_builder"].elements["sign_text3"].value == "") {
		characters[2]="";
	}
}

function setFinish(obj_link, code, markup){
    finish_markup = markup;
    if(obj_link.title.indexOf("Aluminum") < 0){
        finish_isBronze = true;
    } else {
        finish_isBronze = false;
    }
    colors = obj_link.parentNode.style.backgroundColor;
    img_update(obj_link,linenum);
    finish_code = code;
    finish_prompt = obj_link.title;
    color_code = "";
    color_prompt = "";
    summary_update();
}

function setColor(obj_link, code){
    finish_markup = 1.0;
    finish_isBronze = false;
    colors = obj_link.parentNode.style.backgroundColor;
    img_update(obj_link,linenum);
    finish_code = "FCAL_NSA";
    finish_template = "FCAL_Finishes";
    finish_prompt = "Natural Satin Aluminum";
    color_code = code;
    color_prompt = obj_link.title;
    summary_update();
}

function showColor(obj_link, code){
    var newImg = "u";
    imgWrapper = document.getElementById("metal_preview_fc");
    imgObject = document.getElementById("metal_img");
    imgText = document.getElementById("metal_txt");
    if(code){
        var newImg = code;
        if(imgObject.src!=newImg){
            imgObject.src = newImg;
            imgText.innerHTML = obj_link.title;
        }
        /* //Changed so that the popup layer now opens in a fixed position set in css
        document.onmousemove = getMouse;
        document.getElementById("xposn").value=mouseX; // to debug, change type="hidden" to type="text"
        document.getElementById("yposn").value=mouseY;
        imgWrapper.style.left=mouseX -100 + 'px';
        */
        imgWrapper.style.display = "block";

    } else {
        imgWrapper.style.display = "none";
        imgObject.src = "";
    }
}

function showBakedColor(obj_link, newImg){
    imgWrapper = document.getElementById("baked_preview_fc");
    imgObject = document.getElementById("baked_img");
    imgText = document.getElementById("baked_txt");
    if(newImg){
        if(imgObject.src!=newImg){
            imgObject.src = newImg;
            imgText.innerHTML = obj_link.title;
        }
        /* //Changed so that the popup layer now opens in a fixed position set in css
        document.onmousemove = getMouse;
        document.getElementById("xposn").value=mouseX; // to debug, change type="hidden" to type="text"
        document.getElementById("yposn").value=mouseY;
        imgWrapper.style.left=mouseX -50 + 'px';
        */
        imgWrapper.style.display = "block";

    } else {
        imgWrapper.style.display = "none";
        imgObject.src = "";
    }
}

function getMouse(e) {
    // Obsolete
    if (!e) var e = window.event;
    if (e.pageX || e.pageY)     {
        mouseX = e.pageX;
        mouseY = e.pageY;
    }
    else if (e.clientX || e.clientY)    {
        mouseX = e.clientX + document.body.scrollLeft
            + document.documentElement.scrollLeft;
        mouseY = e.clientY + document.body.scrollTop
            + document.documentElement.scrollTop;
    }
    // mouseX and mouseY contain the mouse position relative to the document
    // Do something with this information
}

function thickness_select(obj_sel, item){
    // Store selection in global variables
    thickness_code = obj_sel.value;
    thickness_prompt = obj_sel.options[obj_sel.selectedIndex].text;
    summary_caption();
    characters

    // Once a material has been selected enable text boxes and clear characters[n] if needed.
    if(document.forms["sign_builder"].elements["sign_text1"].value==""){
		characters[0]="";
	}
    document.forms["sign_builder"].elements["sign_text1"].disabled=false;
    if(document.forms["sign_builder"].elements["sign_text2"].value){
        document.forms["sign_builder"].elements["sign_text2"].disabled=false;
    } else {
		characters[1]="";
	}
    if(document.forms["sign_builder"].elements["sign_text3"].value){
        document.forms["sign_builder"].elements["sign_text3"].disabled=false;
    } else {
		characters[2]="";
	}
    summary_update()

}

function material_select(obj, catcode, btn, material){
    //Store selection in global variable and update the screen
    material_name = material;
    thickness_code = "";
    thickness_prompt = "";
    finish_code = "";
    finish_prompt = "";
    color_code = "";
    color_prompt = "";

    summary_caption();

    var btnobj ;
    var selobj ;
    if(obj.tagName=="DIV"){
        // force check radio button.
        document.getElementById("matradio"+btn).checked = true;
    }
    //disable text boxes
    document.forms["sign_builder"].elements["sign_text1"].disabled=true;
    document.forms["sign_builder"].elements["sign_text2"].disabled=true;
    document.forms["sign_builder"].elements["sign_text3"].disabled=true;
    // Show selected button
    for (i=1; i<=catcount ; i++) {
        btnobj = document.getElementById("matbutton"+i);
        selobj = document.getElementById("thickness"+i);
        selobj.value="";
        selobj.selectedIndex=0;
        if (i==btn){
            btnobj.className = "matbutton1"
            selobj.style.display="";
        } else {
            btnobj.className = "matbutton"
            selobj.style.display="none";
        }
    }
    // populate each Size select box
    for (i=1; i<=3 ; i++) {
        sel=document.forms["sign_builder"].elements["chr_height"+i];
        sel.length=0;
        for (j=0; j<prodDB.length ; j++) {
            if (catcode==prodDB[j].catcode) {
                sel.options[sel.length] = new Option(prodDB[j].height, prodDB[j].prodcode);
            }
        }
    }
    // Hide or display the Metal Finish icons
    for (i=0; i<catnames.length ; i++) {
        document.getElementById(catnames[i]).style.display = "none";
        if (catnames[i]==material){
            document.getElementById(catnames[i]).style.display = "";
            finish_template = templatecodes[i];
            attrcount = attributecounts[i];
        }
        // Hide or display the Baked Enamel Icons
        if(material=="aluminum") {
            document.getElementById('enamel').style.display = "";
            document.getElementById('BL31descr').style.display = "block";
            document.getElementById('BL30descr').style.display = "none";
	    document.getElementById('BL32descr').style.display = "none";
            document.getElementById('BL33descr').style.display = "none";
        } else if(material=="bronze") {
            document.getElementById('enamel').style.display = "none";
            document.getElementById('BL32descr').style.display = "block";
            document.getElementById('BL30descr').style.display = "none";
	    document.getElementById('BL31descr').style.display = "none";
            document.getElementById('BL33descr').style.display = "none";
        } else {
            document.getElementById('enamel').style.display = "none";
            document.getElementById('BL33descr').style.display = "block";
	    document.getElementById('BL30descr').style.display = "none";
	    document.getElementById('BL31descr').style.display = "none";
            document.getElementById('BL32descr').style.display = "none";
        }
    }

}

//*************** Submit *********************
function addprod_validate(frm){
/* Basket Data
    basketDB.prodcode
    basketDB.charcount
    basketDB.price
    basketDB.phrase
    basketDB.fontcode

    finish_code
    color_code
    thickness_code
*/
    if(thickness_code==""){
        alert('Please select a material and thickness');
        return false;
    }
    if(finish_code==""){
        alert('Please select a finish.');
        return false;
    }
    if (basketDB[0].prodcode==""){
        alert('Please enter some text.');
        return false;
    }
    document.getElementById("message").innerHTML = "<br /><img src='/sign_builder/animated.gif'>";
    document.getElementById("button").style.display="none";
    submit_data(1);
    var t = 750;
    timer1=setTimeout("submit_data(2)",t);
    timer2=setTimeout("submit_data(3)",t*2);
    timer3=setTimeout("submit_data(4)",t*3);
    timer4=setTimeout("done()",t*4);
    return false;
}

function submit_data(row){
    if (row==4){
        var txt = "";
        if(document.getElementById("mount_pattern").checked){
            for (i=0; i<3; i++){
                if(basketDB[i].phrase){
                    txt = txt + basketDB[i].phrase + "~";
                }
            }
            txt= txt.replace(/~/g, "\n");
            document.getElementById("pattern_txt").value = txt;
            frm = document.getElementById("iform4");
            frm.submit();
        }
    } else {
        if (basketDB[row-1].price >  0) {
            iform_update(row)
            frm = document.getElementById("iform");
            frm.target="RSIFrame" + row;
            frm.submit();
        }
    }
    if (row==2){
        clearTimeout(timer1);
    }
    if (row==3){
        clearTimeout(timer2);
    }
    if (row==4){
        clearTimeout(timer3);
    }
}

function iform_update(row){
    var ndx = row - 1;
    document.getElementById("Product_Code").value=basketDB[ndx].prodcode;
    document.getElementById("Product_Price").value=basketDB[ndx].price.toFixed(2);

    document.getElementById("textvalue").value=basketDB[ndx].phrase;
    document.getElementById("textvalue1").value=basketDB[ndx].phrase;

    document.getElementById("typevalue").value=basketDB[ndx].fontcode;
    document.getElementById("typevalue1").value=basketDB[ndx].fontcode;

    document.getElementById("finishvalue").value=finish_code;
    document.getElementById("finishvalue1").value=finish_code;
    document.getElementById("finishtemplate1").value = finish_template;
    document.getElementById("finishtemplate2").value = finish_template;
    document.getElementById("finishvalue1a").value = finish_template;

    document.getElementById("thicknessvalue").value=thickness_code;
    document.getElementById("thicknessvalue1").value=thickness_code;

    document.getElementById("colorvalue").value=color_code;
    document.getElementById("colorvalue1").value=color_code;

    document.getElementById("attrcount").value = attrcount;
}

function done(){
     document.getElementById("message").innerHTML = "Your sign has been added to the basket.";
     document.getElementById("button").style.display="block";
     clearTimeout(timer1);
     clearTimeout(timer2);
     clearTimeout(timer3);
}