aboutsummaryrefslogtreecommitdiff
path: root/js/components/tools-properties
diff options
context:
space:
mode:
Diffstat (limited to 'js/components/tools-properties')
-rwxr-xr-xjs/components/tools-properties/brush-properties.reel/brush-properties.css22
-rwxr-xr-xjs/components/tools-properties/brush-properties.reel/brush-properties.html27
-rwxr-xr-xjs/components/tools-properties/brush-properties.reel/brush-properties.js49
-rwxr-xr-xjs/components/tools-properties/fill-properties.reel/fill-properties.css7
-rwxr-xr-xjs/components/tools-properties/fill-properties.reel/fill-properties.html5
-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.css22
-rwxr-xr-xjs/components/tools-properties/pen-properties.reel/pen-properties.html11
-rwxr-xr-xjs/components/tools-properties/pen-properties.reel/pen-properties.js83
-rwxr-xr-xjs/components/tools-properties/pencil-properties.reel/pencil-properties.css6
-rwxr-xr-xjs/components/tools-properties/pencil-properties.reel/pencil-properties.html31
-rwxr-xr-xjs/components/tools-properties/pencil-properties.reel/pencil-properties.js25
-rwxr-xr-xjs/components/tools-properties/rect-properties.reel/rect-properties.js10
-rwxr-xr-xjs/components/tools-properties/selection-properties.reel/selection-properties.css8
-rwxr-xr-xjs/components/tools-properties/selection-properties.reel/selection-properties.html10
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.css25
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.html16
-rwxr-xr-xjs/components/tools-properties/shape-properties.reel/shape-properties.js125
-rwxr-xr-xjs/components/tools-properties/tag-properties.reel/tag-properties.css16
-rwxr-xr-xjs/components/tools-properties/tag-properties.reel/tag-properties.html18
-rwxr-xr-xjs/components/tools-properties/tag-properties.reel/tag-properties.js47
-rwxr-xr-xjs/components/tools-properties/text-properties.reel/text-properties.html3
-rwxr-xr-xjs/components/tools-properties/text-properties.reel/text-properties.js1
24 files changed, 455 insertions, 128 deletions
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.css b/js/components/tools-properties/brush-properties.reel/brush-properties.css
index 7f1b0f7f..0912dd7e 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.css
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.css
@@ -3,4 +3,26 @@
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
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
7 .optionsBrushTool {
8 padding: 6px;
9}
6 10
11 .optionsBrushTool > * {
12 float:left;
13}
14
15 .optionsBrushTool .fillColorCtrl {
16 width: 20px;
17 height: 18px;
18 margin-left: 3px;
19 margin-right: 8px;
20 border: 1px black solid;
21}
22
23 .optionsBrushTool .colorCtrlIcon {
24 width: 20px;
25 height: 20px;
26 -webkit-transform: scale(0.8);
27 background-color: rgb(40, 40, 40);
28} \ No newline at end of file
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html
index e7aaf0e8..38b317e2 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.html
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html
@@ -64,6 +64,7 @@
64 "prototype": "js/components/tools-properties/brush-properties.reel", 64 "prototype": "js/components/tools-properties/brush-properties.reel",
65 "properties": { 65 "properties": {
66 "element": {"#": "brushProperties"}, 66 "element": {"#": "brushProperties"},
67 "_fillColorCtrl": {"#": "fillColorCtrl"},
67 "_strokeSize": {"@": "strokeSizeHT"}, 68 "_strokeSize": {"@": "strokeSizeHT"},
68 "_strokeHardness": {"@": "strokeHardnessHT"}, 69 "_strokeHardness": {"@": "strokeHardnessHT"},
69 "_doSmoothing": {"#": "doSmoothing"}, 70 "_doSmoothing": {"#": "doSmoothing"},
@@ -79,19 +80,19 @@
79 </head> 80 </head>
80 81
81 <body> 82 <body>
82 <div data-montage-id="brushProperties" class="subToolHolderPanel"> 83 <div data-montage-id="brushProperties" class="subToolHolderPanel optionsBrushTool">
83 <div data-montage-id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;"> 84 <div class="colorCtrlIcon FillTool"></div>
84 <label class="label"> Width:</label> 85 <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div>
85 <div data-montage-id="strokeSize" class="label"></div> 86 <div class="nj-divider divider-vertical">&nbsp;</div>
86 <label class="label"> Hardness:</label> 87 <label class="label"> Width:</label>
87 <div data-montage-id="strokeHardness" class="label"></div> 88 <div data-montage-id="strokeSize" class="label"></div>
88 <label class="label"><input id="doSmoothing" type="checkbox" name="doSmoothingControl" class="checkBoxAlign"/>Smoothing</label> 89 <label class="label"> Hardness:</label>
89 <div data-montage-id="smoothingAmount" class="label"></div> 90 <div data-montage-id="strokeHardness" class="label"></div>
90 <label class="label"><input id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="checkBoxAlign"/>Calligraphic</label> 91 <input data-montage-id="doSmoothing" type="checkbox" name="doSmoothingControl" class="nj-skinned"/><label class="label">Smoothing</label>
91 <label class="label" id="angleLabel"> Angle:</label> 92 <div data-montage-id="smoothingAmount" class="label"></div>
92 <div data-montage-id="strokeAngle" class="label"></div> 93 <input data-montage-id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="nj-skinned"/><label class="label">Calligraphic</label>
93 94 <label data-montage-id="angleLabel class="label"">Angle:</label>
94 </div> 95 <div data-montage-id="strokeAngle" class="label"></div>
95 </div> 96 </div>
96 </body> 97 </body>
97 98
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..7a0d21f1 100755
--- a/js/components/tools-properties/brush-properties.reel/brush-properties.js
+++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js
@@ -8,7 +8,46 @@ var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component; 8var Component = require("montage/ui/component").Component;
9var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; 9var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
10 10
11exports.BrushProperties = Montage.create(ToolProperties, { 11var BrushProperties = exports.BrushProperties = Montage.create(ToolProperties, {
12 addedColorChips: { value: false },
13
14 _fill: {
15 enumerable: false,
16 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] }
17 },
18
19 fill: {
20 enumerable: true,
21 get: function () {
22 return this._fill;
23 },
24 set: function (value) {
25 if (value !== this._fill) {
26 this._fill = value;
27 }
28 }
29 },
30
31 draw: {
32 enumerable: false,
33 value: function () {
34 Object.getPrototypeOf(BrushProperties).draw.call(this);
35
36 if (this.addedColorChips === false && this.application.ninja.colorController.colorPanelDrawn) {
37 this._fillColorCtrl.props = { side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80 };
38 this.application.ninja.colorController.addButton("chip", this._fillColorCtrl);
39
40 this._fillColorCtrl.addEventListener("change", this.handleFillColorChange.bind(this), false);
41
42 this.addedColorChips = true;
43 }
44
45 if (this.addedColorChips) {
46 this._fillColorCtrl.color(this._fill.colorMode, this._fill.color);
47 }
48 }
49 },
50
12 _subPrepare: { 51 _subPrepare: {
13 value: function() { 52 value: function() {
14 this.handleChange(null); 53 this.handleChange(null);
@@ -36,6 +75,14 @@ exports.BrushProperties = Montage.create(ToolProperties, {
36 } 75 }
37 } 76 }
38 }, 77 },
78
79 handleFillColorChange: {
80 value: function (e) {
81 this.fill = e._event;
82 this.fill.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color);
83 }
84 },
85
39 strokeSize: { 86 strokeSize: {
40 get: function() { return this._strokeSize; } 87 get: function() { return this._strokeSize; }
41 }, 88