<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="400" minHeight="200" backgroundColor="#9FA0D4" width="500" height="300"
               creationComplete="init();" viewSourceURL="srcview/index.html">
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            private function init():void{
                var cm:ContextMenu = new ContextMenu();
                
                var red:ContextMenuItem = new ContextMenuItem('Red',false,true,true);
                red.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, handleRed);
                
                var green:ContextMenuItem = new ContextMenuItem('Green',false,true,true);
                green.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, handleGreen);
                
                var blue:ContextMenuItem = new ContextMenuItem('Blue',false,true,true);
                blue.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, handleBlue);
                
                cm.customItems.push(red);
                cm.customItems.push(green);
                cm.customItems.push(blue);
                cm.clipboardMenu = true;
                textArea.textDisplay.contextMenu = cm;
            }
            
            private function handleRed(e:Event):void{
                textArea.setStyle('contentBackgroundColor', 'red');
            }
            
            private function handleGreen(e:Event):void{
                textArea.setStyle('contentBackgroundColor', 'green');
            }
            
            private function handleBlue(e:Event):void{
                textArea.setStyle('contentBackgroundColor', 'blue');
            }
        ]]>
    </fx:Script>
    <s:TextArea id="textArea" x="161" y="74" text="This is a Flex 4 Spark TextArea.  Right click to see the custom context menu. "/>
</s:Application>