aboutsummaryrefslogtreecommitdiff
path: root/js/components/hottext.reel
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/components/hottext.reel
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/components/hottext.reel')
-rw-r--r--js/components/hottext.reel/hottext.css27
-rw-r--r--js/components/hottext.reel/hottext.html29
-rw-r--r--js/components/hottext.reel/hottext.js381
3 files changed, 437 insertions, 0 deletions
diff --git a/js/components/hottext.reel/hottext.css b/js/components/hottext.reel/hottext.css
new file mode 100644
index 00000000..5909c6c1
--- /dev/null
+++ b/js/components/hottext.reel/hottext.css
@@ -0,0 +1,27 @@
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.hottext {
8 cursor: default;
9 border:none;
10 border-bottom:1px dotted white;
11 width:20px;
12 text-align:center;
13 -webkit-user-select:none;
14 outline:none;
15}
16
17.hottext:hover
18{
19 cursor: pointer;
20}
21
22.hottextInput
23{
24 cursor: default;
25 width:20px;
26 text-align:center;
27} \ No newline at end of file
diff --git a/js/components/hottext.reel/hottext.html b/js/components/hottext.reel/hottext.html
new file mode 100644
index 00000000..3531999c
--- /dev/null
+++ b/js/components/hottext.reel/hottext.html
@@ -0,0 +1,29 @@
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="hottext.css">
11
12
13 <script type="text/montage-serialization">
14 {
15 "owner": {
16 "module": "js/components/hottext.reel",
17 "name": "HotText",
18 "properties": {
19 "element": {"#": "hottext"}
20 }
21 }
22 }
23 </script>
24
25</head>
26<body>
27 <input id="hottext"/>
28</body>
29</html> \ No newline at end of file
diff --git a/js/components/hottext.reel/hottext.js b/js/components/hottext.reel/hottext.js
new file mode 100644
index 00000000..0480597a
--- /dev/null
+++ b/js/components/hottext.reel/hottext.js
@@ -0,0 +1,381 @@
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 SliderBase = require("js/components/sliderbase").SliderBase;
9
10var HotText = exports.HotText = Montage.create(SliderBase, {
11 /* Allow users to specify a function to format the display.
12 * For example, the Color Picker can specify a function to map
13 * the numeric hot text value to hex color values.
14 */
15 labelFunction: {
16 serializable: true,
17 enumerable: true,
18 value: null
19 },
20
21 inputFunction: {
22 serializable: true,
23 enumerable: true,
24 value: parseFloat
25 },
26
27 _numValue: {
28 enumerable: false,
29 value: 0
30 },
31
32 numValue: {
33 serializable: false,
34 enumerable: true,
35 get: function() {
36 return this._numValue;
37 },
38 set: function(value) {
39 if (value < this._minValue) {
40 value = this._minValue;
41 }
42 if (value > this._maxValue) {
43 value = this._maxValue;
44 }
45 if (value !== this._numValue) {
46 this._numValue = Math.round(value * this._decimalPlace)/this._decimalPlace;
47 }
48 }
49 },
50
51 _previousValue: {
52 enumerable: false,
53 value: null
54 },
55
56 _stepSize: {
57 enumerable: false,
58 value: 1
59 },
60
61 stepSize: {
62 serializable: true,
63 enumerable: true,
64 get: function() {
65 return this._stepSize;
66 },
67 set: function(value) {
68 if (value !== this._stepSize) {
69 this._stepSize = value;
70 this.needsDraw = true;
71 }
72 }
73 },
74
75 _stepSizeShift: {
76 enumerable: false,
77 value: 10
78 },
79
80 _xStart: {
81 enumerable: false,
82 value: 0
83 },
84
85 _yStart: {
86 enumerable: false,
87 value: 0
88 },
89
90 // Needed to determine when to commit a value change
91 _wasShiftKeyPressed: {
92 enumerable: false,
93 value: false
94 },
95
96 // for ones, use 1
97 // for tenths, use 10
98 // for hundredths, use 100, etc.
99 _decimalPlace: {
100 enumerable: false,
101 value: 1
102 },
103
104 decimalPlace: {
105 serializable: true,
106 enumerable: true,
107 get: function() {
108 return this._decimalPlace;
109 },
110 set: function(value) {
111 if (value !== this._decimalPlace) {
112 this._decimalPlace = value;
113 this.needsDraw = true;
114 }
115 }
116 },
117
118 // TODO - Need to set max value to 2000 for demo.
119 _maxValue: {
120 enumerable: false,
121 value: 2000
122 },
123
124 value: {
125 serializable: true,
126 enumerable: true,
127 get: function() {
128 return this._value;
129 },
130 set: function(value, fromInput) {
131 if (isNaN(value)) {
132 this._valueSyncedWithInputField = false;
133 this.needsDraw = true;
134 return;
135 }
136 if (value < this._minValue) {
137 value = this._minValue;
138 this._valueSyncedWithInputField = false;
139 this.needsDraw = true;
140 }
141 else if (value > this._maxValue) {
142 value = this._maxValue;
143 this._valueSyncedWithInputField = false;
144 this.needsDraw = true;
145 }
146
147 if (value !== this._value) {
148 this._value = this._numValue = Math.round(value * this._decimalPlace)/this._decimalPlace;
149 this._valueSyncedWithInputField = false;
150 this.needsDraw = true;
151 this._dispatchActionEvent();
152 }
153 }
154 },
155
156 _valueSyncedWithInputField: {
157 enumerable: false,
158 value: false
159 },
160
161 // We don't want to handle every input; we only want to handle input from tab or enter
162 // Thus, we don't listen for an input event; we call this from handleKeydown
163 handleInput: {
164 enumerable: false,
165 value: function() {
166 this._setEventFlags("change", false);
167 Object.getPropertyDescriptor(this, "value").set.call(this, this.inputFunction(this.element.value), true);
168 }
169 },
170
171