/*
Script name: formErrorDisplay.js

Author: Marcus Kielly
Date: 23 March 2009
Company: Deckchair

Description:
This script takes several parameters and manipulates the DOM
to illustrate to the user that they have made errors in a form

RELATIONSHIP
- FUNCTION: submitForm()
- SCRIPT: formHandle.js)


NOTES FOR DEVELOPMENT:
- the script could automate containment of its target element
- e.g: wrap the current element within a container
- or use sibling methods to insert the error box into the correct
- location

- could be extended to supply additional display methods
- by changing the displayMethod variable
- e.g: Modal, Label
- this suggests prototypal development

- this function is currently tailored to display all a forms
- values at one location in the document, and is not suited
- to an event triggered by a "change"

TESTING REQUIRED
- must implement object tests to test for browser capabilities
- cross browser tests (IE, Firefox, Opera, Safari)


PARAMETERS
-------------------------------------------------------------------------------------------------
formElem: target form reference
msgArrayParsed: array of pre-generated text messages
displayMethod: to permit multiple display methods
errorClass: class to apply to error message container
inputClass: class to apply to inputs with errors

N.B: It is ideal if the form is contained within it's own element
i.e: a fieldset/div
*/



function formErrorDisplay(formElem,msgArrayParsed,displayMethod,errorClass,inputClass){

        var formParent = formElem.parentNode;
        var formInputs = [];
        var allFormInputs = [];
        var inputs = formElem.getElementsByTagName("input");
        var text = formElem.getElementsByTagName("textarea");

    if(inputs.length>0){
        for(var j=0; j < inputs.length; j++){
            formInputs.push(inputs[j]);
            }
        }

    if(text.length>0){
        for(var k=0; k < text.length; k++){
            formInputs.push(text[k]);
            }
        }

        var inputClass = " " + inputClass;
//-------------------------------------------------------------
//DOM DISPLAY ROUTINE
//-------------------------------------------------------------
    if (displayMethod == "dom"){


        // FLUSH PREVIOUS ERROR DISPLAY
        //------------------------------------------------------------------------------------------
        // check DOM for error box existence and remove it
        var divCheck = document.getElementsByTagName("div");

        for (var i=0;i<divCheck.length;i++){
                // Check to see if a div exists with the "errors" class
                // and also check to see if it is not a child of the same parent node
                if (divCheck[i].className == errorClass){
                    var errorNode = divCheck[i];
                    errorNode.parentNode.removeChild(errorNode);
                    }
                }

        var subCheck = document.getElementsByTagName("h4");
        for (var i=0;i<subCheck.length;i++){
                // Check to see if a div exists with the "errors" class
                // and also check to see if it is not a child of the same parent node
                if (subCheck[i].className == "errsub"){
                    var subNode = subCheck[i];
                    subNode.parentNode.removeChild(subNode);
                    }
                }

         // check DOM for input styling
        var allInputs = document.getElementsByTagName("input");
        var allText = document.getElementsByTagName("textarea");

        if(allInputs.length>0){
            for(var j=0; j < allInputs.length; j++){
                allFormInputs.push(allInputs[j]);
                }
            }

        if(allText.length>0){
            for(var k=0; k < allText.length; k++){
                allFormInputs.push(allText[k]);
                }
            }


         for(var j=0;j < allFormInputs.length;j++){
                    // acquire the current class names
                    var currentInputClass = allFormInputs[j].className;

                    // replace any instance of the error class name
                    // with an empty string
                    // (removes any PHP generated classnames too...)
                    allFormInputs[j].className = currentInputClass.replace(inputClass,"");
                    }


        if(msgArrayParsed.length>0){
            // CREATE NEW DISPLAY ELEMENTS
            //------------------------------------------------------------------------------------------

            // CREATE ERROR CONTAINER
            var errorBox = document.createElement("div");
            errorBox.className=errorClass;

             // CREATE ERROR LIST CONTAINER
            var errorUl = document.createElement("ul");

            // CREATE ERROR LIST TITLE
            var errorTitle = document.createElement("h3");
            var errorTitleTxt = document.createTextNode("There have been some errors with the form - see below:");
            errorTitle.appendChild(errorTitleTxt);

            // CREATE ERROR SUBTITLE
            /*
            var errorSubTitle = document.createElement("h4");
            errorSubTitle.className="errsub";
            var errorSubTitleTxt = document.createTextNode("There have been some errors with the form - see above:");
            errorSubTitle.appendChild(errorSubTitleTxt);
            */

            // PROCESS ERROR MESSAGES
            // process error messages into text nodes and apply styles to inputs
            for(i=0; i < msgArrayParsed.length;i++){
                 // create list item
                 var errListItem = document.createElement("li");

                 // create the text
                 var txtNode = document.createTextNode(msgArrayParsed[i][1]);
                 // append text to list item
                 errListItem.appendChild(txtNode);

                 // attach to the list container
                 errorUl.appendChild(errListItem);

                // APPLY INPUT CLASS
                for(var k=0;k < formInputs.length;k++){
                        if(formInputs[k].getAttribute("title")==msgArrayParsed[i][0]){
                            formInputs[k].className += inputClass;
                            }
                        }
                 }

                 // append errorList to the errorBox
                 errorBox.appendChild(errorTitle);
                 errorBox.appendChild(errorUl);

                 // INSERT CONTAINER INTO DOCUMENT
                 formParent.insertBefore(errorBox,formElem);
                // INSERT SUBTITLE INTO DOCUMENT
                //formParent.appendChild(errorSubTitle);
                }
        }
    }
  /*
 //-------------------------------------------------------------
 // DEFAULT ALERT DISPLAY ROUTINE
 //-------------------------------------------------------------

 else if(display == "alert"){
             msg="";
 for(i=0;i<errorText.length;i++){

             //create list item
             msg += errorText[i] + "\n";
             }
   alert(msg);
   return false;
   }

     return false;
}//end of form submission test
*/