http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/update_build_version.xml
----------------------------------------------------------------------
diff --git a/Radii8Designer/update_build_version.xml 
b/Radii8Designer/update_build_version.xml
new file mode 100644
index 0000000..54de7c6
--- /dev/null
+++ b/Radii8Designer/update_build_version.xml
@@ -0,0 +1,79 @@
+<?xml version="1.0"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<project name="Update Verson" default="main" basedir=".">
+
+  <!--<target name="build" >
+    <mkdir dir="build"/>
+    <javac srcdir="src" destdir="build"/>
+  </target>
+
+  <target name="declare" depends="build">
+    <taskdef name="mytask"
+        classname="com.mydomain.MyVeryOwnTask"
+        classpath="build"/>
+  </target>
+
+  <target name="main" depends="declare">
+    <mytask message="Hello World! MyVeryOwnTask works!"/>
+  </target>-->
+  
+       <!--- Updating build Date and Version -->
+       <target name="main">
+       
+               <propertyset id="tdate"></propertyset>
+               <propertyset id="ttime"></propertyset>
+
+               <tstamp>
+                       <format property="tdate" pattern="yyyy-MM-dd"/>
+               </tstamp>
+       
+               <tstamp>
+                       <format property="ttime" pattern="hh:mm aa"/>
+               </tstamp>
+               
+               <buildnumber file="build.number"/>
+               
+               <echo>Updating version to current date: ${tdate} and time: 
${ttime}</echo>
+               
+               <replaceregexp byline="true">
+                       <regexp pattern='public static const BUILD_DATE:String 
= "([0-9-]+)"'/>
+                       <substitution expression='public static const 
BUILD_DATE:String = "${tdate}"'/>
+                       <fileset dir="src">
+                               <include name="build.as"/>
+                       </fileset>
+               </replaceregexp>
+               
+               <replaceregexp byline="true">
+                       <regexp pattern='public static const BUILD_TIME:String 
= "([0-9:PMA ]+)"'/>
+                       <substitution expression='public static const 
BUILD_TIME:String = "${ttime}"'/>
+                       <fileset dir="src">
+                               <include name="build.as"/>
+                       </fileset>
+               </replaceregexp>
+               
+               <replaceregexp byline="true">
+                       <regexp pattern='public static const 
BUILD_NUMBER:String = "([0-9\.]+)"'/>
+                       <substitution expression='public static const 
BUILD_NUMBER:String = "${build.number}"'/>
+                       <fileset dir="src">
+                               <include name="build.as"/>
+                       </fileset>
+               </replaceregexp>
+       </target>
+</project>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/.actionScriptProperties
----------------------------------------------------------------------
diff --git a/Radii8Library/.actionScriptProperties 
b/Radii8Library/.actionScriptProperties
new file mode 100644
index 0000000..bea51c7
--- /dev/null
+++ b/Radii8Library/.actionScriptProperties
@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<actionScriptProperties analytics="false" 
mainApplicationPath="Radii8Library.as" 
projectUUID="bffb08cf-9863-49e0-ab71-1e13d08f4ec0" version="11">
+  <compiler additionalCompilerArguments="-locale en_US" autoRSLOrdering="true" 
copyDependentFiles="false" flexSDK="Apache Flex 4.12.1 FP13.0 AIR13.0 en_US" 
fteInMXComponents="false" generateAccessible="false" htmlExpressInstall="true" 
htmlGenerate="false" htmlHistoryManagement="false" 
htmlPlayerVersionCheck="true" includeNetmonSwc="false" outputFolderPath="bin" 
removeUnusedRSL="true" sourceFolderPath="src" strict="true" 
targetPlayerVersion="0.0.0" useApolloConfig="false" useDebugRSLSwfs="true" 
useFlashSDK="false" verifyDigests="true" warn="true">
+    <compilerSourcePath/>
+    <libraryPath defaultLinkType="1">
+      <libraryPathEntry kind="4" path="">
+        <excludedEntries>
+          <libraryPathEntry kind="3" linkType="1" 
path="${PROJECT_FRAMEWORKS}/libs/flex.swc" useDefaultLinkType="false"/>
+          <libraryPathEntry kind="3" linkType="1" 
path="${PROJECT_FRAMEWORKS}/libs/core.swc" useDefaultLinkType="false"/>
+        </excludedEntries>
+      </libraryPathEntry>
+      <libraryPathEntry kind="3" linkType="1" 
path="/Radii8LibraryAssets/bin/Radii8LibraryAssets.swc" 
useDefaultLinkType="false"/>
+      <libraryPathEntry kind="3" linkType="1" 
path="/FCLibrary/bin/FCLibrary.swc" useDefaultLinkType="false"/>
+      <libraryPathEntry kind="3" linkType="1" 
path="/AS3CommonsReflect/bin/AS3CommonsReflect.swc" useDefaultLinkType="false"/>
+      <libraryPathEntry kind="3" linkType="1" 
path="/FlexIFrame/bin/FlexIFrame.swc" useDefaultLinkType="false"/>
+      <libraryPathEntry kind="3" linkType="1" 
path="/AS3SyntaxHighlighter/bin/AS3SyntaxHighlighter.swc" 
useDefaultLinkType="false"/>
+    </libraryPath>
+    <sourceAttachmentPath/>
+  </compiler>
+  <applications>
+    <application path="Radii8Library.as"/>
+  </applications>
+  <modules/>
+  <workers/>
+  <buildCSSFiles/>
+  <flashCatalyst validateFlashCatalystCompatibility="false"/>
+</actionScriptProperties>

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/.flexLibProperties
----------------------------------------------------------------------
diff --git a/Radii8Library/.flexLibProperties b/Radii8Library/.flexLibProperties
new file mode 100644
index 0000000..86843b3
--- /dev/null
+++ b/Radii8Library/.flexLibProperties
@@ -0,0 +1,84 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<flexLibProperties includeAllClasses="true" useMultiPlatformConfig="false" 
version="3">
+  <includeClasses>
+    <classEntry path="com.flexcapacitor.components.ColorChooser"/>
+    <classEntry path="com.flexcapacitor.components.IDocumentContainer"/>
+    <classEntry path="com.flexcapacitor.controller.RadiateReferences"/>
+    <classEntry path="com.flexcapacitor.events.HistoryEvent"/>
+    <classEntry path="com.flexcapacitor.model.Device"/>
+    <classEntry path="com.flexcapacitor.model.IProject"/>
+    <classEntry path="com.flexcapacitor.model.Project"/>
+    <classEntry path="com.flexcapacitor.model.ProjectDataDescriptor"/>
+    <classEntry path="com.flexcapacitor.model.Size"/>
+    <classEntry path="com.flexcapacitor.model.StyleMetaData"/>
+    <classEntry path="com.flexcapacitor.skins.DeviceImage"/>
+    <classEntry path="com.flexcapacitor.skins.DeviceSkin"/>
+    <classEntry path="com.flexcapacitor.tools.ITool"/>
+    <classEntry path="com.flexcapacitor.tools.Selection"/>
+    <classEntry path="com.flexcapacitor.utils.MXMLDocumentImporter"/>
+    <classEntry path="com.flexcapacitor.utils.SyntaxHighlighter"/>
+    <classEntry path="com.flexcapacitor.utils.supportClasses.DragData"/>
+    <classEntry path="com.flexcapacitor.utils.supportClasses.ISelectionGroup"/>
+    <classEntry 
path="com.flexcapacitor.views.renderers.EditableDocumentRenderer"/>
+    <classEntry path="com.flexcapacitor.views.renderers.HistoryItemRenderer"/>
+    <classEntry path="com.flexcapacitor.views.supportClasses.Styles"/>
+    <classEntry path="com.flexcapacitor.views.windows.PublishWindow"/>
+    <classEntry path="com.flexcapacitor.utils.MXMLDocumentExporter"/>
+    <classEntry path="com.flexcapacitor.model.Settings"/>
+    <classEntry path="com.flexcapacitor.model.ISettings"/>
+    <classEntry path="com.flexcapacitor.managers.PersistantDataManager"/>
+    <classEntry path="com.flexcapacitor.model.ProjectMetaData"/>
+    <classEntry path="com.flexcapacitor.model.DocumentMetaData"/>
+    <classEntry path="com.flexcapacitor.model.SavedData"/>
+    <classEntry path="com.flexcapacitor.model.ISavedData"/>
+    <classEntry path="com.flexcapacitor.model.DocumentData"/>
+    <classEntry path="com.flexcapacitor.model.ProjectData"/>
+    <classEntry path="com.flexcapacitor.model.IProjectData"/>
+    <classEntry path="com.flexcapacitor.model.IDocumentData"/>
+    <classEntry path="com.flexcapacitor.model.IProjectMetaData"/>
+    <classEntry path="com.flexcapacitor.model.IDocumentMetaData"/>
+    <classEntry path="com.flexcapacitor.views.renderers.LayersRenderer"/>
+    <classEntry path="com.flexcapacitor.model.ISavable"/>
+    <classEntry path="com.flexcapacitor.model.ISavableService"/>
+    <classEntry path="com.flexcapacitor.model.SaveResultsEvent"/>
+    <classEntry path="com.flexcapacitor.controller.RadiateTest"/>
+    <classEntry path="com.flexcapacitor.model.ImageData"/>
+    <classEntry path="com.flexcapacitor.model.AttachmentData"/>
+    <classEntry path="com.flexcapacitor.utils.DocumentExporter"/>
+    <classEntry path="com.flexcapacitor.services.WPAttachmentService"/>
+    <classEntry path="com.flexcapacitor.skins.MenuItemSkin"/>
+    <classEntry path="com.flexcapacitor.skins.MenuBarButtonSkin"/>
+    <classEntry path="com.flexcapacitor.skins.PopUpButtonSkin"/>
+    <classEntry path="com.flexcapacitor.model.MenuItem"/>
+    <classEntry path="com.flexcapacitor.views.renderers.ColorPickerRenderer"/>
+    <classEntry 
path="com.flexcapacitor.views.renderers.PropertiesGridRendererBase"/>
+    <classEntry path="com.flexcapacitor.views.windows.AnimatedPanelWindow"/>
+    <classEntry path="com.flexcapacitor.model.InspectableClass"/>
+    <classEntry path="com.flexcapacitor.model.InspectorData"/>
+    <classEntry path="com.flexcapacitor.views.IInspector"/>
+    <classEntry path="com.flexcapacitor.views.inspectors.Identity"/>
+    <classEntry path="com.flexcapacitor.views.Size"/>
+    <classEntry path="com.flexcapacitor.views.inspectors.FontStyles"/>
+    <classEntry path="com.flexcapacitor.utils.Base64"/>
+  </includeClasses>
+  <includeResources/>
+  <namespaceManifests/>
+</flexLibProperties>

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/.project
----------------------------------------------------------------------
diff --git a/Radii8Library/.project b/Radii8Library/.project
new file mode 100644
index 0000000..0cc7180
--- /dev/null
+++ b/Radii8Library/.project
@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<projectDescription>
+       <name>Radii8Library</name>
+       <comment></comment>
+       <projects>
+       </projects>
+       <buildSpec>
+               <buildCommand>
+                       <name>com.adobe.flexbuilder.project.flexbuilder</name>
+                       <arguments>
+                       </arguments>
+               </buildCommand>
+       </buildSpec>
+       <natures>
+               <nature>com.adobe.flexbuilder.project.flexlibnature</nature>
+               
<nature>com.adobe.flexbuilder.project.actionscriptnature</nature>
+       </natures>
+</projectDescription>

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/.settings/org.eclipse.core.resources.prefs
----------------------------------------------------------------------
diff --git a/Radii8Library/.settings/org.eclipse.core.resources.prefs 
b/Radii8Library/.settings/org.eclipse.core.resources.prefs
new file mode 100644
index 0000000..f906076
--- /dev/null
+++ b/Radii8Library/.settings/org.eclipse.core.resources.prefs
@@ -0,0 +1,3 @@
+#Sat Jun 30 14:07:45 CDT 2012
+eclipse.preferences.version=1
+encoding/<project>=utf-8

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/BlackArrow.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/BlackArrow.png 
b/Radii8Library/src/assets/icons/tools/BlackArrow.png
new file mode 100644
index 0000000..ffe0615
Binary files /dev/null and 
b/Radii8Library/src/assets/icons/tools/BlackArrow.png differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/EyeDropper.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/EyeDropper.png 
b/Radii8Library/src/assets/icons/tools/EyeDropper.png
new file mode 100644
index 0000000..c211eea
Binary files /dev/null and 
b/Radii8Library/src/assets/icons/tools/EyeDropper.png differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/EyeDropperCursor.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/EyeDropperCursor.png 
b/Radii8Library/src/assets/icons/tools/EyeDropperCursor.png
new file mode 100644
index 0000000..2e62dd6
Binary files /dev/null and 
b/Radii8Library/src/assets/icons/tools/EyeDropperCursor.png differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/Selection.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/Selection.png 
b/Radii8Library/src/assets/icons/tools/Selection.png
new file mode 100644
index 0000000..c49677f
Binary files /dev/null and b/Radii8Library/src/assets/icons/tools/Selection.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/WhiteArrow.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/WhiteArrow.png 
b/Radii8Library/src/assets/icons/tools/WhiteArrow.png
new file mode 100644
index 0000000..e090a67
Binary files /dev/null and 
b/Radii8Library/src/assets/icons/tools/WhiteArrow.png differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/Zoom.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/Zoom.png 
b/Radii8Library/src/assets/icons/tools/Zoom.png
new file mode 100644
index 0000000..6cfcf92
Binary files /dev/null and b/Radii8Library/src/assets/icons/tools/Zoom.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/ZoomIn.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/ZoomIn.png 
b/Radii8Library/src/assets/icons/tools/ZoomIn.png
new file mode 100644
index 0000000..6cfcf92
Binary files /dev/null and b/Radii8Library/src/assets/icons/tools/ZoomIn.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/assets/icons/tools/ZoomOut.png
----------------------------------------------------------------------
diff --git a/Radii8Library/src/assets/icons/tools/ZoomOut.png 
b/Radii8Library/src/assets/icons/tools/ZoomOut.png
new file mode 100644
index 0000000..6cfcf92
Binary files /dev/null and b/Radii8Library/src/assets/icons/tools/ZoomOut.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/components/ColorChooser.mxml
----------------------------------------------------------------------
diff --git a/Radii8Library/src/com/flexcapacitor/components/ColorChooser.mxml 
b/Radii8Library/src/com/flexcapacitor/components/ColorChooser.mxml
new file mode 100644
index 0000000..9dfb205
--- /dev/null
+++ b/Radii8Library/src/com/flexcapacitor/components/ColorChooser.mxml
@@ -0,0 +1,220 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<s:Group 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:controls="com.flexcapacitor.controls.*"
+                xmlns:handlers="com.flexcapacitor.handlers.*" 
+                xmlns:clipboard="com.flexcapacitor.effects.clipboard.*" 
+                xmlns:status="com.flexcapacitor.effects.status.*" 
+                
+                height="24" 
+                >
+       
+       <fx:Metadata>
+               [Event(name="change")]
+       </fx:Metadata>
+       
+       <fx:Script>
+               <![CDATA[
+                       import com.flexcapacitor.utils.DisplayObjectUtils;
+                       
+                       import mx.core.IFlexModule;
+                       import mx.events.ColorPickerEvent;
+                       
+                       public static const HEXIDECIMAL_HASH_TYPE:String = 
"hexidecimalHash";
+                       public static const HEXIDECIMAL_TYPE:String = 
"hexidecimal";
+                       public static const STRING_UINT_TYPE:String = 
"stringUint";
+                       public static const NUMBER_TYPE:String = "number";
+                       public static const UINT_TYPE:String = "uint";
+                       public static const INT_TYPE:String = "int";
+                       
+                       /**
+                        * 
+                        * */
+                       public var target:Object = this;
+                       
+                       private var _selectedColor:Object;
+                       private var colorAsUint:uint;
+                       public var originalColor:String;
+                       
+                       /**
+                        * Type of the original value. 
+                        * */
+                       public var originalValueType:String;
+                       
+                       /**
+                        * Type of value to return
+                        * */
+                       
[Inspectable(enumeration="hexidecimalHash,hexidecimal,stringUint,number,uint,int,original")]
+                       public var returnType:String;
+
+                       public function get selectedColor():Object {
+                               var type:String = returnType ? returnType : 
originalValueType;
+                               
+                               return 
DisplayObjectUtils.getColorAsType(colorAsUint, type);
+                       }
+                       
+                       public function get selectedColorAsHex():String {
+                               return 
DisplayObjectUtils.getColorInHex(colorAsUint, false);
+                       }
+                       
+                       public function get selectedColorAsHexAndHash():String {
+                               return 
DisplayObjectUtils.getColorInHex(colorAsUint, true);
+                       }
+                       
+                       public function get selectedColorAsInt():String {
+                               return 
DisplayObjectUtils.getColorInHex(colorAsUint, true);
+                       }
+
+                       public function set selectedColor(value:Object):void {
+                               if (_selectedColor===value) return;
+                               _selectedColor = value;
+                               var actualValue:uint;
+                               
+                               if (value is String)
+                               {
+                                       if (String(value).indexOf("#")==0) {
+                                               originalValueType = 
HEXIDECIMAL_HASH_TYPE;
+                                       }
+                                       else if 
(String(value).indexOf("0x")==0) {
+                                               originalValueType = 
HEXIDECIMAL_TYPE;
+                                       }
+                                       else {
+                                               //actualValue = int(value);
+                                               originalValueType = 
STRING_UINT_TYPE;
+                                       }
+                                       
+                                       var moduleFactory:IFlexModuleFactory = 
null;
+                                       if (target is IFlexModule)
+                                               moduleFactory = 
target.moduleFactory;
+                                       
+                                       actualValue = 
StyleManager.getStyleManager(moduleFactory).getColorName(value);
+                                       
+                                       if 
(actualValue===StyleManager.NOT_A_COLOR) {
+                                               actualValue = 
StyleManager.getStyleManager(moduleFactory).getColorName(int(value));
+                                       }
+                               }
+                               else if (value is Number) {
+                                       originalValueType = NUMBER_TYPE;
+                                       actualValue = Number(value);
+                               }
+                               else if (value is uint) {
+                                       originalValueType = UINT_TYPE;
+                                       actualValue = uint(value);
+                               }
+                               else if (value is int) {
+                                       originalValueType = INT_TYPE;
+                                       actualValue = int(value);
+                               }
+                               
+                               colorAsUint = actualValue;
+                               colorPicker.selectedColor = actualValue;
+                               colorTextInput.text = 
DisplayObjectUtils.getColorInHex(actualValue, true);
+                               originalColor = colorTextInput.text;
+                       }
+
+                       
+                       /**
+                        * Update color text input
+                        * */
+                       protected function 
colorPicker_changeHandler(event:ColorPickerEvent):void {
+                               selectedColor = event.color;
+                               
+                               dispatchEvent(new Event(Event.CHANGE, false, 
true));
+                       }
+                       
+                       protected function 
colorTextInput_keyUpHandler(event:KeyboardEvent):void {
+                               if (event.keyCode==Keyboard.ENTER) {
+                                       selectedColor = colorTextInput.text;
+                                       dispatchEvent(new Event(Event.CHANGE, 
false, true));
+                               }
+                               else if (event.keyCode==Keyboard.ESCAPE) {
+                                       colorTextInput.text = originalColor;
+                                       event.preventDefault();
+                               }
+                       }
+                       
+                       protected function 
colorTextInput_focusOutHandler(event:FocusEvent):void {
+                               if (colorTextInput.text==originalColor) return;
+                               selectedColor = colorTextInput.text;
+                               
+                               if (selectedColor!=originalColor) {
+                                       dispatchEvent(new Event(Event.CHANGE, 
false, true));
+                               }
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               
+               <!-- COPY TO THE CLIPBOARD -->
+               <handlers:EventHandler eventName="click" target="{copyIcon}" 
setTriggerEvent="true">
+                       
+                       <clipboard:CopyToClipboard data="{colorTextInput.text}" 
targetAncestor="{this}" allowNullData="true">
+                               <clipboard:successEffect>
+                                       <status:ShowStatusMessage 
message="Color copied to the clipboard"/>
+                               </clipboard:successEffect>
+                               <clipboard:noDataEffect>
+                                       <status:ShowStatusMessage 
message="Nothing to copy to the clipboard"/>
+                               </clipboard:noDataEffect>
+                               <clipboard:errorEffect>
+                                       <status:ShowStatusMessage message="An 
error occurred while attempting to copy to the clipboard"/>
+                               </clipboard:errorEffect>
+                       </clipboard:CopyToClipboard>
+                       
+               </handlers:EventHandler>
+               
+               <fx:Boolean id="includeCopyIcon">true</fx:Boolean>
+               <fx:Boolean id="includeTextInput">true</fx:Boolean>
+               <fx:Boolean id="includeColorPicker">true</fx:Boolean>
+       </fx:Declarations>
+       
+       <s:layout>
+               <s:HorizontalLayout paddingLeft="0" />
+       </s:layout>
+       
+       <mx:ColorPicker id="colorPicker" 
+                                       height="100%" 
+                                       visible="{includeColorPicker}"
+                                       includeInLayout="{includeColorPicker}"
+                                       
change="colorPicker_changeHandler(event)"
+                                       />
+       
+       <s:TextInput id="colorTextInput" 
+                                widthInChars="6" 
+                                height="100%"
+                                visible="{includeTextInput}"
+                                includeInLayout="{includeTextInput}"
+                                keyUp="colorTextInput_keyUpHandler(event)"
+                                
focusOut="colorTextInput_focusOutHandler(event)"
+                                />
+       
+       
+       <controls:ImageButton id="copyIcon" 
+                                                  height="100%"
+                                                  visible="{includeCopyIcon}"
+                                                  
includeInLayout="{includeCopyIcon}"
+                                                  enabled="{includeCopyIcon 
&amp;&amp; colorTextInput.text!=''}"
+                                                  
source="{Radii8LibraryAssets.copy}" 
+                                                  toolTip="Copy the color to 
the Clipboard"
+                                                  />
+</s:Group>

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/components/DocumentContainer.mxml
----------------------------------------------------------------------
diff --git 
a/Radii8Library/src/com/flexcapacitor/components/DocumentContainer.mxml 
b/Radii8Library/src/com/flexcapacitor/components/DocumentContainer.mxml
new file mode 100644
index 0000000..43cb40b
--- /dev/null
+++ b/Radii8Library/src/com/flexcapacitor/components/DocumentContainer.mxml
@@ -0,0 +1,1038 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Group 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:components="com.flexcapacitor.components.*"
+                xmlns:c="com.flexcapacitor.controls.*"
+                xmlns:local="*"
+                
+                width="400" height="300"
+                show="group1_showHandler(event)"
+                creationComplete="creationComplete()"
+                implements="com.flexcapacitor.components.IDocumentContainer" 
+                >
+
+       <!-- 
+               WE SHOULD REFACTOR THIS
+               
+               Sometimes the generated MXML document is blank. I think it's 
because if we open
+       multiple documents the application never gets completely loaded or 
rendered in it's tab and the
+       user closes the document and reopens it. I think it has to do with the 
activate event in Flex
+       So we need to wait before opening new documents until application 
complete on the current document.
+       We might need to add an event listener in the Document or Project class 
to make sure each application
+       completely loads before opening the next. 
+       -->
+       
+       <fx:Script>
+               <![CDATA[
+                       import com.flexcapacitor.controller.Radiate;
+                       import com.flexcapacitor.events.RadiateEvent;
+                       import com.flexcapacitor.model.IDocument;
+                       import 
com.flexcapacitor.utils.supportClasses.ComponentDescription;
+                       
+                       import mx.core.IVisualElement;
+                       import mx.core.IVisualElementContainer;
+                       import mx.events.FlexEvent;
+                       import mx.events.ResizeEvent;
+                       import mx.managers.SystemManager;
+                       import mx.utils.NameUtil;
+                       
+                       import spark.components.Application;
+                       
+                       import org.as3commons.lang.ArrayUtils;
+                       
+                       
+                       
+                       /**
+                        * STEP 1. 
+                        * 
+                        * When this is added to the display list then we
+                        * load in a blank application.
+                        * 
+                        * We do this so that at some point we can sandbox 
+                        * the application.
+                        * We also do this so we can load in remote 
applications.
+                        * */
+                       private function creationComplete():void {
+                               radiate = Radiate.getInstance();
+                               toolLayer = toolLayerInstance;
+                               canvasBorder = canvasBorderInstance;
+                               canvasBackground = canvasBackgroundInstance;
+                               canvasScroller = canvasScrollerInstance;
+                               //radiate.setCanvas(canvasBorder, 
canvasBackground, canvasScroller);                            
+                               
+                               
+                               
+                               systemManager.allowDomain("*");
+                               
+                               var context:LoaderContext = new LoaderContext();
+                               
+                               /* Specify the current application's security 
domain. */
+                               context.securityDomain = 
SecurityDomain.currentDomain;
+                               
+                               /* Specify a new ApplicationDomain, which loads 
the sub-app into a 
+                               peer ApplicationDomain. */
+                               context.applicationDomain = new 
ApplicationDomain();
+                               
+                               projectLoader.trustContent = trustContent;
+                               projectLoader.loadForCompatibility = 
loadForCompatibility;
+                               projectLoader.maintainAspectRatio = 
maintainAspectRatio;
+                               projectLoader.scaleContent = scaleContent;
+                               
+                               // if not on server context throws errors
+                               if (Security.sandboxType == Security.REMOTE) {
+                                       //projectLoader.loaderContext = context;
+                                       projectLoader.trustContent = 
!trustContent;
+                               }
+                               
+                               projectLoader.source = url;//URL.text; // 
"http://yourdomain.com/SubApp3.swf";;
+                               
+                               //projectLoader.autoLoad = autoLoad;
+                               //load();
+                               
+                               //stage.addEventListener(MouseEvent.MOUSE_DOWN, 
mouseDownHandler);
+                       }
+                       
+                       /**
+                        * STEP 2. 
+                        * 
+                        * SWF is Loaded now listen for Application Complete
+                        * */
+                       protected function 
project_completeHandler(event:Event):void {
+                               //var loader:SWFLoader = event.currentTarget as 
SWFLoader;
+                               /*
+                               SecurityDomain 
'http://www.radii8.com/demo2/RadiateExample.html?debug=true' 
+                               tried to access incompatible context 
'http://www.flexcapacitor.com/apps/aboutyou/AboutYou.swf'
+                               SecurityError: Error #2121: Security sandbox 
violation: Loader.content: 
+                               
http://www.radii8.com/demo2/RadiateExample.swf/[[DYNAMIC]]/3 cannot access 
+                               
http://www.flexcapacitor.com/apps/urlcodec/URLCodec.swf. This may be worked 
around by 
+                               calling Security.allowDomain.
+
+                               */
+                               
projectLoader.loaderInfo.uncaughtErrorEvents.addEventListener(UncaughtErrorEvent.UNCAUGHT_ERROR,
 uncaughtErrorHandler);
+                               
+                               var loaderClassName:String = 
NameUtil.getUnqualifiedClassName(projectLoader.content);
+                               
+                               
+                               if (projectLoader.content is DisplayObject) {
+                                       //parentAllowsChild.selected = 
b.parentAllowsChild;
+                                       //childAllowsParent.selected = 
b.childAllowsParent;
+                                       targetSystemManager = 
projectLoader.content as SystemManager;
+                                       
+                                       
targetSystemManager.addEventListener(FlexEvent.APPLICATION_COMPLETE, 
applicationComplete);
+                                       
//LoaderInfo(targetApplication.loaderInfo).uncaughtErrorEvents.addEventListener(UncaughtErrorEvent.UNCAUGHT_ERROR,
 uncaughtErrorHandler);
+                               }
+                               
+                               hideBusyIndicators();
+                               
+                               
+                               //Radiate.log.info("SWF Loaded");
+                       }
+                       
+                       /**
+                        * STEP 3.
+                        * 
+                        * Blank application loaded. Import the document. 
+                        * */
+                       protected function 
applicationComplete(event:Event):void {
+                               var loader:Object = event.currentTarget;
+                               var radiate:Radiate = Radiate.instance;
+                               //parentAllowsChild.selected = 
b.parentAllowsChild;
+                               //childAllowsParent.selected = 
b.childAllowsParent;
+                               
+                               
+                               targetSystemManager = loader as SystemManager;
+                               targetApplication = loader.application;
+                               
+                               
+                               // 8.5 x 11 at 72dpi is 612x792
+                               targetApplication.width = 
Radiate.DEFAULT_DOCUMENT_WIDTH;
+                               targetApplication.height = 
Radiate.DEFAULT_DOCUMENT_HEIGHT;
+                               
+                               updateBackgroundSize();
+                               
+                               iDocument.instance = targetApplication;
+                               
+                               //radiate.setDocument(iDocument);
+                               //radiate.setTarget(targetApplication);
+                               
+                               //codeAvailable = true;
+                               //Radiate.log.info("Document container app 
complete");
+                               if (iDocument.source) {
+                                       validateNow();
+                                       iDocument.parseSource();
+                                       iDocument.resetSaveStatus();
+                                       updateBackgroundSize();
+                                       //parseDocument(codeToLoad);
+                                       //codeAvailable = false;
+                                       
+                                       // we should dispatch an event when 
parsing is complete
+                               }
+                               
+                               
+                               
radiate.addEventListener(RadiateEvent.SCALE_CHANGE, scaleChange, false, 0, 
true);
+                               
//radiate.addEventListener(RadiateEvent.DOCUMENT_SIZE_CHANGE, scaleChange, 
false, 0, true);
+                               
radiate.addEventListener(RadiateEvent.PROPERTY_CHANGED, propertyChange, false, 
0, true);
+                               
+                               radiate.setDocument(iDocument);
+                               radiate.setTarget(targetApplication);
+                               //updateAppScrollPosition();
+                               
+                               //setTimeout(updateAppScrollPosition, 10);
+                               //setTimeout(updateAppScrollPosition, 100);
+                               //setTimeout(updateAppScrollPosition, 500);
+                               
+                               hideBusyIndicators();
+                               
+                               applicationReady = true;
+                               
+                               radiate.centerApplication(true);
+                               
+                               //Radiate.log.info("Application Complete");
+                               
+                       }
+                       
+                       /**
+                        * The document / application
+                        * */
+                       public var targetApplication:Object;
+                       
+                       /*[Embed(source="assets/460/application.swf")]
+                       public var embeddedApplication:Class*/
+                       
+                       private var _url:String = "application.swf";
+                       
+                       public var autoLoad:Boolean = true;
+                       
+                       private var radiate:Radiate;
+                       
+                       /**
+                        * Set to false. 
+                        * */
+                       private var loadForCompatibility:Boolean;
+                       
+                       /**
+                        * Maintains the aspect ratio
+                        * */
+                       private var maintainAspectRatio:Boolean = true;
+                       
+                       /**
+                        * Set to false to prevent application from scaling to 
fit (vs resizing)
+                        * */
+                       private var scaleContent:Boolean;
+                       
+                       /**
+                        * Set to false for loading local file? And true for 
loading remote swf.
+                        * */
+                       private var trustContent:Boolean;
+                       
+                       /**
+                        * System manager of the target application
+                        * */
+                       private var targetSystemManager:SystemManager;
+                       
+                       /**
+                        * Padding to add around the document if it is too 
large to 
+                        * fit in the available space. 
+                        * */
+                       public var documentPadding:int = 25;
+                       
+                       /**
+                        * True when updating the document and background size
+                        * */
+                       public var inUpdateBackgroundSize:Boolean = true;
+                       
+                       /**
+                        * Application ready
+                        * */
+                       public var applicationReady:Boolean;
+                       
+                       /**
+                        * 
+                        * */
+                       public var codeAvailable:Boolean;
+                       
+                       /**
+                        * 
+                        * */
+                       public var codeToLoad:String;
+                       
+                       
+                       private var _componentDescription:ComponentDescription;
+
+                       /**
+                        * Root component description
+                        * */
+                       public function get 
componentDescription():ComponentDescription {
+                               return _componentDescription;
+                       }
+
+                       /**
+                        * @private
+                        */
+                       [Bindable]
+                       public function set 
componentDescription(value:ComponentDescription):void {
+                               _componentDescription = value;
+                       }
+                       
+                       private var _documentDescription:IDocument;
+
+                       public function get iDocument():IDocument {
+                               return _documentDescription;
+                       }
+
+                       /**
+                        * Reference to document description
+                        * */
+                       [Bindable]
+                       public function set iDocument(value:IDocument):void {
+                               if (_documentDescription == value) return;
+                               _documentDescription = value;
+                               
+                               //load();
+                       }
+                       
+                       private var _toolLayer:IVisualElementContainer;
+
+                       public function get toolLayer():IVisualElementContainer 
{
+                               return _toolLayer;
+                       }
+
+                       /**
+                        * Reference to the tool layer
+                        * */
+                       [Bindable]
+                       public function set 
toolLayer(value:IVisualElementContainer):void {
+                               _toolLayer = value;
+                       }
+
+                       private var _canvasBorder:IVisualElementContainer;
+
+                       public function get 
canvasBorder():IVisualElementContainer {
+                               return _canvasBorder;
+                       }
+
+                       /**
+                        * Canvas border
+                        * */
+                       [Bindable]
+                       public function set 
canvasBorder(value:IVisualElementContainer):void {
+                               _canvasBorder = value;
+                       }
+
+                       private var _canvasBackground:IVisualElementContainer;
+
+                       /**
+                        * Reference to the canvas background
+                        * */
+                       public function get 
canvasBackground():IVisualElementContainer {
+                               return _canvasBackground;
+                       }
+
+                       public function set 
canvasBackground(value:IVisualElementContainer):void {
+                               _canvasBackground = value;
+                       }
+
+                       private var _canvasScroller:Scroller;
+
+                       public function get canvasScroller():Scroller {
+                               return _canvasScroller;
+                       }
+
+                       /**
+                        * Canvas scroller
+                        * */
+                       [Bindable]
+                       public function set canvasScroller(value:Scroller):void 
{
+                               _canvasScroller = value;
+                       }
+
+                       /**
+                        * 
+                        * */
+                       public function importDocument(code:String):Boolean {
+                               load();
+                               codeToLoad = code;
+                               codeAvailable = true;
+                               return true;
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       [Bindable]
+                       public function get url():String {
+                               return _url;
+                       }
+
+                       public function set url(value:String):void {
+                               _url = value;
+                               load();
+                       }
+
+                       
+                       
+                       /**
+                        * Load blank Spark Application SWF
+                        * */
+                       public function load():void {
+                               
+                               removeErrorMessages();
+                               
+                               showBusyIndicators();
+                               
+                               if (url) {
+                                       try {
+                                               //projectLoader.trustContent = 
trustContent;
+                                               projectLoader.loaderContext = 
null;
+                                               projectLoader.source = "";
+                                               projectLoader.source = url;
+                                               projectLoader.load();
+                                       }
+                                       catch (error:Error) {
+                                               
Radiate.log.error(error.message);
+                                               hideBusyIndicators();
+                                       }
+                               }
+                               else {
+                                       hideBusyIndicators();
+                               }
+                       }
+                       
+                       /**
+                        * Load URL
+                        * */
+                       public function loadRemote(url:String, 
trustContent:Boolean = true, loadForCompatibility:Boolean = false):void {
+                               
+                               systemManager.allowDomain("*");
+                               showBusyIndicators();
+                               
+                               if (url) {
+                                       try {
+                                               // if not on server context 
throws errors
+                                               //if (Security.sandboxType == 
Security.REMOTE) {
+                                                       
//projectLoader.loaderContext = context;
+                                               projectLoader.trustContent = 
trustContent;
+                                               //}
+                                                       
+                                               var context:LoaderContext = new 
LoaderContext();
+                                                       
+                                               /* Specify the current 
application's security domain. */
+                                               //context.securityDomain = 
SecurityDomain.currentDomain;
+                                               //projectLoader.loaderContext = 
context;
+                                               
projectLoader.loadForCompatibility = loadForCompatibility;
+                                               projectLoader.source = "";
+                                               projectLoader.source = url;
+                                               projectLoader.load();
+                                       }
+                                       catch (error:Error) {
+                                               
Radiate.log.error(error.message);
+                                               hideBusyIndicators();
+                                       }
+                               }
+                               else {
+                                       hideBusyIndicators();
+                               }
+                       }
+                       
+                       protected function 
allowDomainHandler(event:MouseEvent):void {
+                               systemManager.allowDomain("*");
+                       }
+                       
+                       private function 
uncaughtErrorHandler(event:UncaughtErrorEvent):void {
+                               event.preventDefault();
+                               
+                               //to capture the error message
+                               var errorMessage:String = new String();
+                               
+                               if (event.error is Error) {
+                                       errorMessage = Error( event.error 
).message;
+                               }
+                               else if (event.error is ErrorEvent) {
+                                       errorMessage = ErrorEvent( event.error 
).text;
+                               }
+                               else {
+                                       errorMessage = event.error.toString();
+                               }
+                               
+                               //Radiate.logTarget.logEvent(new 
LogEvent("Uncaught Error", LogEventLevel.ERROR));
+                               Radiate.log.error(errorMessage);
+                               //trace("Uncaught error", event);
+                               
+                               hideBusyIndicators();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
project_ioErrorHandler(event:IOErrorEvent):void {
+                               //trace("ioerror");
+                               Radiate.log.error(event.text);
+                               hideBusyIndicators();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
project_securityErrorHandler(event:SecurityErrorEvent):void
+                       {
+                               //trace("security error");
+                               Radiate.log.error(event.text);
+                               hideBusyIndicators();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function project_initHandler(event:Event):void
+                       {
+                               //trace("init");
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
project_progressHandler(event:ProgressEvent):void
+                       {
+                               //trace("PROGRESS");
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
project_unloadHandler(event:Event):void
+                       {
+                               //trace("unload");
+                               Radiate.log.info("SWF unloaded");
+                               hideBusyIndicators();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function project_openHandler(event:Event):void
+                       {
+                               //trace("open");
+                               showBusyIndicators();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
project_httpStatusHandler(event:HTTPStatusEvent):void {
+                               //trace("http status");                         
+                       }
+                       
+                       /**
+                        * Show busy indicatos
+                        * */
+                       public function showBusyIndicators():void {
+                               //fadeOutBusy.end();
+                               //fadeInBusy.play();
+                               
+                               if (!loadingLabel || !toolLayer || 
!canvasBorder) return;
+                               loadingLabel.visible =  true;
+                               IVisualElement(toolLayer).visible = false;
+                               canvasBorderInstance.visible = false;
+                       }
+                       
+                       /**
+                        * Hide busy indicators
+                        * */
+                       public function hideBusyIndicators():void {
+                               
+                               if (!loadingLabel || !toolLayer || 
!canvasBorder) return;
+                               loadingLabel.visible =  false;
+                               toolLayerInstance.visible = true;
+                               canvasBorderInstance.visible = true;
+                       }
+                       
+                       /**
+                        * Make sure we are showing the correct document
+                        * */
+                       protected function 
group1_showHandler(event:FlexEvent):void {
+                               if (radiate.selectedDocument!=iDocument) {
+                                       
radiate.setDocument(radiate.selectedDocument, true);// maybe call update 
document here???
+                               }
+                               
+                               Radiate.log.info("Document SHOW event");
+                       }
+                       
+                       /**
+                        * Reload blank app
+                        * */
+                       public function reload():void {
+                               creationComplete();
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       private function removeErrorMessages():void {
+                               
+                               if (projectLoader && projectLoader.loaderInfo) {
+                                       
projectLoader.loaderInfo.uncaughtErrorEvents.removeEventListener(UncaughtErrorEvent.UNCAUGHT_ERROR,
 uncaughtErrorHandler);
+                               }
+                               
+                               if (targetSystemManager) {
+                                       //parentAllowsChild.selected = 
b.parentAllowsChild;
+                                       //childAllowsParent.selected = 
b.childAllowsParent;
+                                       
+                                       
targetSystemManager.removeEventListener(FlexEvent.APPLICATION_COMPLETE, 
applicationComplete);
+                               }
+                       }
+                       
+                       
+                       /**
+                        * 
+                        * */
+                       private function 
canvasBorder_resizeHandler(event:ResizeEvent):void {
+                               if (targetApplication) {
+                                       updateBackgroundSize();
+                               }
+                       }
+                       
+                       /**
+                        * Update the size of the target application
+                        * */
+                       private function updateAppScrollPosition():void {
+                               
+                               if (targetApplication is DisplayObject) {
+                                       radiate.centerApplication();
+                               }
+                       }
+                       
+                       /**
+                        * Handles the clipping, scaling and sizing of the 
target application. 
+                        * Could be moved to update display list???
+                        * */
+                       public function updateBackgroundSize():void {
+                               //if (inUpdateBackgroundSize) return;
+                               inUpdateBackgroundSize = true;
+                               
+                               // size canvas background to be the minimum 
size of the scroller
+                               // or the size of the target application + 50
+                               var scaledDocumentWidth:int = 
targetApplication.width * targetApplication.scaleX;
+                               var scaledDocumentHeight:int = 
targetApplication.height * targetApplication.scaleY;
+                               /*var aspectRatio:String = 
scaledDocumentWidth/scaledDocumentHeight>1?"portrait":"landscape";
+                               if 
(aspectRatio!=canvasBorder.skin.currentState) {
+                                       canvasBorder.skin.currentState = 
aspectRatio;
+                               }*/
+                               
+                               var scaledPaddedDocumentWidth:int = 
documentPadding + (targetApplication.width * targetApplication.scaleX);
+                               var scaledPaddedDocumentHeight:int = 
documentPadding + (targetApplication.height * targetApplication.scaleY);
+                               
+                               var scrollerWidth:int = canvasScroller.width;
+                               var scrollerHeight:int = canvasScroller.height;
+                               
+                               var scrollerPaddedWidth:int = 
canvasScroller.width + documentPadding;
+                               var scrollerPaddedHeight:int = 
canvasScroller.height + documentPadding;
+                               
+                               var visiblePaddedWidth:int = 
canvasScroller.width - documentPadding;
+                               var visiblePaddedHeight:int = 
canvasScroller.height - documentPadding;
+                               
+                               var minimumWidth:int;
+                               var minimumHeight:int;
+                               
+                               // if content width is more than available 
width plus padding then 
+                               // set minimum width to show scrollbars and add 
padding
+                               if (scaledPaddedDocumentWidth >= 
visiblePaddedWidth+10) {
+                                       minimumWidth = Math.max(scrollerWidth, 
scaledPaddedDocumentWidth);
+                               }
+                               else {
+                                       minimumWidth = scrollerWidth;
+                               }
+                               
+                               // if content height is more than available 
height plus padding then 
+                               // set minimum height to show scrollbars and 
add padding
+                               if (scaledPaddedDocumentHeight 
>=visiblePaddedHeight+10) {
+                                       minimumHeight = 
Math.max(scrollerPaddedHeight, scaledPaddedDocumentHeight);
+                               }
+                               else {
+                                       minimumHeight = scrollerHeight;
+                               }
+                               
+                               canvasBackgroundParent.percentWidth = 100;
+                               canvasBackgroundParent.percentHeight = 100;
+                               
+                               canvasBackgroundInstance.width = 
minimumWidth;//Math.max(canvasScroller.width, minimumWidth);
+                               canvasBackgroundInstance.height = 
minimumHeight;//Math.max(canvasScroller.height, minimumHeight);
+                               
+                               canvasBorderInstance.width = 
scaledDocumentWidth;
+                               canvasBorderInstance.height = 
scaledDocumentHeight;
+                               
+                               projectLoader.width = scaledDocumentWidth;
+                               projectLoader.height = scaledDocumentHeight;
+                               
+                               // we do this because when we scale the 
application the 
+                               // system manager mask is not updated and the 
content gets clipped
+                               
targetSystemManager.setActualSize(scaledDocumentWidth, scaledDocumentHeight);
+                               
+                               validateNow();
+                               
+                               inUpdateBackgroundSize = false;
+                       }
+                       
+                       /**
+                        * Update the position of the document
+                        * */
+                       protected function scaleChange(event:RadiateEvent):void 
{
+                               
+                               //if (!inUpdateBackgroundSize) {
+                                       updateBackgroundSize();
+                               //}
+                       }
+                       
+                       public var importantProperties:Array = ["width", 
"explicitWidth", "height", "explicitHeight","scaleX","scaleY"];
+                       
+                       /**
+                        * Update the size of the document
+                        * */
+                       protected function 
propertyChange(event:RadiateEvent):void {
+                               var sizeChange:Boolean;
+                               
+                               if (event.selectedItem is Application) {
+                                       sizeChange = 
ArrayUtils.containsAny(event.properties, importantProperties);
+                                       
+                                       if (sizeChange) {
+                                               updateBackgroundSize();
+                                       }
+                               }
+                       }
+                       
+                       protected function 
canvasBackground_resizeHandler(event:ResizeEvent):void {
+                               
+                       }
+                       
+                       protected function 
canvasBackgroundParent_resizeHandler(event:ResizeEvent):void {
+                               
+                       }
+                       
+                       protected function 
projectLoader_resizeHandler(event:ResizeEvent):void {
+                               //Radiate.log.info("Project loader resize");
+                       }
+                       
+                       
+                       /**
+                        * 
+                        * */
+                       private function 
updateScrollBarPosition(center:Point=null):void {
+                               /*if (canvasBackground.contentHeight > 
canvasBackground.height) {
+                                       
//canvasBackground.verticalScrollPosition = 
int((canvasBackground.contentHeight-canvasBackground.height)/2)
+                               }
+                               else {
+                                       
//canvasBackground.verticalScrollPosition = 0;
+                               }*/
+                               /*if (borderContainer.contentHeight > 
borderContainer.height) {
+                                       borderContainer.verticalScrollPosition 
= int((borderContainer.contentHeight-borderContainer.height)/2);
+                               }
+                               else {
+                                               
borderContainer.verticalScrollPosition = 0;
+                               }
+                               
+                               if (borderContainer.contentWidth > 
borderContainer.width) {
+                                       
borderContainer.horizontalScrollPosition = 
int((borderContainer.contentWidth-borderContainer.width)/2);
+                               }
+                               else {
+                                       
borderContainer.horizontalScrollPosition = 0;
+                               }*/
+                       }
+                       
+                       /**
+                        * Not used but probably should be
+                        * */
+                       override protected function 
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
+                               super.updateDisplayList(unscaledWidth, 
unscaledHeight);
+                               
+                               return;
+                               
+                       }
+                       
+                       private var _showBorders:Boolean;
+
+                       /**
+                        * 
+                        * */
+                       public function get showBorders():Boolean {
+                               return _showBorders;
+                       }
+
+                       /**
+                        * Show borders for debugging layout of application
+                        * */
+                       public function set showBorders(value:Boolean):void {
+                               if (_showBorders == value) return;
+                               _showBorders = value;
+                               
+                               if (_showBorders) {
+                                       
canvasBackgroundParent.setStyle("backgroundColor", 0xF00000);
+                                       
canvasBackgroundInstance.setStyle("backgroundColor", 0xFF0000);
+                                       
canvasBorderInstance.setStyle("backgroundColor", 0xFFF000);
+                                       
toolLayerInstance.setStyle("backgroundColor", 0xFFFF00);
+                                       
canvasBackgroundParent.setStyle("backgroundAlpha", 1);
+                                       
canvasBackgroundInstance.setStyle("backgroundAlpha", 1);
+                                       
canvasBorderInstance.setStyle("backgroundAlpha", 1);
+                                       
toolLayerInstance.setStyle("backgroundAlpha", 1);
+                               }
+                               else {
+                                       
canvasBackgroundParent.setStyle("backgroundAlpha", 0);
+                                       
canvasBackgroundInstance.setStyle("backgroundAlpha", 0);
+                                       
canvasBorderInstance.setStyle("backgroundAlpha", 0);
+                                       
toolLayerInstance.setStyle("backgroundAlpha", 0);
+                               }
+                       }
+
+                       /**
+                        * 
+                        * */
+                       protected function 
scrollerCornerButton_clickHandler(event:MouseEvent):void {
+                               //showBorders = !showBorders;
+                               
+                               //if (!inUpdateBackgroundSize) { 
+                                       radiate.centerApplication();
+                               //}
+                       }
+                       
+                       /**
+                        * 
+                        * */
+                       protected function 
scroller_resizeHandler(event:ResizeEvent):void {
+                               if (!targetApplication) return;
+                               
+                               //if (!inUpdateBackgroundSize) {
+                                       updateBackgroundSize();
+                               //}
+                       }
+                       
+                       
+                       protected function 
canvasScrollerInstance_creationCompleteHandler(event:FlexEvent):void {
+                               var enableMouseSupport:Boolean = false;
+                               
+                               if (enableMouseSupport) {
+                                       
canvasScrollerInstance.addEventListener(MouseEvent.MOUSE_WHEEL, 
list_mouseWheel, true);
+                               }
+                       }
+                       
+                       protected function list_mouseWheel(e:MouseEvent):void {
+                               e.preventDefault();
+                               e.stopImmediatePropagation();
+                               
canvasScrollerInstance.viewport.verticalScrollPosition  -= e.delta * 5;
+                       }
+                       
+                       protected function drawGrid(sprite:Sprite):void {
+                var x:int = 0;
+                var y:int = 0;
+                
+                sprite.graphics.clear();
+                
+                // draw the background
+                sprite.graphics.beginFill(0xFFFFFF);
+                sprite.graphics.drawRect(0, 0, sprite.width, sprite.height);
+                sprite.graphics.endFill();
+                
+                sprite.graphics.lineStyle(0.5, 0x000000, 0.2);
+                
+                // draw the vertical lines
+                while (x <= sprite.width) {
+                    sprite.graphics.moveTo(x, 0);
+                    sprite.graphics.lineTo(x, sprite.height);
+                    x = x + 20;
+                }
+                
+                // draw the horizontal lines
+                while (y <= sprite.height) {
+                    sprite.graphics.moveTo(0, y);
+                    sprite.graphics.lineTo(sprite.width, y);
+                    y = y + 20;
+                }
+            }
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               <!--<s:Fade id="fadeInBusy" 
+                               alphaTo="1" 
+                               target="{busyIndicator}"
+                               effectStart="busyIndicator.visible=true"
+                               effectEnd="busyIndicator.visible=true"/>
+               <s:Fade id="fadeOutBusy" 
+                               alphaTo="0" 
+                               target="{busyIndicator}" 
+                               effectStart="busyIndicator.visible=true"
+                               effectEnd="busyIndicator.visible=false"/>-->
+               
+               <fx:XML id="testModel" xmlns="">
+                       <mx:MXML >
+                               <s:Group x="15" y="50">
+                               <s:Button label="Hello World" x="20" y="20" 
color="#ff0000"/>
+                               </s:Group >
+                       </mx:MXML>
+               </fx:XML>
+       </fx:Declarations>
+       
+       
+       
+       <s:Rect id="backgroundRect" width="100%" height="100%">
+               <s:fill>
+                       <s:SolidColor color="#666666"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:Rect width="20" height="20">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       
+       <s:Scroller id="canvasScrollerInstance" 
+                               left="20" 
+                               right="0" 
+                               top="20" 
+                               bottom="0" 
+                               width="100%"
+                               height="100%"
+                               resize="scroller_resizeHandler(event)"
+                               interactionMode="mouse"
+                               
creationComplete="canvasScrollerInstance_creationCompleteHandler(event)"
+                               >
+               
+               <!--- why two containers around this? reasons below -->
+               <!--
+               
+                       // clicked on background area
+                       if (target==canvasBackground || 
target==canvasBackgroundParent) {
+                               radiate.setTarget(targetApplication, true);
+               -->
+               
+               <!--- 
+               This first group is sized by the Scroller. 
+               The scroller automatically sets this group, the viewport, to 
100%
+               -->
+               <s:Group id="canvasBackgroundParent"
+                                width="100%"
+                                height="100%" >
+                       
+                       
+                       <!---
+                       This second group is to provide padding to the top and 
bottom of the document 
+                       and to receive any mouse events such as zoom in and out.
+                       
+                       It gets sized to the canvas size plus the padding 
value. 
+                       
+                       It may also be used for skinning with different 
devices. 
+                       -->
+                       <s:BorderContainer id="canvasBackgroundInstance"
+                                                          borderVisible="false"
+                                                          backgroundAlpha="0"
+                                                          >
+                               
+                       
+                               <!--- 
+                               This third group is to mask application content.
+                               Without it the application or the application's 
system manager
+                               may bleed over. 
+                               -->
+                               <s:BorderContainer id="canvasBorderInstance" 
+                                                verticalCenter="0"
+                                                horizontalCenter="0"
+                                                backgroundAlpha="0"
+                                                borderVisible="false"
+                                                visible="false"
+                                                
resize="canvasBorder_resizeHandler(event)">
+                               
+                               <!--<s:SkinnableContainer id="canvasBorder"
+                                                                         
verticalCenter="0"
+                                                                         
horizontalCenter="0"
+                                                                         
visible="false"
+                                                                         
backgroundAlpha="1"
+                                                                         
skinClass="com.flexcapacitor.skins.DeviceSkin"
+                                                                         >-->
+                                       
+                               
+                                       <!--- 
+                                       This group contains the system manager 
and the blank application
+                                       -->
+                                       <s:SWFLoader id="projectLoader" 
+                                                                
resize="projectLoader_resizeHandler(event)"
+                                                                
complete="project_completeHandler(event)"
+                                                                
httpStatus="project_httpStatusHandler(event)"
+                                                                
init="project_initHandler(event)"
+                                                                
ioError="project_ioErrorHandler(event)"
+                                                                
open="project_openHandler(event)"
+                                                                
progress="project_progressHandler(event)"
+                                                                
securityError="project_securityErrorHandler(event)"
+                                                                
unload="project_unloadHandler(event)"/>
+                               
+                                       <!--- 
+                                       This group is used to add visual 
elements above the application.
+                                       For example, selection and resizing 
borders. 
+                                       -->
+                                       <s:Group id="toolLayerInstance" 
+                                                        mouseChildren="false" 
+                                                        mouseEnabled="false">
+                                               
+                                       </s:Group>
+                               
+                               </s:BorderContainer>
+                               <!--</s:SkinnableContainer>-->
+                       </s:BorderContainer>
+               </s:Group>
+       </s:Scroller>
+       
+       <s:Label id="loadingLabel" color="#ffffff" text="Loading. Please 
wait..." 
+                        fontWeight="bold" horizontalCenter="0" 
verticalCenter="0"/>
+       
+       <s:Group id="scrollerCornerButton" 
+                        width="16" height="16" right="0" bottom="0"
+                        click="scrollerCornerButton_clickHandler(event)">
+               <s:Rect width="100%"
+                               height="100%"
+                               alpha="0"
+                               
visible="{canvasScroller.verticalScrollBar.visible &amp;&amp; 
canvasScroller.horizontalScrollBar.visible}"
+                               >
+                       <s:fill>
+                               <s:SolidColor color="#000000"/>
+                       </s:fill>
+               </s:Rect>
+       </s:Group>
+       
+       
+       <!-- alternatives to ruler component -->
+       <s:Rect left="20" width="100%" height="20">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:Rect top="20" width="20" height="100%">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       <!--<components:Ruler left="20" width="100%" height="20"/>
+       
+       <components:Ruler top="20" width="20" height="100%" 
direction="vertical"/>-->
+       
+       <!--<s:BusyIndicator id="busyIndicator" right="20" top="10" 
symbolColor="white"/>-->
+       
+       
+</s:Group>

http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/components/IDocumentContainer.as
----------------------------------------------------------------------
diff --git 
a/Radii8Library/src/com/flexcapacitor/components/IDocumentContainer.as 
b/Radii8Library/src/com/flexcapacitor/components/IDocumentContainer.as
new file mode 100644
index 0000000..32e32c3
--- /dev/null
+++ b/Radii8Library/src/com/flexcapacitor/components/IDocumentContainer.as
@@ -0,0 +1,87 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+package com.flexcapacitor.components {
+       import com.flexcapacitor.model.IDocument;
+       import com.flexcapacitor.utils.supportClasses.ComponentDescription;
+       
+       import mx.core.IVisualElementContainer;
+       
+       import spark.components.Scroller;
+       
+       
+       /**
+        * An interface for the different types of documents. 
+        * */
+       public interface IDocumentContainer {
+
+               /**
+                * The root component description for this document.
+                * */
+               function get componentDescription():ComponentDescription;
+               
+               /**
+                * @private
+                * */
+               function set 
componentDescription(value:ComponentDescription):void;
+               
+               /**
+                * Parses the code
+                * */
+               /*function parseDocument(code:String):Boolean;*/
+               
+               /**
+                * Imports code 
+                * */
+               function importDocument(code:String):Boolean;
+               
+               /**
+                * Reference to the document. Named documentDescription since
+                * document is already a property on UIComponent.
+                * */
+               function set iDocument(value:IDocument):void;
+               function get iDocument():IDocument;
+               
+               /**
+                * Reference to the tool layer.
+                * */
+               function set toolLayer(value:IVisualElementContainer):void;
+               function get toolLayer():IVisualElementContainer;
+               
+               /**
+                * Reference to the canvas border.
+                * */
+               function set canvasBorder(value:IVisualElementContainer):void;
+               function get canvasBorder():IVisualElementContainer;
+               
+               /**
+                * Reference to the canvas background.
+                * */
+               function set 
canvasBackground(value:IVisualElementContainer):void;
+               function get canvasBackground():IVisualElementContainer;
+               
+               /**
+                * Reference to the canvas scroller.
+                * */
+               function set canvasScroller(value:Scroller):void;
+               function get canvasScroller():Scroller;
+               
+               
+       }
+}
\ No newline at end of file

Reply via email to