diff options
author | Kishore Subramanian | 2012-03-19 14:14:29 -0700 |
---|---|---|
committer | Kishore Subramanian | 2012-03-19 14:14:29 -0700 |
commit | ec58642a7b31165890eb5bef7d95ce59dd0c34a0 (patch) | |
tree | 32640021d0362314ee5898626a0721feca814154 | |
parent | 9d364be255900e9bde02c4b254d145ec41fc78fb (diff) | |
download | ninja-ec58642a7b31165890eb5bef7d95ce59dd0c34a0.tar.gz |
Changes to Map and FeedReader
- Added traffic property to Map
- Support for show/hide traffic in the example
- Changed FeedReader to use only one DIV. No longer uses Repetition
- Support multiple modes in the Feed reader - timed/animated
5 files changed, 148 insertions, 88 deletions
diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.html b/node_modules/montage/examples/feed-reader/main.reel/main.html index ef4fc92a..50bac601 100644 --- a/node_modules/montage/examples/feed-reader/main.reel/main.html +++ b/node_modules/montage/examples/feed-reader/main.reel/main.html | |||
@@ -44,7 +44,9 @@ | |||
44 | "module": "montage/ui/feed-reader/feed-reader.reel", | 44 | "module": "montage/ui/feed-reader/feed-reader.reel", |
45 | "name": "FeedReader", | 45 | "name": "FeedReader", |
46 | "properties": { | 46 | "properties": { |
47 | "element": {"#": "feed-reader"} | 47 | "element": {"#": "feed-reader"}, |
48 | "feedDisplayMode": "timed", | ||
49 | "interval": "5" | ||
48 | } | 50 | } |
49 | }, | 51 | }, |
50 | 52 | ||
@@ -76,7 +78,14 @@ | |||
76 | "map": { | 78 | "map": { |
77 | "prototype": "montage/ui/map.reel", | 79 | "prototype": "montage/ui/map.reel", |
78 | "properties": { | 80 | "properties": { |
79 | "element": {"#": "map"} | 81 | "element": {"#": "map"}, |
82 | "traffic": false | ||
83 | }, | ||
84 | "bindings": { | ||
85 | "traffic": { | ||
86 | "boundObject": {"@": "traffic"}, | ||
87 | "boundObjectPropertyPath": "checked" | ||
88 | } | ||
80 | } | 89 | } |
81 | }, | 90 | }, |
82 | 91 | ||
@@ -86,6 +95,12 @@ | |||
86 | "element": {"#": "types"} | 95 | "element": {"#": "types"} |
87 | } | 96 | } |
88 | }, | 97 | }, |
98 | "traffic": { | ||
99 | "prototype": "montage/ui/checkbox.reel", | ||
100 | "properties": { | ||
101 | "element": {"#": "traffic"} | ||
102 | } | ||
103 | }, | ||
89 | 104 | ||
90 | "owner": { | 105 | "owner": { |
91 | "module": "main.reel", | 106 | "module": "main.reel", |
@@ -155,6 +170,18 @@ | |||
155 | margin-top: 10px; | 170 | margin-top: 10px; |
156 | } | 171 | } |
157 | 172 | ||
173 | /* | ||
174 | .feed-reader .feed-entry { | ||
175 | visibility:hidden; | ||
176 | opacity:0; | ||
177 | transition:visibility 0s linear 0.5s,opacity 0.5s linear; | ||
178 | } | ||
179 | .feed-reader .feed-entry .active { | ||
180 | visibility:visible; | ||
181 | opacity:1; | ||
182 | transition-delay:0s; | ||
183 | } | ||
184 | */ | ||
158 | 185 | ||
159 | </style> | 186 | </style> |
160 | 187 | ||
@@ -194,6 +221,7 @@ | |||
194 | <option value='gas_station'>Gas Stations</option> | 221 | <option value='gas_station'>Gas Stations</option> |
195 | </select> | 222 | </select> |
196 | </div> | 223 | </div> |
224 | <input type="checkbox" id="traffic">Show Traffic</input> | ||
197 | </form> | 225 | </form> |
198 | </div> | 226 | </div> |
199 | <div id="map">Map</div> | 227 | <div id="map">Map</div> |
diff --git a/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.js b/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.js index 3d97eec7..72c5023e 100644 --- a/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.js +++ b/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.js | |||
@@ -8,6 +8,14 @@ var Montage = require("montage").Montage, | |||
8 | 8 | ||
9 | exports.FeedEntry = Montage.create(Component, { | 9 | exports.FeedEntry = Montage.create(Component, { |
10 | 10 | ||
11 | entry: {value: null} | 11 | _entry: {value: null}, |
12 | entry: { | ||
13 | get: function() { | ||
14 | return this._entry; | ||
15 | }, | ||
16 | set: function(value) { | ||
17 | this._entry = value; | ||
18 | } | ||
19 | } | ||
12 | 20 | ||
13 | }); | 21 | }); |
diff --git a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html index 646fd01e..e5251e0a 100644 --- a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html +++ b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html | |||
@@ -23,17 +23,7 @@ | |||
23 | } | 23 | } |
24 | } | 24 | } |
25 | }, | 25 | }, |
26 | 26 | ||
27 | "repetition": { | ||
28 | "module": "montage/ui/repetition.reel", | ||
29 | "name": "Repetition", | ||
30 | "properties": { | ||
31 | "element": {"#": "entries"}, | ||
32 | "contentController": {"@": "entriesController"}, | ||
33 | "isSelectionEnabled": true, | ||
34 | "orientation": "vertical" | ||
35 | } | ||
36 | }, | ||
37 | "feedEntry": { | 27 | "feedEntry": { |
38 | "module": "montage/ui/feed-reader/feed-entry.reel", | 28 | "module": "montage/ui/feed-reader/feed-entry.reel", |
39 | "name": "FeedEntry", | 29 | "name": "FeedEntry", |
@@ -42,27 +32,19 @@ | |||
42 | }, | 32 | }, |
43 | "bindings": { | 33 | "bindings": { |
44 | "entry": { | 34 | "entry": { |
45 | "boundObject": {"@": "repetition"}, | 35 | "boundObject": {"@": "owner"}, |
46 | "boundObjectPropertyPath": "objectAtCurrentIteration", | 36 | "boundObjectPropertyPath": "activeFeedEntry", |
47 | "oneway": true | 37 | "oneway": true |
48 | } | 38 | } |
49 | } | 39 | } |
50 | }, | 40 | }, |
51 | 41 | ||
52 | "owner": { | 42 | "owner": { |
53 | "module": "montage/ui/feed-reader/feed-reader.reel", | 43 | "module": "montage/ui/feed-reader/feed-reader.reel", |
54 | "name": "FeedReader", | 44 | "name": "FeedReader", |
55 | "properties": { | 45 | "properties": { |
56 | "element": {"#": "feed-reader"}, | 46 | "element": {"#": "feed-reader"} |
57 | "repetition": {"@": "repetition"} | 47 | } |
58 | }, | ||
59 | "bindings": { | ||
60 | "items": { | ||
61 | "boundObject": {"@": "repetition"}, | ||
62 | "boundObjectPropertyPath": "objects", | ||
63 | "oneway": true | ||
64 | } | ||
65 | } | ||
66 | } | 48 | } |
67 | 49 | ||
68 | } | 50 | } |
@@ -74,16 +56,8 @@ | |||
74 | } | 56 | } |
75 | 57 | ||
76 | .feed-entry { | 58 | .feed-entry { |
77 | display: none; | ||
78 | } | ||
79 | |||
80 | .montage-hidden { | ||
81 | display: none; | ||
82 | } | 59 | } |
83 | 60 | ||
84 | .active { | ||
85 | display: block; | ||
86 | } | ||
87 | 61 | ||
88 | </style> | 62 | </style> |
89 | 63 | ||
diff --git a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js index d5c9ca17..8fd9ae22 100644 --- a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js +++ b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js | |||
@@ -42,92 +42,117 @@ exports.FeedReader = Montage.create(Component, { | |||
42 | }, | 42 | }, |
43 | 43 | ||
44 | // time in ms between slides | 44 | // time in ms between slides |
45 | interval: {value: 3000, distinct: true}, | 45 | interval: {value: 3, distinct: true}, |
46 | |||
47 | repetition: {enumerable: false, value: null}, | ||
48 | 46 | ||
49 | maxEntries: {value: 10, distinct: true}, | 47 | maxEntries: {value: 10, distinct: true}, |
50 | entries: {value: null}, | ||
51 | |||
52 | |||
53 | _startLoading: { | ||
54 | value: function() { | ||
55 | //Notifier.show('Loading ... please wait', null, {top: this.element.style.top, left: this.element.style.left + 20}); | ||