package  com.actionscriptfacile.ui.button
{
	import com.actionscriptfacile.skin.ISkin;
	import com.actionscriptfacile.ui.UIComponent;
	import flash.display.DisplayObject;
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import com.actionscriptfacile.ui.text.UITextField;
 
	/**
	 * Un objet de type Button est un objet
	 * @author Matthieu
	 */
	public class Button extends UIComponent
	{
 
		/**
		 * Constantes qui vont nous servir à définir des styles dans les objets de skin par défaut @see com.as3facileexemple.skin.classic.DefaultButtonSkin
		 */
		static public const BUTTON_UP_SKIN:String = "BUTTON_UP_SKIN";
		static public const BUTTON_DOWN_SKIN:String = "BUTTON_DOWN_SKIN";
		static public const BUTTON_OVER_SKIN:String = "BUTTON_OVER_SKIN";
 
		/**
		 * Constantes qui vont nous servir à changer l'état  du bouton par le biais d'un appel à la méthode setState
		 */
		static protected const UP_STATE:String = "UP_STATE";
		static protected const DOWN_STATE:String = "DOWN_STATE";
		static protected const OVER_STATE:String = "OVER_STATE";
 
		protected var m_overStyle:DisplayObject;	// objet graphique représentant l'état OVER
		protected var m_upStyle:DisplayObject;		// objet graphique représentant l'état UP
		protected var m_downStyle:DisplayObject;	// objet graphique représentant l'état DOWN
		protected var m_label:UITextField;			// objet de type UITextField qui est en fait un champ texte un peu amélioré
 
		public function Button()
		{
			/*
			 * ajout d'une méthode init pour gagner des ressources, en effet en AS3 tout ce qui se trouve dans le constructeur n'est
			 * pas optimisé à la compilation, on met donc toutes nos instructions dans une méthode privée init
			 * */
 
			init();
		}
 
		/**
		 * Détruit proprement un objet de type Button
		 */
 
		override public function destroy():void
		{
 
			/**
			 * On s'extrait de la display list de notre parent, on détruit notre composant m_label de type UITextField ainsi
			 * que nos objets graphiques qui représentent les différents états et on appelle la méthode
			 * destroy() parente @see com.actionscriptfacile.ui.UIComponent
			 */
 
			if ( parent && parent.contains( this ) )
				parent.removeChild( this );
 
			m_label.destroy();
			m_label = null;
			m_upStyle = m_downStyle = m_overStyle = null;
 
			super.destroy();
		}
 
		/**
		 * Initialise proprement les différents éléments du composant
		 */
		private function init():void
		{
 
			/**
			 * Création d'un objet de type UITextField que l'on assigne à la variable membre m_label.
			 * On aligne son texte par défaut en justifié et on indente le texte de 2 pixels.
			 * Ensuite nous mettons des valeurs totalement arbitraires pour les propriétés width, maxwidth, height
			 * et maxheight que l'on pourra changer par la suite.
			 */
 
			m_label = addChild( new UITextField() ) as UITextField;
			m_label.alignJustify();
			m_label.changeFormat( 'indent', 2 );
			m_label.maxHeight = m_label.height = 30;
			m_label.maxWidth = m_label.width = 80;
 
			/**
			 * nos objets graphiques de style sont des sprites vides par défaut
			 */
			m_overStyle = addChild( new Sprite() );
			m_upStyle = addChild( new Sprite() );
			m_downStyle = addChild( new Sprite() );
 
			setState( UP_STATE );
 
			mouseChildren = false;
		}
 
		/**
		 * Quand on sort de la display list du stage on tue tous les events listeners ce qui économise des ressources
		 */
 
		override public function onRemovedFromStage():void
		{
			removeEventListener( MouseEvent.MOUSE_UP, overHandler, false );
			removeEventListener( MouseEvent.ROLL_OUT, upStateHandler, false );
			removeEventListener( MouseEvent.MOUSE_DOWN, downStateHandler, false );
			removeEventListener( MouseEvent.ROLL_OVER, overHandler, false );
		}
 
		/**
		 * On initialise les events listeners uniquement lorsque le composant est ajouté à la displaylist du stage.
		 * En procédant de la sorte, on utilise les ressources uniquement lorsque cela s'avère nécessaire.
		 */
		override public function onAddedToStage():void
		{
			addEventListener( MouseEvent.MOUSE_UP, overHandler, false );
			addEventListener( MouseEvent.ROLL_OUT, upStateHandler, false );
			addEventListener( MouseEvent.MOUSE_DOWN, downStateHandler, false );
			addEventListener( MouseEvent.ROLL_OVER, overHandler, false );
		}
 
		/**
		 * @see com.actionscriptfacile.ui.UIComponent
		 */
		override public function resize( p_width:Number, p_height:Number ):void
		{
 
			/*
			 * on redéfinit les maxWidth et maxHeight de notre m_label et on les définit à la taille de notre composant button.
			 * Ensuite on rédéfinit la taille de nos composants m_overStyle, m_downStyle, m_upStyle.
			 * */
 
			m_label.maxWidth = p_width;
			m_label.maxHeight = p_height;
 
			m_overStyle.width = m_label.width = m_downStyle.width = m_upStyle.width = p_width;
			m_overStyle.height = m_label.height = m_downStyle.height = m_upStyle.height = p_height;
		}
 
		/**
		 * Au survol on affiche l'état OVER par le biais de la méthode setState
		 * @param	e Evenement de type MouseEvent
		 */
		private function overHandler(e:MouseEvent):void { setState( OVER_STATE ); }
 
		/**
		 * Au survol on affiche l'état DOWN par le biais de la méthode setState
		 * @param	e Evenement de type MouseEvent
		 */
		private function downStateHandler(e:MouseEvent):void { setState ( DOWN_STATE ); }
 
		/**
		 * Au survol on affiche l'état UP par le biais de la méthode setState
		 * @param	e Evenement de type MouseEvent
		 */
		private function upStateHandler(e:MouseEvent):void { setState( UP_STATE ); }
 
		/**
		 *	Définit le texte du composant m_label de type UITextField @see com.actionscriptfacile.ui.text.UITextField
		 */
		public function set label( p_label:String ):void { m_label.text = p_label; }
 
		/**
		 *	Retourne le texte du composant m_label de type UITextField @see com.actionscriptfacile.ui.text.UITextField
		 */
		public function get label():String { return m_label.text; }
 
		/**
		 *	Retourne le composant m_label de type UITextField @see com.actionscriptfacile.ui.text.UITextField
		 */
		public function get labelField():UITextField { return m_label; }
 
		/**
		 *
		 * Cette méthode applique la skin définit en paramètre au composant.
		 *
		 * @param	p_skin Objet implémentant l'interface ISkin
		 */
 
		override public function applySkin(p_skin:ISkin):void
		{
 
			// on définit une variable de type Class qui servira à réceptionner toutes les définitions de notre objet skin
			var definition:Class;
 
			// on cherche la définition au sein de la skin qui répond au nom : BUTTON_OVER_SKIN
			definition = p_skin.getSkin( BUTTON_OVER_SKIN ) as Class;
 
			// si cette définition existe alors on crée une nouvelle instance et on l'assigne à l'élément m_overStyle
			if ( definition != null )
				m_overStyle = new definition();
 
			/*
			 * On applique le même procédé pour tous les autres éléments du bouton
			 * */
 
			definition = p_skin.getSkin( BUTTON_DOWN_SKIN ) as Class;
 
			if ( definition != null )
				m_downStyle = new definition();
 
			definition = p_skin.getSkin( BUTTON_UP_SKIN ) as Class;
 
			if ( definition != null )
				m_upStyle = new definition();
 
			// on ajoute nos styles à la display list
			addChild( m_upStyle );
			addChild( m_downStyle );
			addChild( m_overStyle );
 
			// on affiche l'état par défaut.
			setState ( UP_STATE );
 
			// Et on redimensionne proprement nos nouveaux objets graphiques / états
			resize( width, height );
		}
 
		/**
		 *
		 * Change l'état graphique du bouton en fonction du paramètre p_state qui répresente l'id de l'état à afficher.
		 * Si l'état n'est pas valide l'état par défaut est l'état UP_STATE.
		 *
		 * @param	id de l'état à afficher
		 */
		protected function setState( p_state:String ):void
		{
 
			// on enlève tous les enfants de la display list
			while ( numChildren > 0 )
				removeChildAt( 0 );
 
			// puis on ajoute celui qui représente notre état.
 
			switch ( p_state )
			{
				case OVER_STATE:
					addChild( m_overStyle );
					break;
 
				case DOWN_STATE:
					addChild( m_downStyle );
					break;
 
				default:
					addChild( m_upStyle );
					break;
			}
 
			addChild( m_label );
		}
 
	}
 
}

package
{
	import com.actionscriptfacile.ui.button.Button;
	import com.as3facileexemple.skin.classic.DefaultButtonSkin;// import du skin du boutton
 
	import flash.display.Sprite;
 
	/**
	 * Exemple d'utilisation du composant Button.
	 * @author Matthieu
	 */
	public class ButtonExample extends Sprite
	{
 
		public function ButtonExample():void
		{
			// création un objet de type Button
			var button:Button = new Button();
 
			// définission du texte
			button.label = 'Button Component';
 
			// Application de la skin par défaut
			// [ Attention ! Cette skin utilise le fichier ui.swc qui doit être ajouté à la liste des composants à passer au compilateur ]
			button.applySkin( new DefaultButtonSkin() );
 
			// ajout à la displaylsit
			addChild( button );
 
			// définition de sa taille en 150 * 30 pixels
			button.resize( 150, 30 );
 
			// définition de la position du button sur la scène
			button.x = 60;
			button.y = 60;
 
			// acccès au composant de type UITextField (labelField)
			button.labelField.alignCenter(); // centre le texte
			button.labelField.changeFormat("color", 0xffffff);// changement de la couleur du texte
			button.labelField.changeFormat("size", 14);// changement de la taille de la police du texte
			button.labelField.changeFormat("font", "Arial");// changement de la police du texte
		}
	}
}

package com.as3facileexemple.skin.classic
{
	// Import des classes gérant la partie graphique du composant dans le fla (movieclip)
	// Provient de ui.swc (créé avec la compilation de UI.fla)
	import com.as3facile.skin.button.ButtonDownSkin;
	import com.as3facile.skin.button.ButtonOverSkin;
	import com.as3facile.skin.button.ButtonUpSkin;
 
	import com.actionscriptfacile.skin.Skin;
	import com.actionscriptfacile.ui.button.Button;
 
	/**
	 * Définition du skin utilisé pour un composant Button
	 *
	 * @author Matthieu
	 */
	public class DefaultButtonSkin extends Skin
	{
 
		public function DefaultButtonSkin()
		{
			// Affectation de chaque élément du bouton à un skin
			setSkin( Button.BUTTON_DOWN_SKIN , ButtonDownSkin );// élément du bouton, classe graphique (movieclip) associée
			setSkin( Button.BUTTON_OVER_SKIN, ButtonOverSkin );
			setSkin( Button.BUTTON_UP_SKIN , ButtonUpSkin );
		}
 
	}
 
}