package  com.actionscriptfacile.ui.list
{
	import com.actionscriptfacile.skin.ISkin;
	import com.actionscriptfacile.ui.scroll.components.VerticalScrollBar;
	import com.actionscriptfacile.ui.UIComponent;
	import com.actionscriptfacile.ui.utils.UIMargins;
	import flash.display.DisplayObject;
	import flash.display.Shape;
	import flash.display.Sprite;
 
	/**
	 * Un composant List est un objet graphique qui peut stocker d'autres objets graphiques au sein d'un clip
	 * conteneur qui lui-même, est masqué.
	 *
	 * A chaque fois qu'un objet est ajouté au composant, celui-ci se charge d'éditer la position ".y" du dit
	 * objet afin de le placer à la suite des autres.
	 *
	 *
	 * @author Matthieu
	 */
	public class List extends UIComponent
	{
 
		static public const LIST_BACKGROUND_SKIN:String = 'LIST_BACKGROUND_SKIN'; // constantes pour le skin
 
		private var m_scrollBar:VerticalScrollBar; // objet de type VerticalScrollBar
		private var m_containerMask:Shape; // masque du clip conteneur
		private var m_container:Sprite; // conteneur
		private var m_background:Sprite; // background ou "fond" du composant.
		private var m_margins:UIMargins; // objet servant à définir les marges à appliquer au contenu.
 
		public function List()
		{
			init();
		}
 
		private function init():void
		{
 
			m_margins = new UIMargins(); // Marges = 0 dans toutes les directions
 
			m_scrollBar = new VerticalScrollBar(); // on crée une scrollBar
			m_containerMask = new Shape(); // on crée le mask
			m_container =  new Sprite(); // on crée le conteneur
			m_background = new Sprite(); // on crée le fond
 
			/**
			 * On dessine le masque
			 */
			m_containerMask.graphics.beginFill( 0XFF0000, .5 );
			m_containerMask.graphics.drawRect( 0, 0, 100, 100 );
			m_containerMask.graphics.endFill();
 
			/**
			 * On dessine un fond par défaut
			 */
			m_background.graphics.beginFill( 0X999999, .1  );
			m_background.graphics.drawRect( 0, 0, 100, 100 );
			m_background.graphics.endFill();
 
			/**
			 * Puis nous ajoutons tous les éléments de notre composant que nous avons créé 
			 * au préalable à sa displayList
			 */
			addChild( m_scrollBar );
			addChild( m_background );
			addChild( m_container );
			addChild( m_containerMask );
 
			// on applique le masque au conteneur
			m_container.mask = m_containerMask;
 
			// on cache la scrollBar
			m_scrollBar.hide();
 
		}
 
		/**
		 * Fonction permettant de gérer la customisation des différents éléments
		 * graphiques d'un objet de type List
		 *
		 * @param	p_skin Objet implémentant l'interface ISkin
		 */
		override public function applySkin( p_skin:ISkin ):void
		{ 
 
			// on applique la skin à la scrollBar
			m_scrollBar.applySkin( p_skin );
 
			// nous récupérons la définition de classe pour le background de l'objet List
			var definition:Class = p_skin.getSkin( LIST_BACKGROUND_SKIN ) as Class;
 
			// si la définition a été trouvée
			if ( definition )
			{
				// nous vidons proprement l'objet background
				var child:DisplayObject;
				while ( m_background.numChildren > 0 )
				{
					child = m_background.removeChildAt( 0 );
					child = null;
				}
				// puis nous ajoutons une instance de cette définition au conteneur background
				m_background = addChildAt( new definition(), 0 ) as Sprite;
			}
		}
 
		/**
		 *
		 * Fonction permettant d'ajouter un clip graphique au conteneur.
		 *
		 * @param	p_element	Un objet de type flash.display.DisplayObject
		 * @return	Retourne une référence vers le DisplayObject ajouté.
		 */
		public function addElement( p_element:DisplayObject ):DisplayObject
		{
			// On place p_element dans la displayList du conteneur
			m_container.addChild( p_element );
 
			// puis on effectue un redraw.
			redraw();
 
			// enfin, nous retournons l'élément envoyé en paramètre
			return p_element;
		}
 
		/**
		 *
		 * Fonction permettant d'enlever un clip graphique au conteneur.
		 *
		 * @param	p_element	Un objet de type flash.display.DisplayObject
		 * @return	Retourne une référence vers le DisplayObject supprimé de la displayList du conteneur.
		 */
		public function removeElement( p_element:DisplayObject ):DisplayObject
		{
			// on enlève p_element de la displayList du conteneur
			m_container.removeChild( p_element );
 
			// on effectue un redraw
			redraw();
 
			// puis on retourne l'élément envoyé en paramètre
			return p_element;
		}
 
		/**
		 *
		 * Fonction interne permettant d'actualiser l'état graphique des différents
		 * éléments d'un composant de type List
		 *
		 * @param	p_width	Nouvelle taille en largeur du composant
		 * @param	p_height Nouvelle taille en hauteur du composant
		 */
		private function redraw( p_width:Number = -1, p_height:Number = - 1 ):void
		{
 
			// on effectue des contrôles sur les paramètres envoyés
			if ( p_width < 0 ) p_width = m_background.width;
			if ( p_height < 0 ) p_height = m_background.height;
 
			var curY:Number = 0; // y maximum courant, au départ il est égal à 0
			var max:int = m_container.numChildren; // nombre d'enfants du clip conteneur
			var i:int = 0;
			var child:DisplayObject;
 
			for ( ; i < max; i++ )
			{
				// nous récupérons l'enfant du conteneur à l'index i
				child = m_container.getChildAt( i );
 
				// nous actualisons sa position en y ( verticale )
				child.y = curY;
 
				// puis on ajoute la hauteur de l'enfant à la variable curY
				// ainsi le prochain enfant sera placé juste après de façon verticale.
				curY += child.height;
			}
 
			// On actualise la largeur et la hauteur du background
			m_background.width = p_width;
			m_background.height = p_height;
 
			// la largeur du masque est égale à la largeur passée en paramètre - la marge 
			// de gauche + celle de droite
			m_containerMask.width = p_width - m_margins.marginLeft - m_margins.marginRight;
 
			// la hauteur du masque est égale à la hauteur passée en paramètre - la marge 
			// du haut + celle du bas
			m_containerMask.height = p_height - m_margins.marginTop - m_margins.marginBottom;
 
			// si la taille du conteneur ( la maison ) ne dépasse pas les dimensions du masque 
			// ( la fenêtre ) alors
			if ( m_container.height < m_containerMask.height )
			{
				// on cache la scrollBar
				m_scrollBar.hide();
			}
			else // sinon
			{
				// on affiche la scrollBar
				m_scrollBar.show();
 
				// la largeur du masque diminue encore afin de laisser de la  
				// place à la scrollBar
				m_containerMask.width -= m_scrollBar.width;
 
				// on positionne la scrollBar juste à droite du masque
				m_scrollBar.x = m_background.width - m_scrollBar.width - m_margins.marginRight;
 
				// enfin on actualise la hauteur de la scrollBar
				m_scrollBar.resize( m_scrollBar.width, m_containerMask.height );
			}
 
			// on positionne le masque et le conteneur de façon à respecter la marge de gauche
			m_containerMask.x = m_container.x = m_margins.marginLeft;
 
			// Même chose pour la marge du haut avec la scrollBar en plus
			m_scrollBar.y = m_containerMask.y = m_container.y = m_margins.marginTop;
 
			// on dit bien à la scrollBar que le contenu qu'elle doit scroller est le conteneur...
			m_scrollBar.content = m_container;
 
			// et que la zone de scroll correspond aux dimensions du masque ( la fenêtre ).
			m_scrollBar.scrollArea = m_containerMask.getRect(this);
 
		}
 
		/**
		 *
		 * Fonction permettant de gérer intelligemment le redimensionnement
		 * d'un objet de type List
		 *
		 * @param	p_width		la nouvelle largeur ( en pixels ) du composant
		 * @param	p_height	la nouvelle hauteur ( en pixels ) du composant
		 */
		override public function resize( p_width:Number, p_height:Number ):void
		{
			// on effectue un redraw
			redraw( p_width, p_height );
		}
 
		/**
		 * Retourne une référence de l'objet VerticalScrollBa utilisé au sein du composant
		 */
		public function get scrollBar():VerticalScrollBar { return m_scrollBar; }
 
		/**
		 * Retourne une référence de l'objet UIMargins utilisé pour définir les marges des contenus
		 */
		public function get margins():UIMargins { return m_margins; }
 
		/**
		 * Définit les marges à appliquer aux contenus
		 */
		public function set margins( p_margins:UIMargins ):void
		{
			// on change les margins actuelles puis on effectue un redraw
			m_margins = p_margins;
			redraw( m_background.width, m_background.height );
		}
 
		/**
		 * Détruit proprement un objet de type List
		 */
		override public function destroy():void
		{
			// on tue proprement l'objet UIMargins
			m_margins = null;
 
			// on tue proprement la scrollBar
			m_scrollBar.destroy();
 
			/**
			 * Nous tuons tous les enfants du conteneur
			 */
			var child:DisplayObject;
 
			while ( m_container.numChildren > 0 )
			{
				child = m_container.removeChildAt( 0 );
 
				if ( child is UIComponent )
				{
					UIComponent( child ).destroy();
				}
 
				child = null;
			}
 
			// Enfin, on supprime le conteneur, son masque et le fond
			removeChild( m_container );
			removeChild( m_containerMask );
			removeChild( m_background );
 
			m_container = null;
			m_containerMask = null;
			m_background = null;
			m_scrollBar = null;
 
			// on appelle la fonction de destruction parente par précaution
			super.destroy();
 
		}
	}
 
}

package  com.actionscriptfacile.ui.utils
{
	/**
	 * Permet de définir des marges à tout type d'élément
	 *
	 * @author Matthieu
	 */
	public class UIMargins
	{
 
		private var m_marginLeft:Number;
		private var m_marginRight:Number;
		private var m_marginBottom:Number;
		private var m_marginTop:Number;
 
		public function UIMargins( p_margTop:Number = 0, p_margRight:Number = 0, p_margBottom:Number = 0, 
								   p_margLeft:Number = 0 )
		{
			m_marginTop = p_margTop;
			m_marginLeft = p_margLeft;
			m_marginBottom = p_margBottom;
			m_marginRight = p_margRight;
		}
 
		public function get marginLeft():Number { return m_marginLeft; }
		public function set marginLeft(value:Number):void { m_marginLeft = value; }
 
		public function get marginRight():Number { return m_marginRight; }
		public function set marginRight(value:Number):void { m_marginRight = value; }
 
		public function get marginBottom():Number { return m_marginBottom; }
		public function set marginBottom(value:Number):void { m_marginBottom = value; }
 
		public function get marginTop():Number { return m_marginTop; }
		public function set marginTop(value:Number):void { m_marginTop = value; }
 
	}
 
}

package
{
	import com.actionscriptfacile.ui.text.UITextField;
	import com.actionscriptfacile.ui.list.List;
	import com.actionscriptfacile.ui.utils.UIMargins;
	import com.as3facileexemple.skin.classic.DefaultListSkin;// import du skin de la VerticalScrollBar
	import flash.display.Shape;
	import flash.display.Sprite;
 
	/**
	 * Exemple d'utilisation du composant List.
	 * @author Matthieu
	 */
	public class ListExample extends Sprite
	{
 
		public function ListExample()
		{
			// création d'une liste
			var list:List = new List();
 
			// 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 ]
			list.applySkin( new DefaultListSkin() );
 
			// définition de la taille de la List
			list.resize( 230, 150 );
 
			// ajout de plusieurs éléments dans la liste
			for ( var i:int = 0; i < 35; i++ )
			{
				list.addElement( getListElement(i+1) );
			}
 
			// détermination de la position de la List
			list.x = 30;
			list.y = 30;
 
			// affichage - ajout à la displaylist
			addChild( list );
 
			// ajout des marges au contenu de la liste
			list.margins = new UIMargins( 5, 5, 5, 5 );
		}
 
		/**
		 * Création des éléments du composant List
		 */
		private function getListElement(id:Number):Sprite
		{
			// création de l'élément
			var oElement:Sprite = new Sprite();
 
			// ajout d'un fond avec une couleur aléatoire
			var shp:Shape = new Shape();
			var color:int = Math.random() * 0X00FFFFFF;
 
			shp.graphics.beginFill( color );
			shp.graphics.drawRect( 0, 0, 200, 30 );
			shp.graphics.endFill();
 
			// ajout d'un texte
			var oTxt:UITextField = new UITextField();
 
			// définition de la taille du texte
			oTxt.height = oTxt.maxHeight = 25;
			oTxt.width = oTxt.maxWidth = 195;
 
			oTxt.selectable = false;
			oTxt.changeFormat("color", 0xffffff);// changement de la couleur du texte
			oTxt.changeFormat("size", 14);// changement de la taille de la police du texte
			oTxt.changeFormat("font", "Arial");// changement de la police du texte
			oTxt.text = "Élément "+id;
			oTxt.alignCenter();
 
			oTxt.background = false;
			oTxt.backgroundColor = 0xff33ff;
 
			// ajout à la displaylist (le fond et le texte) de l'élément
			oElement.addChild(shp);
			oElement.addChild(oTxt);
 
			return oElement;
		}
 
	}
 
} 

package com.as3facileexemple.skin.classic
{
 
	import com.actionscriptfacile.skin.Skin;
	import com.actionscriptfacile.ui.list.List;
	import com.actionscriptfacile.ui.scroll.components.VerticalScrollBar;
 
	// 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.list.ListBackgroundSkin;
	import com.as3facile.skin.scroll.ScrollBarBackgroundSkin;
	import com.as3facile.skin.scroll.ScrollBottomButtonSkin;
	import com.as3facile.skin.scroll.ScrollerButtonSkin;
	import com.as3facile.skin.scroll.ScrollUpButtonSkin;
 
	/**
	 * Définition du skin utilisé pour un composant List
	 *
	 * @author Matthieu
	 */
	public class DefaultListSkin extends Skin
	{
 
		public function DefaultListSkin()
		{
			setSkin( List.LIST_BACKGROUND_SKIN, ListBackgroundSkin  );
			setSkin( VerticalScrollBar.SCROLL_VERTICAL_BACKGROUND_SKIN, ScrollBarBackgroundSkin );
			setSkin( VerticalScrollBar.SCROLL_VERTICAL_BOTTOM_SKIN, ScrollBottomButtonSkin );
			setSkin( VerticalScrollBar.SCROLL_VERTICAL_UP_SKIN, ScrollUpButtonSkin );
			setSkin( VerticalScrollBar.SCROLL_VERTICAL_SCROLLER_SKIN, ScrollerButtonSkin );
		}
 
	}
 
}