brand.globalnav.Accordion = Class.create( Widget, 
{
    // summary:
    //      Container for a set of nav links where only 1 nav category link's content is visible at a time
    //      Switching between nav categories slides the sub nav links in each nav category up/down 
    
    //templatePath: "/js/brand/globalnav/templates/Accordion.html",  
    templatePath: "jsTemplates.globalnav.Accordion",
    
    templateType: "",
    isContainer: true,

    // hasLoaded: Boolean
    // have template nodes loaded in DOM
    // declarative instance = true
    hasLoaded: false,

    // parentId: String (Optional: passed for declarative instances)
    // parent object id 
    parentId: "",
    
    // displayName: String
    displayName: "",
    
    // hdPath: String
    // header img src
    hdPath: "", 
    
    // isOpen: Boolean
    // is accordion sub nav open
    isOpen: false,

    // activeItemId: String
    // currently active/open child PanelNavs associated w/ this Accordion
    activeSubItemId: "",
   
    // open/close animation properties
    durationOpen: 0.4,     
    durationClose: 0.3,      
    durationFade: 0.3, 

    initialize: function($super, properties) { 
    	this.setProperties(properties); 
    	//console.log("Accordion.initialize "+this.id);
    	
    	/**MK: still used?
    	if (this.templateType && this.templateType !== "") {  
            this.templatePath = "/js/brand/globalnav/templates/" + this.templateType + ".html";
          }**/
          
    	$super();
    }, 
    postCreate: function() {  
        //console.log("Accordion.postCreate "+this.id);
 
        // declarative instance
        if (this.hasLoaded) { 
        	  //some cases where accordion is stand-alone (no parent), such as my account nav in open/default state 
            //jstest if (parent) { parent.addChild(this.id); }  
            this.startup();
        }
    },
    
    startup: function() { 
        this.hdNode = $(this.id + "_hd");  
    },
 
    onClick: function() {    
        //console.log("Accordion.onClick: "+this.id);
        
        // tell parent of event
        if (this.parent) {
            this.parent.onChildClick(this.id);
        }   
 
        // toggle state
        if (this.isOpen) {
            this.close();
        } else {
            this.open();
        }   
       
    },

    open: function() {
         //console.log("Accordion.open "+this.id);  
         if (this.hdNode) this.hdNode.addClassName("sprite-on"); // switch img 
 
         this._showSubNav();
         this._setActive(true);  
         
         //MK: fix me: there is another panelnav:show somewhere, confusing issues
         // as it was commented out, I renamed this and fixed the format, needed for CM element tags at some point. EF
         generic.events.fire({event:"accordion:open", msg:{ type: "accordion", id: this.id, parentId: this.parentId, displayName: this.displayName }}); 
        
    },
    
    close: function(/* String */defaultId) {
    	// summary:
    	//		Closes the active accordion, unless it is associated with default item
    	// 		Close subitems (panelsubnavs) 
        // handle subitems  
         //console.log("Accordion.close "+this.id + " " + defaultId); 
          if (this.hdNode) this.hdNode.removeClassName("sprite-on"); // switch img 
          
         if (this.activeSubItemId) {
           var activeSubItem = $(this.activeSubItemId).widget;  
        	 if (activeSubItem.hdNode) activeSubItem.hdNode.removeClassName("sprite-on"); 
           activeSubItem.close(); 
         } 
    	// handle this accordion
    	if (this.id !== defaultId) {
		/**JSTEST if (this.hdImg) {
				this.hdImg.changeSrc("off"); // switch img
		}**/
		this._hideSubNav();
		this._setActive(false);
		//generic.events.fire("panelnav:hide", { type: "accordion", id: this.id, parentId: this.parentId } ); 
          } 
    },
    
    _setActive: function(/* Boolean */state) {     
        this.isOpen = state;
         
        if (this.parent) {
            if (state == true) {
                this.parent.activeItemId = this.id;
            } else if (this.parent.activeItemId === this.id) {
               this.parent.activeItemId = "";
            }
        } 
    },
    
    _showSubNav: function() {
        var node = this.containerNode; 
        //console.log("Accordion._showSubNav "+ node.id); 
        node.setOpacity(0);
        node.style.overflow = "hidden";
        if (node.style.visibility == "hidden" || node.style.display == "none") { 
        	node.style.height = "1px";
        	node.style.display = "block";
          node.style.visibility = "";  
        
        } 
           
        var duration = this.durationOpen;
        var h = node.scrollHeight; 
        
        var expandAccordion  = function() { 
	new Effect.Morph( node, {
	     	duration    : duration, 
		style       : { height  : h + "px"},   
		afterFinish : fadeUp
	});
        };
        duration = this.durationFade;
        var fadeUp  = function() {  
	new Effect.Opacity ( node, {
		duration    : duration, 
		transition  : Effect.Transitions.linear, 
		from        : 0,
		to          : 1 
	});
         };   
         expandAccordion();   
    },
    
    _hideSubNav: function() {
        var node = this.containerNode;
        //console.log("Accordion._hideSubNav "+ node.id);  
        
       var duration = this.durationClose;
       var contractAccordion = function() {  
	new Effect.Morph(node, {
	     	duration    : duration, 
		style       : { height  : "1px" },   
		afterFinish : function() {
			node.hide();
			node.style.overflow = "hidden";
		}
	});
        };
        duration = this.durationFade;
        var fadeDown  = function() {  
	new Effect.Opacity ( node, {
		duration    : duration,  
		transition  : Effect.Transitions.linear, 
		from        : 1,
		to          : 0 
	});
         };   
         fadeDown();
         contractAccordion();      
    } /**, 
    
    _onMouseOver: function(e) { 
	if (dojo.exists("changeSrc", this.hdImg)) {
	        if (!this.isOpen) { this.hdImg.changeSrc("on") };
	}
    },
    
    _onMouseOut: function(e) { 
	if (dojo.exists("changeSrc", this.hdImg)) {
	        if (!this.isOpen) { this.hdImg.changeSrc("off") }; 
	}
    }**/
});