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.js64
1 files changed, 34 insertions, 30 deletions
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js
index 580d945d..40e9b86a 100755
--- a/js/panels/properties.reel/properties.js
+++ b/js/panels/properties.reel/properties.js
@@ -17,15 +17,11 @@ exports.Properties = Montage.create(Component, {
17 value: null 17 value: null
18 }, 18 },
19 19
20 elementID: { 20 elementId: {
21 value: null 21 value: null
22 }, 22 },
23 23
24 elementClassName: { 24 elementClass: {
25 value: null
26 },
27
28 nameAttribute: {
29 value: null 25 value: null
30 }, 26 },
31 27
@@ -60,6 +56,14 @@ exports.Properties = Montage.create(Component, {
60 56
61 this.eventManager.addEventListener("openDocument", this, false); 57 this.eventManager.addEventListener("openDocument", this, false);
62 this.eventManager.addEventListener("switchDocument", this, false); 58 this.eventManager.addEventListener("switchDocument", this, false);
59
60 this.elementId.element.addEventListener("blur", this, false);
61 this.elementId.element.addEventListener("focus", this, false);
62 this.elementId.element.addEventListener("keyup", this, false);
63
64 this.elementClass.element.addEventListener("blur", this, false);
65 this.elementClass.element.addEventListener("focus", this, false);
66 this.elementClass.element.addEventListener("keyup", this, false);
63 } 67 }
64 }, 68 },
65 69
@@ -73,12 +77,6 @@ exports.Properties = Montage.create(Component, {
73 if(this.application.ninja.selectedElements.length === 0) { 77 if(this.application.ninja.selectedElements.length === 0) {
74 this.displayStageProperties(); 78 this.displayStageProperties();
75 } 79 }
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 } 80 }
83 }, 81 },
84 82
@@ -87,7 +85,7 @@ exports.Properties = Montage.create(Component, {
87 // For now always assume that the stage is selected by default 85 // For now always assume that the stage is selected by default
88 if(this.application.ninja.selectedElements.length === 0) { 86 if(this.application.ninja.selectedElements.length === 0) {
89 this.displayStageProperties(); 87 this.displayStageProperties();
90 }else { 88 } else {
91 if(this.application.ninja.selectedElements.length === 1) { 89 if(this.application.ninja.selectedElements.length === 1) {
92 this.displayElementProperties(this.application.ninja.selectedElements[0]._element); 90 this.displayElementProperties(this.application.ninja.selectedElements[0]._element);
93 } else { 91 } else {
@@ -102,17 +100,29 @@ exports.Properties = Montage.create(Component, {
102 */ 100 */
103 handleBlur: { 101 handleBlur: {
104 value: function(event) { 102 value: function(event) {
105 console.log(event.target); 103
106 if(event.target.id === "elementID") { 104 if(event.target.id === "elementId") {
105
106 // Remove all white spaces from the id
107 this.elementId.value = this.elementId.value.replace(/\s/g, '');
108
109 // Check if that id is in use
110 if(this.application.ninja.currentDocument._document.getElementById(this.elementId.value) !== null) {
111 // TODO: Replace with Ninja Alert
112 alert("The following ID: " + this.elementId.value + " is already in use");
113 }
114
107 if(this.application.ninja.selectedElements.length) { 115 if(this.application.ninja.selectedElements.length) {
108 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); 116 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi");
109 } else { 117 } else {
110 ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id); 118 ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id);
111 } 119 }
112 } else if(event.target.id === "elementNameAttribute") { 120 } else if(event.target.id === "elementClass") {
113 if(this.application.ninja.selectedElements.length) { 121 if(this.application.ninja.selectedElements.length) {
114 //ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "name", this.elementNameAttribute.value, "Change", "pi"); 122 ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "class", this.elementClass.value, "Change", "pi");
115 this.application.ninja.selectedElements[0]._element.setAttribute("name", this.elementNameAttribute.value); 123 console.log(this.application.ninja.selectedElements[0]._element.className);
124 } else {
125 ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "class", this.elementClass.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.elementClass);
116 } 126 }
117 } 127 }
118 } 128 }
@@ -121,11 +131,7 @@ exports.Properties = Montage.create(Component, {
121 handleKeyup: { 131 handleKeyup: {
122 value: function(event) { 132 value: function(event) {
123 if(event.keyCode === 13) { 133 if(event.keyCode === 13) {
124 if(event.target === "elementID") { 134 event.target.blur();
125 this.elementId.element.blur();
126 } else if(event.target === "elementNameAttribute") {
127 this.elementNameAttribute.element.blur();
128 }
129 } 135 }
130 } 136 }
131 }, 137 },
@@ -180,10 +186,9 @@ exports.Properties = Montage.create(Component, {
180 value: function() { 186 value: function() {
181 var stage = this.application.ninja.currentDocument.documentRoot; 187 var stage = this.application.ninja.currentDocument.documentRoot;
182 //this is test code please remove 188 //this is test code please remove
183 this.elementName = "Stage"; 189 this.elementName.value = "Stage";
184 this.elementId.value = stage.elementModel.id; 190 this.elementId.value = stage.elementModel.id;
185 this.elementClassName = ""; 191 this.elementClass.value = "";
186 this.nameAttribute = "";
187 192
188 this.positionSize.disablePosition = true; 193 this.positionSize.disablePosition = true;
189 this.threeD.disableTranslation = true; 194 this.threeD.disableTranslation = true;
@@ -243,10 +248,9 @@ exports.Properties = Montage.create(Component, {
243 var customPI, 248 var customPI,
244 currentValue; 249 currentValue;
245 250
246 this.elementName = el.elementModel.selection; 251 this.elementName.value = el.elementModel.selection;
247 this.elementId.value = el.getAttribute("id") || ""; 252 this.elementId.value = el.getAttribute("id") || "";
248 this.elementClassName = el.getAttribute("class"); 253 this.elementClass.value = el.getAttribute("class");
249 this.nameAttribute = el.getAttribute("name") || "";
250 254
251 this.positionSize.disablePosition = false; 255 this.positionSize.disablePosition = false;
252 this.threeD.disableTranslation = false; 256 this.threeD.disableTranslation = false;
@@ -385,7 +389,7 @@ exports.Properties = Montage.create(Component, {
385 389
386 displayGroupProperties: { 390 displayGroupProperties: {
387 value: function (els) { 391 value: function (els) {
388 this.elementName = "Multiple Elements"; 392 this.elementName.value = "Multiple Elements";
389 } 393 }
390 }, 394 },
391 395