diff options
author | Eric Guzman | 2012-02-13 10:29:49 -0800 |
---|---|---|
committer | Eric Guzman | 2012-02-13 10:29:49 -0800 |
commit | e4893f7d3c3b9bd7967973197c3ffb5d3a075c91 (patch) | |
tree | f3d4fd9d96ba0dcf846fbf66153fb443bd60f767 /js/components/tools-properties | |
parent | ef032412216d437ce1c7dfc9050ab41adf0594c0 (diff) | |
parent | e142611e22718b1f1d1696902ad9161ec5f33f98 (diff) | |
download | ninja-e4893f7d3c3b9bd7967973197c3ffb5d3a075c91.tar.gz |
Merge branch 'refs/heads/master' into TreeComponents
Diffstat (limited to 'js/components/tools-properties')
5 files changed, 477 insertions, 155 deletions
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 7af35a03..74a3a747 100644 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.html +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html | |||
@@ -12,12 +12,25 @@ | |||
12 | <script type="text/montage-serialization"> | 12 | <script type="text/montage-serialization"> |
13 | { | 13 | { |
14 | 14 | ||
15 | "strokeSizeHT": { | ||
16 | "module": "js/components/hottextunit.reel", | ||
17 | "name": "HotTextUnit", | ||
18 | "properties": { | ||
19 | "element": {"#": "strokeSize"}, | ||
20 | "minValue": 1, | ||
21 | "maxValue": 100, | ||
22 | "value": 1, | ||
23 | "decimalPlace": 10, | ||
24 | "acceptableUnits" : ["px", "pt"] | ||
25 | } | ||
26 | }, | ||
27 | |||
15 | "owner": { | 28 | "owner": { |
16 | "module": "js/components/tools-properties/pen-properties.reel", | 29 | "module": "js/components/tools-properties/pen-properties.reel", |
17 | "name": "PenProperties", | 30 | "name": "PenProperties", |
18 | "properties": { | 31 | "properties": { |
19 | "element": {"#": "penProperties"}, | 32 | "element": {"#": "penProperties"}, |
20 | "reset": {"#": "resetPenTool"} | 33 | "_strokeSize": {"@": "strokeSizeHT"} |
21 | } | 34 | } |
22 | } | 35 | } |
23 | } | 36 | } |
@@ -26,9 +39,12 @@ | |||
26 | </head> | 39 | </head> |
27 | 40 | ||
28 | <body> | 41 | <body> |
29 | <div id="penProperties" class="subToolHolderPanel"> | 42 | <div id="penProperties" class="subToolHolderPanel"> |
30 | <button id="resetPenTool" tabindex="0" class="montage-button" aria-role="button" aria-busy="false">Reset</button> | 43 | <div id="strokesContainer" class="leftLabel" style="margin-left:25px; padding-top: 3px;"> |
44 | <label class="label"> Stroke:</label> | ||
45 | <div id="strokeSize" class="label"></div> | ||
31 | </div> | 46 | </div> |
47 | </div> | ||
32 | </body> | 48 | </body> |
33 | 49 | ||
34 | </html> \ No newline at end of file | 50 | </html> \ No newline at end of file |
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 ec8efa69..b57f9a6f 100644 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.js +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.js | |||
@@ -5,24 +5,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage; | 7 | var Montage = require("montage/core/core").Montage; |
8 | var Component = require("montage/ui/component").Component; | ||
9 | var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; | ||
10 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; | 8 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; |
11 | 9 | ||
12 | exports.PenProperties = Montage.create(ToolProperties, { | 10 | exports.PenProperties = Montage.create(ToolProperties, { |
13 | reset: { value: null }, | 11 | strokeSize: { |
14 | 12 | get: function() { return this._strokeSize; } | |
15 | _subPrepare: { | ||
16 | value: function() { | ||
17 | this.reset.addEventListener("click", this, false); | ||
18 | } | ||
19 | }, | ||
20 | |||
21 | handleClick: { | ||
22 | value: function(event) { | ||
23 | var newEvent = document.createEvent( "CustomEvent" ); | ||
24 | newEvent.initCustomEvent( "resetPenTool", false, true ); | ||
25 | defaultEventManager.dispatchEvent( newEvent ); | ||
26 | } | ||
27 | } | 13 | } |
28 | }); \ No newline at end of file | 14 | }); \ No newline at end of file |
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.css b/js/components/tools-properties/text-properties.reel/text-properties.css index d581c6c3..6aa61812 100644 --- a/js/components/tools-properties/text-properties.reel/text-properties.css +++ b/js/components/tools-properties/text-properties.reel/text-properties.css | |||
@@ -5,29 +5,33 @@ | |||
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | .optionsTextTool { | 7 | .optionsTextTool { |
8 | display: -webkit-box; | 8 | padding: 6px; |
9 | -webkit-box-orient:horizontal; | ||
10 | -webkit-box-align: stretch; | ||
11 | padding: 5px; | ||
12 | } | 9 | } |
13 | 10 | ||
14 | 11 | .optionsTextTool .btnGroup { | |
15 | .optionsTextTool > * { | 12 | padding: 0px 8px; |
16 | -webkit-box-flex:0; | ||
17 | } | 13 | } |
18 | 14 | ||
19 | .optionsTextTool .button { | 15 | .optionsTextTool > *, .optionsTextTool .btnGroup > * { |
20 | width: auto; | 16 | float:left; |
21 | |||
22 | } | 17 | } |
23 | 18 | ||
24 | .optionsTextTool .hottextunit { | 19 | .optionsTextTool button { |
25 | padding-top:5px; | 20 | width: auto; |
21 | padding: 4px 8px !important; | ||
22 | margin-left:4px; | ||
26 | } | 23 | } |
27 | 24 | ||
28 | .optionsTextTool .label, .optionsTextTool .hottextunit { | 25 | .optionsTextTool .label, .optionsTextTool .hottextunit { |
29 | float:none; | ||
30 | font-size:11px; | 26 | font-size:11px; |
31 | } | 27 | } |
32 | 28 | ||
29 | .optionsTextTool .fontSelection { | ||
30 | width:100px; | ||
31 | } | ||
33 | 32 | ||
33 | .optionsTextTool .fontColor { | ||
34 | width: 20px; | ||
35 | height: 18px; | ||
36 | margin: 2px 6px; | ||
37 | } \ No newline at end of file | ||
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html index fb57c06d..7ded1236 100644 --- a/js/components/tools-properties/text-properties.reel/text-properties.html +++ b/js/components/tools-properties/text-properties.reel/text-properties.html | |||
@@ -33,8 +33,8 @@ | |||
33 | "alignCenter": {"@": "alignCenter"}, | 33 | "alignCenter": {"@": "alignCenter"}, |
34 | "alignRight": {"@": "alignRight"}, | 34 | "alignRight": {"@": "alignRight"}, |
35 | "alignJustify": {"@": "alignJustify"}, | 35 | "alignJustify": {"@": "alignJustify"}, |
36 | "indentRight": {"@": "indentRight"}, | 36 | "indent": {"@": "indent"}, |
37 | "indentLeft": {"@": "indentLeft"}, | 37 | "outdent": {"@": "outdent"}, |
38 | "numberedList": {"@": "numberedList"}, | 38 | "numberedList": {"@": "numberedList"}, |
39 | "bulletedList": {"@": "bulletedList"} | 39 | "bulletedList": {"@": "bulletedList"} |
40 | } | 40 | } |
@@ -57,8 +57,16 @@ | |||
57 | "module": "js/components/combobox.reel", | 57 | "module": "js/components/combobox.reel", |
58 | "name": "Combobox", | 58 | "name": "Combobox", |
59 | "properties": { | 59 | "properties": { |
60 | "element": {"#": "fontSelection"} | 60 | "element": {"#": "fontSelection"}, |
61 | } | 61 | "identifier": "fontSelection" |
62 | }, | ||
63 | "listeners": [ | ||
64 | { | ||
65 | "type": "change", | ||
66 | "listener": {"@": "owner"} | ||
67 | } | ||
68 | ] | ||
69 | |||
62 | }, | 70 | }, |
63 | "fontSettings": { | 71 | "fontSettings": { |
64 | "module": "js/components/button.reel", | 72 | "module": "js/components/button.reel", |
@@ -69,131 +77,226 @@ | |||
69 | }, | 77 | }, |
70 | 78 | ||
71 | "fontSize": { | 79 | "fontSize": { |
72 | "module": "js/components/hottextunit.reel", | 80 | "module": "js/components/combobox.reel", |
73 | "name": "HotTextUnit", | 81 | "name": "Combobox", |
74 | "properties": { | 82 | "properties": { |
75 | "element": {"#": "fontSize"} | 83 | "element": {"#": "fontSize"}, |
76 | } | 84 | "identifier": "fontSize" |
77 | }, | 85 | }, |