diff options
author | Jon Reid | 2012-06-26 14:58:10 -0700 |
---|---|---|
committer | Jon Reid | 2012-06-26 14:58:10 -0700 |
commit | 2599f74d72293b809929d8a0b36fb8e721f194cd (patch) | |
tree | ca4cd45b23b8debea32f95d7dea807c77b6633b2 /js/stage/binding-view.reel/binding-hud.reel | |
parent | ab9d14780eed98f39786fae4518e69861b34bad7 (diff) | |
parent | e4304b9ac6c58802de4dd334be1f5802533f5160 (diff) | |
download | ninja-2599f74d72293b809929d8a0b36fb8e721f194cd.tar.gz |
Merge remote-tracking branch 'ninja-jduran/TimelineUber' into timeline-local
Diffstat (limited to 'js/stage/binding-view.reel/binding-hud.reel')
3 files changed, 496 insertions, 0 deletions
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css new file mode 100755 index 00000000..680f9183 --- /dev/null +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css | |||
@@ -0,0 +1,104 @@ | |||
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 | .bindingHud { | ||
8 | position: absolute; | ||
9 | background: rgba(0, 0, 0, 0.85); | ||
10 | /*padding: 0px;*/ | ||
11 | color: #C4C4C4; | ||
12 | font-size: 11px; | ||
13 | box-shadow: inset 0px 0px 0px 0px #CCC; | ||
14 | border-radius: 6px; | ||
15 | padding: 3px 1px 1px; | ||
16 | border:1px solid #000; | ||
17 | text-shadow: 1px 1px 0px #000; | ||
18 | } | ||
19 | |||
20 | .bindingHud .bindingTitle { | ||
21 | font-weight:bold; | ||
22 | background: url('/images/panels/horizontal-resize.png') no-repeat; | ||
23 | padding-left: 10px; | ||
24 | line-height: 20px; | ||
25 | background-position: left center; | ||
26 | padding-top: 2px; | ||
27 | color: #EBE6E6; | ||
28 | } | ||
29 | |||
30 | .bindingHud .hudRepetition { | ||
31 | /*background: rgba(0, 0, 0, 0.3);*/ | ||
32 | line-height:16px; | ||
33 | /*box-shadow: inset 0px 0px 4px #333, 1px 1px 0px #3A3A3A;*/ | ||
34 | min-width: 80px; | ||
35 | } | ||
36 | |||
37 | .bindingHud .hudOption { | ||
38 | position:relative; | ||
39 | /*border-bottom:1px solid #505050;*/ | ||
40 | line-height:16px; | ||
41 | padding:1px 25px 1px 8px; | ||
42 | } | ||
43 | |||
44 | .bindingHud .hudOption .connectorBubble:hover { | ||
45 | background-color: #1B52A7; | ||
46 | box-shadow: inset 0px 2px 2px 1px rgba(15, 15, 15, 0.78), 0 1px #474747; | ||
47 | cursor: pointer; | ||
48 | } | ||
49 | |||
50 | .bindingHud .hudOption.bound .connectorBubble { | ||
51 | background: -webkit-linear-gradient(top, #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); | ||
52 | box-shadow: none; | ||
53 | } | ||
54 | |||
55 | .bindingHud .hudOption:last-child { | ||
56 | border-bottom: 0px; | ||
57 | } | ||
58 | |||
59 | .bindingHud .hudOption .connectorBubble { | ||
60 | position: absolute; | ||
61 | right: 5px; | ||
62 | top: 3px; | ||
63 | border-radius: 50%; | ||
64 | width: 10px; | ||
65 | height: 10px; | ||
66 | border-left: 0px; | ||
67 | display: block; | ||
68 | background-color: #313131; | ||
69 | box-shadow: inset 0px 2px 7px 1px #0F0F0F, 0 1px #424242; | ||
70 | |||
71 | } | ||
72 | |||
73 | .splitter.scrollArea { | ||
74 | background-color: transparent; | ||
75 | background-size: 12%; | ||
76 | background-position-y: 2px; | ||
77 | display: none; | ||
78 | height:11px; | ||
79 | text-align: center; | ||
80 | } | ||
81 | .splitter.scrollAreaTop { | ||
82 | border-top: 1px solid #353535; | ||
83 | box-shadow: 0 -1px 0 0 #141414; | ||
84 | } | ||
85 | .splitter.scrollAreaBottom { | ||
86 | -webkit-transform: rotate(180deg); | ||
87 | border-top-left-radius: 6px; | ||
88 | border-top-right-radius: 6px; | ||
89 | border-bottom: 1px solid #353535; | ||
90 | box-shadow: 0 1px 0 0 #141414; | ||
91 | margin-top: 4px; | ||
92 | } | ||
93 | |||
94 | .scrollArea.disabled { | ||
95 | opacity: 0.5; | ||
96 | } | ||
97 | .splitter.scrollArea:hover:not(.disabled) { | ||
98 | background-color: #252525; | ||
99 | } | ||
100 | |||
101 | |||
102 | .hudRepetition { | ||
103 | overflow: hidden; | ||
104 | } \ No newline at end of file | ||
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html new file mode 100755 index 00000000..7bb888d5 --- /dev/null +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html | |||
@@ -0,0 +1,78 @@ | |||
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="binding-hud.css"> | ||
11 | |||
12 | <script type="text/montage-serialization"> | ||
13 | { | ||
14 | "owner": { | ||
15 | "prototype": "js/stage/binding-view.reel/binding-hud.reel", | ||
16 | "properties": { | ||
17 | "element": {"#": "bindingHud"}, | ||
18 | "titleElement": {"#": "title"}, | ||
19 | "scrollUp": {"#":"scrollUp"}, | ||
20 | "scrollDown": {"#":"scrollDown"}, | ||
21 | "optionsRepeater": {"@": "repeater"} | ||
22 | } | ||
23 | }, | ||
24 | "repeater": { | ||
25 | "prototype": "montage/ui/repetition.reel", | ||
26 | "properties": { | ||
27 | "element": {"#": "hudRepetition"} | ||
28 | }, | ||
29 | "bindings": { | ||
30 | "objects": {"<-": "@owner.properties"} | ||
31 | } | ||
32 | }, | ||
33 | "hudOption": { | ||
34 | "prototype": "js/stage/binding-view.reel/binding-hud-option.reel", | ||
35 | "properties": { | ||
36 | "element": {"#" : "hudOption"} | ||
37 | }, | ||
38 | "bindings": { | ||
39 | "title": {"<-": "@repeater.objectAtCurrentIteration"} | ||
40 | } | ||
41 | }, | ||
42 | "resizer1": { | ||
43 | "prototype": "js/panels/resize-composer", | ||
44 | "properties": { | ||
45 | "element": {"#": "title"}, | ||
46 | "component": {"@": "owner"} | ||
47 | }, | ||
48 | "listeners": [ | ||
49 | { | ||
50 | "type": "resizeStart", | ||
51 | "listener": {"@": "owner"} | ||
52 | }, | ||
53 | { | ||
54 | "type": "resizeMove", | ||
55 | "listener": {"@": "owner"} | ||
56 | }, | ||
57 | { | ||
58 | "type": "resizeEnd", | ||
59 | "listener": {"@": "owner"} | ||
60 | } | ||
61 | ] | ||
62 | } | ||
63 | } | ||
64 | </script> | ||
65 | |||
66 | </head> | ||
67 | <body> | ||
68 | <section data-montage-id="bindingHud" class="bindingHud"> | ||
69 | <div data-montage-id="title" class="bindingTitle"></div> | ||
70 | <div data-montage-id="scrollUp" class=" splitter scrollArea scrollAreaTop"></div> | ||
71 | <div data-montage-id="hudRepetition" class="hudRepetition"> | ||
72 | <div data-montage-id="hudOption"></div> | ||
73 | </div> | ||
74 | <div data-montage-id="scrollDown" class="splitter scrollArea scrollAreaBottom"></div> | ||
75 | </section> | ||
76 | |||
77 | </body> | ||
78 | </html> | ||
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js new file mode 100755 index 00000000..9918b06d --- /dev/null +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js | |||
@@ -0,0 +1,314 @@ | |||
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 | /** | ||
8 | @requires montage/core/core | ||
9 | @requires montage/ui/component | ||
10 | */ | ||
11 | var Montage = require("montage/core/core").Montage, | ||
12 | Component = require("montage/ui/component").Component; | ||
13 | |||
14 | exports.BindingHud = Montage.create(Component, { | ||
15 | scrollUp: { | ||
16 | value: null | ||
17 | }, | ||
18 | scrollable: { | ||
19 | value: false | ||
20 | }, | ||
21 | scrollInterval: { | ||