<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.apache.org/royale/spark"
			   xmlns:mx="library://ns.apache.org/royale/mx"
			   paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0"
			   height="100%" width="100%" 
			   >
	
	<fx:Metadata>
		[ResourceBundle("messages")]
	</fx:Metadata>
	
	<fx:Script>
		<![CDATA[
			
			import mx.resources.ResourceManager;
			import mx.collections.XMLListCollection;
			import mx.events.FlexEvent;
			import mx.events.MenuEvent;
			
			
			[Bindable]
			public var menuBarData1:XMLListCollection = new XMLListCollection();
			
			[Bindable]
			public var menuBarData2:XMLListCollection = new XMLListCollection();
			
			
			private var menubarXML:XMLList =
				<>
					<menuitem label="Menu1" data="top">
						<menuitem label="MenuItem 1-A" data="1A"/>
						<menuitem label="MenuItem 1-B" data="1B"/>
					</menuitem>
					<menuitem label="Menu2" data="top">
						<menuitem label="MenuItem 2-A" type="check"  data="2A"/>
						<menuitem type="separator"/>
						<menuitem label="MenuItem 2-B" >
							<menuitem label="SubMenuItem 3-A" type="radio"
								groupName="one" data="3A"/>
							<menuitem label="SubMenuItem 3-B" type="radio"
								groupName="one" data="3B"/>
						</menuitem>
					</menuitem>
				</>;
			
			public function onCreationComplete():void {
				
			}


			protected function creationCompleteHandler1(event:FlexEvent):void
			{	
				menuBarData1 = new XMLListCollection(menubarXML);
			}
			
			protected function creationCompleteHandler2(event:FlexEvent):void
			{

				var roleInfo:String = "ADMIN";
				
				var tmpXmlList:XMLListCollection = new XMLListCollection();
				tmpXmlList.source = menuDataXMLList;
				
				
				/*
					RoleFilters is a custom class that is filtering the xml nodes 
					according to the given role eg:ADMIN, OPREATION, VIEW
				 	Not directly related the with the bug that is why commented
				*/
				// tmpXmlList = RoleFilters.deleteRoledMenuItems(tmpXmlList, roleInfo);
				
				menuDataXMLList = tmpXmlList.source.copy();
				
				menuBarData2.source = menuDataXMLList;
				
				menuBarData2.refresh();

			}
			
			protected function itemClickHandler(event:MenuEvent):void {
			}
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<fx:XMLList id="menuDataXMLList">
			<menuitem label="label-1">			
				<menuitem label="label-1-1"/>			
				<menuitem label="label-1-2"/>			
			</menuitem>
			<menuitem label="{resourceManager.getString('messages', 'configuration')}" id="admin" role="{UserRole.ADMIN}">			
				<menuitem label="label-2-1"/>			
				<menuitem label="label-2-2"/>			
			</menuitem>
		</fx:XMLList>
	</fx:Declarations>	
	
	<s:layout>
		<s:VerticalLayout gap="10" paddingRight="10" paddingLeft="10" paddingTop="10" paddingBottom="20" />
	</s:layout>

	
	<mx:MenuBar id="menuBar_fx_Script" width="100%" dataProvider="{menuBarData1}" horizontalCenter="0"
				itemClick="itemClickHandler(event)" 
				labelField="@label" 
				creationComplete="creationCompleteHandler1(event)"/>

	<mx:MenuBar id="menuBar_fx_Declarations" width="100%" dataProvider="{menuBarData2}" horizontalCenter="0"
				itemClick="itemClickHandler(event)" 
				labelField="@label" 
				creationComplete="creationCompleteHandler2(event)"/>
</s:Application>