aboutsummaryrefslogtreecommitdiff
path: root/js/components
diff options
context:
space:
mode:
authorJohn Mayhew2012-05-03 15:11:56 -0700
committerJohn Mayhew2012-05-03 15:11:56 -0700
commit1a759361b82127f9d5c1428dc889fffdf2daaf86 (patch)
tree92e62aa215418d864e5224797a974cb9841d4b90 /js/components
parent6b1a6994d98a18b45016b97ac8d81483109a586c (diff)
downloadninja-1a759361b82127f9d5c1428dc889fffdf2daaf86.tar.gz
First round of moving color chips into the sub tools. Shape and Pen tool now have chips in the sub tool bar. Still need to complete adding chips to the Brush tool and finalizing the subtool bar layout to our spec for all of the subtools.
Diffstat (limited to 'js/components')
-rwxr-xr-xjs/components/tools-properties/brush-properties.reel/brush-properties.js1
-rwxr-xr-xjs/components/tools-properties/line-properties.reel/line-properties.js8
-rwxr-xr-xjs/components/tools-properties/oval-properties.reel/oval-properties.js8
-rwxr-xr-xjs/components/tools-properties/pen-properties.reel/pen-properties.css20
-rwxr-xr-xjs/components/tools-properties/pen-properties.reel/pen-properties.html16
-rwxr-xr-xjs/components/tools-properties/pen-properties.reel/pen-properties.js83
-rwxr-xr-xjs/components/tools-properties/rect-properties.reel/rect-properties.js10
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.css22
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.html14
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.js125
-rwxr-xr-xjs/components/tools-properties/text-properties.reel/text-properties.html4
-rwxr-xr-xjs/components/tools-properties/text-properties.reel/text-properties.js1
12 files changed, 274 insertions, 38 deletions
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.js b/js/components/tools-properties/brush-properties.reel/brush-properties.js
index fdcd50f8..677cd2d9 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.js
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js
@@ -36,6 +36,7 @@ exports.BrushProperties = Montage.create(ToolProperties, {
36 } 36 }
37 } 37 }
38 }, 38 },
39
39 strokeSize: { 40 strokeSize: {
40 get: function() { return this._strokeSize; } 41 get: function() { return this._strokeSize; }
41 }, 42 },
diff --git a/js/components/tools-properties/line-properties.reel/line-properties.js b/js/components/tools-properties/line-properties.reel/line-properties.js
index e1ecf790..ce8c0494 100755
--- a/js/components/tools-properties/line-properties.reel/line-properties.js
+++ b/js/components/tools-properties/line-properties.reel/line-properties.js
@@ -24,6 +24,14 @@ exports.LineProperties = Montage.create(ToolProperties, {
24 }, 24 },
25 25
26 // Public API 26 // Public API
27 fill: {
28 get: function () { return this.base.fill; }
29 },
30
31 stroke: {
32 get: function () { return this.base.stroke; }
33 },
34
27 use3D: { 35 use3D: {
28 get: function() { return this.base._use3D; } 36 get: function() { return this.base._use3D; }
29 }, 37 },
diff --git a/js/components/tools-properties/oval-properties.reel/oval-properties.js b/js/components/tools-properties/oval-properties.reel/oval-properties.js
index ddeb64ee..3edd9214 100755
--- a/js/components/tools-properties/oval-properties.reel/oval-properties.js
+++ b/js/components/tools-properties/oval-properties.reel/oval-properties.js
@@ -24,6 +24,14 @@ exports.OvalProperties = Montage.create(ToolProperties, {
24 }, 24 },
25 25
26 // Public API 26 // Public API
27 fill: {
28 get: function () { return this.base.fill; }
29 },
30
31 stroke: {
32 get: function () { return this.base.stroke; }
33 },
34
27 use3D: { 35 use3D: {
28 get: function() { return this.base._use3D; } 36 get: function() { return this.base._use3D; }
29 }, 37 },
diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.css b/js/components/tools-properties/pen-properties.reel/pen-properties.css
index 7f1b0f7f..01a0ca1f 100755
--- a/js/components/tools-properties/pen-properties.reel/pen-properties.css
+++ b/js/components/tools-properties/pen-properties.reel/pen-properties.css
@@ -4,3 +4,23 @@
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */ 5 </copyright> */
6 6
7
8 .optionsPenTool {
9 padding: 6px;
10}
11
12 .optionsPenTool > * {
13 float:left;
14}
15
16 .optionsPenTool .fillColorCtrl, .optionsPenTool .strokeColorCtrl {
17 width: 20px;
18 height: 18px;
19 margin: 2px 6px;
20}
21
22 .optionsPenTool .colorCtrlIcon {
23 width: 20px;
24 height: 20px;
25 background-color: rgb(54, 54, 54);
26} \ No newline at end of file
diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html
index e835f69d..176663df 100755
--- a/js/components/tools-properties/pen-properties.reel/pen-properties.html
+++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html
@@ -28,20 +28,24 @@
28 "prototype": "js/components/tools-properties/pen-properties.reel", 28 "prototype": "js/components/tools-properties/pen-properties.reel",
29 "properties": { 29 "properties": {
30 "element": {"#": "penProperties"}, 30 "element": {"#": "penProperties"},
31 "_fillColorCtrl": {"#": "fillColorCtrl"},
32 "_strokeColorCtrl": {"#": "strokeColorCtrl"},
31 "_strokeSize": {"@": "strokeSizeHT"} 33 "_strokeSize": {"@": "strokeSizeHT"}
32 } 34 }
33 } 35 }
34 } 36 }
35 </script> 37 </script>
36 38
37 </head> 39 </head>
38 40
39 <body> 41 <body>
40 <div data-montage-id="penProperties" class="subToolHolderPanel"> 42 <div data-montage-id="penProperties" class="subToolHolderPanel optionsPenTool">
41 <div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;"> 43 <div class="colorCtrlIcon FillTool"></div>
42 <label class="label"> Stroke:</label> 44 <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div>
43 <div id="strokeSize" class="label"></div> 45 <div class="colorCtrlIcon PencilTool"></div>
44 </div> 46 <div data-montage-id="strokeColorCtrl" class="strokeColorCtrl"></div>
47 <label class="label"> Stroke:</label>
48 <div id="strokeSize" class="label"></div>
45 </div> 49 </div>
46 </body> 50 </body>
47 51
diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.js b/js/components/tools-properties/pen-properties.reel/pen-properties.js
index b57f9a6f..cd205e07 100755
--- a/js/components/tools-properties/pen-properties.reel/pen-properties.js
+++ b/js/components/tools-properties/pen-properties.reel/pen-properties.js
@@ -7,8 +7,87 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
7var Montage = require("montage/core/core").Montage; 7var Montage = require("montage/core/core").Montage;
8var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; 8var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
9 9
10exports.PenProperties = Montage.create(ToolProperties, { 10var PenProperties = exports.PenProperties = Montage.create(ToolProperties, {
11 addedColorChips: { value: false },
12
13 _fill: {
14 enumerable: false,
15 value: { colorMode: 'rgb', color: { r: 255, g: 255, b: 255, a: 1, css: 'rgb(255,255,255)', mode: 'rgb', wasSetByCode: true, type: 'change' }, webGlColor: [1, 1, 1, 1] }
16 },
17
18 _stroke: {
19 enumerable: false,
20 value: { colorMode: 'rgb', color: { r: 0, g: 0, b: 0, a: 1, css: 'rgb(0,0,0)', mode: 'rgb', wasSetByCode: true, type: 'change' }, webGlColor: [0, 0, 0, 1] }
21 },
22
23 stroke: {
24 enumerable: true,
25 get: function () {
26 return this._stroke;
27 },
28 set: function (value) {
29 if (value !== this._stroke) {
30 this._stroke = value;
31 }
32 }
33 },
34
35 fill: {
36 enumerable: true,
37 get: function () {
38 return this._fill;
39 },
40 set: function (value) {
41 if (value !== this._fill) {
42 this._fill = value;
43 }
44 }
45 },
46
11 strokeSize: { 47 strokeSize: {
12 get: function() { return this._strokeSize; } 48 get: function () {
49 return this._strokeSize;
50 }
51 },
52
53 draw: {
54 enumerable: false,
55 value: function () {
56 Object.getPrototypeOf(PenProperties).draw.call(this);
57
58 if (this.addedColorChips === false && this.application.ninja.colorController.colorPanelDrawn) {
59 // setup fill color
60 this._fillColorCtrl.props = { side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80 };
61 this.application.ninja.colorController.addButton("chip", this._fillColorCtrl);
62
63 // setup stroke color