//
// Fournit l'ensemble des composants permettant de construire un "Accordeon".
//
// Le composant Accordion fournit les classes permettant de construire un composant "Accordeon".
//
// Code inspiré de "dijit.layout.Accordion". Ce composant force à définir une 
// valeur pour la hauteur totale de l'accordéon. Ce qui n'est pas le comportement habituel.
//
// Utilisation :
// | 	<div dojoType="dijit.layout.Accordion">
// |		<div dojoType="dijit.layout.AccordionPane" title="pane 1">
// |			<div dojoType="dijit.layout.ContentPane">...</div>
// | 	</div>
// |		<div dojoType="dijit.layout.AccordionPane" title="pane 2">
// |			<p>This is some text</p>
// ||		...
// |	</div>
//
if (!dojo._hasResource["cyim.dojo.widgets.Accordion"]) { //_hasResource checks added by build. Do not use _hasResource directly in your code.
    dojo._hasResource["cyim.dojo.widgets.Accordion"] = true;
    dojo.provide("cyim.dojo.widgets.Accordion");

    dojo.require("dojo.fx");

    dojo.require("dijit._Container");
    dojo.require("dijit._Templated");
    dojo.require("dijit.layout.StackContainer");
    dojo.require("dijit.layout.ContentPane");

    dojo.declare(
	"cyim.dojo.widgets.Accordion",
	dijit.layout.StackContainer,
	{
	    // duration: Integer
	    //		Amount of time (in ms) it takes to slide panes
	    duration: 250,

	    // expandOnStartUp: Boolean
	    //		Si faux, tous les panneaux sont fermés à l'initilisation de l'accordéon
	    expandOnStartUp: true,

	    _verticalSpace: 0,

	    postCreate: function() {
	        this.domNode.style.overflow = "hidden";
	        this.inherited("postCreate", arguments);
	        dojo.addClass(this.domNode, "cyimAccordion");
	    },

	    startup: function() {
	        if (this._started) { return; }
	        this.inherited("startup", arguments);

	        // le comportement par défaut de dijit.layout.StackContainer est de sélectionner le premier panel
	        // la propriété expandOnStartUp permet de passer outre
	        if (!this.expandOnStartUp) {
	            this.selectedChildWidget = undefined;
	        }

	        if (this.selectedChildWidget) {
	            this.selectedChildWidget.setSelected(true);
	        }
	    },

	    layout: function() {
	        // cette fonction doit rester vide.
	    },

	    _setupChild: function(/*Widget*/page) {
	        // Summary: prepare the given child
	        return page;
	    },

	    _transition: function(/*Widget?*/newWidget, /*Widget?*/oldWidget) {
	        if (this._inTransition) { return; }
	        this._inTransition = true;
	        var animations = [];
	        if (newWidget) {
	            newWidget.setSelected(true);
	            var newContents = newWidget.containerNode;
	            newContents.style.display = "";

	            animations.push(dojo.animateProperty({
	            node: newContents,
	            duration: this.duration,
	            properties: {
	            height: { start: "1", end: newWidget.height }
	            },
	            onEnd: function() {
	            newContents.style.overflow = "auto";
	            }
	            }));
	        }
	        if (oldWidget) {
	            oldWidget.setSelected(false);
	            var oldContents = oldWidget.containerNode;
	            oldContents.style.overflow = "hidden";

	            animations.push(dojo.animateProperty({
	                node: oldContents,
	                duration: this.duration,
	                properties: {
	                    height: { start: oldWidget.height, end: "1", unit: "px" }
	                },
	                onEnd: function() {
	                    oldContents.style.display = "none";
	                }
	            }));
	        }

	        this._inTransition = false;

	        dojo.fx.combine(animations).play();
	    }
	}
);

	dojo.declare("cyim.dojo.widgets.AccordionPane",
	[dijit.layout.ContentPane, dijit._Templated, dijit._Contained],
	{
	    // height: Integer    Hauteur de l'élement à l'initialisation de l'accordeon
	    height: 50,

	    // _inheritedClass: String      Classe CSS déclarées dans le noeud container
	    _inheritedClass: String,

	    templateString: "<div class='cyimAccordionPane' dojoAttachPoint='accordionContainer'><div dojoAttachPoint='titleTextNode,titleNode,focusNode' dojoAttachEvent='onclick:_onTitleClick,onfocus:_handleFocus,onblur:_handleFocus' class='cyimAccordionTitle'>${title}<span class='cyimAccordionArrow'></span></div><div><div dojoAttachPoint='containerNode' style='overflow: hidden; height: 1px; display: none' class='cyimAccordionBody'></div></div></div>",

	    constructor: function(props, htmlTag, maxHeight) {
	        if (typeof (htmlTag) != "undefined") {
	            if (props.height != undefined) {
	                this.height = props.height;
	            }
	            else if (typeof (htmlTag.scrollHeight) != "undefined") {
	                this.height = htmlTag.scrollHeight;
	                if (typeof (maxHeight) != "undefined") {
	                    if (this.height > maxHeight)
	                        this.height = maxHeight;
	                }
	            }
	            this._inheritedClass = htmlTag.className;
	            this.title = htmlTag.title;
	        }
	    },

	    postCreate: function() {
	        this.inherited("postCreate", arguments)
	        dojo.setSelectable(this.titleNode, false);
	        this.setSelected(this.selected);
	        if (this.selected)
	            this._onTitleClick();
	        if (this._inheritedClass != "") {
	            dojo.addClass(this.accordionContainer, this._inheritedClass);
	        }
	    },

	    _onTitleClick: function() {
	        // summary: callback when someone clicks my title
	        var parent = this.getParent();
	        if (!parent._inTransition) {
	            parent.selectChild(this);
	            dijit.focus(this.focusNode);
	        }
	    },

	    _setSelectedState: function(/*Boolean*/isSelected) {
	        this.selected = isSelected;
	        dojo[(isSelected ? "addClass" : "removeClass")](this.titleNode, "cyimAccordionTitle-selected");
	    },

	    _handleFocus: function(/*Event*/e) {
	        // summary: handle the blur and focus state of this widget
	        dojo[(e.type == "focus" ? "addClass" : "removeClass")](this.focusNode, "cyimAccordionFocused");
	    },

	    setSelected: function(/*Boolean*/isSelected) {
	        // summary: change the selected state on this pane
	        this._setSelectedState(isSelected);
	        if (isSelected) {
	            this.onSelected();
	            this._loadCheck(true); // if href specified, trigger load
	        }
	    },

	    onSelected: function() {
	        // summary: called when this pane is selected
	    }
	});

}