diff options
-rwxr-xr-x | js/controllers/elements/element-controller.js | 113 | ||||
-rw-r--r-- | js/data/panels-data.js | 12 | ||||
-rwxr-xr-x | js/mediators/element-mediator.js | 133 | ||||
-rwxr-xr-x | js/panels/Panel.reel/Panel.js | 5 | ||||
-rwxr-xr-x | js/panels/PanelContainer.reel/PanelContainer.html | 11 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.css | 0 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.html | 29 | ||||
-rw-r--r-- | js/panels/history-panel/history-item.reel/history-item.js | 32 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.css | 34 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.html | 106 | ||||
-rw-r--r-- | js/panels/history-panel/history.reel/history.js | 26 | ||||
-rwxr-xr-x | js/panels/properties.reel/properties.js | 5 | ||||
-rwxr-xr-x | js/tools/SelectionTool.js | 57 |
13 files changed, 342 insertions, 221 deletions
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index 2ac84452..0f17dd46 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js | |||
@@ -47,10 +47,20 @@ exports.ElementController = Montage.create(Component, { | |||
47 | }, | 47 | }, |
48 | 48 | ||
49 | setProperties: { | 49 | setProperties: { |
50 | value: function(el, props, index) { | 50 | value: function(element, properties) { |
51 | for(var p in props) { | 51 | /* Array of properties is not supported yet |
52 | this.application.ninja.stylesController.setElementStyle(el, p, props[p][index]); | 52 | if(Array.isArray(properties)) { |
53 | |||
54 | elements.forEach(function(property) { | ||
55 | this.application.ninja.stylesController.setElementStyle(element, p, props[p][index]); | ||
56 | }); | ||
57 | } else { | ||
53 | } | 58 | } |
59 | */ | ||
60 | |||
61 | for(var property in properties) { | ||
62 | this.application.ninja.stylesController.setElementStyle(element, property, properties[property]); | ||
63 | } | ||
54 | } | 64 | } |
55 | }, | 65 | }, |
56 | 66 | ||
@@ -65,37 +75,29 @@ exports.ElementController = Montage.create(Component, { | |||
65 | // borderSide : "top", "right", "bottom", or "left" | 75 | // borderSide : "top", "right", "bottom", or "left" |
66 | getColor: { | 76 | getColor: { |
67 | value: function(el, isFill, borderSide) { | 77 | value: function(el, isFill, borderSide) { |
68 | var colorObj, | 78 | var colorObj, color, image; |
69 | color, | ||
70 | image; | ||
71 | 79 | ||
72 | // Return cached value if one exists | 80 | // Return cached value if one exists |
73 | if(isFill) | 81 | if(isFill) { |
74 | { | 82 | if(el.elementModel.fill) { |
75 | if(el.elementModel.fill) | ||
76 | { | ||
77 | return el.elementModel.fill; | 83 | return el.elementModel.fill; |
78 | } | 84 | } |
79 | //TODO: Once logic for color and gradient is established, this needs to be revised | 85 | //TODO: Once logic for color and gradient is established, this needs to be revised |
80 | color = this.getProperty(el, "background-color"); | 86 | color = this.getProperty(el, "background-color"); |
81 | image = this.getProperty(el, "background-image"); | 87 | image = this.getProperty(el, "background-image"); |
82 | } | 88 | } else { |
83 | else | ||
84 | { | ||
85 | // Try getting border color from specific side first | 89 | // Try getting border color from specific side first |
86 | if(borderSide) | 90 | if(borderSide) { |
87 | { | ||
88 | color = this.getProperty(el, "border-" + borderSide + "-color"); | 91 | color = this.getProperty(el, "border-" + borderSide + "-color"); |
89 | image = this.getProperty(el, "border-" + borderSide + "-image"); | 92 | image = this.getProperty(el, "border-" + borderSide + "-image"); |
90 | } | 93 | } |
91 | 94 | ||
92 | // If no color was found, look up the shared border color | 95 | // If no color was found, look up the shared border color |
93 | if(!color && !image) | 96 | if(!color && !image) { |
94 | { | 97 | if(el.elementModel.stroke) { |
95 | if(el.elementModel.stroke) | ||
96 | { | ||
97 | return el.elementModel.stroke; | 98 | return el.elementModel.stroke; |
98 | } | 99 | } |
100 | |||
99 | color = this.getProperty(el, "border-color"); | 101 | color = this.getProperty(el, "border-color"); |
100 | image = this.getProperty(el, "border-image"); | 102 | image = this.getProperty(el, "border-image"); |
101 | } | 103 | } |
@@ -112,17 +114,12 @@ exports.ElementController = Montage.create(Component, { | |||
112 | } | 114 | } |
113 | 115 | ||
114 | // Update cache | 116 | // Update cache |
115 | if(isFill) | 117 | if(isFill) { |
116 | { | ||
117 | el.elementModel.fill = colorObj; | 118 | el.elementModel.fill = colorObj; |
118 | } | 119 | } else if(!borderSide) { |
119 | else if(!borderSide) | ||
120 | { | ||
121 | // TODO - Need to update border style and width also | 120 | // TODO - Need to update border style and width also |
122 | el.elementModel.stroke = colorObj; | 121 | el.elementModel.stroke = colorObj; |
123 | } | 122 | } else { |
124 | else | ||
125 | { | ||
126 | // TODO - Should update specific border sides too | 123 | // TODO - Should update specific border sides too |
127 | } | 124 | } |
128 | 125 | ||
@@ -133,10 +130,9 @@ exports.ElementController = Montage.create(Component, { | |||
133 | setColor: { | 130 | setColor: { |
134 | value: function(el, color, isFill) { | 131 | value: function(el, color, isFill) { |
135 | var mode = color.mode; | 132 | var mode = color.mode; |
136 | if(isFill) | 133 | |
137 | { | 134 | if(isFill) { |
138 | if(mode) | 135 | if(mode) { |
139 | { | ||
140 | switch (mode) { | 136 | switch (mode) { |
141 | case 'nocolor': | 137 | case 'nocolor': |
142 | this.setProperty(el, "background-image", "none"); | 138 | this.setProperty(el, "background-image", "none"); |
@@ -152,12 +148,10 @@ exports.ElementController = Montage.create(Component, { | |||
152 | this.setProperty(el, "background-color", color.color.css); | 148 | this.setProperty(el, "background-color", color.color.css); |
153 | } | 149 | } |
154 | } | 150 | } |
151 | |||
155 | el.elementModel.fill = color; | 152 | el.elementModel.fill = color; |
156 | } | 153 | } else { |
157 | else | 154 | if(mode) { |
158 | { | ||
159 | if(mode) | ||
160 | { | ||
161 | switch (mode) { | 155 | switch (mode) { |
162 | case 'nocolor': | 156 | case 'nocolor': |
163 | this.setProperty(el, "border-image", "none"); | 157 | this.setProperty(el, "border-image", "none"); |
@@ -167,20 +161,16 @@ exports.ElementController = Montage.create(Component, { | |||
167 | case 'gradient': | 161 | case 'gradient': |
168 | this.setProperty(el, "border-image", color.color.css); | 162 | this.setProperty(el, "border-image", color.color.css); |
169 | this.setProperty(el, "border-color", "none"); | 163 | this.setProperty(el, "border-color", "none"); |
170 | if(color.borderInfo) | 164 | if(color.borderInfo) { |
171 | { | 165 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); |
172 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + | ||
173 | color.borderInfo.borderUnits); | ||
174 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | 166 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); |
175 | } | 167 | } |
176 | break; | 168 | break; |
177 | default: | 169 | default: |
178 | this.setProperty(el, "border-image", "none"); | 170 | this.setProperty(el, "border-image", "none"); |
179 | this.setProperty(el, "border-color", color.color.css); | 171 | this.setProperty(el, "border-color", color.color.css); |
180 | if(color.borderInfo) | 172 | if(color.borderInfo) { |
181 | { | 173 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); |
182 | this.setProperty(el, "border-width", color.borderInfo.borderWidth + | ||
183 | color.borderInfo.borderUnits); | ||
184 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); | 174 | this.setProperty(el, "border-style", color.borderInfo.borderStyle); |
185 | } | 175 | } |
186 | } | 176 | } |
@@ -209,8 +199,7 @@ exports.ElementController = Montage.create(Component, { | |||
209 | // Routines to get/set 3D properties | 199 | // Routines to get/set 3D properties |
210 | get3DProperty: { | 200 | get3DProperty: { |
211 | value: function(el, prop) { | 201 | value: function(el, prop) { |
212 | if(el.elementModel && el.elementModel.props3D) | 202 | if(el.elementModel && el.elementModel.props3D) { |
213 | { | ||
214 | return el.elementModel.props3D[prop]; | 203 | return el.elementModel.props3D[prop]; |
215 | } | 204 | } |
216 | } | 205 | } |
@@ -218,16 +207,12 @@ exports.ElementController = Montage.create(Component, { | |||
218 | 207 | ||
219 | getMatrix: { | 208 | getMatrix: { |
220 | value: function(el) { | 209 | value: function(el) { |
221 | if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.matrix3d) | 210 | if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.matrix3d) { |
222 | { | ||
223 | return el.elementModel.props3D.matrix3d.slice(0); | 211 | return el.elementModel.props3D.matrix3d.slice(0); |
224 | } | 212 | } else { |
225 | else | ||
226 | { | ||
227 | var mat; | 213 | var mat; |
228 | 214 | ||
229 | if (el) |