aboutsummaryrefslogtreecommitdiff
path: root/js/components/checkbox.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/components/checkbox.reel')
-rw-r--r--js/components/checkbox.reel/checkbox.html24
-rw-r--r--js/components/checkbox.reel/checkbox.js99
2 files changed, 123 insertions, 0 deletions
diff --git a/js/components/checkbox.reel/checkbox.html b/js/components/checkbox.reel/checkbox.html
new file mode 100644
index 00000000..3d523a98
--- /dev/null
+++ b/js/components/checkbox.reel/checkbox.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/checkbox.reel",
13 "name": "Checkbox",
14 "properties": {
15 "element": {"#": "ch_comp"}
16 }
17 }
18 }
19 </script>
20</head>
21<body>
22 <input id="ch_comp" class="nj-skinned" type="checkbox">
23</body>
24</html> \ No newline at end of file
diff --git a/js/components/checkbox.reel/checkbox.js b/js/components/checkbox.reel/checkbox.js
new file mode 100644
index 00000000..f06e5830
--- /dev/null
+++ b/js/components/checkbox.reel/checkbox.js
@@ -0,0 +1,99 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No 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
7var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component;
9
10exports.Checkbox = Montage.create(Component, {
11
12 _valueSyncedWithInputField: {
13 enumerable: false,
14 value: false
15 },
16
17 _wasSetByCode: {
18 enumerable: false,
19 value: true
20 },
21
22 prependLabel: {
23 value: false
24 },
25
26 label: {
27 value: null
28 },
29
30 value: {
31 value: false
32 },
33
34 _checked: {
35 enumerable: false,
36 value: false
37 },
38
39 checked: {
40 enumerable: true,
41 serializable: true,
42 get: function() {
43 return this._checked;
44 },
45 set: function(value) {
46 this._checked = value;
47 this.needsDraw = true;
48
49 var e = document.createEvent("CustomEvent");
50 e.initEvent("change", true, true);
51 e.type = "change";
52 e.wasSetByCode = this._wasSetByCode;
53 e.value = value;
54 this.value = value;
55 this.dispatchEvent(e);
56
57 this._wasSetByCode = true;
58 }
59 },
60
61 handleChange:
62 {
63 value:function(event)
64 {
65 this._valueSyncedWithInputField = true;
66 this._wasSetByCode = false;
67 this.checked = this.element.checked;
68 }
69 },
70 handleClick: {
71 value: function() {
72 this._wasSetByCode = false;
73 this.checked = !this.element.checked;
74 }
75 },
76
77 draw: {
78 value: function() {
79 if(!this._valueSyncedWithInputField)
80 {
81 this.element.checked = this._checked;
82 }
83 this._valueSyncedWithInputField = false;
84 }
85 },
86
87 prepareForDraw: {
88 value: function() {
89 if (this.label !== null) {
90 var b = document.createElement("label");
91 b.innerHTML = this.label;
92 this.element.appendChild(b);
93 b.addEventListener("click", this, false);
94 }
95 this.element.addEventListener("change", this, false);
96 }
97 }
98
99}); \ No newline at end of file