diff options
Diffstat (limited to 'js/components/tools-properties')
6 files changed, 83 insertions, 29 deletions
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 608111bd..98442164 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.html +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html | |||
@@ -33,7 +33,8 @@ | |||
33 | "maxValue": 100, | 33 | "maxValue": 100, |
34 | "value": 100, | 34 | "value": 100, |
35 | "decimalPlace": 10, | 35 | "decimalPlace": 10, |
36 | "acceptableUnits" : ["px", "pt"] | 36 | "acceptableUnits" : ["%"], |
37 | "units" : "%" | ||
37 | } | 38 | } |
38 | }, | 39 | }, |
39 | 40 | ||
@@ -46,7 +47,20 @@ | |||
46 | "maxValue": 90, | 47 | "maxValue": 90, |
47 | "value": 0, | 48 | "value": 0, |
48 | "decimalPlace": 10, | 49 | "decimalPlace": 10, |
49 | "acceptableUnits" : ["px", "pt"] | 50 | "acceptableUnits" : ["deg."], |
51 | "units" : "deg." | ||
52 | } | ||
53 | }, | ||
54 | |||
55 | "smoothingAmountHT": { | ||
56 | "module": "js/components/hottext.reel", | ||
57 | "name": "HotText", | ||
58 | "properties": { | ||
59 | "element": {"#": "smoothingAmount"}, | ||
60 | "minValue": 0, | ||
61 | "maxValue": 100, | ||
62 | "value": 0, | ||
63 | "decimalPlace": 10 | ||
50 | } | 64 | } |
51 | }, | 65 | }, |
52 | 66 | ||
@@ -58,8 +72,10 @@ | |||
58 | "_strokeSize": {"@": "strokeSizeHT"}, | 72 | "_strokeSize": {"@": "strokeSizeHT"}, |
59 | "_strokeHardness": {"@": "strokeHardnessHT"}, | 73 | "_strokeHardness": {"@": "strokeHardnessHT"}, |
60 | "_doSmoothing": {"#": "doSmoothing"}, | 74 | "_doSmoothing": {"#": "doSmoothing"}, |
75 | "_smoothingAmount": {"@": "smoothingAmountHT"}, | ||
61 | "_useCalligraphic":{"#": "useCalligraphic"}, | 76 | "_useCalligraphic":{"#": "useCalligraphic"}, |
62 | "_strokeAngle": {"@": "strokeAngleHT"} | 77 | "_strokeAngle": {"@": "strokeAngleHT"}, |
78 | "_angleLabel": {"#": "angleLabel"} | ||
63 | } | 79 | } |
64 | } | 80 | } |
65 | } | 81 | } |
@@ -75,8 +91,9 @@ | |||
75 | <label class="label"> Hardness:</label> | 91 | <label class="label"> Hardness:</label> |
76 | <div id="strokeHardness" class="label"></div> | 92 | <div id="strokeHardness" class="label"></div> |
77 | <label class="label"><input id="doSmoothing" type="checkbox" name="doSmoothingControl" class="checkBoxAlign"/>Smoothing</label> | 93 | <label class="label"><input id="doSmoothing" type="checkbox" name="doSmoothingControl" class="checkBoxAlign"/>Smoothing</label> |
94 | <div id="smoothingAmount" class="label"></div> | ||
78 | <label class="label"><input id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="checkBoxAlign"/>Calligraphic</label> | 95 | <label class="label"><input id="useCalligraphic" type="checkbox" name="useCalligraphicControl" class="checkBoxAlign"/>Calligraphic</label> |
79 | <label class="label"> Angle:</label> | 96 | <label class="label" id="angleLabel"> Angle:</label> |
80 | <div id="strokeAngle" class="label"></div> | 97 | <div id="strokeAngle" class="label"></div> |
81 | 98 | ||
82 | </div> | 99 | </div> |
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 e6faa0f0..fdcd50f8 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.js +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js | |||
@@ -9,6 +9,33 @@ var Component = require("montage/ui/component").Component; | |||
9 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; | 9 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; |
10 | 10 | ||
11 | exports.BrushProperties = Montage.create(ToolProperties, { | 11 | exports.BrushProperties = Montage.create(ToolProperties, { |
12 | _subPrepare: { | ||
13 | value: function() { | ||
14 | this.handleChange(null); | ||
15 | this._useCalligraphic.addEventListener("change", this, false); | ||
16 | this._doSmoothing.addEventListener("change", this, false); | ||
17 | } | ||
18 | }, | ||
19 | handleChange: { | ||
20 | value: function(event) { | ||
21 | if(this._useCalligraphic.checked) { | ||
22 | this._strokeAngle.element.style["display"] = ""; | ||
23 | this._strokeAngle.visible = true; | ||
24 | this._angleLabel.style["display"] = ""; | ||
25 | } else { | ||
26 | this._strokeAngle.element.style["display"] = "none"; | ||
27 | this._strokeAngle.visible = false; | ||
28 | this._angleLabel.style["display"] = "none"; | ||
29 | } | ||
30 | if(this._doSmoothing.checked) { | ||
31 | this._smoothingAmount.element.style["display"] = ""; | ||
32 | this._smoothingAmount.visible = true; | ||
33 | } else { | ||
34 | this._smoothingAmount.element.style["display"] = "none"; | ||
35 | this._smoothingAmount.visible = false; | ||
36 | } | ||
37 | } | ||
38 | }, | ||
12 | strokeSize: { | 39 | strokeSize: { |
13 | get: function() { return this._strokeSize; } | 40 | get: function() { return this._strokeSize; } |
14 | }, | 41 | }, |
@@ -18,6 +45,9 @@ exports.BrushProperties = Montage.create(ToolProperties, { | |||
18 | doSmoothing:{ | 45 | doSmoothing:{ |
19 | get: function() {return this._doSmoothing.checked; } | 46 | get: function() {return this._doSmoothing.checked; } |
20 | }, | 47 | }, |
48 | smoothingAmount:{ | ||
49 | get: function() {return this._smoothingAmount;} | ||
50 | }, | ||
21 | useCalligraphic: { | 51 | useCalligraphic: { |
22 | get: function() {return this._useCalligraphic.checked;} | 52 | get: function() {return this._useCalligraphic.checked;} |
23 | }, | 53 | }, |
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.css b/js/components/tools-properties/rect-properties.reel/rect-properties.css index 74509555..cbd9dde8 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.css +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.css | |||
@@ -4,16 +4,15 @@ | |||
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 | .rectProperties .button { | 7 | #lockButton { |
8 | border:none; | 8 | float:left; |
9 | cursor:default; | 9 | border: none; |
10 | text-align:center; | 10 | background-color: transparent; |
11 | -webkit-user-select:none; | 11 | top: 2px; |
12 | opacity:0.8; | 12 | opacity: 0.7; |
13 | display:table-cell; | 13 | width: 17px; |
14 | vertical-align:middle; | 14 | height: 18px; |
15 | background-color:#333333; | 15 | margin-right: 10px; |
16 | color:white; | ||
17 | } | 16 | } |
18 | 17 | ||
19 | .rectProperties .subToolButton { | 18 | .rectProperties .subToolButton { |
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html index 214ff1d5..ceb761b9 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.html +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html | |||
@@ -50,12 +50,23 @@ | |||
50 | } | 50 | } |
51 | }, | 51 | }, |
52 | 52 | ||
53 | "lockButton": { | ||
54 | "prototype": "montage/ui/toggle-button.reel", | ||
55 | "properties": { | ||
56 | "element": {"#": "lockButton"}, | ||
57 | "pressed": true, | ||
58 | "pressedClass": "lockUp", | ||
59 | "preventFocus": true, | ||
60 | "identifier": "ratio" | ||
61 | } | ||
62 | }, | ||
63 | |||
53 | "owner": { | 64 | "owner": { |
54 | "module": "js/components/tools-properties/rect-properties.reel", | 65 | "module": "js/components/tools-properties/rect-properties.reel", |
55 | "name": "RectProperties", | 66 | "name": "RectProperties", |
56 | "properties": { | 67 | "properties": { |
57 | "element": {"#": "rectProperties"}, | 68 | "element": {"#": "rectProperties"}, |
58 | "lockButton": {"#": "lockButton"}, | 69 | "lockButton": {"@": "lockButton"}, |
59 | "TLRadiusControl": {"@": "hottext1"}, | 70 | "TLRadiusControl": {"@": "hottext1"}, |
60 | "TRRadiusControl": {"@": "hottext2"}, | 71 | "TRRadiusControl": {"@": "hottext2"}, |
61 | "BLRadiusControl": {"@": "hottext3"}, | 72 | "BLRadiusControl": {"@": "hottext3"}, |
@@ -69,7 +80,8 @@ | |||
69 | 80 | ||
70 | <body> | 81 | <body> |
71 | <div id="rectProperties" class="rectProperties"> | 82 | <div id="rectProperties" class="rectProperties"> |
72 | <button id="lockButton" class="unselectable subToolButton button LockToolUp" style=" margin-left:20px"></button> | 83 | <!--<button id="lockButton" class="unselectable subToolButton button LockToolUp" style=" margin-left:20px"></button>--> |
84 | <button id="lockButton" class="unlock" style="margin-left:20px"></button> | ||
73 | <div id="TLRadiusLabel" class="unselectable subToolButton cornerRadius topLeft"></div> | 85 | <div id="TLRadiusLabel" class="unselectable subToolButton cornerRadius topLeft"></div> |
74 | <div id="TLRadiusControl" class="label"></div> |