<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" creationComplete="showAlert();" backgroundColor="white" viewSourceURL="srcview/index.html">
	
	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.CloseEvent;
			
			[Bindable]
			[Embed(source='assets/error.png')]
			private var Icon:Class;
			
			[Bindable]
			[Embed(source='assets/tick.png')]
			private var TickIcon:Class;
			
			[Bindable]
			[Embed(source='assets/cross.png')]
			private var CrossIcon:Class;
			
			private var a:Alert;
			
			private function showAlert():void {
				/* set button width so it is large enough to accomodate an icon and default button labels. */
				Alert.buttonWidth = 100;
				
				var titleText:String = "WARNING";
				var messageText:String = "Are you sure you would like to erase the Internet?\n\nPress OK to continue, or Cancel to abort.";
				/* display the Alert, show the OK and Cancel buttons, and show an icon represented by the Icon binding. */
				a = Alert.show(messageText, titleText, Alert.OK | Alert.CANCEL, null, doClose, Icon);
				
				/* get a reference to the Alert control's internal buttons array. */
				var buttonArray:Array = a.mx_internal::alertForm.mx_internal::buttons;
				
				/* set the first button to the TickIcon class, and the second icon to the CrossIcon class. */
				buttonArray[0].setStyle("icon", TickIcon);
				buttonArray[1].setStyle("icon", CrossIcon);
				
				progressBar.visible = false;
			}
			
			private function doClose(evt:CloseEvent):void {
				if (evt.detail == Alert.OK) {
					progressBar.visible = true;
				} else if (evt.detail == Alert.CANCEL) {
					// do nothing.
				}
			}
		]]>
	</mx:Script>
	
	<mx:Button label="Launch Alert" click="showAlert();" />
	<mx:ProgressBar id="progressBar" label="Deleting..." indeterminate="true" visible="false" />
	
</mx:Application>