diff options
author | Armen Kesablyan | 2012-02-13 02:05:07 -0800 |
---|---|---|
committer | Armen Kesablyan | 2012-02-13 02:05:07 -0800 |
commit | 0bb13001ce07e5256a6e395325a898ab4ac93e1c (patch) | |
tree | f23c62b455a379fd99a29d9ed5d3c4f4ff760f5b /js/components/tools-properties/text-properties.reel/text-properties.js | |
parent | ce963d45cdf2703d2d4eedfa94394b178f86e0f1 (diff) | |
download | ninja-0bb13001ce07e5256a6e395325a898ab4ac93e1c.tar.gz |
Fixed Color on text edit. Also Fixed Indent & Outdent button. toggle bullet and numbered now bound to text tool
Diffstat (limited to 'js/components/tools-properties/text-properties.reel/text-properties.js')
-rw-r--r-- | js/components/tools-properties/text-properties.reel/text-properties.js | 116 |
1 files changed, 95 insertions, 21 deletions
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js index 55274322..7ae0cfda 100644 --- a/js/components/tools-properties/text-properties.reel/text-properties.js +++ b/js/components/tools-properties/text-properties.reel/text-properties.js | |||
@@ -6,6 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
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; | 8 | var Component = require("montage/ui/component").Component; |
9 | var ArrayController = require("montage/ui/controller/array-controller").ArrayController; | ||
9 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; | 10 | var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; |
10 | 11 | ||
11 | exports.TextProperties = Montage.create(ToolProperties, { | 12 | exports.TextProperties = Montage.create(ToolProperties, { |
@@ -29,18 +30,57 @@ exports.TextProperties = Montage.create(ToolProperties, { | |||
29 | outdent: {value: null}, | 30 | outdent: {value: null}, |
30 | numberedList: {value: null}, | 31 | numberedList: {value: null}, |
31 | bulletedList: {value: null}, | 32 | bulletedList: {value: null}, |
33 | fontTypes: {value: null}, | ||
34 | fontSizes: {value: null}, | ||
32 | 35 | ||
33 | prepareForDraw: { | 36 | prepareForDraw: { |
34 | value: function() { | 37 | value: function() { |
38 | // code commented out because montage ui element select-input is incomplete. Will switch back when they fix or actually complete the component | ||
39 | // this.fontTypes = Montage.create(ArrayController); | ||
40 | // this.fontTypes.content = [ | ||
41 | // { value: "Arial", text: "Arial" }, | ||
42 | // { value: "Arial Black", text: "Arial Black" }, | ||
43 | // { value: "Courier New", text: "Courier New" }, | ||
44 | // { value: "Garamond", text: "Garamond" }, | ||
45 | // { value: "Georgia", text: "Georgia" }, | ||
46 | // { value: "Open Sans", text: "Open Sans" }, | ||
47 | // { value: "Tahoma", text: "Tahoma" }, | ||
48 | // { value: "Times New Roman", text: "Times New Roman" }, | ||
49 | // { value: "Trebuchet MS", text: "Trebuchet MS" }, | ||
50 | // { value: "Verdana", text: "Verdana" } | ||
51 | // ]; | ||
52 | |||
53 | //this.fontSelection.contentController = this.fontTypes; | ||
54 | // | ||
55 | // this.fontSizes = Montage.create(ArrayController); | ||
56 | // this.fontSizes.content = [ | ||
57 | // { value: 1, text: "8pt" }, | ||
58 | // { value: 2, text: "10pt" }, | ||
59 | // { value: 3, text: "12pt" }, | ||
60 | // { value: 4, text: "14pt" }, | ||
61 | // { value: 5, text: "18pt" }, | ||
62 | // { value: 6, text: "24pt" }, | ||
63 | // { value: 7, text: "36pt" } | ||
64 | // ]; | ||
65 | // this.fontSize.contentController = this.fontSizes; | ||
66 | |||
35 | this.fontSelection.items = ["Arial", "Arial Black", "Courier New", "Garamond", "Georgia", "Open Sans", "Tahoma", "Times New Roman", "Trebuchet MS", "Verdana"]; | 67 | this.fontSelection.items = ["Arial", "Arial Black", "Courier New", "Garamond", "Georgia", "Open Sans", "Tahoma", "Times New Roman", "Trebuchet MS", "Verdana"]; |
36 | this.tagType.items = ["div", "span", "p", "section", "article", "h1", "h2", "h3", "h4", "h5", "h6"]; | ||
37 | this.fontSize.items = ["8pt","10pt","12pt","14pt","18pt","24pt","36pt"]; | 68 | this.fontSize.items = ["8pt","10pt","12pt","14pt","18pt","24pt","36pt"]; |
69 | this.tagType.items = ["div", "span", "p", "section", "article", "h1", "h2", "h3", "h4", "h5", "h6"]; | ||
38 | } | 70 | } |
39 | }, | 71 | }, |
40 | 72 | ||
41 | handleEditorSelect: { | 73 | handleEditorSelect: { |
42 | value: function(e) { | 74 | value: function(e) { |
43 | this.application.ninja.stage.textTool.updateStates(); | 75 | this.application.ninja.stage.textTool.updateStates(); |
76 | // this.fontSelection.value = this.application.ninja.stage.textTool.states.fontname; | ||
77 | // | ||
78 | // for( var i = 0; i < this.fontSize.items.length; i++) { | ||
79 | // if (this.application.ninja.stage.textTool.states.fontsize == i + 1) { | ||
80 | // this.fontSize.value = this.fontSize.items[i] | ||
81 | // break; | ||
82 | // } | ||
83 | // } | ||
44 | } | 84 | } |
45 | }, | 85 | }, |
46 | 86 | ||
@@ -133,6 +173,18 @@ exports.TextProperties = Montage.create(ToolProperties, { | |||
133 | } | 173 | } |
134 | }, | 174 | }, |
135 | 175 | ||
176 | handleBulletedListAction: { | ||
177 | value: function(e) { | ||
178 | this.application.ninja.stage.textTool.doAction("insertunorderedlist"); | ||
179 | } | ||
180 | }, | ||
181 | |||
182 | handleNumberedListAction: { | ||
183 | value: function(e) { | ||
184 | this.application.ninja.stage.textTool.doAction("insertorderedlist"); | ||
185 | } | ||
186 | }, | ||
187 | |||
136 | handleFontSizeChange: { | 188 | handleFontSizeChange: { |
137 | value: function(e) { | 189 | value: function(e) { |
138 | //We need the index of whats selected. This is a temporary solution til we can have a variable amount for font-size. | 190 | //We need the index of whats selected. This is a temporary solution til we can have a variable amount for font-size. |
@@ -214,6 +266,34 @@ exports.TextProperties = Montage.create(ToolProperties, { | |||
214 | oneway: true | 266 | oneway: true |
215 | }); | 267 | }); |
216 | 268 | ||
269 | Object.defineBinding(this.numberedList, "pressed", { | ||
270 | boundObject: this.application.ninja.stage.textTool, | ||
271 | boundObjectPropertyPath: "states.insertorderedlist", | ||
272 | boundValueMutator: this.validatePressed, | ||
273 | oneway: true | ||
274 | }); | ||
275 | |||
276 | Object.defineBinding(this.bulletedList, "pressed", { | ||
277 | boundObject: this.application.ninja.stage.textTool, | ||
278 | boundObjectPropertyPath: "states.insertunorderedlist", | ||
279 | boundValueMutator: this.validatePressed, | ||
280 | oneway: true | ||
281 | }); | ||
282 | |||
283 | Object.defineBinding(this.fontSelection, "value", { | ||
284 | boundObject: this.application.ninja.stage.textTool, | ||
285 | boundObjectPropertyPath: "states.fontname", | ||
286 | boundValueMutator: this.validateFont, | ||
287 | oneway: true | ||
288 | }); | ||
289 | |||
290 | Object.defineBinding(this.fontSize, "value", { | ||
291 | boundObject: this.application.ninja.stage.textTool, | ||
292 | boundObjectPropertyPath: "states.fontsize", | ||
293 | boundValueMutator: this.validateFontSize.bind(this), | ||
294 | oneway: true | ||
295 | }); | ||
296 | |||
217 | this.initialized = true; | 297 | this.initialized = true; |
218 | } | 298 | } |
219 | 299 | ||
@@ -226,40 +306,34 @@ exports.TextProperties = Montage.create(ToolProperties, { | |||
226 | } | 306 | } |
227 | }, | 307 | }, |
228 | 308 | ||
229 | initialized: { | 309 | validateFont: { |
230 | value: false | 310 | value: function(val) { |
311 | return val; | ||
312 | } | ||
231 | }, | 313 | }, |
232 | 314 | ||
233 | handleFontSelectionChange: { | 315 | validateFontSize: { |
234 | value: function() { | 316 | value: function(val) { |
235 | this.application.ninja.stage.textTool.doAction("fontname", this.fontSelection.value); | 317 | val = parseInt(val); |
236 | this.application.ninja.stage.textTool.element.focus(); | 318 | return this.fontSize.items[val]; |
237 | } | 319 | } |
238 | }, | 320 | }, |
239 | 321 | ||
240 | handleNumberedListAction: { | 322 | initialized: { |
241 | value: function(e) { | 323 | value: false |
242 | //this.numberedList.value = false; | ||
243 | this.bulletedList.value = false; | ||
244 | this.application.ninja.stage.textTool.doAction("insertorderedlist"); | ||
245 | this.application.ninja.stage.textTool.element.focus(); | ||
246 | } | ||
247 | }, | 324 | }, |
248 | 325 | ||
249 | handleBulletedListAction: { | 326 | handleFontSelectionChange: { |
250 | value: function(e) { | 327 | value: function(e) { |
251 | this.numberedList.value = false; | 328 | this.application.ninja.stage.textTool.doAction("fontname", this.fontSelection.value); |
252 | //this.bulletedList.value = false; | ||
253 | this.application.ninja.stage.textTool.doAction("insertunorderedlist"); | ||
254 | this.application.ninja.stage.textTool.element.focus(); | 329 | this.application.ninja.stage.textTool.element.focus(); |
255 | } | 330 | } |
256 | }, | 331 | }, |
257 | 332 | ||
258 | handleFontColorChange: { | 333 | handleFontColorChange: { |
259 | value: functi |