<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/10/19/creating-a-credit-card-validator-in-actionscript/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
		layout="vertical"
		verticalAlign="middle"
		backgroundColor="white"
		creationComplete="init();" viewSourceURL="srcview/index.html">

	<mx:Style>
        global {
            modalTransparencyBlur: 0;
            modalTransparency: 0.4;
            modalTransparencyDuration: 250;
        }
	</mx:Style>

	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.ValidationResultEvent;
			import mx.styles.StyleManager;
			import mx.validators.CreditCardValidator;
			import mx.validators.CreditCardValidatorCardType;

			private var ccVal:CreditCardValidator;
			private var globalStyle:CSSStyleDeclaration;

			private function init():void {
				ccVal = new CreditCardValidator();
				ccVal.cardNumberSource = cc;
				ccVal.cardNumberProperty = "cardNumber";
				ccVal.cardTypeSource = cc;
				ccVal.cardTypeProperty = "cardType";
				ccVal.addEventListener(ValidationResultEvent.VALID, isValid);
				ccVal.addEventListener(ValidationResultEvent.INVALID, isInvalid);
				
				globalStyle = StyleManager.getStyleDeclaration("global");
			}
			
			private function isValid(evt:ValidationResultEvent):void {
				globalStyle.setStyle("modalTransparencyColor", "green");

				Alert.show("you're valid", evt.type);
			}
			
			private function isInvalid(evt:ValidationResultEvent):void {
				globalStyle.setStyle("modalTransparencyColor", "red");

				Alert.show(evt.message, evt.type);
			}
		]]>
	</mx:Script>

    <mx:Model id="cc">
        <card>
            <cardNumber>{cardNumber.text}</cardNumber>
            <cardType>{cardType.selectedItem.data}</cardType>
        </card>
    </mx:Model>

	<mx:Array id="ccType">
		<mx:Object label="American Express"
				data="{CreditCardValidatorCardType.AMERICAN_EXPRESS}" />
		<mx:Object label="Diners Club"
				data="{CreditCardValidatorCardType.DINERS_CLUB}" />
		<mx:Object label="Discover"
				data="{CreditCardValidatorCardType.DISCOVER}" />
		<mx:Object label="Master Card"
				data="{CreditCardValidatorCardType.MASTER_CARD}" />
		<mx:Object label="Visa"
				data="{CreditCardValidatorCardType.VISA}" />
	</mx:Array>

	<mx:Form>
		<mx:FormItem label="Card number:" required="true">
			<mx:TextInput id="cardNumber"
					restrict="[0-9]" />
		</mx:FormItem>
		<mx:FormItem label="Card type:" required="true">
			<mx:ComboBox id="cardType"
					dataProvider="{ccType}"
					prompt="Please select a credit card type."/>
		</mx:FormItem>
		<mx:FormItem>
		<mx:Button label="Validate"
				click="ccVal.validate();" />
		</mx:FormItem>
	</mx:Form>

</mx:Application>

