diff options
author | Kruti Shah | 2012-05-31 10:44:45 -0700 |
---|---|---|
committer | Kruti Shah | 2012-05-31 10:44:45 -0700 |
commit | c350cc1c060fdf17357ddadce024267943784593 (patch) | |
tree | 453f86e88f1ee1dfda6fb4b7cc7b17e306e39536 /js/panels/properties.reel | |
parent | fdc4f5c7f81ae3b9adeca2232e60268b4be594a2 (diff) | |
parent | 121d0e616f48aa7cd048763554089c20a1883d7a (diff) | |
download | ninja-c350cc1c060fdf17357ddadce024267943784593.tar.gz |
Merge branch 'refs/heads/TimelineUberjd' into TimelineUber
Conflicts:
js/panels/Timeline/Layer.reel/Layer.js
Signed-off-by: Kruti Shah <kruti.shah@motorola.com>
Diffstat (limited to 'js/panels/properties.reel')
10 files changed, 162 insertions, 200 deletions
diff --git a/js/panels/properties.reel/properties.css b/js/panels/properties.reel/properties.css index 0928da3a..84f52ed4 100755 --- a/js/panels/properties.reel/properties.css +++ b/js/panels/properties.reel/properties.css | |||
@@ -4,6 +4,21 @@ | |||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | /* Cleanup TODO - now that we removed the color toolbar from the tools panel, we no longer load the colortoolbar reel. | ||
8 | Currently the color chips in the property inspector rely on the colortoolbar button style so we | ||
9 | copied the class here. When we do the color feature cleanup we should remove this dependency. | ||
10 | */ | ||
11 | .colortoolbar button { | ||
12 | float: left; | ||
13 | clear: both; | ||
14 | width: 27px; | ||
15 | height: 27px; | ||
16 | background: black; | ||
17 | border: 1px solid #000; | ||
18 | padding: 0; | ||
19 | margin: 0px; | ||
20 | } | ||
21 | |||
7 | .propertiesPanel { | 22 | .propertiesPanel { |
8 | color:#FFF; | 23 | color:#FFF; |
9 | overflow-x: hidden; | 24 | overflow-x: hidden; |
@@ -256,20 +271,21 @@ padding-right:6px; | |||
256 | content: "•"; | 271 | content: "•"; |
257 | } | 272 | } |
258 | 273 | ||
259 | .propertiesPanel input.nj-skinned label { | 274 | .propertiesPanel .checkbox-label { |
260 | position: absolute; | 275 | position: absolute; |
261 | top: 0; | 276 | top: 4px; |
262 | left: 15px; | 277 | padding-left: 5px; |
278 | /*left: 15px;*/ | ||
263 | font-size: 10px; | 279 | font-size: 10px; |
264 | width:55px; | 280 | width:55px; |
265 | text-align: left; | 281 | text-align: left; |
266 | font-weight: normal; | 282 | font-weight: normal; |
267 | color:#FFF; | 283 | color:#FFF; |
268 | } | 284 | } |
269 | |||
270 | .propertiesPanel input[type='radio'].nj-skinned { | 285 | .propertiesPanel input[type='radio'].nj-skinned { |
271 | text-indent: 0px; | 286 | text-indent: 0px; |
272 | line-height: 5px; | 287 | line-height: 5px; |
288 | margin: -4px 0 0 0; | ||
273 | } | 289 | } |
274 | 290 | ||
275 | .propertiesPanel input[type='radio'].nj-skinned label { | 291 | .propertiesPanel input[type='radio'].nj-skinned label { |
@@ -288,4 +304,34 @@ input label { | |||
288 | .propertiesPanel .rotation .fieldRow { | 304 | .propertiesPanel .rotation .fieldRow { |
289 | -webkit-box-flex:0; | 305 | -webkit-box-flex:0; |
290 | width:45px; | 306 | width:45px; |
307 | } | ||
308 | |||
309 | .propertiesPanel div.montage-button:disabled { | ||
310 | opacity: 0.4; | ||
311 | } | ||
312 | |||
313 | .propertiesPanel div.montage-button { | ||
314 | font-size: 9px; | ||
315 | cursor: pointer; | ||
316 | display: block; | ||
317 | margin: -3px 0 0 -12px; | ||
318 | padding: 4px; | ||
319 | border: 1px #313131 solid; | ||
320 | background-color: #474747; | ||
321 | background-image: -webkit-linear-gradient(top, #505050 0%, #3c3c3c 100%); | ||
322 | border-radius: 4px; | ||
323 | color: white; | ||
324 | text-transform: uppercase; | ||
325 | cursor: pointer; | ||
326 | text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); | ||
327 | width: 18px; | ||
328 | height: 14px; | ||
329 | } | ||
330 | |||
331 | .propertiesPanel div.montage-button:active { | ||
332 | background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #505050 100%); | ||
333 | } | ||
334 | |||
335 | .propertiesPanel div.montage-button:hover { | ||
336 | -webkit-box-shadow: 0px 0px 3px #b4b4b4; | ||
291 | } \ No newline at end of file | 337 | } \ No newline at end of file |
diff --git a/js/panels/properties.reel/properties.html b/js/panels/properties.reel/properties.html index 3a1ae880..ac0dab5a 100755 --- a/js/panels/properties.reel/properties.html +++ b/js/panels/properties.reel/properties.html | |||
@@ -38,13 +38,15 @@ | |||
38 | "prototype": "js/panels/properties.reel/section.reel", | 38 | "prototype": "js/panels/properties.reel/section.reel", |
39 | "properties": { | 39 | "properties": { |
40 | "element": {"#": "PosSize"}, | 40 | "element": {"#": "PosSize"}, |
41 | "content" : {"@": "PosSize"}, | 41 | "content" : {"@": "positionSize"}, |
42 | "name" : "Position And Size" | 42 | "name" : "Position And Size" |
43 | } | 43 | } |
44 | }, | 44 | }, |
45 | "PosSize": { | 45 | |
46 | "prototype": "js/panels/properties.reel/sections/position-and-size.reel[PosSize]" | 46 | "positionSize": { |
47 | "prototype": "js/panels/properties.reel/sections/position-size.reel" | ||
47 | }, | 48 | }, |
49 | |||
48 | "threeDSection": { | 50 | "threeDSection": { |
49 | "prototype": "js/panels/properties.reel/section.reel", | 51 | "prototype": "js/panels/properties.reel/section.reel", |
50 | "properties": { | 52 | "properties": { |
@@ -97,7 +99,7 @@ | |||
97 | "elementName": {"@": "elementName"}, | 99 | "elementName": {"@": "elementName"}, |
98 | "elementClass": {"@": "elementClass"}, | 100 | "elementClass": {"@": "elementClass"}, |
99 | "elementId": {"@": "elementId"}, | 101 | "elementId": {"@": "elementId"}, |
100 | "positionSize": {"@": "PosSize"}, | 102 | "positionSize": {"@": "positionSize"}, |
101 | "threeD": {"@": "threeDProperties"} | 103 | "threeD": {"@": "threeDProperties"} |
102 | } | 104 | } |
103 | } | 105 | } |
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index 507770f6..7f8197ea 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js | |||
@@ -46,17 +46,15 @@ exports.Properties = Montage.create(Component, { | |||
46 | 46 | ||
47 | prepareForDraw: { | 47 | prepareForDraw: { |
48 | value : function() { | 48 | value : function() { |
49 | 49 | this.eventManager.addEventListener("openDocument", this, false); | |
50 | this.eventManager.addEventListener("selectionChange", this, false); | 50 | this.eventManager.addEventListener("selectionChange", this, false); |
51 | this.eventManager.addEventListener("closeDocument", this, false); | ||
51 | 52 | ||
52 | // This will be a toggle option | 53 | // This will be a toggle option |
53 | if(this.application.ninja.appData.PILiveUpdate) { | 54 | if(this.application.ninja.appData.PILiveUpdate) { |
54 | this.eventManager.addEventListener( "elementChanging", this, false); | 55 | this.eventManager.addEventListener( "elementChanging", this, false); |
55 | } | 56 | } |
56 | 57 | ||
57 | this.eventManager.addEventListener("openDocument", this, false); | ||
58 | this.eventManager.addEventListener("switchDocument", this, false); | ||
59 | |||
60 | this.elementId.element.addEventListener("blur", this, false); | 58 | this.elementId.element.addEventListener("blur", this, false); |
61 | this.elementId.element.addEventListener("focus", this, false); | 59 | this.elementId.element.addEventListener("focus", this, false); |
62 | this.elementId.element.addEventListener("keyup", this, false); | 60 | this.elementId.element.addEventListener("keyup", this, false); |
@@ -67,32 +65,21 @@ exports.Properties = Montage.create(Component, { | |||
67 | } | 65 | } |
68 | }, | 66 | }, |
69 | 67 | ||
70 | // Document is opened - Display the current selection | ||
71 | handleOpenDocument: { | 68 | handleOpenDocument: { |
72 | value: function() { | 69 | value: function() { |
73 | |||
74 | this.eventManager.addEventListener( "elementChange", this, false); | 70 | this.eventManager.addEventListener( "elementChange", this, false); |
75 | 71 | ||
76 | // For now always assume that the stage is selected by default when opening the old template | 72 | // Save a reference of the pi inside the document view to be able to clear |
77 | // TODO: Remove marker for old template: NINJA-STAGE-REWORK | 73 | this.application.ninja.currentDocument.model.views.design.propertiesPanel = this; |
78 | if(this.application.ninja.selectedElements.length === 0 && this.application.ninja.currentDocument.documentRoot.nodeName.toLowerCase() !== "body") { | 74 | |
79 | this.displayStageProperties(); | 75 | // Display the default document root PI |
80 | } | 76 | this.displayElementProperties(this.application.ninja.currentDocument.model.documentRoot); |
81 | } | 77 | } |
82 | }, | 78 | }, |
83 | 79 | ||
84 | handleSwitchDocument: { | 80 | handleCloseDocument: { |
85 | value: function(){ | 81 | value: function(){ |
86 | // For now always assume that the stage is selected by default | 82 | this.clear(); |
87 | if(this.application.ninja.selectedElements.length === 0) { | ||
88 | this.displayStageProperties(); | ||
89 | } else { | ||
90 | if(this.application.ninja.selectedElements.length === 1) { | ||
91 | this.displayElementProperties(this.application.ninja.selectedElements[0]); | ||
92 | } else { |