<?xml version="1.0" encoding="utf-8"?>
<view:EditUserDlgClass 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:view="org.pyamf.examples.addressbook.components.*"
					   title="Edit User" width="600">
	
	<view:layout>
		<s:VerticalLayout />
	</view:layout>
	
	<s:Form>
		<s:layout>
			<s:FormLayout gap="-13" />
		</s:layout>
		
		<s:FormItem label="Persistent:">
			<s:CheckBox enabled="false" selected="{user.isPersistent()}" />
		</s:FormItem>
	
		<s:FormItem label="First Name:">
			<s:TextInput
				id="firstName"
				text="{user.first_name}" />
		</s:FormItem>
		
		<s:FormItem label="Last Name:">
			<s:TextInput
				id="lastName"
				text="{user.last_name}" />
		</s:FormItem>
		<s:FormItem label="Created:">
			<s:Label
				id="created"
				text="{user.created}" />
		</s:FormItem>
	</s:Form>
	
	<mx:HRule width="100%"/>
	
	<s:HGroup width="100%" paddingBottom="10" paddingLeft="10" paddingTop="10" paddingRight="10">
		<s:VGroup width="100%">
			<mx:DataGrid
				id="emails"
				width="100%"
				allowMultipleSelection="true"
				dataProvider="{user.emails}"
				doubleClickEnabled="true"
				doubleClick="editEmail()"
				toolTip="Double click on an e-mail to edit it">
				<mx:columns>
					<mx:DataGridColumn headerText="Label" dataField="label"/>
					<mx:DataGridColumn headerText="E-mail" dataField="email"/>
				</mx:columns>
			</mx:DataGrid>
			
			<s:HGroup width="100%" horizontalAlign="center" verticalAlign="middle">
				<s:Button
					label="Add Email"
					click="addEmail()"
					toolTip="Add a new e-mail" />
				<s:Button
					label="Remove Email"
					click="removeEmails()"
					toolTip="Remove selected emails" />
			</s:HGroup>
		</s:VGroup>
			
		<mx:VRule height="100%"/>
			
		<s:VGroup width="100%">
			<mx:DataGrid
				id="phone_numbers"
				width="100%"
				allowMultipleSelection="true"
				dataProvider="{user.phone_numbers}"
				doubleClickEnabled="true"
				doubleClick="editPhone()"
				toolTip="Double click on a phone number to edit it">
				<mx:columns>
					<mx:DataGridColumn headerText="Label" dataField="label"/>
					<mx:DataGridColumn headerText="Number" dataField="number"/>
				</mx:columns>
			</mx:DataGrid>
		
			<s:HGroup width="100%" horizontalAlign="center" verticalAlign="middle">
				<s:Button
					label="Add Phone"
					click="addPhone()"
					toolTip="Add a new phone number" />
				<s:Button
					label="Remove Phone"
					click="removePhones()"
					toolTip="Remove selected phone numbers" />
			</s:HGroup>
		</s:VGroup>
	</s:HGroup>

	<mx:HRule width="100%"/>

	<s:HGroup width="100%" horizontalAlign="center" verticalAlign="middle"
			  paddingBottom="10" paddingLeft="10" paddingTop="10" paddingRight="10">
		<s:Button
			label="Save"
			click="save()"
			toolTip="Save user" />
		<s:Button
			label="Close"
			click="close()"
			toolTip="Close window" />
	</s:HGroup>
	
</view:EditUserDlgClass>