<?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">
 <fx:Library>
  <fx:Definition name="HRule">
   <s:Line width="100%">
    <s:stroke><s:SolidColorStroke color="#000000" /></s:stroke>
   </s:Line>
  </fx:Definition>
  <fx:Definition name="Border">
   <s:Rect>
    <s:stroke>
     <s:SolidColorStroke color="#000000" alpha="0.7" weight="4" joints="bevel" />
    </s:stroke>
   </s:Rect>
  </fx:Definition>
 </fx:Library>
 
 <fx:Metadata>
  [SWF(width="500", height="400")]
 </fx:Metadata>
 
 <fx:Declarations>
  <s:ArrayList id="blendModes">
   {[BlendMode.NORMAL, BlendMode.HARDLIGHT,
    BlendMode.OVERLAY, BlendMode.ADD,
    BlendMode.ALPHA, BlendMode.DARKEN,
    BlendMode.DIFFERENCE, BlendMode.ERASE,
    BlendMode.INVERT, BlendMode.LAYER,
    BlendMode.LIGHTEN, BlendMode.MULTIPLY,
    BlendMode.SCREEN, BlendMode.SUBTRACT]}
  </s:ArrayList>
  <s:ArrayList id="opaqueBgColors">
   {[{label: "Null", data: null},
    {label: "#000000", data: 0x000000},
    {label: "#808080", data: 0x808080},
    {label: "#FFFFFF", data: 0xFFFFFF},
    {label: "#FF0000", data: 0xFF0000},
    {label: "#00FF00", data: 0x00FF00},
    {label: "#0000FF", data: 0x0000FF}]}
  </s:ArrayList>
 </fx:Declarations>
 
 <s:layout>
  <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" gap="40" />
 </s:layout>
 
 <!-- Graphics Group -->
 <s:Group id="graphicsGroup" width="200" height="250" alpha="{alphaSlider.value}" blendMode="normal">
 
  <s:Group id="underGroup" top="24" bottom="44" left="4" right="4"
     opaqueBackground="{underOpaqueBgList.selectedItem.data}"
     blendMode="{underBlendModeList.selectedItem ? underBlendModeList.selectedItem : 'normal'}">
   <s:Rect top="0" bottom="0" left="0" right="0">
    <s:fill>
     <s:LinearGradient rotation="90">
      <s:GradientEntry color="#FF0000" ratio="0" />
      <s:GradientEntry color="#FFFF00" ratio=".15" />
      <s:GradientEntry color="#00FF00" ratio=".3" />
      <s:GradientEntry color="#00FFFF" ratio=".45" />
      <s:GradientEntry color="#0000FF" ratio=".60" />
      <s:GradientEntry color="#FF00FF" ratio=".75" />
      <s:GradientEntry color="#FF0000" ratio=".9" />
      <s:GradientEntry color="#FFFFFF" ratio=".90001" />
      <s:GradientEntry color="#FFFFFF" ratio=".95" />
      <s:GradientEntry color="#000000" ratio=".95001" />
      <s:GradientEntry color="#000000" ratio="1" />
     </s:LinearGradient>
    </s:fill>
   </s:Rect>
  </s:Group>
 
  <fx:Border top="20" bottom="40" left="0" right="0" />
  <s:Label top="30" left="-20" text="Under Graphic (Colour Gradient)" rotation="-90" />
 
  <s:Group top="4" bottom="4" left="24" right="44" cacheAsBitmap="{cacheAsBitmapCk.selected}">
   <s:Rect top="0" bottom="0" left="0" right="0">
    <s:fill>
     <s:LinearGradient>
      <s:GradientEntry color="#000000" ratio="0" alpha="1" />
      <s:GradientEntry color="#000000" ratio="1" alpha="0" />
     </s:LinearGradient>
    </s:fill>
   </s:Rect>
  </s:Group>
 
  <fx:Border top="0" bottom="0" left="20" right="40" />
  <s:Label top="-20" left="0" text="Over Graphic (#000000, 0-100% Alpha)" />
 </s:Group>
 
 <!-- Graphic Control Group -->
 <s:VGroup gap="10">
  <s:Label text="Under Graphic Blend Mode:" />
  <s:List id="underBlendModeList" height="100" dataProvider="{blendModes}" requireSelection="true" />
  <s:Label text="Under Graphic Opaque Background:" />
  <s:List id="underOpaqueBgList" height="100" dataProvider="{opaqueBgColors}" requireSelection="true" />
 
  <fx:HRule width="100%" />
 
  <s:CheckBox id="cacheAsBitmapCk" label="Over Graphic Cache As Bitmap" />
 
  <fx:HRule width="100%" />
 
  <s:Label text="Graphic Group Alpha: {alphaSlider.value}" />
  <s:HSlider id="alphaSlider" width="80%" value="1" stepSize="0.01" minimum="0" maximum="1" />
 </s:VGroup>
 
</s:Application>

/**
 *  @private
 *  This gets called when mouse clicks on a focusable object.
 *  We block player behavior
 */
private function mouseFocusChangeHandler(event:FocusEvent):void
{
    // trace("FocusManager: mouseFocusChangeHandler  in  = " + this._form.systemManager.loaderInfo.url);
	// trace("FocusManager: mouseFocusChangeHandler " + event);
 
    // If relatedObject is null because we don't have access to the 
    // object getting focus then allow the Player to set focus
    // to the object. The isRelatedObjectInaccessible property is 
    // Player 10 only so we have to test if it is available. We
    // will only see isRelatedObjectInaccessible if we are a version "10" swf
    // (-target-player=10). Version "9" swfs will not see the property
    // even if running in Player 10.
    if (event.relatedObject == null && 
        "isRelatedObjectInaccessible" in event &&
        event["isRelatedObjectInaccessible"] == true)
    {
        // lost focus to a control in different sandbox.
        return;
    }
 
    if (event.relatedObject is TextField)
    {
        var tf:TextField = event.relatedObject as TextField;
        if (tf.type == "input" || tf.selectable)
        {
            return; // pass it on
        }
    }
 
    event.preventDefault();
}

package
{
	import flash.events.MouseEvent;
 
	import mx.controls.Label;
 
	public class UnselectableLinkEnableLabel extends Label
	{
		public function UnselectableLinkEnableLabel()
		{
			super();
			addEventListener(MouseEvent.ROLL_OVER, handleRollOver);
			addEventListener(MouseEvent.ROLL_OUT, handleRollOut);
		}
 
		protected function handleRollOut(event:MouseEvent):void
		{
			// TODO Auto-generated method stub
			trace("handleRollOut")
			focusManager.activate();
		}
 
		protected function handleRollOver(event:MouseEvent):void
		{
			// TODO Auto-generated method stub
			trace("handleRollOver")
			focusManager.deactivate();
		}
	}
}

public static function abs(value:Number):Number
{
    return value < 0 ? -value : value;
}