http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/panels/ConstraintsInspector.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/panels/ConstraintsInspector.mxml b/Radii8Library/src/com/flexcapacitor/views/panels/ConstraintsInspector.mxml new file mode 100644 index 0000000..e41f547 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/panels/ConstraintsInspector.mxml @@ -0,0 +1,1546 @@ +<?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" + xmlns:utils="com.flexcapacitor.utils.*" + xmlns:handlers="com.flexcapacitor.handlers.*" + xmlns:supportClasses="com.flexcapacitor.effects.supportClasses.*" + + styleName="constraintStyles" + creationComplete="creationCompleteHandler(event)" + width="100%" + height="100%" + > + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + + import mx.collections.ArrayList; + import mx.core.IVisualElement; + import mx.core.UIComponent; + import mx.events.FlexEvent; + + 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 targetBaseline: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; + + /** + * Select all the text in an input on focus in. + * */ + public var selectOnFocusIn:Boolean; + + public var radiate:Radiate = Radiate.instance; + + protected function creationCompleteHandler(event:FlexEvent):void { + target = null; + radiate = Radiate.getInstance(); + radiate.addEventListener(RadiateEvent.TARGET_CHANGE, targetChangeHandler); + radiate.addEventListener(RadiateEvent.PROPERTY_CHANGED, propertyChangeHandler); + radiate.addEventListener(RadiateEvent.HISTORY_CHANGE, historyChangeHandler); + + if (radiate.targets.length>0) { + target = radiate.target; + } + } + + /** + * 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; + targetBaseline = 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); + targetBaseline = Number(element.baseline); + 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); + + // not all changes update the selection + // maybe add to system manager + // NOTE: This is not the place to do it + // Should be added as a flag to radiate instance + if (target.parent) { + target.parent.addEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline, false, 0, true); + } + }*/ + + updateTargetDimensionsLayout(); + + } + + public function get element():IVisualElement { + return _visualElement; + } + + public function get target():Object { + return _target; + } + + [Bindable] + public function set target(value:Object):void { + + if (!(value is DisplayObject)) { + _target = null; + clearForm(); + clearTargetDimensions(); + return; + } + + clearForm(); + clearTargetDimensions(); + + _target = value as DisplayObject; + + if (_target is IVisualElement) { + isVisualElement = true; + _visualElement = IVisualElement(_target); + } + else { + isVisualElement = false; + _visualElement = undefined; + } + + if (_target) { + initializeProperties(); + } + else { + updateTargetDimensionsLayout(); + } + + } + + /** + * Updates the + * */ + 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; + } + } + } + + // not sure of way to validate an IVisualElement + // 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(); + + } + + /** + * Updates the visual components to reflect the current values + * */ + public function updateView():void { + + // update UI + updateXProperty(); + updateYProperty(); + + updateTopConstraint(); + updateBottomConstraint(); + updateLeftConstraint(); + updateRightConstraint(); + + updateHorizontalCenterConstraint(); + updateVerticalCenterConstraint(); + updateBaselineConstraint(); + + updateWidthProperty(); + updateHeightProperty(); + + updateVisibleControls(); + + + } + + /** + * Applies properties when enter key is pressed on text components + * */ + protected function applyPropertiesToTargetHandler(event:Event):void { + var currentTarget:UIComponent = event.currentTarget as UIComponent; + var textInput:TextInput = event.currentTarget as TextInput; + var combobox:ComboBox = event.currentTarget as ComboBox; + var checkbox:CheckBox = event.currentTarget as CheckBox; + var property:String; + + if (!target) return; + + if (combobox && combobox.selectedIndex != -1) { // not used + //TypeUtils.applyProperty(combobox, combobox.selectedItem.name, combobox.selectedItem.label, combobox.selectedItem.type); + } + + else if (textInput) { + property = textInput.name.indexOf(":") ? textInput.name.split(":")[0]:textInput.name; + + // handle percents + if (property=="width" && textInput.text.indexOf("%")!=-1) { + property = "percentWidth"; + textInput.text = textInput.text.split("%")[0]; + } + else if (property=="height" && textInput.text.indexOf("%")!=-1) { + property = "percentHeight"; + textInput.text = textInput.text.split("%")[0]; + } + + if (textInput.text=="") { + Radiate.setProperty(DisplayObject(target), property, undefined); + } + else { + Radiate.setProperty(DisplayObject(target), property, textInput.text); + } + + } + + else if (checkbox) { + var value:Boolean = checkbox.selected; + property = checkbox.name.indexOf(":") ? checkbox.name.split(":")[0]:checkbox.name; + Radiate.setProperty(DisplayObject(target), property, value); + } + + 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; + + // naming convention is important leftConstraint becomes "left" + constraint = constraint.split("Constraint")[0]; + + if (isVisualElement) { + if (enabled) { + convertToConstraint(constraint); + } + else { + convertFromConstraint(constraint); + } + } + } + + /** + * Convert constraint to property + * Note: Setting a constraint to undefined + * causes Flex to update the non constraint values + * */ + protected function convertFromConstraint(constraint:String):void { + var focusComponent:UIComponent; + var enabled:Boolean = false; + var constraint:String; + var value:Object; + + if (!target) return; + + // convert Right to X + if (constraint == RIGHT) { + value = undefined; + constraint = "right"; + rightText.text = ""; + focusComponent = xText; + } + + // convert from Left to X + else if (constraint == LEFT) { + value = undefined; + constraint = "left"; + leftText.text = ""; + focusComponent = xText; + } + + // convert from Bottom to Y + else if (constraint == BOTTOM) { + value = undefined; + constraint = "bottom"; + bottomText.text = ""; + focusComponent = yText; + } + + // convert from Top to Y + if (constraint == TOP) { + value = undefined; + constraint = "top"; + topText.text = ""; + focusComponent = yText; + } + + // convert from Vertical Center to Y + if (constraint == VERTICAL_CENTER) { + //element.verticalCenter = undefined; + value = undefined; + constraint = "verticalCenter"; + verticalCenterText.text = ""; + focusComponent = yText; + } + + // convert from Horizontal Center to X + if (constraint == HORIZONTAL_CENTER) { + //value = Object(element.horizontalCenter); + value = undefined; + constraint = "horizontalCenter"; + 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 = undefined; + constraint = "baseline"; + baselineText.text = ""; + focusComponent = yText; + } + + + Radiate.setProperty(target, constraint, value); + 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; + + if (!target) return; + + // 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 = baselineText; + } + + // not sure of way to validate an IVisualElement + //target[constraint] = value; + Radiate.setProperty(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 = ""; + heightText.prompt = String(element.percentHeight) + "%"; + } + else { + + if ("explicitHeight" in target && target.height==target.explicitHeight) { + heightText.text = String(target.height); + } + else { + heightText.text = ""; + heightText.prompt = 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 = ""; + widthText.prompt = String(element.percentWidth) + "%"; + } + else { + if ("explicitWidth" in target && target.width==target.explicitWidth) { + widthText.text = String(target.width); + } + else { + widthText.text = ""; + widthText.prompt = 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!=null || element.right!=null + || element.horizontalCenter!=null)) { + 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!=null || element.bottom!=null + || element.verticalCenter!=null || element.baseline!=null)) { + hasConstraints = true; + } + + return hasConstraints; + } + + /** + * Selects all the text in the text field + * */ + protected function selectInputText(event:Event):void { + if (selectOnFocusIn && event.currentTarget is TextInput) { + TextInput(event.currentTarget).selectAll(); + } + } + + /** + * Sets the top constraint + * */ + protected function setTopConstraint(value:Object):void { + element.top = 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 bottom constraint + * */ + protected function setBottomConstraint(value:Object):void { + element.bottom = value ? value : undefined; + } + + /** + * Sets the vertical center constraint + * */ + protected function setVerticalCenterConstraint(value:Object):void { + element.verticalCenter = value ? value : undefined; + } + + /** + * Sets the horizontal center constraint + * */ + protected function setHorizontalCenterConstraint(value:Object):void { + element.horizontalCenter = value ? value : undefined; + } + + /** + * Sets the baseline constraint + * */ + protected function setBaselineConstraint(value:Object):void { + element.baseline = value ? value : undefined; + } + + + /** + * Updates the display with the value of the baseline position + * NOTE! This is not implemented or tested + * */ + 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!=null) { + 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!=null) { + 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!=null) { + 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!=null) { + 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!=null) { + 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!=null) { + 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!=null) { + verticalCenterText.text = String(verticalCenterValue); + + // vertical center is set so do not display Y + yText.text = ""; + } + else { + verticalCenterText.text = ""; + } + + } + + /** + * 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; + bottomConstraint.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; + + // update position of preview target + copyConstraints(constrainedTarget, element, 0); + } + + /** + * Updates the preview target + * */ + protected function copyConstraints(target:IVisualElement, source:IVisualElement, setValue:Object=null):void { + setValue = setValue!=null ? 1 : setValue; // this doesn't make sense + + // 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; + + if (target.top==null + && target.bottom==null + && target.left==null + && target.right==null + && target.horizontalCenter==null + && target.verticalCenter==null + && target.baseline==null) { + target.visible = false; + } + else { + target.visible = true; + } + } + + /** + * 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 = ""; + verticalCenterText.text = ""; + horizontalCenterText.text = ""; + baselineText.text = ""; + + widthText.text = ""; + heightText.text = ""; + + topConstraint.selected = false; + leftConstraint.selected = false; + rightConstraint.selected = false; + bottomConstraint.selected = false; + verticalCenterConstraint.selected = false; + horizontalCenterConstraint.selected = false; + baselineConstraint.selected = false; + + topRule.visible = false; + leftRule.visible = false; + rightRule.visible = false; + bottomRule.visible = false; + verticalCenterRule.visible = false; + horizontalCenterRule.visible = false; + baselineRule.visible = false; + + } + + /** + * Get current target + * */ + protected function targetChangeHandler(event:RadiateEvent):void { + target = event.selectedItem; + } + + /** + * Updates the view when a property is changed externally + * */ + protected function propertyChangeHandler(event:RadiateEvent):void { + var properties:Array = event.properties; + var length:int = event.properties.length; + + if (target!=event.selectedItem) { + target = event.selectedItem; + } + + if (!target) return; + + for (var i:int;i<length;i++) { + if (relevantProperties.indexOf(properties[i])!=-1) { + updateView(); + break; + } + } + } + + protected function historyChangeHandler(event:RadiateEvent):void { + if (event.newIndex==-1 || !event.historyEventItem) return; + var properties:Array = event.historyEventItem.properties; + var length:int = properties ? properties.length : 0; + + if (!target) return; + + for (var i:int;i<length;i++) { + if (relevantProperties.indexOf(properties[i])!=-1) { + updateView(); + break; + } + } + } + + private const relevantProperties:Array = [ "width", "height", "percentWidth", "percentHeight", "x", + "y", "top", "left", "right", "bottom", "verticalCenter", + "horizontalCenter", "baseline"] + + ]]> + </fx:Script> + + <fx:Declarations> + <!--<handlers:EventHandler eventName="{SearchTextInput.CLEAR_TEXT}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="clearTextHandler"> + <handlers:eventStart> + <![CDATA[ + applyPropertiesToTargetHandler(event.currentTarget.event); + ]]> + </handlers:eventStart> + </handlers:EventHandler>--> + + <handlers:EventHandler eventName="{FlexEvent.ENTER}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="enterHandler"> + <handlers:eventStart> + <![CDATA[ + applyPropertiesToTargetHandler(event.currentTarget.event); + ]]> + </handlers:eventStart> + </handlers:EventHandler> + + <!-- FOCUS OUT HANDLER + + named focusOutHandler2 because conflict between UIComponent handler of the same name + --> + <handlers:EventHandler eventName="{FocusEvent.FOCUS_OUT}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="focusOutHandler2"> + <handlers:eventStart> + <![CDATA[ + applyPropertiesToTargetHandler(event.currentTarget.event); + ]]> + </handlers:eventStart> + </handlers:EventHandler> + + <handlers:EventHandler eventName="{FocusEvent.FOCUS_IN}" + targets="{[ + topText, + bottomText, + rightText, + leftText, + widthText, + heightText, + xText, + yText, + verticalCenterText, + horizontalCenterText, + baselineText]}" + keepEvent="true" + id="focusInEventHandler"> + <handlers:eventStart> + <![CDATA[ + selectInputText(event.currentTarget.event); + ]]> + </handlers:eventStart> + </handlers:EventHandler> + + + <handlers:EventHandler eventName="{MouseEvent.CLICK}" + targets="{[ + leftConstraint, + rightConstraint, + bottomConstraint, + topConstraint, + baselineConstraint, + horizontalCenterConstraint, + verticalCenterConstraint]}" + keepEvent="true" + id="clickHandler"> + + <handlers:eventStart> + <![CDATA[ + constraintHandler(event.currentTarget.event); + ]]> + </handlers:eventStart> + + </handlers:EventHandler> + + <s:SolidColorStroke id="stroke1" weight="1" color="#00AA00"/> + + </fx:Declarations> + + <!-- NAMING CONVENTION IS USED --> + + <!-- POSITIONING --> + <s:Group horizontalCenter="0" y="30" + styleName="constraintStyles"> + <s:TextInput id="widthText" + fontSize="12" + styleName="inputStyles" + width="70" x="44" y="0" + restrict="0-9%" + name="width:Number"/> + <s:TextInput id="heightText" + fontSize="12" + styleName="inputStyles" + width="70" x="174" y="0" + restrict="0-9%" + name="height:Number"/> + <s:TextInput id="xText" + fontSize="12" + styleName="inputStyles" + width="70" x="44" y="35" + restrict="0-9-" + name="x:Number"/> + <s:TextInput id="yText" + fontSize="12" + styleName="inputStyles" + width="70" x="174" y="35" + restrict="0-9-" + name="y:Number"/> + <s:Label text="Height:" + styleName="constraintStyles" + x="126" y="7"/> + <s:Label text="Width:" + styleName="constraintStyles" + x="2" y="7"/> + <s:Label text="X:" + styleName="constraintStyles" + x="30" y="42"/> + <s:Label text="Y:" + styleName="constraintStyles" + x="160" y="42"/> + </s:Group> + + + <!-- CONSTRAINTS PANEL --> + <s:BorderContainer id="constraintsContainer" + styleName="constraintStyles" + horizontalCenter="0" + y="119" + borderVisible="false"> + + <!-- CONSTRAINTS --> + <s:TextInput id="topText" + styleName="inputStyles" + width="40" x="205" y="47" + restrict="0-9-" + name="top:style"/> + <s:TextInput id="verticalCenterText" + styleName="inputStyles" + width="40" x="205" y="95" + restrict="0-9-" + name="verticalCenter:style"/> + <s:TextInput id="bottomText" + styleName="inputStyles" + width="40" x="205" y="143" + restrict="0-9" + name="bottom:style"/> + <s:TextInput id="baselineText" + styleName="inputStyles" + width="40" x="205" y="165" + restrict="0-9" + visible="false" + name="baseline:style"/> + + <s:TextInput id="rightText" + styleName="inputStyles" + width="40" x="147" y="189" + restrict="0-9" + name="right:style"/> + <s:TextInput id="horizontalCenterText" + styleName="inputStyles" + width="40" x="99" y="189" + restrict="0-9" + name="horizontalCenter:style"/> + <s:TextInput id="leftText" + styleName="inputStyles" + width="40" x="50" y="189" + restrict="0-9" + 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" + visible="false" + 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" + visible="false" + 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="106" alpha=".5"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Line> + + <s:Line left="23.5" right="23.5" + y="10" alpha=".5"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Line>--> + + <s:Label left="0" + y="5" + text="Size and Position" + color="#585858" + width="100%" + styleName="formItem" + /> + + <s:Label text="Constraints" + left="0" + y="101" + color="#585858" + width="100%" + styleName="formItem" + /> + + <s:ComboBox id="layoutLayoutComboBox" + styleName="constraintStyles" + horizontalCenter="0" + includeInLayout="false" + visible="false" width="250" y="346" + 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/panels/DocumentationInspector.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/panels/DocumentationInspector.mxml b/Radii8Library/src/com/flexcapacitor/views/panels/DocumentationInspector.mxml new file mode 100644 index 0000000..d394cd0 --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/panels/DocumentationInspector.mxml @@ -0,0 +1,160 @@ +<?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.*" + xmlns:handlers="com.flexcapacitor.handlers.*" + xmlns:collections="com.flexcapacitor.effects.collections.*" + xmlns:components="com.flexcapacitor.components.*" + xmlns:flexiframe="com.google.code.flexiframe.*" + + minWidth="200" + minHeight="100" + implements="com.flexcapacitor.views.IInspector" + > + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + import com.flexcapacitor.model.MetaData; + import com.flexcapacitor.utils.DisplayObjectUtils; + + import flash.net.navigateToURL; + + + /** + * Reference to Radiate + * */ + public var radiate:Radiate; + + public var lastURL:String; + public var declaredBy:String; + + public function activate():void { + radiate = Radiate.getInstance(); + + radiate.addEventListener(RadiateEvent.PROPERTY_SELECTED, propertySelectedHandler, false, 0, true); + } + + public function deactivate():void { + if (radiate) { + radiate.removeEventListener(RadiateEvent.PROPERTY_SELECTED, propertySelectedHandler); + } + } + + protected function propertySelectedHandler(event:RadiateEvent):void { + var metadata:MetaData = MetaData(event.selectedItem); + var isVisible:Boolean = DisplayObjectUtils.getGreatestVisibilityDisplayList(this); + var path:String = ""; + var prefix:String = ""; + + lastURL = Radiate.getURLToHelp(metadata); + declaredBy = metadata.declaredBy; + + if (!isVisible || !showDocsCheckbox.selected) { + + textURL.text = ""; + return; + } + + updateDocumentation(); + + } + + protected function showDocsCheckbox_changeHandler(event:Event):void { + + updateDocumentation(); + } + + protected function openInSeparateWindow_changeHandler(event:Event):void { + + updateDocumentation(); + } + + public function updateDocumentation():void { + + if (showDocsCheckbox.selected) { + + if (openInSeparateWindow.selected) { + var request:URLRequest = new URLRequest(lastURL); + navigateToURL(request, "asdocs"); + + if (docsFrame.source!="" || docsFrame.source!="about:blank") { + docsFrame.source = ""; + } + } + else { + docsFrame.source = lastURL; + } + + if (showURL.selected) { + textURL.text = lastURL; + } + else { + textURL.text = declaredBy; + } + } + else { + docsFrame.source = "about:blank"; + textURL.text = ""; + } + } + + protected function showURL_changeHandler(event:Event):void { + if (showURL.selected) { + textURL.text = lastURL; + } + else { + textURL.text = declaredBy; + } + } + + ]]> + </fx:Script> + + <s:HGroup left="0" right="0" + width="100%" + clipAndEnableScrolling="true" + paddingLeft="6" + paddingRight="10" + > + <s:TextInput id="textURL" + width="100%" + color="#A6a5a5" + borderColor="#A5A5A5" + borderVisible="false" + focusAlpha="0" + prompt="No documentation available. Select a property, style or event."/> + <s:CheckBox id="showURL" label="Show URL" + change="showURL_changeHandler(event)"/> + <s:CheckBox id="openInSeparateWindow" label="Open in Window" + change="openInSeparateWindow_changeHandler(event)"/> + <s:CheckBox id="showDocsCheckbox" + label="Enabled" + change="showDocsCheckbox_changeHandler(event)" + selected="true" + /> + </s:HGroup> + + <flexiframe:IFrame id="docsFrame" top="28" width="100%" height="100%" /> + +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/panels/DocumentsInspector.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/panels/DocumentsInspector.mxml b/Radii8Library/src/com/flexcapacitor/views/panels/DocumentsInspector.mxml new file mode 100644 index 0000000..5d4a93e --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/panels/DocumentsInspector.mxml @@ -0,0 +1,600 @@ +<?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:views="com.flexcapacitor.views.*" + xmlns:c="com.flexcapacitor.controls.*" + xmlns:fc="com.flexcapacitor.effects.popup.*" + xmlns:handlers="com.flexcapacitor.handlers.*" + xmlns:collections="com.flexcapacitor.effects.collections.*" + + width="100%" + height="100%" + implements="com.flexcapacitor.views.IInspector" + > + + <fx:Script> + <![CDATA[ + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + import com.flexcapacitor.model.DocumentData; + import com.flexcapacitor.model.IDocument; + import com.flexcapacitor.model.IDocumentData; + import com.flexcapacitor.model.IProject; + import com.flexcapacitor.views.IInspector; + import com.flexcapacitor.views.windows.DeleteDocumentWindow; + import com.flexcapacitor.views.windows.ImportWindow; + + import mx.core.IVisualElement; + import mx.events.FlexEvent; + + import spark.components.RadioButtonGroup; + import spark.events.IndexChangeEvent; + + private var rootDisplayObject:DisplayObject; + private var displayList:Array = []; + + [Bindable] + private var radiate:Radiate; + private var designDocument:IEventDispatcher; + + public var project:IProject; + + + public function activate():void { + radiate = Radiate.instance; + + radiate.addEventListener(RadiateEvent.PROJECT_CHANGE, projectChangeHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.DOCUMENT_ADDED, documentAddedHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.DOCUMENT_CHANGE, documentChangeHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.DOCUMENT_OPENING, documentOpeningHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.DOCUMENT_REMOVED, documentRemovedHandler, false, 0, true); + radiate.addEventListener(RadiateEvent.DOCUMENT_DELETED, documentRemovedHandler, false, 0, true); + + update(); + } + + public function deactivate():void { + if (radiate) { + radiate.removeEventListener(RadiateEvent.PROJECT_CHANGE, projectChangeHandler); + radiate.removeEventListener(RadiateEvent.DOCUMENT_ADDED, documentAddedHandler); + radiate.removeEventListener(RadiateEvent.DOCUMENT_CHANGE, documentChangeHandler); + radiate.removeEventListener(RadiateEvent.DOCUMENT_OPENING, documentOpeningHandler); + radiate.removeEventListener(RadiateEvent.DOCUMENT_REMOVED, documentRemovedHandler); + radiate.removeEventListener(RadiateEvent.DOCUMENT_DELETED, documentRemovedHandler); + } + } + + public function update():void { + + if (radiate.selectedProject) { + setProjectsDocuments(radiate.selectedProject); + } + + if (radiate.selectedDocument && radiate.selectedDocument) { + selectDocument(radiate.selectedDocument); + } + } + + /** + * Label of the list + * */ + public function labelFunction(data:Object):String { + return data && data.document ? data.document.name : data.name; + } + + protected function projectChangeHandler(event:RadiateEvent):void { + if (event.selectedItem as IProject) { + setProjectsDocuments(event.selectedItem as IProject); + } + } + + /** + * Document was changed from outside of this inspector. Update to reflect that. + * */ + protected function documentChangeHandler(event:RadiateEvent):void { + var iDocument:IDocumentData = event.selectedItem as IDocumentData; + //var documentData:IDocumentData = iDocument.documentData; + + /* + if (document && (radiate.project!=document.project || documents.length==0)) { + setProjectsDocuments(document.project); + } + else if (document.project && document.project.documents.length != radiate.selectedDocuments.length) { + setProjectsDocuments(document.project); + } + else if (documents.length==0) { + setProjectsDocuments(document.project); + }*/ + + var selectedDocument:IDocumentData = list.selectedItem as IDocumentData; + + if (selectedDocument && iDocument) { + if (selectedDocument.uid != iDocument.uid) { + selectDocument(iDocument); + } + } + + if (selectedDocument==null && iDocument) { + selectDocument(iDocument); + } + /* + if (selectedDocument) { + radiate.dispatchObjectSelectedEvent(selectedDocument); + }*/ + } + + /** + * Update document + * */ + private function selectDocument(iDocument:IDocumentData):void { + var jDocument:IDocumentData; + list.validateNow(); + + if (list.selectedItem != iDocument) { + + var length:int = documentsCollection.length; + for (var i:int;i<length;i++) { + jDocument = IDocumentData(documentsCollection.getItemAt(i)); + + + if (jDocument.uid==iDocument.uid) { + list.selectedItem = IDocumentData(documentsCollection.getItemAt(i)); + break; + } + } + } + } + + /** + * Update documents + * */ + private function setProjectsDocuments(project:IProject, refresh:Boolean = false):void { + var projectDocuments:Array = project ? project.documents : []; + var iDocument:IDocumentData = list.selectedItem; + var uid:String; + + if (iDocument) { + uid = iDocument.uid; + } + else { + iDocument = radiate.getVisibleDocument(); + if (iDocument==null) { + iDocument = radiate.selectedDocument; + } + uid = iDocument ? iDocument.uid : null; + } + + if (documentsCollection.source != projectDocuments) { + documentsCollection.source = projectDocuments; + + documentsCollection.refresh(); + + // must call validate now so selected index doesn't revert if a new project is selected + list.validateNow(); + + if (uid) { + selectDocumentByUID(uid); + } + } + else if (documentsCollection.source.length != project.documents.length) { + documentsCollection.refresh(); + + if (uid) { + selectDocumentByUID(uid); + } + } + else if (refresh) { + documentsCollection.refresh(); + + if (uid) { + selectDocumentByUID(uid); + } + } + } + + /** + * Add new document + * */ + protected function newDocumentIcon_clickHandler(event:MouseEvent):void { + var newDocument:IDocument = radiate.addDocument(radiate.createDocument(), radiate.selectedProject, true, true); + radiate.openDocument(newDocument, DocumentData.INTERNAL_LOCATION, true); + } + + protected function saveDocumentIcon_clickHandler(event:MouseEvent):void { + //radiate.saveProject(radiate.project); + var document:IDocument = list.selectedItem as IDocument; + + if (document) { + var saveRemote:Boolean = radiate.isUserConnected && radiate.isUserLoggedIn; + var savedLocation:String = saveRemote ? DocumentData.REMOTE_LOCATION : DocumentData.LOCAL_LOCATION; + + var savedLocally:Boolean = radiate.saveDocument(document, savedLocation); + + //Radiate.log.info("Saved locally: " + savedLocally); + } + } + + /** + * User selected a document in the list + * */ + protected function list_changeHandler(event:IndexChangeEvent):void { + var documentData:IDocumentData = list.selectedItem ? IDocumentData(list.selectedItem) : null; + + if (documentData) { + if (documentData.isOpen) { + radiate.showDocument(documentData); + } + else { + //radiate.openDocumentByData(documentData); + } + } + + if (documentData) { + radiate.dispatchObjectSelectedEvent(documentData); + } + } + + protected function documentAddedHandler(event:RadiateEvent):void { + //event.preventDefault(); + //setProjectsDocuments(radiate.project); + + setProjectsDocuments(radiate.selectedProject, true); + } + + protected function documentOpeningHandler(event:RadiateEvent):void { + //event.preventDefault(); + //setProjectsDocuments(radiate.project); + } + + + protected function deleteDocumentIcon_clickHandler(event:MouseEvent):void { + var selectedDocument:IDocument = list.selectedItem as IDocument; + + if (selectedDocument) { + radiate.removeDocument(selectedDocument); + } + else { + Radiate.log.info("Please select a document"); + } + } + + protected function documentRemovedHandler(event:Event):void { + setProjectsDocuments(radiate.selectedProject, true); + } + + + protected function closeDocumentIcon_clickHandler(event:MouseEvent):void { + var selectedDocument:IDocument = list.selectedItem as IDocument; + + if (selectedDocument) { + radiate.closeDocument(selectedDocument); + } + else { + Radiate.log.info("Please select a document"); + } + } + + protected function openDocumentIcon_clickHandler(event:MouseEvent):void { + var selectedDocument:IDocument = list.selectedItem as IDocument; + + if (selectedDocument) { + radiate.openDocument(selectedDocument, DocumentData.REMOTE_LOCATION, true); + } + else { + Radiate.log.info("Please select a document"); + } + } + + protected function importDocumentIcon_clickHandler(event:MouseEvent):void { + var selectedDocument:IDocument = list.selectedItem as IDocument; + + if (selectedDocument) { + //radiate.importMXMLDocument(radiate.selectedProject, selectedDocument, code); + } + else { + Radiate.log.info("Please select a document"); + } + } + + protected function openpopup1_closeHandler(event:Event):void { + var selectedDocument:IDocument = list.selectedItem as IDocument; + var importWindow:ImportWindow = ImportWindow(openPopUp.popUp); + var code:String = importWindow.code; + var action:String = importWindow.action; + var type:String = RadioButtonGroup(importWindow.importLocation).selectedValue as String; + + if (action==ImportWindow.IMPORT) { + if (type==ImportWindow.NEW_DOCUMENT) { + radiate.importMXMLDocument(radiate.selectedProject, null, null, code); + } + else if (type==ImportWindow.CURRENT_DOCUMENT && selectedDocument) { + radiate.importMXMLDocument(radiate.selectedProject, selectedDocument, null, code); + } + else if (type==ImportWindow.CURRENT_SELECTION && radiate.target is IVisualElement) { + if (radiate.target is IVisualElement) { + radiate.importMXMLDocument(radiate.selectedProject, selectedDocument, IVisualElement(radiate.target), code); + } + Radiate.log.info("Please select a visual element"); + } + else { + Radiate.log.info("Please select a document"); + } + } + } + + /** + * Pressing enter would retrieve the style value. + * + * This is no longer necessary since values are updated on property change events. + * */ + protected function searchPropertyInput_enterHandler(event:FlexEvent):void { + var searchText:String = filterInput.text; + var item:XML; + + } + + /** + * Move from search text input to properties grid on down arrow key + * */ + protected function filterInput_keyUpHandler(event:KeyboardEvent):void { + /*if (event.keyCode==Keyboard.DOWN) { + propertiesGrid.setFocus(); + if (propertiesGrid.selectedIndex ==-1) { + propertiesGrid.setSelectedIndex(0); + } + }*/ + } + + protected function list_doubleClickHandler(event:MouseEvent):void { + var documentData:IDocument = list.selectedItem ? IDocument(list.selectedItem) : null; + + if (documentData && !documentData.isOpen) { + radiate.openDocumentByData(documentData, true); + } + } + + private function selectDocumentByUID(uid:String):void { + var length:int = documentsCollection.length; + for (var i:int;i<length;i++) { + var iDocumentData:IDocumentData = IDocumentData(documentsCollection.getItemAt(i)); + if (iDocumentData.uid==uid) { + list.selectedItem = iDocumentData; + break; + } + } + + } + + ]]> + </fx:Script> + + <fx:Declarations> + <s:ArrayCollection id="documentsCollection" /> + + + + <!-- SORT BY NAME --> + <handlers:EventHandler eventName="creationComplete" > + <collections:SortCollection target="{documentsCollection}" + fields="{['name']}" /> + </handlers:EventHandler> + + <!-- FILTER BY NAME --> + <handlers:EventHandler eventName="change" + targets="{[filterInput,showAllItemsOnEmpty,caseSensitive,searchAtStart]}" + > + <collections:FilterCollection target="{documentsCollection}" + source="{filterInput}" + sourcePropertyName="text" + fieldName="name" + showAllItemsOnEmpty="{showAllItemsOnEmpty.selected}" + caseSensitive="{caseSensitive.selected}" + searchAtStart="{searchAtStart.selected}" + /> + </handlers:EventHandler> + + + + <!--- show import document popup --> + <handlers:EventHandler eventName="click" target="{importDocumentIcon}"> + <fc:OpenPopUp id="openPopUp" + popUpType="{ImportWindow}" + modalDuration="250" + percentWidth="75" + percentHeight="90" + width="600" + parent="{parentApplication}" + close="openpopup1_closeHandler(event)"/> + </handlers:EventHandler> + + <!--- show delete document popup --> + <handlers:EventHandler targets="{deleteDocumentIcon}" eventName="click" + enabled="{list.selectedItem!=null}"> + <fc:OpenPopUp id="openDeleteProjectPopUp" + popUpType="{DeleteDocumentWindow}" + modalDuration="100" + percentWidth="75" + percentHeight="90" + width="600" + parent="{parentApplication}" + popUpOptions="{{currentState:'document',documentData:list.selectedItem}}" + /> + </handlers:EventHandler> + + <!--- show save before close document popup. disabled for now --> + <!--<handlers:EventHandler targets="{closeDocumentIcon}" eventName="click" + enabled="{list.selectedItem!=null}"> + <fc:OpenPopUp id="saveBeforeClosePopUp" + popUpType="{SaveBeforeCloseWindow}" + modalDuration="100" + percentWidth="75" + percentHeight="90" + width="600" + parent="{parentApplication}" + popUpOptions="{{currentState:'document',documentData:list.selectedItem}}" + /> + </handlers:EventHandler>--> + + <fx:Component className="namePopUp"> + + <s:Group mouseEnabledWhereTransparent="true" + width="100%" height="100%" + > +<!-- creationComplete="nameInput.setFocus()"--> + + <fx:Script> + <![CDATA[ + import mx.events.FlexEvent; + protected function nameInput_enterHandler(event:FlexEvent):void { + + } + ]]> + </fx:Script> + + + <fx:Declarations> + <handlers:EventHandler target="{this}" eventName="mouseDownOutside"> + <!--<popup:ClosePopUp target="{newDocumentPopUp}" />--> + </handlers:EventHandler> + </fx:Declarations> + + + <s:Rect width="100%" height="100%" radiusX="0" radiusY="0"> + <s:fill> + <s:SolidColor color="#ffffff" alpha=".9" /> + </s:fill> + <s:stroke> + <s:SolidColorStroke color="#000000" pixelHinting="true" weight="0" /> + </s:stroke> + <s:filters> + <s:DropShadowFilter distance="3" strength=".75"/> + </s:filters> + </s:Rect> + + <s:Group width="100%" height="100%"> + <s:layout> + <s:HorizontalLayout paddingLeft="5" paddingRight="5" + paddingTop="5" paddingBottom="5"/> + </s:layout> + + + <s:Label text="Name:"/> + + <s:TextInput id="nameInput" width="100%" enter="nameInput_enterHandler(event)"/> + </s:Group> + </s:Group> + </fx:Component> + </fx:Declarations> + + <s:layout> + <s:VerticalLayout paddingLeft="8" paddingRight="8" paddingBottom="8"/> + </s:layout> + + <mx:VDividedBox id="verticalContainer" + width="100%" height="100%" + top="0" + left="8" + right="8" + bottom="0" + > + + <s:Group height="24" + minHeight="24" + width="100%" + > + + <c:SearchTextInput id="filterInput" + left="0" right="0" top="0" + width="100%" + minWidth="60" + styleName="inputStyles" + prompt="Search" + enter="searchPropertyInput_enterHandler(event)" + keyUp="filterInput_keyUpHandler(event)" + /> + <s:HGroup width="100%" top="32" left="4" verticalAlign="baseline"> + <s:CheckBox id="showAllItemsOnEmpty" label="All" selected="true"/> + <s:CheckBox id="caseSensitive" label="Case" selected="false"/> + <s:CheckBox id="searchAtStart" label="At start" selected="false"/> + <s:Spacer width="100%"/> + <s:Label text="Results: {documentsCollection.length}"/> + </s:HGroup> + </s:Group> + + + <s:List id="list" + focusAlpha="0" + minHeight="20" + width="100%" + height="100%" + labelFunction="labelFunction" + borderAlpha=".2" + dataProvider="{documentsCollection}" + change="list_changeHandler(event)" + doubleClick="list_doubleClickHandler(event)" + doubleClickEnabled="true" + itemRenderer="com.flexcapacitor.views.renderers.EditableDocumentRenderer" + > + </s:List> + + + </mx:VDividedBox> + + <s:HGroup width="100%" + height="24" + minHeight="24" + verticalAlign="middle" + > + <c:ImageButton id="importDocumentIcon" + source="{Radii8LibraryAssets.importIcon}" + toolTip="Import Document" + /> + <s:Spacer width="100%"/> + <c:ImageButton id="closeDocumentIcon" + source="{Radii8LibraryAssets.closedFolder}" + toolTip="Close Document" + click="closeDocumentIcon_clickHandler(event)" + /> + <c:ImageButton id="openDocumentIcon" + source="{Radii8LibraryAssets.openFolder}" + toolTip="Open Document" + click="openDocumentIcon_clickHandler(event)" + /> + <c:ImageButton id="saveDocumentIcon" + source="{Radii8LibraryAssets.save}" + toolTip="Save Document" + click="saveDocumentIcon_clickHandler(event)" + height="15" + /> + <c:ImageButton id="newDocumentIcon" + source="{Radii8LibraryAssets.newFile}" + toolTip="New Document" + click="newDocumentIcon_clickHandler(event)" + /> + <c:ImageButton id="deleteDocumentIcon" + source="{Radii8LibraryAssets.trashCan}" + toolTip="Remove Document" + /> + </s:HGroup> + + +</s:Group> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Library/src/com/flexcapacitor/views/panels/DynamicComponentInspector.mxml ---------------------------------------------------------------------- diff --git a/Radii8Library/src/com/flexcapacitor/views/panels/DynamicComponentInspector.mxml b/Radii8Library/src/com/flexcapacitor/views/panels/DynamicComponentInspector.mxml new file mode 100644 index 0000000..189734a --- /dev/null +++ b/Radii8Library/src/com/flexcapacitor/views/panels/DynamicComponentInspector.mxml @@ -0,0 +1,141 @@ +<?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.*" + + width="100%" height="100%" + creationComplete="creationCompleteHandler(event)" + > + + + <!-- + + --> + <fx:Script> + <![CDATA[ + import com.flexcapacitor.views.IInspector; + import com.flexcapacitor.controller.Radiate; + import com.flexcapacitor.events.RadiateEvent; + import com.flexcapacitor.model.InspectorData; + import com.flexcapacitor.utils.supportClasses.ComponentDescription; + + import mx.core.UIComponent; + import mx.events.FlexEvent; + + /** + * Reference to Radiate + * */ + public var radiate:Radiate; + + public var componentDescription:ComponentDescription; + + public var target:Object; + + private var _inspectors:Array; + + public function get inspectors():Array { + return _inspectors; + } + + [Bindable] + public function set inspectors(value:Array):void { + + _inspectors = value; + + if (_inspectors) { + + } + else { + + } + } + + protected function creationCompleteHandler(event:FlexEvent):void { + radiate = Radiate.getInstance(); + + // listen at a higher priority so we can deactivate before child inspectors hear event + // before they have to since the views are specific to the class they are used for + // for example, if we have inspectors for Button and we switch to Application + // we don't want the inspectors for Button to get the target change event + // for Application + radiate.addEventListener(RadiateEvent.TARGET_CHANGE, handleTargetChange, false, 10, true); + //radiate.addEventListener(RadiateEvent.PROPERTY_CHANGED, propertyChangeHandler, false, 0, true); + + if (radiate.target) { + target = radiate.target; + } + + inspectors = radiate.getInspectors(target); + + updateInspectors(inspectors); + } + + protected function handleTargetChange(event:RadiateEvent):void { + var sameType:Boolean = radiate.isSameClassType(target, radiate.target); + + target = radiate.target; + + if (!sameType) { + inspectors = radiate.getInspectors(target); + + updateInspectors(inspectors); + } + } + + + public function updateInspectors(inspectors:Array):void { + var inspectorInstance:UIComponent; + var inspectorData:InspectorData; + var length:int = contentGroup.numElements; + + // deactivate and remove previous inspectors + for (var j:int;j<length;j++) { + if (contentGroup.getElementAt(j) is IInspector) { + IInspector(contentGroup.getElementAt(j)).deactivate(); + } + } + + contentGroup.removeAllElements(); + + length = inspectors.length; + + // add and activate inspectors + for (var i:int;i<length;i++) { + inspectorData = InspectorData(inspectors[i]); + inspectorInstance = inspectorData.getInstance() as UIComponent; + + if (inspectorInstance) { + contentGroup.addElement(inspectorInstance); + IInspector(inspectorInstance).activate(); + } + } + + } + ]]> + </fx:Script> + + + <s:Scroller id="scroller" top="0" left="8" right="8" bottom="4"> + <s:VGroup id="contentGroup" width="100%" paddingRight="12" paddingBottom="12" /> + </s:Scroller> + +</s:Group> \ No newline at end of file
