/* Implementation of the eGV.WMSManager control that allows for some custom
 * properties of this project
 */

LayersManagerCustom = OpenLayers.Class(eGV.Control.LayersManager, {
    /**
     * Method: draw
     * This method create all the HTML inside the Div, creating all the DOM
     * elemens.
     *
     * Depending if the LayersGroups exists, it calls the drawGroupList() or drawLayersList()
     * methods.
     *
     */


    draw: function(){
        if(this.div == null) return;
        //clear the previous content of the div.
        while(this.div.firstChild) this.div.removeChild(this.div.firstChild);

        var divIntro = document.createElement("div");
        divIntro.className = "divIntroLayersManager";
        divIntro.setAttribute("class","divIntroLayersManager");

        var txtNode = document.createTextNode(ca.infoIntroText1);
        divIntro.appendChild(txtNode);

        //divIntro.appendChild(document.createElement("br"));

        var img = document.createElement("img");
        img.setAttribute("src","img/viewer/wms_petit.png");
        img.setAttribute("class","imgIntroLayersManager");
        img.setAttribute("className","imgIntroLayersManager");
        img.setAttribute("align","absmiddle");

        // works fine with ff but not in IE
        //img.setAttribute("onclick","wmsControlCall();");

        // so we have to do it like this.
        if (document.addEventListener)
        { // All browsers except IE use these assignments
            img.addEventListener("click",wmsControlCall,false);
        }
        else
        { // this part is needed for IE only
            img.attachEvent("onclick",wmsControlCall);
        }



        divIntro.appendChild(img);

        divIntro.appendChild(document.createElement("br"));
        divIntro.appendChild(document.createElement("br"));

        txtNode = document.createTextNode(ca.infoIntroText2);
        divIntro.appendChild(txtNode);
        divIntro.appendChild(document.createElement("br"));

        this.div.appendChild(divIntro);

        //create the title
        if (this.displayTitle) {
            var header = document.createElement("h3");
            header.className ='egvControlLayersManagerTitle';
            header.appendChild(document.createTextNode(eGV.Lang.translate("layersmanager_title")));
            this.div.appendChild(header);
        }

        if (this.displayExplanationText) {
            this.div.appendChild(document.createTextNode(eGV.Lang.translate("layersmanager_management")));
            this.div.appendChild(document.createElement("br"));
            this.div.appendChild(document.createTextNode(eGV.Lang.translate("layersmanager_warning")));
            this.div.appendChild(document.createElement("br"));
            this.div.appendChild(document.createTextNode(eGV.Lang.translate("layersmanager_legend")));
            this.div.appendChild(document.createElement("br"));
        }

        //Main div
        var divMain = document.createElement("div");
        if (this.map.groups){
            divMain.className = "egvControlLayersManagerDiv";
            var spanGroups = this.drawGroupList();
            divMain.appendChild(spanGroups);

        } else {
            divMain.className = "egvControlLayersManagerDiv";

            //Main list
            var spanMain = document.createElement("span");
            spanMain.className = "egvControlLayersManagerContainer";
            for (var i=0, len=this.map.connections.length;i < len; i++){
                conn = this.map.connections[i];
                divsLayersArray = this.drawLayersList(conn.layers);
                for (k = 0; k < divsLayersArray.length;k++) {
                    spanMain.appendChild(divsLayersArray[k]);
                }

            }
            divMain.appendChild(spanMain);

        }
         this.div.appendChild(divMain);
        // begins specific part for wms manager transparency tools
        //intro text
         var divAdded = document.createElement("div");
        divAdded.className = "egvControlLayersManagerDivAdded";
        divAdded.setAttribute("class","egvControlLayersManagerDivAdded");

        var divSlideIntro = document.createElement("div");
        divSlideIntro.className = "divSlideIntro";
        divSlideIntro.setAttribute("class","divSlideIntro");

        var txtNode = document.createTextNode(ca.slideText);
        divSlideIntro.appendChild(txtNode);
        divAdded.appendChild(divSlideIntro);

        //combo stuff
        var divSlideCombo = document.createElement("div");
        divSlideCombo.className = "divSlideCombo";
        divSlideCombo.setAttribute("class","divSlideCombo");

        var combo = document.createElement("select");
        combo.setAttribute('id', 'idCombo');
        var default_option=document.createElement("option");
        default_option.text=ca.chooseAnOption;
        default_option.value=0;

        try{// ie made me do this
            combo.add(default_option);
        }catch(e){
            combo.appendChild(default_option);
        }
        for (var i=0, len=this.map.connections.length;i < len; i++){
            var newOption=document.createElement("option");
            if (this.map.connections[i].name){
                newOption.text=this.map.connections[i].name;
            }else if(this.map.connections[i].layers[0].name){
                newOption.text=ca.externalConnection+this.map.connections[i].layers[0].name;
            }else{
                newOption.text=ca.WMSNameNotFound;
            }

            if (this.map.connections[i].visibleLayers.length == 0){
                newOption.text += ca.mustActivate;
            }
            newOption.value=i+1;

            try{// ie made me do this
                combo.add(newOption);
            }catch(e){
                combo.appendChild(newOption);
            }
        }
        divSlideCombo.appendChild(combo);
        divAdded.appendChild(divSlideCombo);

        // transparency text and slidebar
        var spanSliderMain = document.createElement("span");
        spanSliderMain.className = "spanSliderMain";
        spanSliderMain.setAttribute("class","spanSliderMain");

        var spanSliderText = document.createElement("span");
        spanSliderText.className ="spanSliderText";

        var txtNode2 = document.createTextNode(ca.transparency);
        spanSliderText.appendChild(txtNode2);

        spanSliderMain.appendChild(spanSliderText);

        var spanSliderWrapper  = document.createElement("span");
        spanSliderWrapper.className = "spanSliderWrapper";

        var divSlider = document.createElement("div");
        divSlider.setAttribute('id', 'idSlider');
        divSlider.className = "slider";
        divSlider.setAttribute("class","slider");

        var divSliderInput = document.createElement("div");
        divSliderInput.setAttribute('id', 'idSliderInput');
        divSliderInput.className = "slider-input";
        divSliderInput.setAttribute("class","slider-input");

        divSlider.appendChild(divSliderInput);
        spanSliderWrapper.appendChild(divSlider);
        spanSliderMain.appendChild(spanSliderWrapper);

        divAdded.appendChild(spanSliderMain);

        // adding everything
        this.div.appendChild(divAdded);
        /////////////////////////////////////


        slider = new Slider(document.getElementById("idSlider"), document.getElementById("idSliderInput"),'horizontal');
        slider.setValue(90);

        slider.onchange = function () {
            var map = eGV.getMap();

            if (map.connections && document.getElementById("idCombo").value > 0){

                var transparentConnection = map.connections[(document.getElementById("idCombo").value)-1];
                transparentConnection.olLayer.setOpacity(slider.getValue()/100);
            }

        };



    },


    CLASS_NAME: "LayersManagerCustom"
});