http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/DropShadowFilter.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/DropShadowFilter.mxml b/Radii8Library/src/com/flexcapacitor/views/DropShadowFilter.mxml new file mode 100644 index 0000000..71d2737 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/DropShadowFilter.mxml @@ -0,0 +1,1316 @@ +<?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:fc="com.flexcapacitor.controls.*" + xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:local="*" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark" + width="100%" + xmlns:utils="com.flexcapacitor.utils.*" + xmlns:handlers="com.flexcapacitor.handlers.*" + xmlns:supportClasses="com.flexcapacitor.effects.supportClasses.*" + creationComplete="group1_creationCompleteHandler(event)" > + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + import com.flexcapacitor.utils.InspectorUtils; + import com.flexcapacitor.utils.TypeUtils; + + import mx.collections.ArrayList; + import mx.core.IVisualElement; + import mx.core.UIComponent; + import mx.events.FlexEvent; + import mx.managers.SystemManager; + + import spark.components.Image; + import spark.components.supportClasses.GroupBase; + import spark.primitives.BitmapImage; + + public static const BASELINE:String = "baseline"; + public static const BOTTOM:String = "bottom"; + public static const HORIZONTAL_CENTER:String = "horizontalCenter"; + public static const LEFT:String = "left"; + + public static const PERCENT_HEIGHT:String = "percentHeight"; + public static const PERCENT_WIDTH:String = "percentWidth"; + public static const RIGHT:String = "right"; + public static const TOP:String = "top"; + public static const VERTICAL_CENTER:String = "verticalCenter"; + + public static const X:String = "x"; + public static const Y:String = "y"; + + [Bindable] + public var targetActualHeight:Number; + + [Bindable] + public var targetActualWidth:Number; + + [Bindable] + public var targetBottom:Number; + + [Bindable] + public var targetHeight:Number; + + [Bindable] + public var targetHorizontal:Number; + + [Bindable] + public var targetLeft:Number; + + [Bindable] + public var targetPercentHeight:Number; + + [Bindable] + public var targetPercentWidth:Number; + + [Bindable] + public var targetRight:Number; + + [Bindable] + public var targetTop:Number; + + [Bindable] + public var targetVertical:Number; + + [Bindable] + public var targetWidth:Number; + + [Bindable] + public var targetX:Number; + + [Bindable] + public var targetY:Number; + + + private var _target:DisplayObject; + private var _visualElement:IVisualElement; + + [Bindable] + public var isVisualElement:Boolean; + + /** + * Clears the target dimension variables which updates any element + * bound to them + * */ + public function clearTargetDimensions():void { + + if (_target) { + if (target is SystemManager) { + target.removeEventListener(Event.RESIZE, updateTargetOutline); + } + else { + _target.removeEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline); + if (_target.parent) { + _target.parent.removeEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline); + } + } + InspectorUtils.clearSelection(_target, systemManager); + } + + targetWidth = undefined; + targetHeight = undefined; + targetX = undefined; + targetY = undefined; + + targetTop = undefined; + targetBottom = undefined; + targetLeft = undefined; + targetRight = undefined; + targetVertical = undefined; + targetHorizontal = undefined; + targetPercentWidth = undefined; + targetPercentHeight = undefined; + + } + + /** + * Gets the current properties of the target and updates the properties inspector + * with those values + * */ + public function initializeProperties():void { + var bitmap:BitmapImage; + var image:Image; + + if (isVisualElement) { + constraintsContainer.enabled = true; + + // get constraints + targetTop = Number(element.top); + targetBottom = Number(element.bottom); + targetLeft = Number(element.left); + targetRight = Number(element.right); + targetVertical = Number(element.verticalCenter); + targetHorizontal = Number(element.horizontalCenter); + targetPercentWidth = Number(element.percentWidth); + targetPercentHeight = Number(element.percentHeight); + } + else { + constraintsContainer.enabled = false; + } + + if (target.width == 0 || target.height == 0) { + + if (target is BitmapImage) { + bitmap = BitmapImage(target); + targetWidth = bitmap.sourceWidth; + targetHeight = bitmap.sourceHeight; + targetActualWidth = bitmap.sourceWidth; + targetActualHeight = bitmap.sourceHeight; + } + else if (target is Image) { + image = Image(target); + targetWidth = image.sourceWidth; + targetHeight = image.sourceHeight; + targetActualWidth = image.sourceWidth; + targetActualHeight = image.sourceHeight; + } + } + else { + targetWidth = target.width; + targetHeight = target.height; + } + + targetX = target.x; + targetY = target.y; + + if (target is SystemManager) { + target.addEventListener(Event.RESIZE, updateTargetOutline, false, 0, true); + } + else { + target.addEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline, false, 0, true); + if (target.parent) { + target.parent.addEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline, false, 0, true); + } + } + + updateTargetDimensionsLayout(); + + } + + public function get target():Object { + return _target; + } + + public function get element():IVisualElement { + return _visualElement; + } + + [Bindable] + public function set target(value:Object):void { + + if (!(value is DisplayObject)) { + _target = null; + clearForm(); + clearTargetDimensions(); + return; + } + + clearForm(); + clearTargetDimensions(); + + _target = value as DisplayObject; + + if (value is IVisualElement) { + isVisualElement = true; + _visualElement = IVisualElement(value); + } + else { + isVisualElement = false; + _visualElement = undefined; + } + + if (value) { + initializeProperties(); + } + + updateTargetDimensionsLayout(); + + } + + public function update():void { + updateTargetDimensionsLayout(); + } + + /** + * Updates the target dimension layout inspector + * */ + public function updateTargetDimensionsLayout():void { + + // check if the layout panel has been created yet + if (target == null) { + return; + } + + // if target is a container we show the layout options + if (target is GroupBase) { + var layoutName:String = flash.utils.getQualifiedClassName(GroupBase(target).layout); + + for each (var item:Object in ArrayList(layoutLayoutComboBox.dataProvider).source) { + if (item.label == layoutName) { + layoutLayoutComboBox.selectedItem = item; + } + } + } + + // new values aren't always committed on the same frame + if (target.parent is UIComponent) { + UIComponent(target.parent).validateNow(); + } + else if (target is UIComponent) { + UIComponent(target).validateNow(); + } + + updateView(); + //callLater(updateView); + + } + + public function updateView():void { + + // update UI + updateXProperty(); + updateYProperty(); + + updateTopConstraint(); + updateBottomConstraint(); + updateLeftConstraint(); + updateRightConstraint(); + + updateHorizontalCenterConstraint(); + updateVerticalCenterConstraint(); + + updateWidthProperty(); + updateHeightProperty(); + + updateVisibleControls(); + + updateTargetOutline(); + + visibleCheckbox.selected = target.visible; + } + + protected function applyPropertiesToTargetHandler(event:Event):void { + if (event.currentTarget is ComboBox && event.currentTarget.selectedIndex != -1) { + TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.selectedItem.name, event.currentTarget.selectedItem.label, event.currentTarget.selectedItem.type); + } + + if (event.currentTarget is TextInput) { + TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.name, event.currentTarget.text); + } + + if (event.currentTarget is CheckBox) { + var value:Boolean = event.currentTarget.selected; + TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.name, value, "Boolean"); + } + + updateTargetDimensionsLayout(); + } + + + /** + * Handles when a constraint checkbox is enabled or disabled + * */ + protected function constraintHandler(event:Event):void { + var enabled:Boolean = event.currentTarget.selected; + var constraint:String = event.currentTarget.id; + + constraint = constraint.split("Constraint")[0]; + + if (isVisualElement) { + if (enabled) { + convertToConstraint(constraint); + } + else { + convertFromConstraint(constraint); + } + } + } + + /** + * Convert constraint to property + * */ + protected function convertFromConstraint(constraint:String):void { + var focusComponent:UIComponent; + var enabled:Boolean = false; + var value:Object; + + // convert Right to X + if (constraint == RIGHT) { + element.right = undefined; // relying on flex + rightText.text = ""; + focusComponent = xText; + } + + // convert from Left to X + else if (constraint == LEFT) { + element.left = undefined; + leftText.text = ""; + focusComponent = xText; + } + + // convert from Bottom to Y + else if (constraint == BOTTOM) { + element.bottom = undefined; + bottomText.text = ""; + focusComponent = yText; + } + + // convert from Top to Y + if (constraint == TOP) { + element.top = undefined; + topText.text = ""; + focusComponent = yText; + } + + // convert from Vertical Center to Y + if (constraint == VERTICAL_CENTER) { + element.verticalCenter = undefined; + verticalCenterText.text = ""; + focusComponent = yText; + } + + // convert from Horizontal Center to X + if (constraint == HORIZONTAL_CENTER) { + value = Object(element.horizontalCenter); + element.horizontalCenter = undefined; + horizontalCenterText.text = ""; + value = String(target.parent.width / 2 - target.width / 2 + Number(value)); + target.x = Number(value); + focusComponent = xText; + } + + // convert from Baseline to Y + if (constraint == BASELINE) { + element.baseline = undefined; + value = String(target.y); + baselineText.text = ""; + focusComponent = yText; + } + + + // not sure of way to validate an IVisualElement + updateTargetDimensionsLayout(); + callLater(focusComponent.setFocus); + } + + /** + * Convert property value to constraint value + * NOTE: Does not take into account all options - could be incorrect + * */ + protected function convertToConstraint(constraint:String):void { + var value:String; + var enabled:Boolean = true; + var focusComponent:UIComponent; + + // convert from X to Right + if (constraint == RIGHT) { + value = String(Number(target.parent.width) - Number(target.width) - Number(target.x)); + focusComponent = rightText; + } + + // convert from X to Left + else if (constraint == LEFT) { + value = String(target.x); + focusComponent = leftText; + } + + // convert from Y to Bottom + else if (constraint == BOTTOM) { + value = String(Number(target.parent.height) - Number(target.height) - Number(target.y)); + focusComponent = bottomText; + } + + // convert from Y to Top + else if (constraint == TOP) { + value = String(target.y); + focusComponent = topText; + } + + // convert from Y to Vertical Center + else if (constraint == VERTICAL_CENTER) { + value = String(target.y - target.parent.height / 2 + target.height / 2); + focusComponent = verticalCenterText; + } + + // convert from X to Horizontal Center + else if (constraint == HORIZONTAL_CENTER) { + value = String(target.x - target.parent.width / 2 + target.width / 2); + focusComponent = horizontalCenterText; + } + + // convert from Y to Baseline + else if (constraint == BASELINE) { + value = String(target.y); + focusComponent = rightText; + } + + // not sure of way to validate an IVisualElement + target[constraint] = value; + updateTargetDimensionsLayout(); + callLater(focusComponent.setFocus); + + // we may need to take into account width and height and percentages + } + + /** + * Displays height value taking into account percent height + * */ + protected function displayCorrectHeight():void { + var isPercentHeight:Boolean; + + if (isVisualElement) { + isPercentHeight = Boolean(element.percentHeight); + } + + if (isPercentHeight) { + heightText.text = String(element.percentHeight) + "%"; + } + else { + heightText.text = String(target.height); + } + } + + /** + * Displays width value taking into account percent width + * */ + protected function displayCorrectWidth():void { + var isPercentWidth:Boolean; + + if (isVisualElement) { + isPercentWidth = Boolean(element.percentWidth); + } + + if (isPercentWidth) { + widthText.text = String(element.percentWidth) + "%"; + } + else { + widthText.text = String(target.width); + } + } + + /** + * Casts the value to the correct type + * NOTE: May not work for colors + * Also supports casting to specific class. use ClassDefinition as type + * returns instance of flash.utils.getDefinitionByName(className) + * */ + protected function getCorrectType(value:String, type:String):* { + if (type == "Boolean" && value.toLowerCase() == "false") { + return false; + } + else if (type == "Boolean" && value.toLowerCase() == "true") { + return true; + } + else if (type == "Number") { + if (value == null || value == "") { + return undefined + }; + return Number(value); + } + else if (type == "int") { + if (value == null || value == "") { + return undefined + }; + return int(value); + } + else if (type == "String") { + return String(value); + } + // TODO: Return color type + else if (type == "Color") { + return String(value); + } + else if (type == "ClassDefinition") { + if (value) { + var ClassDefinition:Class = flash.utils.getDefinitionByName(value) as Class; + return new ClassDefinition(); + } + return new Object(); + } + else { + return value; + } + } + + /** + * Returns true if left, right or horizontalCenter is set + * */ + protected function get hasHorizontalConstraints():Boolean { + var hasConstraints:Boolean; + + if (isVisualElement && (element.left || element.right || element.horizontalCenter)) { + hasConstraints = true; + } + + return hasConstraints; + } + + /** + * Returns true if top, bottom, verticalCenter or baseline is set + * */ + protected function get hasVerticalConstraints():Boolean { + var hasConstraints:Boolean; + + if (isVisualElement && (element.top || element.bottom || element.verticalCenter || element.baseline)) { + hasConstraints = true; + } + + return hasConstraints; + } + + /** + * Selects all the text in the text field + * */ + protected function selectInputText(event:Event):void { + TextInput(event.currentTarget).selectAll(); + } + + /** + * Sets the baseline constraint + * */ + protected function setBaselineConstraint(value:Object):void { + element.baseline = value ? value : undefined; + } + + /** + * Sets the bottom constraint + * */ + protected function setBottomConstraint(value:Object):void { + element.bottom = value ? value : undefined; + } + + /** + * Sets the horizontal center constraint + * */ + protected function setHorizontalCenterConstraint(value:Object):void { + element.horizontalCenter = value ? value : undefined; + } + + /** + * Sets the left constraint + * */ + protected function setLeftConstraint(value:Object):void { + element.left = value ? value : undefined; + } + + /** + * Sets the right constraint + * */ + protected function setRightConstraint(value:Object):void { + element.right = value ? value : undefined; + } + + /** + * Sets the top constraint + * */ + protected function setTopConstraint(value:Object):void { + element.top = value ? value : undefined; + } + + /** + * Sets the vertical center constraint + * */ + protected function setVerticalCenterConstraint(value:Object):void { + element.verticalCenter = value ? value : undefined; + } + + /** + * Updates the display with the value of the baseline position + * */ + protected function updateBaselineConstraint():void { + var baselineValue:Object; + + if (!isVisualElement) { + baselineText.text = ""; + return; + } + + baselineValue = element.baseline; + + /** + * If baseline is set then set Y to nothing + * If baseline and bottom are set then set height to nothing + * If verticalCenter is set then set baseline to nothing + * Otherwise set baseline to nothing + * */ + if (baselineValue) { + baselineText.text = String(baselineValue); + + // baseline is set so do not display Y + yText.text = ""; + } + else { + baselineText.text = ""; + } + + } + + /** + * Updates the display with the value of the bottom position + * */ + protected function updateBottomConstraint():void { + var bottomValue:Object; + + if (!isVisualElement) { + bottomText.text = ""; + return; + } + + bottomValue = element.bottom; + + /** + * If bottom is set then set Y to nothing + * If bottom and bottom are set then set height to nothing + * If verticalCenter is set then set bottom to nothing + * Otherwise set bottom to nothing + * */ + if (bottomValue) { + bottomText.text = String(bottomValue); + + // if top and bottom are set then hide height + if (element.top) { + heightText.text = ""; + } + + // bottom is set so do not display Y + yText.text = ""; + } + else { + bottomText.text = ""; + } + + } + + /** + * Updates the display with the value of the height + * */ + protected function updateHeightProperty():void { + var isPercentHeight:Boolean; + + /** + * If visual element and top is set and bottom is set then do not display height + * */ + if (isVisualElement && element.top != null && element.bottom != null) { + heightText.text = ""; + } + else { + displayCorrectHeight(); + } + } + + /** + * Updates the display with the value of the left constraint + * */ + protected function updateHorizontalCenterConstraint():void { + var value:String; + var horizontalCenterValue:Object; + + if (!isVisualElement) { + horizontalCenterText.text = ""; + return; + } + + horizontalCenterValue = element.horizontalCenter; + + /** + * If left is set then set x to nothing + * If left and right are set then set width to nothing + * If horizontalCenter is set than set left and right to nothing + * Otherwise set left to nothing + * */ + if (horizontalCenterValue) { + horizontalCenterText.text = String(horizontalCenterValue); + + // left is set so do not display X + xText.text = ""; + } + else { + horizontalCenterText.text = ""; + } + + } + + /** + * Updates the display with the value of the left constraint + * */ + protected function updateLeftConstraint():void { + var value:String; + var leftValue:Object; + + if (!isVisualElement) { + leftText.text = ""; + return; + } + + leftValue = element.left; + + /** + * If left is set then set x to nothing + * If left and right are set then set width to nothing + * If horizontalCenter is set than set left and right to nothing + * Otherwise set left to nothing + * */ + if (leftValue) { + leftText.text = String(leftValue); + + // if left and right are set then hide width + if (element.right) { + widthText.text = ""; + } + + // left is set so do not display X + xText.text = ""; + } + else { + leftText.text = ""; + } + + } + + /** + * Updates the display with the value of the right position + * */ + protected function updateRightConstraint():void { + var value:String; + var rightValue:Object; + + if (!isVisualElement) { + rightText.text = ""; + return; + } + + rightValue = element.right; + + /** + * If horizontalCenter is set then set right to nothing + * If left and right are set then set width to nothing + * If horizontalCenter is set than set left and right to nothing + * Otherwise set right to nothing + * */ + if (rightValue) { + rightText.text = String(rightValue); + + // if left and right are set then hide width + if (element.left) { + widthText.text = ""; + } + + // right is set so do not display X + xText.text = ""; + } + else { + rightText.text = ""; + } + + } + + /** + * Updates the display with the value of the top position + * */ + protected function updateTopConstraint():void { + var value:String; + var topValue:Object; + + if (!isVisualElement) { + topText.text = ""; + return; + } + + topValue = element.top; + + /** + * If top is set then set Y to nothing + * If top and bottom are set then set height to nothing + * If verticalCenter is set then set top to nothing + * Otherwise set top to nothing + * */ + if (topValue != null) { + topText.text = String(topValue); + + // if top and bottom are set then do not display height + if (element.bottom) { + heightText.text = ""; + } + + // top is set so do not display Y + yText.text = ""; + } + else { + topText.text = ""; + } + + } + + /** + * Updates the display with the value of the vertical center position + * */ + protected function updateVerticalCenterConstraint():void { + var verticalCenterValue:Object; + + if (!isVisualElement) { + verticalCenterText.text = ""; + return; + } + + verticalCenterValue = element.verticalCenter; + + if (verticalCenterValue) { + verticalCenterText.text = String(verticalCenterValue); + + // vertical center is set so do not display Y + yText.text = ""; + } + else { + verticalCenterText.text = ""; + } + + } + + /** + * Updates the visibility of the outline in the contraint box + * */ + public function updateTargetOutline(event:Event=null):void { + InspectorUtils.drawSelection(target, systemManager); + } + + /** + * Updates the visibility of the rulers and text boxes in the contraints container + * and checks or unchecks the constraint checkboxes + * */ + protected function updateVisibleControls():void { + var visible:Boolean = true; + + topConstraint.selected = topRule.visible = topText.visible = (isVisualElement && element.top != null) ? visible : !visible; + + rightConstraint.selected = bottomRule.visible = bottomText.visible = (isVisualElement && element.bottom != null) ? visible : !visible; + + leftConstraint.selected = leftRule.visible = leftText.visible = (isVisualElement && element.left != null) ? visible : !visible; + + rightConstraint.selected = rightRule.visible = rightText.visible = (isVisualElement && element.right != null) ? visible : !visible; + + horizontalCenterConstraint.selected = horizontalCenterRule.visible = horizontalCenterText.visible = (isVisualElement && element.horizontalCenter != null) ? visible : !visible; + + verticalCenterConstraint.selected = verticalCenterRule.visible = verticalCenterText.visible = (isVisualElement && element.verticalCenter != null) ? visible : !visible; + + baselineConstraint.selected = baselineRule.visible = baselineText.visible = (isVisualElement && element.baseline != null) ? visible : !visible; + + // this throws an error, element is null, when target is system manager + // we should disable constraints if not supported + copyConstraints(constrainedTarget, element, 0); + } + + protected function copyConstraints(target:IVisualElement, source:IVisualElement, setValue:Object=null):void { + setValue = setValue!=null ? 1 : setValue; + + // this throws an error when target is system manager + // we should disable constraints if not supported + if (element == null) return; + + target.top = (element.top != null) ? setValue || element.top : undefined; + + target.bottom = (element.bottom != null) ? setValue || element.bottom : undefined; + + target.left = (element.left != null) ? setValue || element.left : undefined; + + target.right = (element.right != null) ? setValue || element.right : undefined; + + target.horizontalCenter = (element.horizontalCenter != null) ? setValue || element.horizontalCenter : undefined; + + target.verticalCenter = (element.verticalCenter != null) ? setValue || element.verticalCenter : undefined; + + target.baseline = (element.baseline != null) ? setValue || element.baseline : undefined; + + } + + /** + * Updates the display with the value of the width + * */ + protected function updateWidthProperty():void { + var isPercentWidth:Boolean; + + /** + * If left is set and right is set then set to nothing + * */ + if (isVisualElement && element.left != null && element.right != null) { + widthText.text = ""; + } + else { + displayCorrectWidth(); + } + } + + /** + * Updates the displayed with the value of the X position + * */ + protected function updateXProperty():void { + + /** + * If horizontalCenter is set then set to nothing + * If left is set then set to nothing + * If right is set then set to nothing + * */ + if (hasHorizontalConstraints) { + xText.text = ""; + } + else { + xText.text = String(target.x); + } + } + + /** + * Updates the display with the value of the Y position + * */ + protected function updateYProperty():void { + + /** + * If verticalCenter is set then set to nothing + * If top is set then set to nothing + * If bottom is set then set to nothing + * + * if int is 0 will it return false? if (target.top) vs if (target.top!=null) + * */ + if (hasVerticalConstraints) { + // hide Y text + yText.text = ""; + } + else { + yText.text = String(target.y); + } + + } + + public function clearForm():void { + xText.text = ""; + yText.text = ""; + + topText.text = ""; + leftText.text = ""; + rightText.text = ""; + bottomText.text = ""; + + topConstraint.selected = false; + leftConstraint.selected = false; + rightConstraint.selected = false; + bottomConstraint.selected = false; + + widthText.text = ""; + heightText.text = ""; + + xText.text = ""; + xText.text = ""; + xText.text = ""; + xText.text = ""; + xText.text = ""; + xText.text = ""; + xText.text = ""; + + visibleCheckbox.selected = false; + } + + public var radiate:Radiate = Radiate.instance; + protected function group1_creationCompleteHandler(event:FlexEvent):void { + radiate.addEventListener(RadiateEvent.TARGET_CHANGE, targetChangeHandler); + } + + protected function targetChangeHandler(event:RadiateEvent):void { + target = event.selectedItem; + } + + ]]> + </fx:Script> + + <fx:Declarations> + <handlers:EventHandler eventName="{FlexEvent.ENTER}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="enterHandler"> + <supportClasses:ActionEffect > + <supportClasses:effectStart> + <![CDATA[ + applyPropertiesToTargetHandler(enterHandler.event); + //EffectEvent(event).effectInstance.finish(); + ]]> + </supportClasses:effectStart> + </supportClasses:ActionEffect> + </handlers:EventHandler> + + <handlers:EventHandler eventName="{FocusEvent.FOCUS_IN}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="focusInEventHandler"> + + <supportClasses:ActionEffect > + <supportClasses:effectStart> + <![CDATA[ + selectInputText(focusInEventHandler.event); + ]]> + </supportClasses:effectStart> + </supportClasses:ActionEffect> + </handlers:EventHandler> + + + <handlers:EventHandler eventName="{MouseEvent.CLICK}" + targets="{[ + leftConstraint, + rightConstraint, + bottomConstraint, + topConstraint, + baselineConstraint, + horizontalCenterConstraint, + verticalCenterConstraint]}" + keepEvent="true" + id="clickHandler"> + + <supportClasses:ActionEffect > + <supportClasses:effectStart> + <![CDATA[ + constraintHandler(clickHandler.event); + ]]> + </supportClasses:effectStart> + </supportClasses:ActionEffect> + + </handlers:EventHandler> + + <s:SolidColorStroke id="stroke1" weight="1" color="#00AA00"/> + + </fx:Declarations> + + <!-- POSITIONING --> + <s:Group horizontalCenter="0" y="60"> + <s:TextInput id="heightText" + width="50" x="154" y="0" + name="height:Number"/> + <s:TextInput id="yText" + width="50" x="154" y="35" + name="y:Number"/> + <s:TextInput id="xText" + width="50" x="45" y="35" + name="x:Number"/> + <s:TextInput id="widthText" + width="50" x="44" y="0" + name="width:Number"/> + <s:RichText text="Height:" x="110" y="7" + tabFocusEnabled="false"/> + <s:RichText text="Width:" x="2" y="7" + tabFocusEnabled="false"/> + <s:RichText text="X:" x="26" y="42" + tabFocusEnabled="false"/> + <s:RichText text="Y:" x="138" y="42" + tabFocusEnabled="false"/> + </s:Group> + + + <!-- CONSTRAINTS PANEL --> + <s:BorderContainer id="constraintsContainer" + horizontalCenter="0" + y="149" + borderVisible="false"> + + <!-- CONSTRAINTS --> + <s:TextInput id="topText" + width="40" x="205" y="47" + name="top:style"/> + <s:TextInput id="verticalCenterText" + width="40" x="205" y="95" + name="verticalCenter:style"/> + <s:TextInput id="bottomText" + width="40" x="205" y="143" + name="bottom:style"/> + <s:TextInput id="baselineText" + width="40" x="205" y="165" + name="baseline:style"/> + + <s:TextInput id="rightText" + width="40" x="147" y="189" + name="right:style"/> + <s:TextInput id="horizontalCenterText" + width="40" x="99" y="189" + name="horizontalCenter:style"/> + <s:TextInput id="leftText" + width="40" x="50" y="189" + name="left:style"/> + + <s:CheckBox id="leftConstraint" + toolTip="Left" + x="64" y="8"/> + <s:CheckBox id="horizontalCenterConstraint" + toolTip="Horizontal Center" + x="114" y="8"/> + <s:CheckBox id="bottomConstraint" + toolTip="Bottom" + x="23" y="145"/> + <s:CheckBox id="topConstraint" + toolTip="Top" + x="23" y="48"/> + <s:CheckBox id="verticalCenterConstraint" + toolTip="Vertical Center" + x="23" y="97"/> + <s:CheckBox id="rightConstraint" + toolTip="Right" + x="162" y="8"/> + <s:CheckBox id="baselineConstraint" + toolTip="Baseline" + x="23" y="165"/> + + <!-- CONSTRAINTS PANEL BOX --> + <s:BorderContainer height="150" width="150" + x="44" y="31" + borderAlpha=".4"> + + <s:BorderContainer borderColor="#9E9E9E" + height="98" width="98" + x="25" y="25" + borderVisible="true" + borderWeight="2"> + + <s:Group id="constrainedTarget" + width="40" height="20"> + + <s:Rect width="100%" height="100%" + x="0" y="0"> + <s:fill> + <s:SolidColor color="gray"/> + </s:fill> + </s:Rect> + + </s:Group> + + </s:BorderContainer> + + <!-- HORIZONTAL --> + <s:Line id="topRule" + left="0" right="0" + top="25" + width="100%" + stroke="{stroke1}" + visible="false"/> + <s:Line id="verticalCenterRule" + left="0" right="0" + width="100%" + verticalCenter="0" + stroke="{stroke1}" + visible="false"/> + <s:Line id="bottomRule" + left="0" right="0" + bottom="25" + width="100%" + stroke="{stroke1}" + visible="false"/> + <s:Line id="baselineRule" + left="0" right="0" + bottom="4" + width="100%" + stroke="{stroke1}" + visible="false"/> + + <!-- VERTICAL --> + <s:Line id="leftRule" + bottom="0" left="25" + top="0" + height="100%" + stroke="{stroke1}" + visible="false"/> + <s:Line id="horizontalCenterRule" + bottom="0" horizontalCenter="0" + top="0" + height="100%" + stroke="{stroke1}" + visible="false"/> + <s:Line id="rightRule" + bottom="0" right="25" + top="0" + height="100%" + stroke="{stroke1}" + visible="false"/> + </s:BorderContainer> + + </s:BorderContainer> + + <s:Line left="23.5" right="23.5" + y="136" alpha=".5"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Line> + + <s:Line left="23.5" right="23.5" + y="40" alpha=".5"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Line> + + <s:Label backgroundColor="#FFFFFF" horizontalCenter="0" + text="Size and Position" y="35"/> + + <s:Label backgroundColor="#FFFFFF" horizontalCenter="0" + text="Constraints" y="131"/> + + <s:CheckBox id="visibleCheckbox" + label="Visible" x="10" y="5" + click="applyPropertiesToTargetHandler(event)" + name="visible"/> + + <s:ComboBox id="layoutLayoutComboBox" + horizontalCenter="0" + visible="false" width="250" y="376" + change="applyPropertiesToTargetHandler(event)" + focusOut="applyPropertiesToTargetHandler(event)"> + <s:dataProvider> + <mx:ArrayList> + <fx:Object label="" + name="layout" type="ClassDefinition"/> + <fx:Object label="spark.layouts::BasicLayout" + name="layout" type="ClassDefinition"/> + <fx:Object label="spark.layouts::HorizontalLayout" + name="layout" type="ClassDefinition"/> + <fx:Object label="spark.layouts::TileLayout" + name="layout" type="ClassDefinition"/> + <fx:Object label="spark.layouts::VerticalLayout" + name="layout" type="ClassDefinition"/> + </mx:ArrayList> + </s:dataProvider> + </s:ComboBox> + +</s:Group>
http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/ElementInspector.as ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/ElementInspector.as b/Radii8Library/src/com/flexcapacitor/views/ElementInspector.as new file mode 100644 index 0000000..4b2d179 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/ElementInspector.as @@ -0,0 +1,222 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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. +// +//////////////////////////////////////////////////////////////////////////////// +/** + * Allows you to inspect your application at runtime. Press CMD + SHIFT + I to enable + * It will also appear in the context menu as Inspect. This is disabled by default. + * + * + * + * + * + * + * + * + * + * */ +package com.flexcapacitor.views { + import com.flexcapacitor.views.ElementInspectorGroup; + + import flash.display.DisplayObject; + import flash.display.InteractiveObject; + import flash.events.ContextMenuEvent; + import flash.events.Event; + import flash.events.KeyboardEvent; + import flash.events.MouseEvent; + import flash.system.Capabilities; + import flash.ui.ContextMenu; + import flash.ui.ContextMenuItem; + import flash.ui.Keyboard; + + import mx.core.FlexGlobals; + import mx.events.FlexEvent; + import mx.managers.PopUpManager; + import mx.managers.SystemManager; + + public class ElementInspector { + private var systemManager:SystemManager; + private var _currItem:InteractiveObject; + private var _clonedEvent:MouseEvent; + private var created:Boolean; + private var application:Object; + private var menuItem:ContextMenuItem = new ContextMenuItem(""); + + public var enableInReleaseSWF:Boolean; + + public var enable:Boolean = true; + + public var currentTarget:Object; + + public var currentCaptureTarget:Object; + + /** + * A comma separated list of sites that inspector will be enabled on + * Default is "http://localhost"; + * */ + public var enabledSites:String = "http://localhost";; + + public var showInContextMenu:Boolean = true; + + [Bindable] + public var menu:ContextMenu = new ContextMenu(); + + public var showNewPanel:Boolean = true; + + private var elementInspectorWindow:ElementInspectorGroup; + + private var isDebugPlayer:Boolean; + + // assume it is debug + private var isDebugSWF:Boolean; + + public function ElementInspector() { + + + if (!enable) { + return; + } + + // disable in non debug swfs - NOT ENABLED + isDebugPlayer = flash.system.Capabilities.isDebugger; + + application = FlexGlobals.topLevelApplication; + + if (!application.initialized) { + application.addEventListener(FlexEvent.APPLICATION_COMPLETE, setupMouseManager, false, 0, true); + } + else { + setupMouseManager(null); + } + + } + + // gets item mouse is over + private function setupMouseManager(event:FlexEvent):void { + var sites:Array = enabledSites.split(","); + var url:String = application.url; + var siteFound:Boolean = false; + + // search through sites specified to enable or disable inspector + for (var i:int = 0; i < sites.length; i++) { + if (url.indexOf(sites[i]) != -1) { + siteFound = true; + } + } + + if (enabledSites == "" || enabledSites == null) { + // return + } + + // disable for sites not specified + if (enabledSites!="*" && enabledSites != "" + && enabledSites != null && !siteFound) { + return; + } + + + if (!enable) { + return; + } + + // Check code https://gist.github.com/596639 + + // disable in non debug swfs + /*if (!enableInReleaseSWF) { + if (!isDebugSWF) { + return; + } + }*/ + + + application = FlexGlobals.topLevelApplication; + application.removeEventListener(FlexEvent.APPLICATION_COMPLETE, setupMouseManager); + + if (showInContextMenu) { + menu = new ContextMenu(); + menu.addEventListener(ContextMenuEvent.MENU_SELECT, menuSelect, false, 0, false); + if (application.contextMenu == null) { + application.contextMenu = menu; + menu.hideBuiltInItems(); + } + else { + menu = application.contextMenu; + menu.addEventListener(ContextMenuEvent.MENU_SELECT, menuSelect, false, 0, false); + } + } + + created = true; + systemManager = application.systemManager; // should add to stage + systemManager.addEventListener(KeyboardEvent.KEY_DOWN, keydownHandler, false, 0, true); + + } + + private function keydownHandler(event:KeyboardEvent):void { + // 73 is I and i + if (event.keyCode == 73) { + if (event.ctrlKey) { + if (event.shiftKey) { + displayPopUp(); + } + } + } + } + + private function getItemUnderMouse(event:MouseEvent):void { + _currItem = InteractiveObject(event.target); + _clonedEvent = MouseEvent(event); + + currentTarget = event.target; + + if (event.eventPhase == 2) { + currentTarget = event.target; + } + else { + currentCaptureTarget = event.target; + } + } + + public function menuSelect(event:ContextMenuEvent):void { + + if (!menuItem.hasEventListener(ContextMenuEvent.MENU_ITEM_SELECT)) { + menuItem.caption = "Inspect"; + menuItem.separatorBefore = true; + menuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, inspectSelectedItem); + menu.customItems.push(menuItem); + } + } + + public function inspectSelectedItem(event:ContextMenuEvent):void { + //elementInspectorPanel.currentTarget = currentTarget; + displayPopUp(); + } + + public function displayPopUp():void { + if (showNewPanel) { + if (elementInspectorWindow==null) elementInspectorWindow = new ElementInspectorGroup(); + PopUpManager.addPopUp(elementInspectorWindow, DisplayObject(FlexGlobals.topLevelApplication)); + + PopUpManager.centerPopUp(elementInspectorWindow); + } + else { + //if (elementInspectorPanel==null) elementInspectorPanel = new ElementInspectorPanel(); + //PopUpManager.addPopUp(elementInspectorPanel, DisplayObject(ApplicationUtils.getInstance())); + //PopUpManager.centerPopUp(elementInspectorPanel); + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/ElementInspectorGroup.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/ElementInspectorGroup.mxml b/Radii8Library/src/com/flexcapacitor/views/ElementInspectorGroup.mxml new file mode 100644 index 0000000..14ba6df --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/ElementInspectorGroup.mxml @@ -0,0 +1,147 @@ +<?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" + width="400" height="400" + xmlns:inspectors="com.flexcapacitor.inspectors.*" + styleName="myStyle" xmlns:views="com.flexcapacitor.views.*" xmlns:panels="com.flexcapacitor.views.panels.*"> + + <fx:Style> + @namespace s "library://ns.adobe.com/flex/spark"; + @namespace mx "library://ns.adobe.com/flex/mx"; + @namespace inspectors "com.flexcapacitor.inspectors.*"; + + </fx:Style> + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.utils.InspectorUtils; + + import mx.core.FlexGlobals; + import mx.events.DragEvent; + import mx.events.FlexEvent; + import mx.events.ResizeEvent; + import mx.managers.PopUpManager; + + public function close():void { + PopUpManager.removePopUp(this); + InspectorUtils.clearSelection(target, systemManager); + } + + protected function creationCompleteHandler(event:FlexEvent):void { + + // EVENTS we need to implement or handle + // selection events - when an item is selected then we assign a new target + // highlight events - when an item is highlighted / show border we do not set target + // close - teardown event when window is removed from the screen + // targetPropertyChange - when a property is changed on the target + // - the event would have is property bindable so listeners can check if the property is bindable + // and ignore or respond accordingly. also old values and new values + // show or hide event - when a panel is hidden or shown let windows know + // (tab navigator does not dispatch hide or show when the tab is selected or deselected) + + // Nick recommended using ItemRenderers + // the advantage is that as targets change the data property is set + // dataProvider keeps an array of items + // the disadvantage is item renders are not thought of as group containers + + // Create a undo history panel to keep track of changes + // create a components panel + // add icons for the outline view + // create a styles panel + // register panels in the manager + + target = FlexGlobals.topLevelApplication; + } + + + ]]> + </fx:Script> + + <fx:Declarations> + <fx:Object id="target"/> + </fx:Declarations> + + <views:Description target="{target}" left="10" right="10" top="10"/> + + <s:Group bottom="10" left="10" right="10" top="30"> + + <!--<s:View height="100%" label="Selection" width="100%">--> + <s:Scroller height="100%" width="100%"> + <s:Group> + <s:layout> + <s:VerticalLayout/> + </s:layout> + <views:SelectionOld height="100%" width="100%"/> + </s:Group> + </s:Scroller> + <!--</s:View>--> + + <!--<s:View height="100%" label="Outline" width="100%">--> + <s:Scroller height="100%" width="100%"> + <s:Group> + <s:layout> + <s:VerticalLayout/> + </s:layout> + <!--<inspectors:Outline id="outline" height="100%" width="100%" + change="{target = event.targetItem}" + target="{target}"/>--> + </s:Group> + </s:Scroller> + <!--</s:View>--> + + <!--<s:View height="100%" label="Layout" width="100%">--> + <s:Scroller height="100%" width="100%"> + <s:Group> + <s:layout> + <s:VerticalLayout/> + </s:layout> + <panels:ConstraintsInspector id="constraints" height="100%" width="100%" + target="{target}"/> + </s:Group> + </s:Scroller> + <!--</s:View>--> + + <!--<s:View height="100%" label="Properties" width="100%">--> + <s:Scroller height="100%" width="100%"> + <s:Group> + <s:layout> + <s:VerticalLayout/> + </s:layout> + <panels:PropertyInspector height="100%" width="100%"/> + </s:Group> + </s:Scroller> + <!--</s:View>--> + + <!--<s:View height="100%" label="Statistics" width="100%">--> + <s:Scroller height="100%" width="100%"> + <s:Group> + <s:layout> + <s:VerticalLayout/> + </s:layout> + <views:Statistics height="100%" width="100%" + target="{target}"/> + </s:Group> + </s:Scroller> + <!--</s:View>--> + + </s:Group> +</s:Group> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/Example.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/Example.mxml b/Radii8Library/src/com/flexcapacitor/views/Example.mxml new file mode 100644 index 0000000..bd8519a --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/Example.mxml @@ -0,0 +1,80 @@ +<?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" + width="100%" + minHeight="20" + creationComplete="group1_creationCompleteHandler(event)"> + + <!-- Width and height should be 100%?? --> + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + + import mx.events.FlexEvent; + + private var _target:*; + + public function get target():* { + return _target; + } + + /** + * This is set automatically when a new target is selected + * This can be any type. You must disable this component if the + * type is not what you can process. + * */ + [Bindable] + public function set target(value:*):void { + + // For example, if we only want to handle DisplayObjects we check for them here + if (!(value is DisplayObject)) { + _target = null; + enabled = false; + return; + } + else { + enabled = true; + } + + _target = DisplayObject(value); + } + + private var radiate:Radiate = Radiate.instance; + + protected function group1_creationCompleteHandler(event:FlexEvent):void { + radiate.addEventListener(RadiateEvent.TARGET_CHANGE, targetChangeHandler, false, 0, true); + } + + protected function targetChangeHandler(event:RadiateEvent):void { + target = event.selectedItem + } + + ]]> + </fx:Script> + + <fx:Declarations> + <!-- Place non-visual elements (e.g., services, value objects) here --> + </fx:Declarations> + + <s:Label text="Hello world! The target is {target}" horizontalCenter="0" verticalCenter="0"/> +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/EyeDropperInspector.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/EyeDropperInspector.mxml b/Radii8Library/src/com/flexcapacitor/views/EyeDropperInspector.mxml new file mode 100644 index 0000000..362382e --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/EyeDropperInspector.mxml @@ -0,0 +1,192 @@ +<?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:controls="com.flexcapacitor.graphics.*" + xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:filters="com.flexcapacitor.filters.*" + xmlns:mx="library://ns.adobe.com/flex/mx" + + creationComplete="group1_creationCompleteHandler(event)" xmlns:controls1="com.flexcapacitor.controls.*" xmlns:handlers="com.flexcapacitor.handlers.*" xmlns:clipboard="com.flexcapacitor.effects.clipboard.*" xmlns:status="com.flexcapacitor.effects.status.*" + > + + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + import com.flexcapacitor.tools.EyeDropper; + import com.flexcapacitor.tools.ITool; + import com.flexcapacitor.utils.DisplayObjectUtils; + import com.flexcapacitor.utils.supportClasses.ComponentDescription; + + import mx.events.ColorPickerEvent; + import mx.events.FlexEvent; + + public var radiate:Radiate; + public var color:uint; + public var tool:ITool; + private var isOverDocument:Boolean; + + /** + * + * */ + protected function group1_creationCompleteHandler(event:FlexEvent):void { + radiate = Radiate.getInstance(); + + radiate.addEventListener(RadiateEvent.COLOR_SELECTED, colorSelectedHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.COLOR_PREVIEW, colorPreviewHandler, false, 0, true); + + tool = radiate.selectedTool; + + EyeDropper(tool).addEventListener(MouseEvent.ROLL_OUT, rollOutHandler, false, 0, true); + EyeDropper(tool).addEventListener(MouseEvent.ROLL_OVER, rollOverHandler, false, 0, true); + //EyeDropper(tool).addEventListener(MouseEvent.MOUSE_MOVE, rollOverHandler, false, 0, true); + + //Radiate.log.info("INSPECTOR TOOL CREATED"); + + updateTool(tool); + } + + /** + * Update UI components to tool settings + * */ + public function updateTool(tool:ITool):void { + var toolDescription:ComponentDescription = radiate.getToolDescription(tool); + + if (toolDescription && toolDescription.instance + && toolDescription.instance is EyeDropper) { + var eyeDropperTool:EyeDropper = EyeDropper(toolDescription.instance); + //showSelection.selected = selectionTool.showSelection; + //showLabel.selected = selectionTool.showSelectionLabel; + } + } + + /** + * When user clicks on a location apply the values + * */ + protected function colorSelectedHandler(event:RadiateEvent):void { + //Radiate.log.info("COLOR CHANGE"); + + updateDisplay(event.color, event.invalid, false); + } + + /** + * When user previews a location (mouse movement) show in preview components + * */ + protected function colorPreviewHandler(event:RadiateEvent):void { + //Radiate.log.info("COLOR PREVIEW"); + + updateDisplay(event.color, event.invalid, true); + } + + /** + * Updates UI + * */ + public function updateDisplay(color:uint, invalid:Boolean, preview:Boolean):void { + + if (preview) { + if (invalid) { + colorPickerPreview.selectedColor = 0; + } + else { + colorPickerPreview.selectedColor = color; + colorTextInputPreview.text = DisplayObjectUtils.getColorInHex(color, true); + } + + } + else { + if (invalid) { + colorPicker.selectedColor = 0; + } + else { + colorPicker.selectedColor = color; + colorTextInput.text = DisplayObjectUtils.getColorInHex(color, true); + } + } + } + + + protected function rollOutHandler(event:MouseEvent):void { + colorPickerPreview.visible = false; + colorTextInputPreview.visible = false; + isOverDocument = false; + + } + + protected function rollOverHandler(event:MouseEvent):void { + colorPickerPreview.visible = true; + colorTextInputPreview.visible = true; + isOverDocument = true; + } + + /** + * + * */ + protected function colorPicker_changeHandler(event:ColorPickerEvent):void { + colorTextInputPreview.text = DisplayObjectUtils.getColorInHex(event.color, true); + } + + ]]> + </fx:Script> + <fx:Declarations> + + <fx:Array id="selectFiltersOff"> + <filters:BlackAndWhiteFilter /> + </fx:Array> + + <!-- 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:Declarations> + + <s:layout> + <s:HorizontalLayout paddingLeft="4" /> + </s:layout> + + <mx:ColorPicker id="colorPicker" height="21" change="colorPicker_changeHandler(event)"/> + + <s:TextInput id="colorTextInput" widthInChars="6" height="21"/> + + + <controls1:ImageButton id="copyIcon" + height="100%" + filters="{selectFiltersOff}" + toolTip="Copy the color to the Clipboard" + source="{Radii8LibraryAssets.copy}" + includeInLayout="{colorTextInput.text!=''}" + /> + + <mx:ColorPicker id="colorPickerPreview" visible="false" height="21"/> + <s:TextInput id="colorTextInputPreview" visible="false" widthInChars="6" height="21"/> + +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/Features.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/Features.mxml b/Radii8Library/src/com/flexcapacitor/views/Features.mxml new file mode 100644 index 0000000..5060c3f --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/Features.mxml @@ -0,0 +1,329 @@ +<?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" + + implements="com.flexcapacitor.views.IInspector" + width="100%" + minHeight="20" + > + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.status.StatusManager; + + import mx.events.ValidationResultEvent; + import mx.rpc.events.FaultEvent; + import mx.rpc.events.ResultEvent; + import mx.validators.EmailValidator; + + [Bindable] + public var os:String; + + [Bindable] + public var browser:String; + + [Bindable] + public var player:String; + + [Bindable] + public var manufacturer:String; + + [Bindable] + public var cpu:String; + + [Bindable] + public var isDebugger:Boolean; + + [Bindable] + public var language:String; + + [Bindable] + public var supports32bit:String; + + [Bindable] + public var supports64bit:String; + + [Bindable] + public var touchscreenType:String; + + [Bindable] + public var isDebugSWF:Boolean; + + [Bindable] + public var flexSDK:String; + + private var radiate:Radiate = Radiate.instance; + + + public function activate():void { + radiate = Radiate.instance; + + if (radiate.isUserLoggedIn) { + emailText.text = radiate.userEmail; + } + } + + public function deactivate():void { + + } + + protected function getPropertiesInfo():void { + + var cap:Object = Capabilities; + os = Capabilities.os; + manufacturer = Capabilities.manufacturer; + player = Capabilities.version; + isDebugger = Capabilities.isDebugger; + language = Capabilities.language; + + // in the future we should load in the swf in question + // and get the sdk version and if its a debug swf + //flexSDK = mx_internal::Version; + isDebugSWF = false; //new Error().getStackTrace().search(/:[0-9]+]$/m) > -1; + + + if (Object(Capabilities).hasOwnProperty("cpuArchitecture")) { + cpu = Capabilities['cpuArchitecture']; + } + else { + cpu = ""; + } + + if (Object(Capabilities).hasOwnProperty("supports32BitProcesses")) { + supports32bit = Capabilities['supports32BitProcesses']; + supports64bit = Capabilities['supports64BitProcesses']; + } + else { + supports32bit = ""; + supports64bit = ""; + } + + if (Object(Capabilities).hasOwnProperty("touchscreenType")) { + touchscreenType = Capabilities['touchscreenType']; + } + else { + touchscreenType = ""; + } + + if (ExternalInterface.available) { + browser = ExternalInterface.call("eval", "navigator.userAgent"); + } + else { + browser = Capabilities.playerType; + } + } + + protected function featureRadioGroup_changeHandler(event:Event):void { + if (featureRadioButton.selected) { + currentState = "feature"; + } + else { + currentState = "bug"; + } + } + + + protected function sendButton_clickHandler(event:MouseEvent):void { + var message:Object = new Object(); + var validResultEvent:ValidationResultEvent = emailValidator.validate(emailText.text); + //var validEmail:Boolean = emailValidator.validate(emailText.text); + + if (emailText.text=="" && validResultEvent.results.length==0) { + StatusManager.show("Please enter your email before sending a message."); + return; + } + if (messageTextArea.text=="") { + StatusManager.show("Please enter a message."); + return; + } + + message.os = os; + message.browser = browser; + message.player = player; + message.manufacturer = manufacturer; + message.cpu = cpu; + message.isDebugger = isDebugger; + message.language = language; + message.supports32bit = supports32bit; + message.supports64bit = supports64bit; + message.touchscreen = touchscreenType; + //message.name = nameText.text; + message.email = emailText.text=="" ? emailText.prompt : emailText.text; + message.message = messageTextArea.text; + + feedbackService.send(message); + } + + protected function feedbackService_resultHandler(event:ResultEvent):void { + var result:String = event.result as String; + StatusManager.show("Message sent!"); + //nameText.text = ""; + emailText.prompt = emailText.text!="" ? emailText.text : emailText.prompt; + emailText.text = ""; + messageTextArea.text = ""; + } + + + protected function feedbackService_faultHandler(event:FaultEvent):void { + StatusManager.show("An error occurred! Message may not have been sent. Please email [email protected].", 6000); + //StatusManager.show("An error occurred! Message may not have been sent. \n\n" + event.fault.message); + Radiate.log.error(event.fault.message); + } + + ]]> + </fx:Script> + + <fx:Declarations> + <mx:EmailValidator id="emailValidator" /> + + <s:RadioButtonGroup id="featureRadioGroup" + change="featureRadioGroup_changeHandler(event)"/> + + <s:HTTPService id="feedbackService" + method="POST" + fault="feedbackService_faultHandler(event)" + result="feedbackService_resultHandler(event)" + url="http://www.radii8.com/support.php"/> + </fx:Declarations> + + <s:states> + <s:State name="feature"/> + <s:State name="bug"/> + </s:states> + + <s:VGroup left="0" right="0" + top="0" + width="100%" + height="100%" + clipAndEnableScrolling="true" + paddingLeft="10" + paddingRight="10" + paddingBottom="10" + > + + <s:HGroup left="0" right="0" + width="100%" + clipAndEnableScrolling="true" + paddingRight="10" + verticalAlign="middle" + > + + <s:Label text="Send as many feature request and bug reports as you like."/> + + <s:Spacer width="100%"/> + + <s:RadioButton id="featureRadioButton" + label="Feature" + group="{featureRadioGroup}" + selected="true" + /> + <s:RadioButton id="booleanDisabledRadioButton" + label="Bug" + group="{featureRadioGroup}" + /> + + <s:Button id="sendButton" + label="Send" + click="sendButton_clickHandler(event)" + /> + + </s:HGroup> + + <s:HGroup verticalAlign="middle"> + <s:Label text="Your email:"/> + + <s:TextInput id="emailText" + minWidth="250" + focusAlpha="0" + borderColor="#cccccc" + /> + </s:HGroup> + + <s:HGroup left="0" right="0" + width="100%" height="100%" + clipAndEnableScrolling="true" + paddingRight="10" + verticalAlign="middle" + > + <s:TextArea id="messageTextArea" + focusColor="#585858" + focusAlpha="0" + width="50%" height="100%" + borderColor="#cccccc" + paddingTop="8" + paddingBottom="8" + prompt.feature="Enter your feature and click send" + > + <s:keyFocusChange> + event.preventDefault(); + event.currentTarget.insertText("\t"); + </s:keyFocusChange> + <s:prompt.bug>Summarize the problem and list the steps to reproduce.</s:prompt.bug> + + <s:text.bug> +<![CDATA[Summary: + + +Steps to reproduce: +1. +2. +3. + +Expected Result: + + +Actual Result: + + +]]></s:text.bug> + </s:TextArea> + + <s:TextArea id="helpTextArea" + focusColor="#585858" + focusAlpha="0" + width="50%" height="100%" + borderColor="#cccccc" + borderVisible="false" + paddingTop="8" + paddingBottom="8" + editable="false" + includeIn="bug" + fontStyle="italic" + color="#585858" + > + <s:text><![CDATA[Summarize the problem and list the steps to reproduce. + +Steps to reproduce: +1. Add a button to the stage +2. Set color on the button to red in the properties panel + +Expected Result: +Button text is red + +Actual Result: +Button text is blue]]></s:text> + </s:TextArea> + </s:HGroup> + </s:VGroup> + +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/FrameRate.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/FrameRate.mxml b/Radii8Library/src/com/flexcapacitor/views/FrameRate.mxml new file mode 100644 index 0000000..c9fbd45 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/FrameRate.mxml @@ -0,0 +1,31 @@ +<?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:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:controls="com.flexcapacitor.performance.controls.*" + > + + <controls:FrameRate left="4" + height="100%" width="100%" + verticalAlign="middle" + textAlign="center"/> + +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/HistoryToolBar.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/HistoryToolBar.mxml b/Radii8Library/src/com/flexcapacitor/views/HistoryToolBar.mxml new file mode 100644 index 0000000..f1ef216 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/HistoryToolBar.mxml @@ -0,0 +1,122 @@ +<?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:c="com.flexcapacitor.controls.*" + + creationComplete="creationCompleteHandler(event)"> + + + <!-- + + --> + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + + import mx.events.FlexEvent; + + + + private var radiate:Radiate = Radiate.instance; + + protected function creationCompleteHandler(event:FlexEvent):void { + radiate.addEventListener(RadiateEvent.HISTORY_CHANGE, historyChangeHandler, false, 0, true); + + updateNavigationButtons(); + } + + /** + * History changed. Select the last applied item in the history array. + * */ + protected function historyChangeHandler(event:Event):void { + updateNavigationButtons(); + } + + /** + * + * */ + public function redo():void { + var historyIndex:int = Radiate.redo(true); + + + //Radiate.history.refresh(); + + //list.selectedIndex = historyIndex; + + updateNavigationButtons(); + + } + + /** + * + * */ + public function undo():void { + var historyIndex:int = Radiate.undo(true); + + //Radiate.history.refresh(); + + //list.selectedIndex = Radiate.historyIndex; + + updateNavigationButtons(); + } + + public function updateNavigationButtons():void { + var historyIndex:int = Radiate.historyIndex; + var totalItems:int = Radiate.history ? Radiate.history.length : 0; + var hasItems:Boolean = totalItems>0; + + // has forward history + if (hasItems && historyIndex+1<totalItems) { + forwardButton.enabled = true; + } + else { + forwardButton.enabled = false; + } + + // has previous items + if (hasItems && historyIndex>-1) { + backButton.enabled = true; + } + else { + backButton.enabled = false; + } + } + ]]> + </fx:Script> + + + <s:layout> + <s:HorizontalLayout paddingTop="4" verticalAlign="baseline" /> + </s:layout> + + <c:ImageButton id="backButton" source="{Radii8LibraryAssets.undo}" + height="15" + alpha=".8" + click="undo()" + /> + <c:ImageButton id="forwardButton" source="{Radii8LibraryAssets.redo}" + height="15" + alpha=".8" + click="redo()" + /> +</s:Group> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/IInspector.as ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/IInspector.as b/Radii8Library/src/com/flexcapacitor/views/IInspector.as new file mode 100644 index 0000000..665939a --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/IInspector.as @@ -0,0 +1,32 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.views { + + /** + * Interface for dynamic inspectors + * */ + public interface IInspector { + + + function activate():void; + + function deactivate():void; + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/Inspector.as ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/Inspector.as b/Radii8Library/src/com/flexcapacitor/views/Inspector.as new file mode 100644 index 0000000..69e0dd7 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/Inspector.as @@ -0,0 +1,37 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.views { + + public interface Inspector { + + /** + * Called when the Element Inspector is closed + * Used to clean up any references + * */ + function close():void; + + /** + * This property is set when the target is changed + * */ + function set target(value:*):void; + } +} \ No newline at end of file
