diff options
Diffstat (limited to 'js/components/textfield.reel')
-rw-r--r-- | js/components/textfield.reel/textfield.html | 24 | ||||
-rw-r--r-- | js/components/textfield.reel/textfield.js | 88 |
2 files changed, 112 insertions, 0 deletions
diff --git a/js/components/textfield.reel/textfield.html b/js/components/textfield.reel/textfield.html new file mode 100644 index 00000000..89adf776 --- /dev/null +++ b/js/components/textfield.reel/textfield.html | |||
@@ -0,0 +1,24 @@ | |||
1 | <!DOCTYPE HTML> | ||
2 | <!-- <copyright> | ||
3 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
4 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
6 | </copyright> --> | ||
7 | <html> | ||
8 | <head> | ||
9 | <script type="text/montage-serialization"> | ||
10 | { | ||
11 | "owner": { | ||
12 | "module": "js/components/textfield.reel", | ||
13 | "name": "TextField", | ||
14 | "properties": { | ||
15 | "element": {"#": "textfield"} | ||
16 | } | ||
17 | } | ||
18 | } | ||
19 | </script> | ||
20 | </head> | ||
21 | <body> | ||
22 | <input id="textfield" class="nj-skinned" type="text"> | ||
23 | </body> | ||
24 | </html> \ No newline at end of file | ||
diff --git a/js/components/textfield.reel/textfield.js b/js/components/textfield.reel/textfield.js new file mode 100644 index 00000000..5e22fcc7 --- /dev/null +++ b/js/components/textfield.reel/textfield.js | |||
@@ -0,0 +1,88 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<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. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage; | ||
8 | var Component = require("montage/ui/component").Component; | ||
9 | |||
10 | exports.TextField = Montage.create(Component, { | ||
11 | |||
12 | _valueSyncedWithInputField: { | ||
13 | enumerable: false, | ||
14 | value: false | ||
15 | }, | ||
16 | |||
17 | _value: { | ||
18 | enumerable: false, | ||
19 | value: "" | ||
20 | }, | ||
21 | |||
22 | value: { | ||
23 | enumerable: true, | ||
24 | serializable: true, | ||
25 | get: function() { | ||
26 | return this._value; | ||
27 | }, | ||
28 | set: function(value) { | ||
29 | this._value = value; | ||
30 | this.needsDraw = true; | ||
31 | } | ||
32 | }, | ||
33 | |||
34 | handleKeyup: { | ||
35 | value: function(event) { | ||
36 | if(event.keyCode === 13) { | ||
37 | this.element.blur(); | ||
38 | } | ||
39 | } | ||
40 | }, | ||
41 | |||
42 | handleBlur: { | ||
43 | value: function(event) { | ||
44 | this._value = this.element.value; | ||
45 | this._valueSyncedWithInputField = true; | ||
46 | |||
47 | var e = document.createEvent("CustomEvent"); | ||
48 | e.initEvent("change", true, true); | ||
49 | e.type = "change"; | ||
50 | e.value = this._value; | ||
51 | this.dispatchEvent(e); | ||
52 | } | ||
53 | }, | ||
54 | /* | ||
55 | handleChange: | ||
56 | { | ||
57 | value:function(event) | ||
58 | { | ||
59 | this._value = this.element.value; | ||
60 | this._valueSyncedWithInputField = true; | ||
61 | |||
62 | var e = document.createEvent("CustomEvent"); | ||
63 | e.initEvent("change", true, true); | ||
64 | e.type = "change"; | ||
65 | e.value = this._value; | ||
66 | this.dispatchEvent(e); | ||
67 | } | ||
68 | }, | ||
69 | */ | ||
70 | |||
71 | draw: { | ||
72 | value: function() { | ||
73 | if(!this._valueSyncedWithInputField) | ||
74 | { | ||
75 | this.element.value = this._value; | ||
76 | this._valueSyncedWithInputField = true; | ||
77 | } | ||
78 | } | ||
79 | }, | ||
80 | |||
81 | prepareForDraw: { | ||
82 | value: function() { | ||
83 | //this.element.addEventListener("change", this, false); | ||
84 | this.element.addEventListener("blur", this, false); | ||
85 | this.element.addEventListener("keyup", this, false); | ||
86 | } | ||
87 | } | ||
88 | }); \ No newline at end of file | ||