diff options
author | Valerio Virgillito | 2012-03-01 17:00:59 -0800 |
---|---|---|
committer | Valerio Virgillito | 2012-03-01 17:00:59 -0800 |
commit | 61dd921d5bb06ab47ee84506dbaaeaf4895ebf42 (patch) | |
tree | f574978953d7813886adee2b6445c549e1093908 | |
parent | 42d78d11764dca5df6c7d01f3221f398bee17152 (diff) | |
parent | dd981ba7fcd85ebf2dc2d6bf539fdb37eeacd556 (diff) | |
download | ninja-61dd921d5bb06ab47ee84506dbaaeaf4895ebf42.tar.gz |
Merge pull request #90 from mencio/stage-fixes
Stage fixes
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 2 | ||||
-rwxr-xr-x | js/panels/properties.reel/properties.html | 21 | ||||
-rwxr-xr-x | js/panels/properties.reel/properties.js | 31 |
3 files changed, 49 insertions, 5 deletions
diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js index abad3736..34bb1fb5 100755 --- a/js/controllers/elements/stage-controller.js +++ b/js/controllers/elements/stage-controller.js | |||
@@ -104,9 +104,11 @@ exports.StageController = Montage.create(ElementController, { | |||
104 | el.elementModel.viewPort.style.setProperty(p, value); | 104 | el.elementModel.viewPort.style.setProperty(p, value); |
105 | break; | 105 | break; |
106 | case "width": | 106 | case "width": |
107 | this.application.ninja.currentDocument.iframe.width = parseInt(value) + 1400; | ||
107 | el.elementModel.stageDimension.style.setProperty(p, value); | 108 | el.elementModel.stageDimension.style.setProperty(p, value); |
108 | break; | 109 | break; |
109 | case "height": | 110 | case "height": |
111 | this.application.ninja.currentDocument.iframe.height = parseInt(value) + 400; | ||
110 | el.elementModel.stageDimension.style.setProperty(p, value); | 112 | el.elementModel.stageDimension.style.setProperty(p, value); |
111 | break; | 113 | break; |
112 | default: | 114 | default: |
diff --git a/js/panels/properties.reel/properties.html b/js/panels/properties.reel/properties.html index d903d8ed..72a6def6 100755 --- a/js/panels/properties.reel/properties.html +++ b/js/panels/properties.reel/properties.html | |||
@@ -58,6 +58,22 @@ | |||
58 | } | 58 | } |
59 | }, | 59 | }, |
60 | 60 | ||
61 | "elementNameAttribute": { | ||
62 | "module": "montage/ui/textfield.reel", | ||
63 | "name": "Textfield", | ||
64 | "properties": { | ||
65 | "element": {"#": "elementNameAttribute"}, | ||
66 | "readOnly": false | ||
67 | }, | ||
68 | "bindings": { | ||
69 | "value": { | ||
70 | "boundObject": {"@": "owner"}, | ||
71 | "boundObjectPropertyPath": "nameAttribute", | ||
72 | "oneway": false | ||
73 | } | ||
74 | } | ||
75 | }, | ||
76 | |||
61 | 77 | ||
62 | "PosSizeSection": { | 78 | "PosSizeSection": { |
63 | "module": "js/panels/properties.reel/section.reel", | 79 | "module": "js/panels/properties.reel/section.reel", |
@@ -128,6 +144,7 @@ | |||
128 | "element": {"#": "propertiesPanel"}, | 144 | "element": {"#": "propertiesPanel"}, |
129 | "elementNameInput": {"@": "elementNameInput1"}, | 145 | "elementNameInput": {"@": "elementNameInput1"}, |
130 | "elementId": {"@": "elementID"}, | 146 | "elementId": {"@": "elementID"}, |
147 | "elementNameAttribute": {"@": "elementNameAttribute"}, | ||
131 | "positionSize": {"@": "PosSize"}, | 148 | "positionSize": {"@": "PosSize"}, |
132 | "threeD": {"@": "threeDProperties"} | 149 | "threeD": {"@": "threeDProperties"} |
133 | } | 150 | } |
@@ -150,6 +167,10 @@ | |||
150 | <label id="lblClass">Class:</label> | 167 | <label id="lblClass">Class:</label> |
151 | <article class="fieldRow"><input type="text" id="elementClassName" class="nj-skinned" /></article> | 168 | <article class="fieldRow"><input type="text" id="elementClassName" class="nj-skinned" /></article> |
152 | </section> | 169 | </section> |
170 | <section class="fieldCol"> | ||
171 | <label id="lblName">Name:</label> | ||
172 | <article class="fieldRow"><input type="text" id="elementNameAttribute" class="nj-skinned" /></article> | ||
173 | </section> | ||
153 | </section> | 174 | </section> |
154 | <section id="PosSize"></section> | 175 | <section id="PosSize"></section> |
155 | <section id="customSections"> | 176 | <section id="customSections"> |
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index 1fa65075..eb9faa8b 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js | |||
@@ -25,6 +25,10 @@ exports.Properties = Montage.create(Component, { | |||
25 | value: null | 25 | value: null |
26 | }, | 26 | }, |
27 | 27 | ||
28 | nameAttribute: { | ||
29 | value: null | ||
30 | }, | ||
31 | |||
28 | customSections: { | 32 | customSections: { |
29 | value: [] | 33 | value: [] |
30 | }, | 34 | }, |
@@ -72,6 +76,9 @@ exports.Properties = Montage.create(Component, { | |||
72 | 76 | ||
73 | this.elementId.element.addEventListener("blur", this, false); | 77 | this.elementId.element.addEventListener("blur", this, false); |
74 | this.elementId.element.addEventListener("keyup", 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); | ||
75 | } | 82 | } |
76 | }, | 83 | }, |
77 | 84 | ||
@@ -95,10 +102,18 @@ exports.Properties = Montage.create(Component, { | |||
95 | */ | 102 | */ |
96 | handleBlur: { | 103 | handleBlur: { |
97 | value: function(event) { | 104 | value: function(event) { |
98 | if(this.application.ninja.selectedElements.length) { | 105 | console.log(event.target); |
99 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); | 106 | if(event.target.id === "elementID") { |
100 | } else { | 107 | if(this.application.ninja.selectedElements.length) { |
101 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id); | 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 | } | ||
102 | } | 117 | } |
103 | } | 118 | } |
104 | }, | 119 | }, |
@@ -106,7 +121,11 @@ exports.Properties = Montage.create(Component, { | |||
106 | handleKeyup: { | 121 | handleKeyup: { |
107 | value: function(event) { | 122 | value: function(event) { |
108 | if(event.keyCode === 13) { | 123 | if(event.keyCode === 13) { |
109 | this.elementId.element.blur(); | 124 | if(event.target === "elementID") { |
125 | this.elementId.element.blur(); | ||
126 | } else if(event.target === "elementNameAttribute") { | ||
127 | this.elementNameAttribute.element.blur(); | ||
128 | } | ||
110 | } | 129 | } |
111 | } | 130 | } |
112 | }, | 131 | }, |
@@ -164,6 +183,7 @@ exports.Properties = Montage.create(Component, { | |||
164 | this.elementName = "Stage"; | 183 | this.elementName = "Stage"; |
165 | this.elementId.value = stage.elementModel.id; | 184 | this.elementId.value = stage.elementModel.id; |
166 | this.elementClassName = ""; | 185 | this.elementClassName = ""; |
186 | this.nameAttribute = ""; | ||
167 | 187 | ||
168 | this.positionSize.disablePosition = true; | 188 | this.positionSize.disablePosition = true; |
169 | this.threeD.disableTranslation = true; | 189 | this.threeD.disableTranslation = true; |
@@ -226,6 +246,7 @@ exports.Properties = Montage.create(Component, { | |||
226 | this.elementName = el.elementModel.selection; | 246 | this.elementName = el.elementModel.selection; |
227 | this.elementId.value = el.getAttribute("id") || ""; | 247 | this.elementId.value = el.getAttribute("id") || ""; |
228 | this.elementClassName = el.getAttribute("class"); | 248 | this.elementClassName = el.getAttribute("class"); |
249 | this.nameAttribute = el.getAttribute("name") || ""; | ||
229 | 250 | ||
230 | this.positionSize.disablePosition = false; | 251 | this.positionSize.disablePosition = false; |
231 | this.threeD.disableTranslation = false; | 252 | this.threeD.disableTranslation = false; |