aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties.reel/properties.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/properties.reel/properties.js')
-rwxr-xr-xjs/panels/properties.reel/properties.js204
1 files changed, 61 insertions, 143 deletions
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js
index 8c2daa14..84b0d589 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 {
93 this.displayGroupProperties(this.application.ninja.selectedElements);
94 }
95 }
96 } 83 }
97 }, 84 },
98 85
@@ -102,13 +89,13 @@ exports.Properties = Montage.create(Component, {
102 handleBlur: { 89 handleBlur: {
103 value: function(event) { 90 value: function(event) {
104 91
105 if(event.target.id === "elementId") { 92 if(event.target === this.elementId.element) {
106 93
107 // Remove all white spaces from the id 94 // Remove all white spaces from the id
108 this.elementId.value = this.elementId.value.replace(/\s/g, ''); 95 this.elementId.value = this.elementId.value.replace(/\s/g, '');
109 96
110 // Check if that id is in use 97 // Check if that id is in use
111 if(this.application.ninja.currentDocument._document.getElementById(this.elementId.value) !== null) { 98 if(this.application.ninja.currentDocument.model.views.design.document.getElementById(this.elementId.value) !== null) {
112 // TODO: Replace with Ninja Alert 99 // TODO: Replace with Ninja Alert
113 alert("The following ID: " + this.elementId.value + " is already in use"); 100 alert("The following ID: " + this.elementId.value + " is already in use");
114 } 101 }
@@ -117,13 +104,13 @@ exports.Properties = Montage.create(Component, {
117// ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); 104// ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi");
118 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, this.application.ninja.selectedElements[0].id, "pi"); 105 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, this.application.ninja.selectedElements[0].id, "pi");
119 } else { 106 } else {
120 ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id); 107 ElementsMediator.setAttribute(this.application.ninja.currentDocument.model.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.model.documentRoot.elementModel.id);
121 } 108 }
122 } else if(event.target.id === "elementClass") { 109 } else if(event.target === this.elementClass.element) {
123 if(this.application.ninja.selectedElements.length) { 110 if(this.application.ninja.selectedElements.length) {
124 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "class", this.elementClass.value, this.application.ninja.selectedElements[0].className, "pi"); 111 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "class", this.elementClass.value, this.application.ninja.selectedElements[0].className, "pi");
125 } else { 112 } else {
126 ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "class", this.elementClass.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.elementClass); 113 ElementsMediator.setAttribute(this.application.ninja.currentDocument.model.documentRoot, "class", this.elementClass.value, "Change", "pi", this.application.ninja.currentDocument.model.documentRoot.elementModel.elementClass);
127 } 114 }
128 } 115 }
129 } 116 }
@@ -148,7 +135,7 @@ exports.Properties = Montage.create(Component, {
148 value: function(event) { 135 value: function(event) {
149// console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update 136// console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update
150 if(event.detail.source && event.detail.source !== "pi") { 137 if(event.detail.source && event.detail.source !== "pi") {
151 var el = this.application.ninja.currentDocument.documentRoot; 138 var el = this.application.ninja.currentDocument.model.documentRoot;
152 if(this.application.ninja.selectedElements.length) { 139 if(this.application.ninja.selectedElements.length) {
153 el = this.application.ninja.selectedElements[0]; 140 el = this.application.ninja.selectedElements[0];
154 } 141 }
@@ -174,8 +161,7 @@ exports.Properties = Montage.create(Component, {
174 handleSelectionChange: { 161 handleSelectionChange: {
175 value: function(event) { 162 value: function(event) {
176 if(event.detail.isDocument) { 163 if(event.detail.isDocument) {
177 if(this.application.ninja.currentDocument.documentRoot.nodeName.toLowerCase() === "body") return; 164 this.displayElementProperties(this.application.ninja.currentDocument.model.documentRoot);
178 this.displayStageProperties();
179 } else { 165 } else {
180 if(this.application.ninja.selectedElements.length === 1) { 166 if(this.application.ninja.selectedElements.length === 1) {
181 this.displayElementProperties(this.application.ninja.selectedElements[0]); 167 this.displayElementProperties(this.application.ninja.selectedElements[0]);
@@ -187,98 +173,33 @@ exports.Properties = Montage.create(Component, {
187 } 173 }
188 }, 174 },
189 175
190 displayStageProperties: { 176 clear: {
191 value: function() { 177 value: function() {
192 var stage = this.application.ninja.currentDocument.documentRoot; 178 this.elementName.value = "";
193 //this is test code please remove 179 this.elementId.value = "";
194 this.elementName.value = "Stage";
195 this.elementId.value = stage.elementModel.id;
196 this.elementClass.value = ""; 180 this.elementClass.value = "";
197 181 this.customPi = null;
198 this.positionSize.disablePosition = true; 182 this.customSections = [];
199 this.threeD.disableTranslation = true;
200
201 this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(stage, "height"));
202 this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(stage, "width"));
203
204 if(this.threeD.inGlobalMode)
205 {
206 this.threeD.xAngle = ElementsMediator.get3DProperty(stage, "xAngle");
207 this.threeD.yAngle = ElementsMediator.get3DProperty(stage, "yAngle");
208 this.threeD.zAngle = ElementsMediator.get3DProperty(stage, "zAngle");
209 }
210
211 this.threeD.flatten = ElementsMediator.getProperty(stage, "-webkit-transform-style") !== "preserve-3d";
212
213 if(this.customPi !== stage.elementModel.pi) {
214 // We need to unregister color chips from the previous selection from the Color Model
215 var len = this.customSections.length;
216 for(var n = 0, controls; n < len; n++) {
217 controls = this.customSections[n].content.controls;
218 if(controls["colorSelect"]) {
219 controls["colorSelect"].destroy();
220 } else if(controls["stageBackground"]) {
221 controls["stageBackground"].destroy();
222 }
223 }
224
225 this.customPi = stage.elementModel.pi;
226 this.displayCustomProperties(stage, stage.elementModel.pi);
227 }
228
229 // For now hardcode the background since it is the only custom property
230 // No need to loop through all the properties.
231 var backgroundChip = this.customSections[0].content.controls["background"];
232 backgroundChip.color = ElementsMediator.getProperty(stage, "background");
233
234 /*
235 var customPI = PiData[this.customPi];
236 // Get all the custom section for the custom PI
237 for(var i = 0, customSec; customSec = customPI[i]; i++) {
238
239 // Now set the Fields for the custom PI
240 for(var j = 0, fields; fields = customSec.Section[j]; j++) {
241 for(var k = 0, control; control = fields[k]; k++) {
242
243 var colorChipEl = this.customSections[i].content.controls[control.id];
244 this.foo = colorChipEl;
245 colorChipEl.addEventListener("firstDraw", this, false);
246