diff options
19 files changed, 283 insertions, 384 deletions
diff --git a/js/components/colorbar.reel/colorbar.html b/js/components/colorbar.reel/colorbar.html index 2e189c87..5018b1f4 100755 --- a/js/components/colorbar.reel/colorbar.html +++ b/js/components/colorbar.reel/colorbar.html | |||
@@ -6,11 +6,9 @@ | |||
6 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 6 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
7 | </copyright> | 7 | </copyright> |
8 | --> | 8 | --> |
9 | <html lang="en"> | 9 | <html> |
10 | <head> | 10 | <head> |
11 | 11 | ||
12 | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | ||
13 | |||
14 | <link rel="stylesheet" type="text/css" href="css/colorbar.css"> | 12 | <link rel="stylesheet" type="text/css" href="css/colorbar.css"> |
15 | 13 | ||
16 | <script type="text/montage-serialization"> | 14 | <script type="text/montage-serialization"> |
diff --git a/js/components/colorbar.reel/colorbar.js b/js/components/colorbar.reel/colorbar.js index e547b9bc..e5dd84cf 100755 --- a/js/components/colorbar.reel/colorbar.js +++ b/js/components/colorbar.reel/colorbar.js | |||
@@ -19,28 +19,22 @@ exports.ColorBar = Montage.create(Component, { | |||
19 | //////////////////////////////////////////////////////////////////// | 19 | //////////////////////////////////////////////////////////////////// |
20 | //Width of spectrum (not including b/w buttons) | 20 | //Width of spectrum (not including b/w buttons) |
21 | _colorBarSpectrumWidth: { | 21 | _colorBarSpectrumWidth: { |
22 | enumerable: false, | ||
23 | value: null | 22 | value: null |
24 | }, | 23 | }, |
25 | //////////////////////////////////////////////////////////////////// | 24 | //////////////////////////////////////////////////////////////////// |
26 | //Width of spectrum steps (used to calculate size of B/W buttons) | 25 | //Width of spectrum steps (used to calculate size of B/W buttons) |
27 | _colorBarSpectrumWidthSteps: { | 26 | _colorBarSpectrumWidthSteps: { |
28 | enumerable: false, | ||
29 | value: 10 | 27 | value: 10 |
30 | }, | 28 | }, |
31 | //////////////////////////////////////////////////////////////////// | 29 | //////////////////////////////////////////////////////////////////// |
32 | //Default value | 30 | //Default value |
33 | _value: { | 31 | _value: { |
34 | enumerable: false, | ||
35 | value: {h: 0, s: 0, v: 0} | 32 | value: {h: 0, s: 0, v: 0} |
36 | }, | 33 | }, |
37 | //////////////////////////////////////////////////////////////////// | 34 | //////////////////////////////////////////////////////////////////// |
38 | //HSV Value selected from bar | 35 | //HSV Value selected from bar |
39 | value: { | 36 | value: { |
40 | enumerable: true, | 37 | get: function() {return this._value;}, |
41 | get: function() { | ||
42 | return this._value; | ||
43 | }, | ||
44 | set: function(value) { | 38 | set: function(value) { |
45 | if (value) { | 39 | if (value) { |
46 | //Checking for limits (Max and Min HSV values) | 40 | //Checking for limits (Max and Min HSV values) |
@@ -73,7 +67,6 @@ exports.ColorBar = Montage.create(Component, { | |||
73 | //////////////////////////////////////////////////////////////////// | 67 | //////////////////////////////////////////////////////////////////// |
74 | // | 68 | // |
75 | prepareForDraw: { | 69 | prepareForDraw: { |
76 | enumerable: false, | ||
77 | value: function() { | 70 | value: function() { |
78 | //Nothing | 71 | //Nothing |
79 | } | 72 | } |
@@ -81,7 +74,6 @@ exports.ColorBar = Montage.create(Component, { | |||
81 | //////////////////////////////////////////////////////////////////// | 74 | //////////////////////////////////////////////////////////////////// |
82 | //Setting up and drawing canvas to object | 75 | //Setting up and drawing canvas to object |
83 | willDraw: { | 76 | willDraw: { |
84 | enumerable: false, | ||
85 | value: function() { | 77 | value: function() { |
86 | //Setting the width and height of the canvas to match container | 78 | //Setting the width and height of the canvas to match container |
87 | this.element.width = parseInt(window.getComputedStyle(this.element, null).width); | 79 | this.element.width = parseInt(window.getComputedStyle(this.element, null).width); |
@@ -168,7 +160,6 @@ exports.ColorBar = Montage.create(Component, { | |||
168 | //////////////////////////////////////////////////////////////////// | 160 | //////////////////////////////////////////////////////////////////// |
169 | //Used to check mouse mode and display cursor | 161 | //Used to check mouse mode and display cursor |
170 | _isMouseDown: { | 162 | _isMouseDown: { |
171 | enumerable: false, | ||
172 | value: false | 163 | value: false |
173 | }, | 164 | }, |
174 | //////////////////////////////////////////////////////////////////// | 165 | //////////////////////////////////////////////////////////////////// |
@@ -224,4 +215,5 @@ exports.ColorBar = Montage.create(Component, { | |||
224 | } | 215 | } |
225 | } | 216 | } |
226 | //////////////////////////////////////////////////////////////////// | 217 | //////////////////////////////////////////////////////////////////// |
218 | //////////////////////////////////////////////////////////////////// | ||
227 | }); \ No newline at end of file | 219 | }); \ No newline at end of file |
diff --git a/js/components/gradientpicker.reel/gradientpicker.html b/js/components/gradientpicker.reel/gradientpicker.html index b0e23653..4765a677 100755 --- a/js/components/gradientpicker.reel/gradientpicker.html +++ b/js/components/gradientpicker.reel/gradientpicker.html | |||
@@ -6,11 +6,10 @@ | |||
6 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 6 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
7 | </copyright> | 7 | </copyright> |
8 | --> | 8 | --> |
9 | <html lang="en"> | 9 | <html> |
10 | |||
10 | <head> | 11 | <head> |
11 | 12 | ||
12 | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | ||
13 | |||
14 | <link rel="stylesheet" type="text/css" href="css/gradientpicker.css"> | 13 | <link rel="stylesheet" type="text/css" href="css/gradientpicker.css"> |
15 | 14 | ||
16 | <script type="text/montage-serialization"> | 15 | <script type="text/montage-serialization"> |
@@ -18,7 +17,12 @@ | |||
18 | "owner": { | 17 | "owner": { |
19 | "prototype": "js/components/gradientpicker.reel[GradientPicker]", | 18 | "prototype": "js/components/gradientpicker.reel[GradientPicker]", |
20 | "properties": { | 19 | "properties": { |
21 | "element": {"#": "gradientpicker"} | 20 | "element": {"#": "gradientpicker"}, |
21 | "radioLinear": {"#": "radio_linear"}, | ||
22 | "radioRadial": {"#": "radio_radial"}, | ||
23 | "trackCover": {"#": "cover"}, | ||
24 | "trackMain": {"#": "track"}, | ||
25 | "trackChips": {"#": "chips"} | ||
22 | 26 | ||
23 | } | 27 | } |
24 | } | 28 | } |
@@ -32,14 +36,25 @@ | |||
32 | <div data-montage-id="gradientpicker" class="gradientpicker"> | 36 | <div data-montage-id="gradientpicker" class="gradientpicker"> |
33 | 37 | ||
34 | <div class="type"> | 38 | <div class="type"> |
35 | <input type="radio" class="cp_gp_linear radio" name="gradient" value="linear" id="cp_gp_linear" checked="like a boss"/><label for="cp_gp_linear">Linear Gradient</label> | 39 | |
36 | <input type="radio" class="cp_gp_radial radio" name="gradient" value="radial" id="cp_gp_radial"/><label for="cp_gp_radial">Radial Gradient</label> | 40 | <input data-montage-id="radio_linear" type="radio" class="cp_gp_linear radio" name="gradient" value="linear" id="cp_gp_linear" checked="like a boss"/> |
41 | <label for="cp_gp_linear">Linear Gradient</label> | ||
42 | |||
43 | <input data-montage-id="radio_radial" type="radio" class="cp_gp_radial radio" name="gradient" value="radial" id="cp_gp_radial"/> | ||
44 | <label for="cp_gp_radial">Radial Gradient</label> | ||
45 | |||
37 | </div> | 46 | </div> |
38 | 47 | ||
39 | <div class="cp_gp_slider"> | 48 | <div class="cp_gp_slider"> |
40 | <div class="track_container"><div class="track"></div></div> | 49 | |
41 | <div class="cover"></div> | 50 | <div class="track_container"> |
42 | <div class="chips"></div> | 51 | <div data-montage-id="track" class="track"></div> |
52 | </div> | ||
53 | |||
54 | <div data-montage-id="cover" class="cover"></div> | ||
55 | |||
56 | <div data-montage-id="chips" class="chips"></div> | ||
57 | |||
43 | </div> | 58 | </div> |
44 | 59 | ||
45 | </div> | 60 | </div> |
diff --git a/js/components/gradientpicker.reel/gradientpicker.js b/js/components/gradientpicker.reel/gradientpicker.js index b10f6624..7fd5d918 100755 --- a/js/components/gradientpicker.reel/gradientpicker.js +++ b/js/components/gradientpicker.reel/gradientpicker.js | |||
@@ -6,54 +6,43 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | //////////////////////////////////////////////////////////////////////// | 7 | //////////////////////////////////////////////////////////////////////// |
8 | // | 8 | // |
9 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
10 | Component = require("montage/ui/component").Component; | 10 | Component = require("montage/ui/component").Component; |
11 | //////////////////////////////////////////////////////////////////////// | 11 | //////////////////////////////////////////////////////////////////////// |
12 | //Exporting as ColorWheel | 12 | //Exporting as ColorWheel |
13 | exports.GradientPicker = Montage.create(Component, { | 13 | exports.GradientPicker = Montage.create(Component, { |
14 | //////////////////////////////////////////////////////////////////// | 14 | //////////////////////////////////////////////////////////////////// |
15 | // | 15 | // |
16 | hasTemplate: { | 16 | hasTemplate: { |
17 | enumerable: true, | ||
18 | value: true | 17 | value: true |