aboutsummaryrefslogtreecommitdiff
path: root/js/components
diff options
context:
space:
mode:
Diffstat (limited to 'js/components')
-rwxr-xr-xjs/components/button.reel/button.css40
-rwxr-xr-xjs/components/button.reel/button.html26
-rwxr-xr-xjs/components/button.reel/button.js225
-rwxr-xr-xjs/components/tools-properties/text-properties.reel/text-properties.html2
4 files changed, 1 insertions, 292 deletions
diff --git a/js/components/button.reel/button.css b/js/components/button.reel/button.css
deleted file mode 100755
index f50a9873..00000000
--- a/js/components/button.reel/button.css
+++ /dev/null
@@ -1,40 +0,0 @@
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.button {
8 border:none;
9 cursor:default;
10 text-align:center;
11 -webkit-user-select:none;
12 opacity:0.8;
13 display:table-cell;
14 vertical-align:middle;
15 width:100%;
16 height:100%;
17 background-color:#333333;
18 color:white;
19}
20
21.button:hover
22{
23 opacity:1;
24}
25
26.button:active
27{
28 outline:solid 1px black;
29}
30
31.button.on
32{
33 background-color: #333333;
34}
35
36.button.off
37{
38 background-color: #cccccc;
39 color:black;
40} \ No newline at end of file
diff --git a/js/components/button.reel/button.html b/js/components/button.reel/button.html
deleted file mode 100755
index d0398a6a..00000000
--- a/js/components/button.reel/button.html
+++ /dev/null
@@ -1,26 +0,0 @@
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 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="button.css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "module": "js/components/button.reel",
15 "name": "Button",
16 "properties": {
17 "element": {"#": "button"}
18 }
19 }
20 }
21 </script>
22</head>
23<body>
24 <button id="button" class="button"></button>
25</body>
26</html> \ No newline at end of file
diff --git a/js/components/button.reel/button.js b/js/components/button.reel/button.js
deleted file mode 100755
index 2d26c8b4..00000000
--- a/js/components/button.reel/button.js
+++ /dev/null
@@ -1,225 +0,0 @@
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,
8Component = require("montage/ui/component").Component;
9
10var Button = exports.Button = Montage.create(Component, {
11 // Button state
12 _focused: {
13 value: false
14 },
15
16 _pressed: {
17 value: false
18 },
19
20 _isToggleButton: {
21 value: false
22 },
23
24 isToggleButton: {
25 serializable: true,
26 enumerable: true,
27 get: function() {
28 return this._isToggleButton;
29 },
30 set: function(value) {
31 if (value !== this._isToggleButton) {
32 this._isToggleButton = value;
33 this.needsDraw = true;
34 }
35 }
36 },
37
38 _value: {
39 value: false
40 },
41
42 value: {
43 serializable: true,
44 enumerable: true,
45 get: function() {
46 return this._value;
47 },
48 set: function(value) {
49 if ( (value !== null) && (value !== this._value) ) {
50 this._value = value;
51 this.needsDraw = true;
52 }
53 }
54 },
55
56 _label: {
57 value: ""
58 },
59
60 label: {
61 serializable: true,
62 enumerable: true,
63 get: function() {
64 return this._label;
65 },
66 set: function(value) {
67 if (value !== this._label) {
68 this._label = value;
69 this.needsDraw = true;
70 }
71 }
72 },
73
74 // TODO - Allow user to specify up, over and down states
75 _onState: {
76 value: "on"
77 },
78
79 onState: {
80 serializable: true,
81 enumerable: true,
82 get: function() {
83 return this._onState;
84 },
85 set: function(value) {
86 if (value !== this._onState) {
87 this._onState = value;
88 this.needsDraw = true;
89 }
90 }
91 },
92
93 _offState: {
94 value: "off"
95 },
96
97 offState: {
98 serializable: true,
99 enumerable: true,
100 get: function() {
101 return this._offState;
102 },
103 set: function(value) {
104 if (value !== this._offState) {
105 this._offState = value;
106 this.needsDraw = true;
107 }
108 }
109 },
110
111 // Low-level event listeners
112 handleTouchstart: {
113 value: function(event) {
114 // TODO preventingDefault disables the magnifying class
115 // sadly it also disables double tapping on the button to zoom...
116 event.preventDefault();
117 this._acknowledgeIntent();
118 }
119 },
120
121 handleMousedown: {
122 value: function(event) {
123 this._acknowledgeIntent();
124 }
125 },
126
127 handleTouchend: {
128 value: function(event) {
129 this._interpretInteraction(event);
130 }
131 },
132
133 handleTouchcancel: {
134 value: function(event) {
135 console.log("cancel!")
136 // this._interpretInteraction(event);
137 }
138 },
139
140 handleMouseup: {
141 value: function(event) {
142 this._interpretInteraction(event);
143 }
144 },
145
146 // Internal state management
147 _acknowledgeIntent: {
148 value: function() {
149 this._pressed = true;
150 this.element.classList.add("pressed");
151 }
152 },
153
154 _interpretInteraction: {
155 value: function(event) {
156
157 if (!this._pressed) {
158 return;
159 }
160
161 this.value = !this.value;
162
163 this._pressed = false;
164 this._dispatchActionEvent();
165 }
166 },
167
168 _dispatchActionEvent: {
169 value: function() {
170 var actionEvent = document.createEvent("CustomEvent");
171 actionEvent.initCustomEvent("action", true, true);