| <?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:c="com.flexcapacitor.controls.*" |
| creationComplete="group1_creationCompleteHandler(event)" |
| > |
| |
| <fx:Script> |
| <![CDATA[ |
| import com.flexcapacitor.controller.Radiate; |
| import com.flexcapacitor.events.RadiateEvent; |
| import com.flexcapacitor.model.Device; |
| import com.flexcapacitor.model.IDocument; |
| import com.flexcapacitor.tools.ITool; |
| |
| import mx.events.FlexEvent; |
| |
| import spark.events.IndexChangeEvent; |
| |
| public var radiate:Radiate; |
| |
| |
| /** |
| * Shows the show actual size button |
| * */ |
| [Bindable] |
| public var showRestoreSize:Boolean = true; |
| |
| /** |
| * Shows the show center button |
| * */ |
| [Bindable] |
| public var showCenterButton:Boolean = true; |
| |
| /** |
| * Shows devices list |
| * */ |
| [Bindable] |
| public var showDevicesList:Boolean = false; |
| |
| /** |
| * Shows the show fit size button |
| * */ |
| [Bindable] |
| public var showFitSize:Boolean = true; |
| |
| protected function group1_creationCompleteHandler(event:FlexEvent):void { |
| radiate = Radiate.getInstance(); |
| |
| //radiate.addEventListener(RadiateEvent.SCALE_CHANGE, scaleChangedHandler, false, 0, true); |
| radiate.addEventListener(RadiateEvent.DOCUMENT_CHANGE, documentChangeHandler, false, 0, true); |
| radiate.addEventListener(RadiateEvent.DOCUMENT_SIZE_CHANGE, documentSizeChangeHandler, false, 0, true); |
| |
| //toolDescription = radiate.getToolByType(Zoom); |
| |
| //zoomTool = toolDescription.instance as Zoom; |
| |
| |
| // temp to get reference |
| //if (!tool) tool = new Zoom(); |
| |
| //updateTool(zoomTool); |
| } |
| |
| /** |
| * Update UI components to tool value |
| * */ |
| public function updateTool(tool:ITool):void { |
| /*var zoomValue:Number; |
| zoomValue = zoomTool.getScale(); |
| |
| updateZoomInComboBox(zoomValue);*/ |
| } |
| |
| /** |
| * Size combo box change handler. Update size. |
| * */ |
| protected function sizeComboBox_changeHandler(event:IndexChangeEvent):void { |
| updateDocumentSize(); |
| //zoomTool.setScale(parseInt(sizesComboBox.selectedItem)/100); |
| } |
| |
| /** |
| * |
| * */ |
| protected function actualSize_clickHandler(event:MouseEvent):void { |
| radiate.restoreDefaultScale(); |
|
|
| } |
| |
| /** |
| * Size changed |
| * */ |
| protected function sizeChangedHandler(event:RadiateEvent):void { |
| /*var zoomValue:Number; |
| var zoomString:String; |
| |
| zoomValue = zoomTool.getScale(); |
| |
| updateZoomInComboBox(zoomValue);*/
|
| } |
| |
| /** |
| * Format size value. |
| * */ |
| public function updateSizeInComboBox(zoomValue:Number):void {
|
| /*var zoomString:String; |
| |
| if (!isNaN(zoomValue)) { |
| |
| if (String(zoomValue*100).indexOf(".")!=-1) { |
| zoomString = Number(zoomValue*100).toFixed(1) + "%"; |
| } |
| else { |
| zoomString = Number(zoomValue*100) + "%"; |
| } |
| |
| if (zoomValue==1) { |
| sizesComboBox.selectedItem = "100%"; |
| } |
| else { |
| sizesComboBox.selectedItem = zoomString; |
| } |
| }*/
|
| } |
| |
| /** |
| * Document changed |
| * */ |
| protected function documentChangeHandler(event:RadiateEvent):void { |
| // since we use this independently of the tool being selected we need to make sure |
| // the target application is set |
| // we'll move this later
|
| /*var zoomValue:Number = zoomTool.getScale(); |
| |
| updateSizeInComboBox(zoomValue);*/ |
| |
| updatePortraitCheckbox(); |
|
|
| } |
| |
| /** |
| * Restore |
| * */ |
| protected function sizeComboBox_doubleClickHandler(event:MouseEvent):void {
|
| /* |
| if (zoomTool) { |
| zoomTool.restoreDefaultScale(); |
| sizesComboBox.selectedItem = "100%"; |
| }*/
|
| } |
| |
| public function labelFunction(item:Object):String { |
| var device:Device = Device(item); |
| |
| if (device.type=="device" || device.type=="screen") { |
| return device.name; |
| } |
| |
| return device.name + device.width + "x" + device.height; |
| } |
| |
| protected function changeOrientation_changeHandler(event:Event):void {
|
| updateDocumentSize();
|
| } |
| |
| /** |
| * |
| * */ |
| public var properties:Array = ["width", "height"]; |
| |
| /** |
| * Update portrait setting |
| * */ |
| public function updatePortraitCheckbox():void { |
| var document:IDocument = radiate.selectedDocument; |
| var documentInstance:DisplayObject = document ? document.instance as DisplayObject : null; |
| var portrait:Boolean; |
| |
| if (documentInstance && |
| documentInstance.width<documentInstance.height) { |
| portraitEnabledCheckbox.selected= true; |
| portraitEnabledCheckbox.enabled = true; |
| } |
| else if (documentInstance && documentInstance.width==documentInstance.height) { |
| portraitEnabledCheckbox.enabled = false; |
| } |
| else { |
| portraitEnabledCheckbox.selected= false; |
| portraitEnabledCheckbox.enabled = true; |
| } |
| |
| } |
| |
| /** |
| * |
| * */ |
| public function updateDocumentSize():void { |
| var document:IDocument = radiate.selectedDocument; |
| var device:Device = sizesComboBox.selectedItem as Device; |
| var object:Object = {}; |
| var applied:Boolean; |
| var displayObject:DisplayObject = document ? document.instance as DisplayObject : null; |
| |
| |
| if (!showDevicesList) { |
| var values:Object = {width:displayObject.height, height:displayObject.width}; |
| Radiate.setProperties(displayObject, properties, values); |
| return; |
| } |
| |
| |
| |
| |
| if (device.type=="screen") { |
| object.width = device.resolutionWidth; |
| object.height = device.resolutionHeight; |
| |
| applied = Radiate.setProperties(displayObject, properties, object); |
| } |
| else { |
| if (portraitEnabledCheckbox.selected) { |
| object.width = device.usableWidthPortrait; |
| object.height = device.usableHeightPortrait; |
| |
| applied = Radiate.setProperties(displayObject, properties, object, device.name); |
| } |
| else { |
| object.width = device.usableWidthLandscape; |
| object.height = device.usableHeightLandscape; |
| |
| applied = Radiate.setProperties(displayObject, properties, object, device.name); |
| } |
| } |
| } |
| |
| protected function fitSizeButton_clickHandler(event:MouseEvent):void {
|
| radiate.scaleToFit(true);
|
| radiate.centerApplication(true, true); |
| } |
|
|
| protected function centerButton_clickHandler(event:MouseEvent):void { |
| radiate.centerApplication(true, true);
|
| } |
| |
| protected function documentSizeChangeHandler(event:RadiateEvent):void {
|
| updatePortraitCheckbox();
|
| } |
| |
| ]]> |
| </fx:Script> |
| |
| <fx:Declarations> |
| <s:ArrayCollection id="sizesCollection"> |
| |
| </s:ArrayCollection> |
| </fx:Declarations> |
| |
| <s:layout> |
| <s:HorizontalLayout paddingLeft="4" verticalAlign="baseline"/> |
| </s:layout> |
| |
| <s:ToggleButton id="portraitEnabledCheckbox" |
| label="Portrait" |
| selected="true" |
| change="changeOrientation_changeHandler(event)" |
| skinClass="com.flexcapacitor.views.skins.OrientationButton" |
| useHandCursor="true" |
| buttonMode="true" |
| /> |
| <s:Spacer width="1"/> |
| <s:DropDownList id="sizesComboBox" |
| width="180" |
| focusAlpha="0" |
| selectedIndex="8" |
| visible="{showDevicesList}" |
| includeInLayout="{showDevicesList}" |
| arrowKeysWrapFocus="false" |
| doubleClickEnabled="true" |
| labelFunction="labelFunction" |
| dataProvider="{Radiate.deviceCollections}" |
| change="sizeComboBox_changeHandler(event)" |
| doubleClick="sizeComboBox_doubleClickHandler(event)" |
| > |
| <s:layout> |
| <s:VerticalLayout gap="0" |
| horizontalAlign="contentJustify" |
| requestedRowCount="10" /> |
| </s:layout> |
| </s:DropDownList> |
| |
| <c:ImageButton id="centerButton" |
| toolTip="Center" |
| visible="{showCenterButton}" |
| includeInLayout="{showCenterButton}" |
| source="{Radii8LibraryAssets.centerAlignment}" |
| click="centerButton_clickHandler(event)" |
| /> |
| |
| <c:ImageButton id="fitSizeButton" |
| toolTip="Fit" |
| visible="{showFitSize}" |
| includeInLayout="{showFitSize}" |
| source="{Radii8LibraryAssets.zoomToFit}" |
| click="fitSizeButton_clickHandler(event)" |
| /> |
| |
| <c:ImageButton id="actualSizeButton" |
| toolTip="Actual" |
| visible="{showRestoreSize}" |
| includeInLayout="{showRestoreSize}" |
| source="{Radii8LibraryAssets.actualSize}" |
| click="actualSize_clickHandler(event)" |
| /> |
| |
| |
| </s:Group> |