diff options
Diffstat (limited to 'js/components/colorwheel.reel')
-rwxr-xr-x | js/components/colorwheel.reel/colorwheel.html | 89 | ||||
-rwxr-xr-x | js/components/colorwheel.reel/colorwheel.js | 733 | ||||
-rwxr-xr-x | js/components/colorwheel.reel/css/colorwheel.css | 23 | ||||
-rwxr-xr-x | js/components/colorwheel.reel/css/colorwheel.scss | 29 |
4 files changed, 439 insertions, 435 deletions
diff --git a/js/components/colorwheel.reel/colorwheel.html b/js/components/colorwheel.reel/colorwheel.html index b39479a8..f3067cba 100755 --- a/js/components/colorwheel.reel/colorwheel.html +++ b/js/components/colorwheel.reel/colorwheel.html | |||
@@ -1,26 +1,27 @@ | |||
1 | <!DOCTYPE html> | 1 | <!DOCTYPE html> |
2 | <!-- | 2 | <!-- |
3 | <copyright> | 3 | <copyright> |
4 | Copyright (c) 2012, Motorola Mobility, Inc | 4 | Copyright (c) 2012, Motorola Mobility LLC. |
5 | All Rights Reserved. | 5 | All Rights Reserved. |
6 | BSD License. | ||
7 | 6 | ||
8 | Redistribution and use in source and binary forms, with or without | 7 | Redistribution and use in source and binary forms, with or without |
9 | modification, are permitted provided that the following conditions are met: | 8 | modification, are permitted provided that the following conditions are met: |
10 | 9 | ||
11 | - Redistributions of source code must retain the above copyright notice, | 10 | * Redistributions of source code must retain the above copyright notice, |
12 | this list of conditions and the following disclaimer. | 11 | this list of conditions and the following disclaimer. |
13 | - Redistributions in binary form must reproduce the above copyright | 12 | |
14 | notice, this list of conditions and the following disclaimer in the | 13 | * Redistributions in binary form must reproduce the above copyright notice, |
15 | documentation and/or other materials provided with the distribution. | 14 | this list of conditions and the following disclaimer in the documentation |
16 | - Neither the name of Motorola Mobility nor the names of its contributors | 15 | and/or other materials provided with the distribution. |
17 | may be used to endorse or promote products derived from this software | 16 | |
18 | without specific prior written permission. | 17 | * Neither the name of Motorola Mobility LLC nor the names of its |
18 | contributors may be used to endorse or promote products derived from this | ||
19 | software without specific prior written permission. | ||
19 | 20 | ||
20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | 21 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" |
21 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 22 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
22 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | 23 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE |
23 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | 24 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE |
24 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | 25 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR |
25 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | 26 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
26 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | 27 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
@@ -31,39 +32,39 @@ POSSIBILITY OF SUCH DAMAGE. | |||
31 | </copyright> | 32 | </copyright> |
32 | --> | 33 | --> |
33 | <html lang="en"> | 34 | <html lang="en"> |
34 | <head> | 35 | <head> |
35 | 36 | ||
36 | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | 37 | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
37 | 38 | ||
38 | <link rel="stylesheet" type="text/css" href="css/colorwheel.css"> | 39 | <link rel="stylesheet" type="text/css" href="css/colorwheel.css"> |
40 | |||
41 | <script type="text/montage-serialization"> | ||
42 | { | ||
43 | "owner": { | ||
44 | "prototype": "js/components/colorwheel.reel[ColorWheel]", | ||
45 | "properties": { | ||
46 | "element": {"#": "colorwheel"}, | ||
47 | "wheel": {"#": "wheel"}, | ||
48 | "wheelSelect": {"#": "wselect"}, | ||
49 | "swatch": {"#": "swatch"}, | ||
50 | "swatchSelect": {"#": "sselect"} | ||
51 | |||
52 | } | ||
53 | } | ||
54 | } | ||
55 | </script> | ||
56 | |||
57 | </head> | ||
58 | |||
59 | <body> | ||
39 | 60 | ||
40 | <script type="text/montage-serialization"> | 61 | <div data-montage-id="colorwheel" class="colorwheel"> |
41 | { | 62 | <canvas data-montage-id="wheel"></canvas> |
42 | "owner": { | 63 | <canvas data-montage-id="swatch"></canvas> |
43 | "prototype": "js/components/colorwheel.reel[ColorWheel]", | 64 | <canvas data-montage-id="sselect"></canvas> |
44 | "properties": { | 65 | <canvas data-montage-id="wselect"></canvas> |
45 | "element": {"#": "colorwheel"}, | 66 | </div> |
46 | "wheel": {"#": "wheel"}, | ||
47 | "wheelSelect": {"#": "wselect"}, | ||
48 | "swatch": {"#": "swatch"}, | ||
49 | "swatchSelect": {"#": "sselect"} | ||
50 | 67 | ||
51 | } | 68 | </body> |
52 | } | ||
53 | } | ||
54 | </script> | ||
55 | |||
56 | </head> | ||
57 | |||
58 | <body> | ||
59 | |||
60 | <div data-montage-id="colorwheel" class="colorwheel"> | ||
61 | <canvas data-montage-id="wheel"></canvas> | ||
62 | <canvas data-montage-id="swatch"></canvas> | ||
63 | <canvas data-montage-id="sselect"></canvas> | ||
64 | <canvas data-montage-id="wselect"></canvas> | ||
65 | </div> | ||
66 | |||
67 | </body> | ||
68 | 69 | ||
69 | </html> | 70 | </html> |
diff --git a/js/components/colorwheel.reel/colorwheel.js b/js/components/colorwheel.reel/colorwheel.js index a7c70038..6a7856d9 100755 --- a/js/components/colorwheel.reel/colorwheel.js +++ b/js/components/colorwheel.reel/colorwheel.js | |||
@@ -1,24 +1,25 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | Copyright (c) 2012, Motorola Mobility, Inc | 2 | Copyright (c) 2012, Motorola Mobility LLC. |
3 | All Rights Reserved. | 3 | All Rights Reserved. |
4 | BSD License. | ||
5 | 4 | ||
6 | Redistribution and use in source and binary forms, with or without | 5 | Redistribution and use in source and binary forms, with or without |
7 | modification, are permitted provided that the following conditions are met: | 6 | modification, are permitted provided that the following conditions are met: |
8 | 7 | ||
9 | - Redistributions of source code must retain the above copyright notice, | 8 | * Redistributions of source code must retain the above copyright notice, |
10 | this list of conditions and the following disclaimer. | 9 | this list of conditions and the following disclaimer. |
11 | - Redistributions in binary form must reproduce the above copyright | 10 | |
12 | notice, this list of conditions and the following disclaimer in the | 11 | * Redistributions in binary form must reproduce the above copyright notice, |
13 | documentation and/or other materials provided with the distribution. | 12 | this list of conditions and the following disclaimer in the documentation |
14 | - Neither the name of Motorola Mobility nor the names of its contributors | 13 | and/or other materials provided with the distribution. |
15 | may be used to endorse or promote products derived from this software | 14 | |
16 | without specific prior written permission. | 15 | * Neither the name of Motorola Mobility LLC nor the names of its |
16 | contributors may be used to endorse or promote products derived from this | ||
17 | software without specific prior written permission. | ||
17 | 18 | ||
18 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | 19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" |
19 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 20 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
20 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | 21 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE |
21 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | 22 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE |
22 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | 23 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR |
23 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | 24 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
24 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | 25 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
@@ -30,14 +31,14 @@ POSSIBILITY OF SUCH DAMAGE. | |||
30 | 31 | ||
31 | //////////////////////////////////////////////////////////////////////// | 32 | //////////////////////////////////////////////////////////////////////// |
32 | // | 33 | // |
33 | var Montage = require("montage/core/core").Montage, | 34 | var Montage = require("montage/core/core").Montage, |
34 | Component = require("montage/ui/component").Component; | 35 | Component = require("montage/ui/component").Component; |
35 | //////////////////////////////////////////////////////////////////////// | 36 | //////////////////////////////////////////////////////////////////////// |
36 | // | 37 | // |
37 | exports.ColorWheel = Montage.create(Component, { | 38 | exports.ColorWheel = Montage.create(Component, { |
38 | //////////////////////////////////////////////////////////////////// | 39 | //////////////////////////////////////////////////////////////////// |
39 | // | 40 | // |
40 | hasTemplate: { | 41 | hasTemplate: { |
41 | value: true | 42 | value: true |
42 | }, | 43 | }, |
43 | //////////////////////////////////////////////////////////////////// | 44 | //////////////////////////////////////////////////////////////////// |
@@ -45,7 +46,7 @@ exports.ColorWheel = Montage.create(Component, { | |||
45 | _value: { | 46 | _value: { |
46 | value: {h: 0, s: 0, v: 0} | 47 | value: {h: 0, s: 0, v: 0} |
47 | }, | 48 | }, |
48 | //////////////////////////////////////////////////////////////////// | 49 | //////////////////////////////////////////////////////////////////// |
49 | //Value of wheel in HSV (360, 100, 100) | 50 | //Value of wheel in HSV (360, 100, 100) |
50 | value: { | 51 | value: { |
51 | get: function() { | 52 | get: function() { |
@@ -54,463 +55,463 @@ exports.ColorWheel = Montage.create(Component, { | |||
54 | set: function(value) { | 55 | set: function(value) { |
55 | this._value = value; | 56 | this._value = value; |
56 | if (this._wheelData) { | 57 | if (this._wheelData) { |
57 | if (value && !value.wasSetByCode) { | 58 | if (value && !value.wasSetByCode) { |
58 | this.wheelSelectorAngle(value.h/this._math.TAU*360); | 59 | this.wheelSelectorAngle(value.h/this._math.TAU*360); |
59 | this.drawSwatchColor(value.h/this._math.TAU*360); | 60 | this.drawSwatchColor(value.h/this._math.TAU*360); |
60 | this.drawSwatchSelector(value.s*100, value.v*100); | 61 | this.drawSwatchSelector(value.s*100, value.v*100); |
61 | } | 62 | } |
62 | if (!this._isMouseDown) { | 63 | if (!this._isMouseDown) { |
63 | this._dispatchEvent('change', true); | 64 | this._dispatchEvent('change', true); |
64 | } | 65 | } |
65 | } | 66 | } |
66 | } | 67 | } |
67 | }, | 68 | }, |
68 | //////////////////////////////////////////////////////////////////// | 69 | /////////////////////////////////// |