aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rw-r--r--js/controllers/color-controller.js3
-rw-r--r--js/controllers/elements/element-controller.js53
-rw-r--r--js/controllers/elements/shapes-controller.js32
-rw-r--r--js/data/pi/pi-data.js16
-rw-r--r--js/mediators/element-mediator.js11
-rw-r--r--js/models/color-model.js39
-rw-r--r--js/models/element-model.js8
-rw-r--r--js/models/shape-model.js2
-rw-r--r--js/panels/Color/colortoolbar.reel/colortoolbar.js64
-rw-r--r--js/panels/properties/content.reel/content.js119
-rw-r--r--js/tools/LineTool.js4
-rw-r--r--js/tools/OvalTool.js8
-rw-r--r--js/tools/RectTool.js8
13 files changed, 221 insertions, 146 deletions
diff --git a/js/controllers/color-controller.js b/js/controllers/color-controller.js
index 925b525d..e3b15f1c 100644
--- a/js/controllers/color-controller.js
+++ b/js/controllers/color-controller.js
@@ -218,6 +218,9 @@ exports.ColorController = Montage.create(Component, {
218 } else if (mode === 'gradient'){ 218 } else if (mode === 'gradient'){
219 color = e._event.value.value; 219 color = e._event.value.value;
220 } 220 }
221 color.mode = panelMode;
222 color.wasSetByCode = true;
223 color.type = "change";
221 //////////////////////////////////////////////////////////// 224 ////////////////////////////////////////////////////////////
222 //////////////////////////////////////////////////////////// 225 ////////////////////////////////////////////////////////////
223 // 226 //
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 8a0735f7..892ac2f2 100644
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -69,15 +69,56 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
69 // Routines to get/set color properties 69 // Routines to get/set color properties
70 getColor: { 70 getColor: {
71 value: function(el, isFill) { 71 value: function(el, isFill) {
72 var colorObj,
73 color,
74 image;
75
76 // Return cached value if one exists
72 if(isFill) 77 if(isFill)
73 { 78 {
74 return this.application.ninja.stylesController.getElementStyle(el, "background-color"); 79 if(el.elementModel.fill)
80 {
81 return el.elementModel.fill;
82 }
83// return this.application.ninja.stylesController.getElementStyle(el, "background-color");
84 //TODO: Once logic for color and gradient is established, this needs to be revised
85 color = this.getProperty(el, "background-color");
86 image = this.getProperty(el, "background-image");
75 } 87 }
76 else 88 else
77 { 89 {
78 // TODO - Need to figure out which border side user wants 90 // TODO - Need to figure out which border side user wants
79 return this.application.ninja.stylesController.getElementStyle(el, "border-color"); 91 if(el.elementModel.stroke)
92 {
93 return el.elementModel.stroke;
94 }
95 // TODO - Need to figure out which border side user wants
96// return this.application.ninja.stylesController.getElementStyle(el, "border-color");
97 color = this.getProperty(el, "border-color");
98 image = this.getProperty(el, "border-image");
80 } 99 }
100
101 if(color || image) {
102 if (image && image !== 'none' && image.indexOf('-webkit') >= 0) {
103 //Gradient
104 colorObj = this.application.ninja.colorController.getColorObjFromCss(image);
105 } else {
106 //Solid
107 colorObj = this.application.ninja.colorController.getColorObjFromCss(color);
108 }
109 }
110
111 // Update cache
112 if(isFill)
113 {
114 el.elementModel.fill = colorObj;
115 }
116 else
117 {
118 el.elementModel.stroke = colorObj;
119 }
120
121 return colorObj;
81 } 122 }
82 }, 123 },
83 124
@@ -92,7 +133,8 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
92 case 'nocolor': 133 case 'nocolor':
93 this.setProperty(el, "background-image", "none"); 134 this.setProperty(el, "background-image", "none");
94 this.setProperty(el, "background-color", "none"); 135 this.setProperty(el, "background-color", "none");
95 break; 136 el.elementModel.fill = null;
137 return;
96 case 'gradient': 138 case 'gradient':
97 this.setProperty(el, "background-image", color.color.css); 139 this.setProperty(el, "background-image", color.color.css);
98 this.setProperty(el, "background-color", "none"); 140 this.setProperty(el, "background-color", "none");
@@ -106,6 +148,7 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
106 { 148 {
107 this.application.ninja.stylesController.setElementStyle(el, "background-color", color.color.css); 149 this.application.ninja.stylesController.setElementStyle(el, "background-color", color.color.css);
108 } 150 }
151 el.elementModel.fill = color;
109 } 152 }
110 else 153 else
111 { 154 {
@@ -115,7 +158,8 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
115 case 'nocolor': 158 case 'nocolor':
116 this.setProperty(el, "border-image", "none"); 159 this.setProperty(el, "border-image", "none");
117 this.setProperty(el, "border-color", "none"); 160 this.setProperty(el, "border-color", "none");
118 break; 161 el.elementModel.stroke = null;
162 return;
119 case 'gradient': 163 case 'gradient':
120 this.setProperty(el, "border-image", color.color.css); 164 this.setProperty(el, "border-image", color.color.css);
121 this.setProperty(el, "border-color", "none"); 165 this.setProperty(el, "border-color", "none");
@@ -129,6 +173,7 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
129 { 173 {
130 this.application.ninja.stylesController.setElementStyle(el, "border-color", color.color.css); 174 this.application.ninja.stylesController.setElementStyle(el, "border-color", color.color.css);
131 } 175 }
176 el.elementModel.stroke = color;
132 } 177 }
133 } 178 }
134 }, 179 },
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index 92353f28..1717db94 100644
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -48,6 +48,8 @@ exports.ShapesController = Montage.create(CanvasController, {
48 switch(p) { 48 switch(p) {
49 case "strokeSize": 49 case "strokeSize":
50 case "innerRadius": 50 case "innerRadius":
51 case "border":
52 case "background":
51 return this.getShapeProperty(el, p); 53 return this.getShapeProperty(el, p);
52 default: 54 default:
53 return CanvasController.getProperty(el, p); 55 return CanvasController.getProperty(el, p);
@@ -154,30 +156,44 @@ exports.ShapesController = Montage.create(CanvasController, {
154 // Routines to get/set color properties 156 // Routines to get/set color properties
155 getColor: { 157 getColor: {
156 value: function(el, isFill) { 158 value: function(el, isFill) {
159 var color,
160 css;
157 if(isFill) 161 if(isFill)
158 { 162 {
159 return this.getShapeProperty(el, "fill"); 163 if(el.elementModel.shapeModel.background)
164 {
165 return el.elementModel.shapeModel.background;
166 }
167 color = this.getShapeProperty(el, "fill");
160 } 168 }
161 else 169 else
162 { 170 {
163 return this.getShapeProperty(el, "stroke"); 171 if(el.elementModel.shapeModel.border)
172 {
173 return el.elementModel.shapeModel.border;
174 }
175 color = this.getShapeProperty(el, "stroke");
164 } 176 }
177
178 css = this.application.ninja.colorController.colorModel.webGlToCss(color);
179 return this.application.ninja.colorController.getColorObjFromCss(css);
165 } 180 }
166 }, 181 },
167 182
168 setColor: { 183 setColor: {
169 value: function(el, color, isFill) { 184 value: function(el, color, isFill) {
170 // TODO - Format color for webGL before setting 185 var webGl = color.webGlColor || color.color.webGlColor;
171 color = color.webGlColor || color.color.webGlColor;
172 if(isFill) 186 if(isFill)
173 { 187 {
174 el.elementModel.shapeModel.GLGeomObj.setFillColor(color); 188 el.elementModel.shapeModel.GLGeomObj.setFillColor(webGl);
175 this.setShapeProperty(el, "fill", color); 189 this.setShapeProperty(el, "fill", webGl);
190 this.setShapeProperty(el, "background", color);
176 } 191 }
177 else 192 else
178 { 193 {
179 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(color); 194 el.elementModel.shapeModel.GLGeomObj.setStrokeColor(webGl);
180 this.setShapeProperty(el, "stroke", color); 195 this.setShapeProperty(el, "stroke", webGl);
196 this.setShapeProperty(el, "border", color);
181 }