diff options
author | hwc487 | 2012-03-06 11:41:28 -0800 |
---|---|---|
committer | hwc487 | 2012-03-06 11:41:28 -0800 |
commit | 5e640e24c3b4658b8060cde837ae98dabd3ba5bf (patch) | |
tree | 527f183b5e485282ce1efe15d96b6b8ddc26801e /js/panels/properties.reel/properties.js | |
parent | 182f05f2f7a8f43f1589c9b8c15bf00d6e983676 (diff) | |
parent | 2815adfd7c19b3dff89dc3e1bda9af8d30dca8d6 (diff) | |
download | ninja-5e640e24c3b4658b8060cde837ae98dabd3ba5bf.tar.gz |
Merge branch 'TimelineUber' of github.com:imix23ways/ninja-internal into integration
Diffstat (limited to 'js/panels/properties.reel/properties.js')
-rwxr-xr-x | js/panels/properties.reel/properties.js | 415 |
1 files changed, 415 insertions, 0 deletions
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js new file mode 100755 index 00000000..eb9faa8b --- /dev/null +++ b/js/panels/properties.reel/properties.js | |||
@@ -0,0 +1,415 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component, | ||
9 | PiData = require("js/data/pi/pi-data").PiData, | ||
10 | CustomSection = require("js/panels/properties.reel/sections/custom.reel").CustomSection; | ||
11 | |||
12 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; | ||
13 | |||
14 | exports.Properties = Montage.create(Component, { | ||
15 | |||
16 | elementName: { | ||
17 | value: null | ||
18 | }, | ||
19 | |||
20 | elementID: { | ||
21 | value: null | ||
22 | }, | ||
23 | |||
24 | elementClassName: { | ||
25 | value: null | ||
26 | }, | ||
27 | |||
28 | nameAttribute: { | ||
29 | value: null | ||
30 | }, | ||
31 | |||
32 | customSections: { | ||
33 | value: [] | ||
34 | }, | ||
35 | |||
36 | _customPi: { | ||
37 | value: null | ||
38 | }, | ||
39 | |||
40 | customPi: { | ||
41 | get: function() { | ||
42 | return this._customPi; | ||
43 | }, | ||
44 | set: function(value) { | ||
45 | if(this._customPi !== value) { | ||
46 | this._customPi = value; | ||
47 | } | ||
48 | } | ||
49 | }, | ||
50 | |||
51 | prepareForDraw: { | ||
52 | value : function() { | ||
53 | |||
54 | this.eventManager.addEventListener("selectionChange", this, false); | ||
55 | |||
56 | // This will be a toggle option | ||
57 | if(this.application.ninja.appData.PILiveUpdate) { | ||
58 | this.eventManager.addEventListener( "elementChanging", this, false); | ||
59 | } | ||
60 | |||
61 | this.eventManager.addEventListener("openDocument", this, false); | ||
62 | this.eventManager.addEventListener("switchDocument", this, false); | ||
63 | } | ||
64 | }, | ||
65 | |||
66 | // Document is opened - Display the current selection | ||
67 | handleOpenDocument: { | ||
68 | value: function() { | ||
69 | |||
70 | this.eventManager.addEventListener( "elementChange", this, false); | ||
71 | |||
72 | // For now always assume that the stage is selected by default | ||
73 | if(this.application.ninja.selectedElements.length === 0) { | ||
74 | this.displayStageProperties(); | ||
75 | } | ||
76 | |||
77 | this.elementId.element.addEventListener("blur", this, false); | ||
78 | this.elementId.element.addEventListener("keyup", this, false); | ||
79 | |||
80 | this.elementNameAttribute.element.addEventListener("blur", this, false); | ||
81 | this.elementNameAttribute.element.addEventListener("keyup", this, false); | ||
82 | } | ||
83 | }, | ||
84 | |||
85 | handleSwitchDocument: { | ||
86 | value: function(){ | ||
87 | // For now always assume that the stage is selected by default | ||
88 | if(this.application.ninja.selectedElements.length === 0) { | ||
89 | this.displayStageProperties(); | ||
90 | }else { | ||
91 | if(this.application.ninja.selectedElements.length === 1) { | ||
92 | this.displayElementProperties(this.application.ninja.selectedElements[0]._element); | ||
93 | } else { | ||
94 | this.displayGroupProperties(this.application.ninja.selectedElements); | ||
95 | } | ||
96 | } | ||
97 | } | ||
98 | }, | ||
99 | |||
100 | /** | ||
101 | * Blur and Key up to handle change in the Element ID field. | ||
102 | */ | ||
103 | handleBlur: { | ||
104 | value: function(event) { | ||
105 | console.log(event.target); | ||
106 | if(event.target.id === "elementID") { | ||
107 | if(this.application.ninja.selectedElements.length) { | ||
108 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); | ||
109 | } else { | ||
110 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id); | ||
111 | } | ||
112 | } else if(event.target.id === "elementNameAttribute") { | ||
113 | if(this.application.ninja.selectedElements.length) { | ||
114 | //ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "name", this.elementNameAttribute.value, "Change", "pi"); | ||
115 | this.application.ninja.selectedElements[0]._element.setAttribute("name", this.elementNameAttribute.value); | ||
116 | } | ||
117 | } | ||
118 | } | ||
119 | }, | ||
120 | |||
121 | handleKeyup: { | ||
122 | value: function(event) { | ||
123 | if(event.keyCode === 13) { | ||
124 | if(event.target === "elementID") { | ||
125 | this.elementId.element.blur(); | ||
126 | } else if(event.target === "elementNameAttribute") { | ||
127 | this.elementNameAttribute.element.blur(); | ||
128 | } | ||
129 | } | ||
130 | } | ||
131 | }, | ||
132 | |||
133 | handleElementChanging: { | ||
134 | value: function(event) { | ||
135 | // this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(this.application.ninja.selectedElements[0]._element, "left")); | ||
136 | // this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(this.application.ninja.selectedElements[0]._element, "top")); | ||
137 | } | ||
138 | }, | ||
139 | |||
140 | handleElementChange: { | ||
141 | value: function(event) { | ||
142 | // console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update | ||
143 | if(event.detail.source && event.detail.source !== "pi") { | ||
144 | // TODO - This should only update the properties that were changed. | ||
145 | var el = this.application.ninja.selectedElements[0]._element || this.application.ninja.selectedElements[0]; | ||
146 | this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); | ||
147 | this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); | ||
148 | this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); | ||
149 | this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); | ||
150 | |||
151 | if(this.threeD.inGlobalMode) | ||
152 | { | ||
153 | this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D"); | ||
154 | this.threeD.y3D = ElementsMediator.get3DProperty(el, "y3D"); | ||
155 | this.threeD.z3D = ElementsMediator.get3DProperty(el, "z3D"); | ||
156 | this.threeD.xAngle = ElementsMediator.get3DProperty(el, "xAngle"); | ||
157 | this.threeD.yAngle = ElementsMediator.get3DProperty(el, "yAngle"); | ||
158 | this.threeD.zAngle = ElementsMediator.get3DProperty(el, "zAngle"); | ||
159 | } | ||
160 | } | ||
161 | } | ||
162 | }, | ||
163 | |||
164 | handleSelectionChange: { | ||
165 | value: function(event) { | ||
166 | if(event.detail.isDocument) { | ||
167 | this.displayStageProperties(); | ||
168 | } else { | ||
169 | if(this.application.ninja.selectedElements.length === 1) { | ||
170 | this.displayElementProperties(this.application.ninja.selectedElements[0]._element); | ||
171 | } else { | ||
172 | this.displayGroupProperties(this.application.ninja.selectedElements); | ||
173 | } | ||
174 | |||
175 | } | ||
176 | } | ||
177 | }, | ||
178 | |||
179 | displayStageProperties: { | ||
180 | value: function() { | ||
181 | var stage = this.application.ninja.currentDocument.documentRoot; | ||
182 | //this is test code please remove | ||
183 | this.elementName = "Stage"; | ||
184 | this.elementId.value = stage.elementModel.id; | ||
185 | this.elementClassName = ""; | ||
186 | this.nameAttribute = ""; | ||
187 | |||
188 | this.positionSize.disablePosition = true; | ||
189 | this.threeD.disableTranslation = true; | ||
190 | |||
191 | this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(stage, "height")); | ||
192 | this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(stage, "width")); | ||
193 | |||
194 | if(this.customPi !== stage.elementModel.pi) { | ||
195 | // We need to unregister color chips from the previous selection from the Color Model | ||
196 | var len = this.customSections.length; | ||
197 | for(var n = 0, controls; n < len; n++) { | ||
198 | controls = this.customSections[n].content.controls; | ||
199 | if(controls["colorSelect"]) { | ||
200 | controls["colorSelect"].destroy(); | ||
201 | } else if(controls["stageBackground"]) { | ||
202 | controls["stageBackground"].destroy(); | ||
203 | } | ||
204 | } | ||
205 | |||
206 | this.customPi = stage.elementModel.pi; | ||
207 | this.displayCustomProperties(stage, stage.elementModel.pi); | ||
208 | } | ||
209 | |||
210 | // For now hardcode the background since it is the only custom property | ||
211 | // No need to loop through all the properties. | ||
212 | var backgroundChip = this.customSections[0].content.controls["background"]; | ||
213 | backgroundChip.color = ElementsMediator.getProperty(stage, "background"); | ||
214 | |||
215 | /* | ||
216 | var customPI = PiData[this.customPi]; | ||
217 | // Get all the custom section for the custom PI | ||
218 | for(var i = 0, customSec; customSec = customPI[i]; i++) { | ||