Edison’s Blog

< ?xml version="1.0" encoding="utf-8"?>
<s :WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
					   xmlns:s="library://ns.adobe.com/flex/spark" 
					   xmlns:mx="library://ns.adobe.com/flex/mx" 
					   xmlns:local="*"
					   creationComplete="creationCompleteHandler(event)">
	<fx :Style>
		@namespace s "library://ns.adobe.com/flex/spark";
		@namespace mx "library://ns.adobe.com/flex/mx";
		@namespace local "*";
 
		local|MyTestContainer #textDisplay
		{
			color:#0099FF;
		}
 
		local|MyTestContainer:green #textDisplay
		{
			color:#00FF99;
		}
 
		local|MyTestContainer:red #textDisplay
		{
			color:#FF9900;
		}				
	</fx>
 
	<fx :Script>
		< ![CDATA[
			import mx.collections.ArrayCollection;
			import mx.collections.IList;
			import mx.events.FlexEvent;
 
			import spark.events.IndexChangeEvent;
 
			[Bindable]
			private var stateSelectorDataProvider:IList;
 
			protected function stateSelector_changeHandler(event:IndexChangeEvent):void
			{
				myTestContainer.currentState = event.currentTarget.selectedItem.name;
			}
 
 
			protected function creationCompleteHandler(event:FlexEvent):void
			{
				stateSelectorDataProvider = new ArrayCollection(myTestContainer.states);
			}
 
		]]>
	</fx>
	<fx :Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx>
	</s><s :layout>
		<s :VerticalLayout/>
	</s>
 
	<s :DropDownList id="stateSelector" dataProvider="{stateSelectorDataProvider}" 
					change="stateSelector_changeHandler(event)"
					selectedIndex="-1" 
					labelField="name"/>
	<local :MyTestContainer id="myTestContainer" skinClass="MyTestContainerSkin"/>

< ?xml version="1.0" encoding="utf-8"?>
<components :MySkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
													 xmlns:s="library://ns.adobe.com/flex/spark" 
													 xmlns:mx="library://ns.adobe.com/flex/mx" 
													 xmlns:components="com.experiment.framework.components.*" 
													 width="400" height="300"
													 currentState="normal">
	<fx :Metadata>
		[SkinState("normal")]
		[SkinState("green")]
		[SkinState("red")]
	</fx>
	<fx :Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx>
	</components><components :states>
		<s :State name="normal"/>
		<s :State name="green"/>
		<s :State name="red"/>
	</components>
	<s :Label id="textDisplay" text="This is Css State Selector Support"/>

package com.experiment.framework.components
{
	import mx.styles.IStyleClient;
 
	import spark.components.SkinnableContainer;
 
	public class MySkinnableContainer extends SkinnableContainer
	{
		public function MySkinnableContainer()
		{
			super();
		}
 
		override public function setCurrentState(stateName:String, playTransition:Boolean=true):void
		{
			super.setCurrentState(stateName,playTransition);
			invalidateSkinState();
		}
 
		override public function invalidateSkinState():void
		{
			super.invalidateSkinState();
			var styleClient:IStyleClient = this as IStyleClient;
			var styleName:Object;
 
			if(styleClient)
			{
				if(styleClient.styleName == null)
				{
					styleClient.styleName = {};
					styleClient.styleName = null;
				}
				else
				{
					styleName = styleClient.styleName;
					styleClient.styleName = null;
					styleClient.styleName = styleName;
				}
			}
		}
 
		override protected function getCurrentSkinState():String
		{
			return currentState;
		}
 
	}
}

< ?xml version="1.0" encoding="utf-8"?>
 
<!--
 
    ADOBE SYSTEMS INCORPORATED
    Copyright 2008 Adobe Systems Incorporated
    All Rights Reserved.
 
    NOTICE: Adobe permits you to use, modify, and distribute this file
    in accordance with the terms of the license agreement accompanying it.
 
-->
 
<!--- The default skin class for a Spark SkinnableContainer container.  
 
     @see spark.components.SkinnableContainer
 
      @langversion 3.0
      @playerversion Flash 10
      @playerversion AIR 1.5
      @productversion Flex 4
-->
<s :Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled="0.5">
 
    <fx :Metadata>
    < ![CDATA[ 
        /** 
         * @copy spark.skins.spark.ApplicationSkin#hostComponent
         */
        [HostComponent("spark.components.SkinnableContainer")]
    ]]>
    </fx> 
 
    </s><s :states>
        <s :State name="normal" />
        <s :State name="disabled" />
		<s :State name="green"/>
		<s :State name="red"/>
    </s>
 
    <!--- Defines the appearance of the SkinnableContainer class's background. -->
    <s :Rect id="background" left="0" right="0" top="0" bottom="0">
        </s><s :fill>
            <!--- @private -->
            <s :SolidColor id="bgFill" color="#FFFFFF"/>
        </s>
 
 
    <!--
        Note: setting the minimum size to 0 here so that changes to the host component's
        size will not be thwarted by this skin part's minimum size.   This is a compromise,
        more about it here: http://bugs.adobe.com/jira/browse/SDK-21143
    -->
    <!--- @copy spark.components.SkinnableContainer#contentGroup -->
    <s :Group id="contentGroup" left="0" right="0" top="0" bottom="0" minWidth="0" minHeight="0">
        </s><s :layout>
            <s :BasicLayout/>
        </s>

import flash.events.Event;
 
import mx.core.INavigatorContent;
 
import spark.components.ButtonBarButton;
 
public class ButtonBarButton extends spark.components.ButtonBarButton
{
	public function ButtonBarButton()
	{
		super();
	}
 
	override public function set data(value:Object):void
	{
		if(data is INavigatorContent)
			INavigatorContent(data).removeEventListener("enabledChanged",enabledChangedHandler);
 
		super.data = value;
 
		if(data is INavigatorContent)
		{
			INavigatorContent(data).addEventListener("enabledChanged",enabledChangedHandler);
		}
	}
 
	private function enabledChangedHandler(event:Event):void
	{
		enabled = INavigatorContent(data).enabled;
	}
}

////////////////////////////////////////////////////////////////////////////////
// DateParser.as
//
// An as3 implementation of the java SimpleDateFormat like class based on Flex 
// SDK which can be used to parse a String with specified format to as3 Date 
// object.
//
// This code is a modification version of Daniel Wabyick's as2 
// SimpleDateFormatter(http://osflash.org/simpledateformatter) which 
// is directly adapted from Matt Kruse's Javascript class implementation.
//
// @author edison.guo(http://www.hydra1983.com)
// @author Daniel Wabyick(http://www.fluid.com)
// @author Matt Kruse (http://www.JavascriptToolbox.com)
 
// The following notice is maintained from Matt Kruse's 
// original Javascript code. 
// 
// NOTICE: You may use this code for any purpose, commercial or
// private, without any further permission from the author. You may
// remove this notice from your final code if you wish, however it is
// appreciated by the author if at least my web site address is kept.
//
// USAGE
// ----------------------------------------------------------------------
// These functions use the same pattern letters used by the DateFormatter 
// class provided by Flex SDK. You can find the detailed description of 
// these letter in the Adobe Flex Language Reference.
// Examples:
//		var dateString:String = "9/10/2008 GMT+0800 08:30:41";
// 		var parser:DateParser = new DateParser();
//		parser.formatString = "M/D/Y HH:NN:SS";
//		trace(parser.parse(dateString));
//		//Wed Sep 10 08:30:41 GMT+0800 2008
//
// ----------------------------------------------------------------------
////////////////////////////////////////////////////////////////////////////////
 
package
{
	import mx.formatters.Formatter;
	import mx.utils.StringUtil;
 
	public class DateParser
	{
		private static const VALID_PATTERN_CHARS:String = "Y,M,D,A,E,H,J,K,L,N,S,Q";
 
		public var error:String;
 
		private var _formatString:String = "YYYY-MM-DD HH:NN";
 
		public function get formatString():String
		{
			return _formatString;
		}
 
		public function set formatString(value:String):void
		{
			if(value) _formatString = value;
		}
 
		private var _defaultInvalidFormatError:String = Formatter.defaultInvalidFormatError;
 
		public function get defaultInvalidFormatError():String
		{
			return _defaultInvalidFormatError;
		}
 
		public function set defaultInvalidFormatError(value:String):void
		{
			_defaultInvalidFormatError = value;
		}
 
		private var _defaultInvalidValueError:String = Formatter.defaultInvalidValueError;
 
		public function get defaultInvalidValueError():String
		{
			return _defaultInvalidValueError;
		}
 
		public function set defaultInvalidValueError(value:String):void
		{
			_defaultInvalidValueError = value;
		}
 
		public function parse( value:Object):Date 
		{
			if (error)
				error = null;
 
			if(!(value is String))
			{
				error = defaultInvalidValueError;
				return null;
			}
 
			if(!value || value == "")
			{
				error = defaultInvalidValueError;
				return null;
			}
 
			var timezoneRegEx:RegExp = /(GMT|UTC)((\+|-)\d\d\d\d(\s)?)?/ig;
			value = StringUtil.trim(String(value).replace(timezoneRegEx, ""));
 
			var letter:String;
			var nTokens:int = 0;
			var tokens:String = "";
 
			var n:int = formatString.length;
			for (var i:int = 0; i < n; i++)
			{
				letter = formatString.charAt(i);
				if (VALID_PATTERN_CHARS.indexOf(letter) != -1 && letter != ",")
				{
					nTokens++;
					if (tokens.indexOf(letter) == -1)
					{
						tokens += letter;
					}
					else
					{
						if (letter != formatString.charAt(Math.max(i - 1, 0)))
						{
							error = defaultInvalidFormatError;
							return null;
						}
					}
				}
			}
 
			if (nTokens < 1)
			{
				error = defaultInvalidFormatError;
				return null;
			}
 
			var dataParser:DateStringParser = new DateStringParser(
				formatString, VALID_PATTERN_CHARS);
 
			return dataParser.parseValue(value);	
		}
	}
}
import mx.formatters.DateBase;
 
class DateStringParser
{
	private static var digits:String = "1234567890";
 
	private static var dayNames:Array = DateBase.dayNamesLong.concat(DateBase.dayNamesShort);
 
	private static var monthNames:Array = DateBase.monthNamesLong.concat(DateBase.monthNamesShort);
 
	public function DateStringParser(format:String, tokens:String)
	{
		super();
 
		this.format = format;
		this.tokens = tokens;
	}
 
	private var format:String;
 
	private var tokens:String;
 
	public function parseValue(value:Object):Date
	{		
		var valueString:String = String(value);
 
		var i_value:int = 0;
		var i_format:int = 0;
		var char_token:String = "";
		var token:String = "";
		var start:int = 0;
		var end:int = 0;
 
		var now:Date = new Date();
		var years:Object = now.getFullYear();
		var months:Object = now.getMonth() + 1;
		var dates:Object = now.getDate();	
		var days:Object = now.getDay();
		var hours:Object = now.getHours();
		var minutes:Object = now.getMinutes();
		var seconds:Object = now.getSeconds();
		var milliseconds:Object = now.getMilliseconds();
		var ampm:String = "";
 
		var max:int = 0;
		var min:int = 0;
 
		while(i_format < format.length)
		{
			char_token = format.charAt(i_format);
			if(tokens.indexOf(char_token) > -1)
			{
				start = format.indexOf(char_token);
				end = format.lastIndexOf(char_token);
				end = end >= 0 ? end + 1 : start + 1;
				token = format.substring(start,end);			
				i_format = end;
 
				if(token == "YYYY" || token == "YY" || token == "Y")
				{					
					if(token == "YYYY") {max = min = 4;}
					if(token == "YY") {max = min = 2;}
					if(token == "Y"){max = 4;min = 2;}
 
					years = getIntegerValue(valueString,i_value,min,max);
					if(isNaN(Number(years))) return null;
					i_value += String(years).length;
					years = Number(years);
				}
				else if(token == "MM" || token == "M")
				{
					months = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(months)) || months < 1 || months > 12) return null;
					i_value += String(months).length;
					months = Number(months);
				}
				else if(token == "MMMM" || token == "MMM")
				{
					var monthName:String = getMonthName(valueString,i_value);
					if(!monthName || monthName.length == 0) return null;
					months = getMonths(monthName);
					if(isNaN(Number(months)) || months < 1 || months > 12) return null;
					i_value += monthName.length;
					months = Number(months);
				}
				else if(token == "EE" || token == "E")
				{
					days = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(days)) || days < 1 || days > 7) return null;
					i_value += String(days).length;
					days = Number(days);
				}
				else if(token == "EEEE" || token == "EEE")
				{
					var dayName:String = getDayName(valueString,i_value);
					if(!dayName || dayName.length == 0) return null;
					days = getDays(dayName);
					if(isNaN(Number(days)) || days < 1 || days > 7) return null;
					i_value += dayName.length;
					days = Number(days);
				}
				else if(token == "DD" || token == "D")
				{
					dates = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(dates)) || dates < 1 || dates > 31) return null;
					i_value += String(dates).length;
					dates = Number(dates);
				}
				else if(token == "AA" || token == "A")
				{
					ampm = valueString.substr(i_value,2).toUpperCase();
					if(ampm != "AM" && ampm != "PM") return null;
					i_value += 2;
				}
				else if(token == "JJ" || token == "J")
				{
					hours = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(hours)) || hours < 0 || hours > 23) return null;
					i_value += String(hours).length;
					hours = Number(hours);
				}
				else if(token == "HH" || token == "H")
				{
					hours = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(hours)) || hours < 1 || hours > 24) return null;
					i_value += String(hours).length;
					hours = Number(hours);
				}				
				else if(token == "KK" || token == "K")
				{
					hours = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(hours)) || hours < 0 || hours > 11) return null;
					i_value += String(hours).length;
					hours = Number(hours);
				}
				else if(token == "LL" || token == "L")
				{
					hours = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(hours)) || hours < 1 || hours > 12) return null;
					i_value += String(hours).length;
					hours = Number(hours);
				}
				else if(token == "NN" || token == "N")
				{
					minutes = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(minutes)) || minutes < 0 || minutes > 59) return null;
					i_value += String(minutes).length;
					minutes = Number(minutes);
				}
				else if(token == "SS" || token == "S")
				{
					seconds = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(seconds)) || seconds < 0 || seconds > 59) return null;
					i_value += String(seconds).length;
					seconds = Number(seconds);
				}
				else if(token == "QQQ" || token == "QQ" || token == "Q")
				{
					milliseconds = getIntegerValue(valueString,i_value,token.length,2);
					if(isNaN(Number(milliseconds)) || milliseconds < 0 || milliseconds > 999) return null;
					i_value += String(milliseconds).length;
					milliseconds = Number(milliseconds);
				}
			}
			else
			{
				i_format ++;
				i_value ++;
			}	
		}
 
		if (i_value != valueString.length) { return null; }
 
		if (months == 2) 
		{
			var isLeapYear:Boolean = isLeapYear(Number(years));
			if(isLeapYear && dates > 28) return null;
 
			if(!isLeapYear && dates > 29) return null;
		}
 
		if (((months == 4)||(months == 6)||(months == 9)||(months == 11)) && dates > 30) 
			return null;
 
		if(hours < 12 && ampm == "PM") {hours = (Number(hours)) + 12;}
		else if(hours > 11 && ampm == "AM") {hours = (Number(hours)) - 12};
 
		return new Date(years,(Number(months)) - 1,dates,hours,minutes,seconds,milliseconds);
	}
 
	public function getIntegerValue(dateString:String,index:int,min:int,max:int):Object
	{
		var valueString:String;
		for(var i:int = max;i >= min;i--)
		{
			valueString = dateString.substring(index,index + i);
			if(valueString.length < min) return NaN;
			if(isInteger(valueString)) return valueString;
		}
		return NaN;
	}
 
	private function isInteger(valueString:String):Boolean
	{
		var n:int = valueString.length;
		for(var i:int = 0;i < n;i++)
		{
			if(!isDigit(valueString.charAt(i)))
				return false;
		}
		return true;
	}
 
	private function isDigit(char:String):Boolean
	{
		return digits.indexOf(char) > -1;
	}
 
	private function getDayName(valueString:String,index:int):String
	{		
		var n:int = dayNames.length;
		var dayName:String;
		for(var i:int = 0;i < n;i++)
		{
			dayName = dayNames[i];
			if(valueString.substr(index,dayName.length) == dayName)
				return dayName;
		}	
		return "";
	}
 
	private function getDays(dayName:String):Number
	{		
		var day:Number = dayNames.indexOf(dayName) + 1;
		day = day > 12? day - 12:day;
		day = day == 0?NaN:day;
		return day;
	}
 
	private function getMonthName(valueString:String,index:int):String
	{
		var n:int = monthNames.length;
		var monthName:String;
		for(var i:int = 0;i < n;i++)
		{
			monthName = monthNames[i];
			if(valueString.substr(index,monthName.length) == monthName)
				return monthName;
		}	
		return "";
	}
 
	private function getMonths(monthName:String):Number
	{
		var month:Number = monthNames.indexOf(monthName) + 1;
		month = month > 12? month - 12:month;
		month = month == 0?NaN:month;
		return month;
	}
 
	private function isLeapYear(year:Number):Boolean
	{
		return ((year % 4 == 0) && (year % 100 != 0)) || ( year % 400 == 0);
	}
}