var VOL = function() {
        var $D = YAHOO.util.Dom;
        var $E = YAHOO.util.Event;
        var $C = YAHOO.util.Connect;
        var $  = $D.get;

        var printList = new Array();

        var products, info;

        return {

            // sets up a cell so that it will fade in and ensures all the following ones are cleard
            setupNextCell: function(cellNum) {
                var cell = $('cell' + cellNum);

                cell.style.visibility = 'visible';
                cell.style.display = 'block';

                var attr = {
                    backgroundColor: { from: '#ffffff', to: '#fff4b4' },
                    borderColor:     { from: '#ffffff', to: '#e3d165' }
                };



                for (var i = (cellNum + 1); i < 8; i++) {
                    $('cell' + i).innerHTML = '';
                    $('cell' + i).style.display = 'none';
                }
             

                var bgAnim = new YAHOO.util.ColorAnim(cell, attr, 0.3, YAHOO.util.Easing.easeOut);
                YAHOO.util.Event.on(cell, 'click', bgAnim.animate(), bgAnim, true);

            },


            // hides all the cells and sets the initial one to fade in
            init: function() {
//                for (var i = 1; i < 8; i++)
//                    $('cell' + i).style.visibility = 'hidden';
            
                // hide the print list until there is something in it
                $("right").style.visibility = 'hidden';

                // in case it was a refresh this needs to be forced to blank
                $("product").selectedIndex = 0;

                VOL.setupNextCell(1);
            },


            //
            productSelected: function(options) {
                if (options == "") return;

                var pCell = $("cell1");
                pCell.style.backgroundColor = '#f3f3f3';
                pCell.style.borderColor = '#dcdcdc';



                var html = new Array();
                var cell = $("cell2");

                cell.style.visibility = 'visible';
                cell.style.display = 'block';


                html.push("<strong style='position:absolute;margin-top:3px;'>Select a hole type:</strong>");
                html.push('<select name="type" id="type" onchange="VOL.typeSelected(this.value)" style="float:right;width:220px;">');
                html.push('<option value=""></option>');
            
            
                // add all the types for the product that was selected
                var optionsA = options.split(",");
                for (var i = 0; i < optionsA.length; i++) {
                    switch (optionsA[i]) {
                        case '0': html.push('<option value="0">Circular</option>'); break;
                        case '1': html.push('<option value="1">Rectangular</option>'); break;
                        case '2': html.push('<option value="2">Construction Joint</option>'); break;
                        case '3': html.push('<option value="2">Rectangular</option>'); break;
                    }
                }

                html.push('</select>');

                VOL.setupNextCell(2);
            
                cell.innerHTML = html.join("");
            },



            typeSelected: function(selectedType) {
                if (selectedType == "")
                    return;

                var pCell = $("cell2");
                pCell.style.backgroundColor = '#f3f3f3';
                pCell.style.borderColor = '#dcdcdc';


                var html = new Array();
                var cell = $("cell3");

                cell.style.visibility = 'visible';
                cell.style.display = 'block';
                cell.style.height = 'auto';


                html.push("<strong style='position:absolute;margin-top:3px;'>Select a hole type:</strong>");
                html.push("<br />");


                switch (selectedType) {
                    case '0': html.push('<table width="350">'
                 + '    <tr>'
                 + '        <td>Diameter of hole</td>'
                 + '        <td><input type="text" name="hole" id="hole" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Diameter of penetrating item</td>'
                 + '        <td><input type="text" name="item" id="item" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Product depth</td>'
                 + '        <td><input type="text" name="depth" id="depth" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Number of applications</td>'
                 + '        <td><input type="text" name="times" id="times" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td><input type="radio" name="sides" id="sides1" value="1" checked> 1-sided(floor)</td>'
                 + '        <td><input type="radio" name="sides" id="sides2" value="2"> 2-sided(wall)</td>'
                 + '    </tr>'
                 + '</table><br>'
                 + '<input type="button" class="sInput" name="calculate" value="Calculate" onclick="VOL.do_calc(0)">'); break;
                    case '1': html.push('<table width="350">'
                 + '    <tr>'
                 + '        <td>Hole size</td>'
                 + '        <td>Length</td><td><input type="text" name="holel" id="holel" size="5"></td>'
                 + '        <td>Width</td><td><input type="text" name="holew" id="holew" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Penetrating item size</td>'
                 + '        <td>Length</td><td><input type="text" name="iteml" id="iteml" size="5"></td>'
                 + '        <td>Width</td><td><input type="text" name="itemw" id="itemw" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td colspan="2">Product depth</td>'
                 + '        <td colspan="3"><input type="text" name="depth" id="depth" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td colspan="2">Number of applications</td>'
                 + '        <td colspan="3"><input type="text" name="times" id="times" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>&nbsp;</td>'
                 + '        <td colspan="2"><input type="radio" name="sides" id="sides1" value="1" checked> 1-sided(floor)</td>'
                 + '        <td colspan="2"><input type="radio" name="sides" id="sides2" value="2"> 2-sided(wall)</td>'
                 + '    </tr>'
                 + '</table><br>'
                 + '<input type="button" class="sInput" name="calculate" value="Calculate" onclick="VOL.do_calc(1)">'); break;
                    case '2': html.push('<p>No provisions have been made for overlap which may be required for some systems.</p>'
                 + '<table width="350">'
                 + '    <tr>'
                 + '        <td>Length of joint(feet)</td>'
                 + '        <td><input type="text" name="length" id="length" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Average joint width</td>'
                 + '        <td><input type="text" name="width" id="width" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Sealant depth</td>'
                 + '        <td><input type="text" name="depth" id="depth" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Number of applications</td>'
                 + '        <td><input type="text" name="times" id="times" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td><input type="radio" name="sides" id="sides1" value="1" checked> 1-sided(floor)</td>'
                 + '        <td><input type="radio" name="sides" id="sides2" value="2"> 2-sided(wall)</td>'
                 + '    </tr>'
                 + '</table><br>'
                 + '<input type="button" name="calculate" value="Calculate" onclick="VOL.do_calc(2)">'); break;
                    case '3': html.push('<table width="350">'
                 + '    <tr>'
                 + '        <td>Hole size</td>'
                 + '        <td>Length</td><td><input type="text" name="holel" id="holel" size="5"></td>'
                 + '        <td>Width</td><td><input type="text" name="holew" id="holew" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td>Penetrating item size</td>'
                 + '        <td>Length</td><td><input type="text" name="iteml" id="iteml" size="5"></td>'
                 + '        <td>Width</td><td><input type="text" name="itemw" id="itemw" size="5"></td>'
                 + '    </tr>'
                 + '    <tr>'
                 + '        <td colspan="2">Number of applications</td>'
                 + '        <td colspan="3"><input type="text" name="times" id="times" size="5"></td>'
                 + '    </tr>'
                 + '</table><br>'
                 + '<input type="button" class="sInput" name="calculate" value="Calculate" onclick="VOL.do_calc(3)">'); break;

                } // end switch

                VOL.setupNextCell(3);

                cell.innerHTML = html.join("");
            },


            do_calc: function(type) {
                var hole, item, depth, sides, times, tmp1, tmp2, total;

                if (type == 1 || type == 3) {
                    hole = $("holel").value * $("holew").value;
                    item = $("iteml").value * $("itemw").value;
                }
                else {
                    if (type == 2) {
                        hole = ($("length").value * 12) * $("width").value;
                        item = 0;
                    }
                    else {
                        tmp1 = $("hole").value / 2;
                        hole = (tmp1 * tmp1) * 3.14;
                        tmp1 = $("item").value / 2;
                        item = (tmp1 * tmp1) * 3.14;
                    }
                }
                if (type == 3) {
                    depth = 1;
                    sides = 1;
                }
                else {
                    sides = $("sides1").checked ? 1 : 2;
                    depth = $("depth").value;
                }

                times = $("times").value;
                total = (((hole - item) * depth) * sides) * times;

                var product = $("product").options[$("product").selectedIndex].text;

                VOL.show_results(total, product, type);
            },



    show_results: function(totalCuIn, productName, holeType) {
        var containerSizes, containerSizeNames;


        switch (productName.toLowerCase()) {
            case "biostop 500+":
                containerSizes = "18|36|54|1155";
                containerSizeNames = "10.3 Fl.Oz.Cart.|20.2 oz. Sausage Pack|30 Fl.Oz.Cart.|5 Gal.";
                break;
            case "biotherm 100/200sl":
                containerSizes = "18|1155";
                containerSizeNames = "10.15 Fl.Oz.Cart.|5 Gal.";
                break;
            case "biostop 700":
                containerSizes = "1155";
                containerSizeNames = "5 Gal.";
                break;
            case "biostop 750":
                containerSizes = "54|1155";
                containerSizeNames = "30 Fl.Oz.Cart.|5 Gal.";
                break;
            case "biostop bf-150+":
                containerSizes = "18|36|54|1155";
                containerSizeNames = "10.3 Fl.Oz.Cart.|20.2 oz. Sausage Pack|30 Fl.Oz.Cart.|5 Gal.";
                break;
            case "bio k-10+ mortar":
                containerSizes = "600|1350";
                containerSizeNames = "20 lb. Pail|45 lb. Poly";
                break;
            case "biostop pillows":
                containerSizes = "12.6|18.9";
                containerSizeNames = '2"x9"x6"|3"x9"x6"';
                break;
            case "biostop 350i":
                containerSizes = "18|36|54|1155";
                containerSizeNames = "10.3 Fl.Oz.Cart.|20.2 oz. Sausage Pack|30 Fl.Oz.Cart.|5 Gal.";
                break;
        }

        var html = new Array();
        totalCuIn = Math.round(totalCuIn * Math.pow(10, 2)) / Math.pow(10, 2);

        html.push('<table cellspacing="8" cellpadding="2">'
                      + '   <tr>'
                      + '       <th>&nbsp;&nbsp;Product&nbsp;&nbsp;</th>'
                      + '       <th>&nbsp;&nbsp;Total cu in&nbsp;&nbsp;</th>'
                      + '       <th>&nbsp;&nbsp;No. of Containers&nbsp;&nbsp;</th>'
                      + '   </tr>'
                      + '   <tr>'
                      + '       <td align="center">' + productName + '</td>'
                      + '       <td align="center">' + totalCuIn + '</td>'
                      + '       <td align="center"><span id="num_cont">0</span></td>'
                      + '   </tr>'
                      + '</table>'
                      + '<br>'
                      + 'Select a container size:<br>');

        sizesA = containerSizes.split("|");
        size_namesA = containerSizeNames.split("|");

        for (i = 0; i < sizesA.length; i++) {
            html.push(
                '<input type="radio" name="sizes" id="sizes'+i+'" value="' + size_namesA[i] + '"' + 
                'onclick="VOL.update_cont(' + sizesA[i] + ',' + totalCuIn + ')">' + size_namesA[i] + '<br>'
            );
        }

        html.push('<br><input type="button" class="sInput" name="add" value="Add to Print List" onclick="VOL.add_print(\''+ productName +'\', '+ totalCuIn +', ' + holeType + ')">');



        var pCell = $("cell3");
        pCell.style.backgroundColor = '#f3f3f3';
        pCell.style.borderColor = '#dcdcdc';

        var cell = $("cell4");

        var attr = {
            backgroundColor: { from: '#ffffff', to: '#fff4b4' },
            borderColor:     { from: '#ffffff', to: '#e3d165' }
        };
        var bg_anim = new YAHOO.util.ColorAnim(cell, attr, 0.3, YAHOO.util.Easing.easeOut);
        bg_anim.animate();

        cell.style.visibility = 'visible';
        cell.style.display = 'block';
        cell.style.height = 'auto';

        cell.innerHTML = html.join("");

        $("sizes0").checked = true;
        VOL.update_cont(sizesA[0], totalCuIn);
    },


    update_cont: function(containerSize, totalCuIn) {
        $("num_cont").innerHTML = Math.ceil(totalCuIn / containerSize);
    },



    add_print: function(productName, totalCuIn, holeType) {
        var numContainers = $("num_cont").innerHTML;
        var nextCell = printList.length ? printList.length : 0;
        var holeTypeNames = new Array("Circular", "Rectangular", "Construction Joint", "Rectangular");
        var sides = $("sides1").checked ? 1 : 2;

        var longD, shortD;
        switch (holeType) {
            case 0: 
                longD = new Array("Circular - " + 
                    "Hole Diameter: " + $("hole").value + "\", " +
                    "Item Diameter: " + $("item").value + "\", ");
                break;
           
            case 1:
            case 3:
                longD = new Array("Rectangular - " +
                    "Hole Length: " + $('holel').value + "\", " +
                    "Hole Width: "  + $('holew').value + "\", " +
                    "Item Length: " + $('iteml').value + "\", " +
                    "Item Width: "  + $('itemw').value + "\", "); 
                break;

            case 2:
                longD = new Array("Construction Joint - " +
                    "Length: " + $('length').value + "', " +
                    "Avg. Width: " + $('width').value + "\", ");
                break;
        }

        // these are common for all hole types
        longD[0] += "Product Depth: "       + $("depth").value + "\", " +
                    "No. of Applications: " + $("times").value + ", " +
                    "No. of Sides: "        + sides + "<br />";

        longD.push(
            "Product: "           + productName,
            "Amount: "            + totalCuIn,
            "Container Size: "    + VOL.getSelectedSize(),
            "No. of Containers: " + numContainers
        );

        printList[nextCell] = {
            fullDesc: longD.join("<br />") + "<br />",
            shortDesc: productName + ", " + holeTypeNames[holeType] + " - " + totalCuIn + ", (" + numContainers + ") " + VOL.getSelectedSize()
        };


        VOL.updatePrintList();

        // on page load this was hid
        $("right").style.visibility = 'visible';

        // break the form submitting
        return false;
    },

    updatePrintList: function() {
        var html = new Array();
        html.push("<p>");
        
        for (var i = 0; i < printList.length; i++) {
            html.push('<a href="javascript:VOL.deletePrintItem(' + i + ')" title="Delete Item" style="font-weight:bold;font-size:100%;">X</a>&nbsp; '+ printList[i].shortDesc + "<br />");
        }

        html.push("</p>");
        html.push('<br /><br /><input type="button" class="sInput" value="View Full Print List" onclick="VOL.viewPrintList()" />');

        $("printListSummary").innerHTML = html.join("");
    },


    deletePrintItem: function(itemNum) {
        printList.splice(itemNum, 1);
        VOL.updatePrintList();
    },


    getSelectedSize: function() {
        var selected = "";

        for (var i = 0; i < 8; i++) {
            try {
                if ($(("sizes" + i)).checked)
                    selected = $("sizes" + i).value;
            }
            catch (err) { }
        }     

        return selected;
    },


    // open a new windows containnig the full print list 
    viewPrintList: function() {
        var windowOptions = "toolbar=yes,location=no,directories=yes,menubar=yes,scrollbars=yes";
        var printWindow = window.open("", "", windowOptions);

        var html = new Array();
        html.push("<html><body>");
        html.push("<center><h3 style='font-family: sans-serif;'>Bio Fireshield Volume Calculations</h3></center>");
        html.push('<div style="font-size: 1em; font-family: sans-serif;"><p>');

        for (var i = 0; i < printList.length; i++) {
            html.push("Volume Calculation #" + (i + 1) + "<br />");
            html.push(printList[i].fullDesc + "<br /><br />");
        }

        html.push('</p></div>');
        html.push("</body></html>");

        printWindow.document.write(html.join(""));
        printWindow.document.close();
        printWindow.focus();

    }

        } // return in VOL
    }(); // VOL


    YAHOO.util.Event.onAvailable('cell1', VOL.init, VOL, true);


    function round(number, x) {
        x = (x ? x : 2);
        return Math.round(number * Math.pow(10, x)) / Math.pow(10, x);
    }