OLD | NEW |
1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 // TODO(jmesserly): can we handle this more elegantly? | 5 // TODO(jmesserly): can we handle this more elegantly? |
6 // In general, it seems like we want a convenient way to take a Stream plus a | 6 // In general, it seems like we want a convenient way to take a Stream plus a |
7 // getter and convert this into an Observable. | 7 // getter and convert this into an Observable. |
8 | 8 |
9 /** Helpers for exposing dart:html as observable data. */ | 9 /** Helpers for exposing dart:html as observable data. */ |
10 library observe.html; | 10 library observe.html; |
11 | 11 |
12 import 'dart:html'; | 12 import 'dart:html'; |
13 | 13 |
14 import 'observe.dart'; | 14 import 'observe.dart'; |
15 | 15 |
16 /** An observable version of [window.location.hash]. */ | 16 /** An observable version of [window.location.hash]. */ |
17 final ObservableLocationHash windowLocation = new ObservableLocationHash._(); | 17 final ObservableLocationHash windowLocation = new ObservableLocationHash._(); |
18 | 18 |
19 class ObservableLocationHash extends ChangeNotifierBase { | 19 class ObservableLocationHash extends ChangeNotifier { |
| 20 Object _currentHash; |
| 21 |
20 ObservableLocationHash._() { | 22 ObservableLocationHash._() { |
21 // listen on changes to #hash in the URL | 23 // listen on changes to #hash in the URL |
22 // Note: listen on both popState and hashChange, because IE9 doesn't support | 24 // Note: listen on both popState and hashChange, because IE9 doesn't support |
23 // history API. See http://dartbug.com/5483 | 25 // history API. See http://dartbug.com/5483 |
24 // TODO(jmesserly): only listen to these if someone is listening to our | 26 // TODO(jmesserly): only listen to these if someone is listening to our |
25 // changes. | 27 // changes. |
26 window.onHashChange.listen(_notifyHashChange); | 28 window.onHashChange.listen(_notifyHashChange); |
27 window.onPopState.listen(_notifyHashChange); | 29 window.onPopState.listen(_notifyHashChange); |
| 30 |
| 31 _currentHash = hash; |
28 } | 32 } |
29 | 33 |
30 @reflectable String get hash => window.location.hash; | 34 @reflectable String get hash => window.location.hash; |
31 | 35 |
32 /** | 36 /** |
33 * Pushes a new URL state, similar to the affect of clicking a link. | 37 * Pushes a new URL state, similar to the affect of clicking a link. |
34 * Has no effect if the [value] already equals [window.location.hash]. | 38 * Has no effect if the [value] already equals [window.location.hash]. |
35 */ | 39 */ |
36 @reflectable void set hash(String value) { | 40 @reflectable void set hash(String value) { |
37 if (value == hash) return; | 41 if (value == hash) return; |
38 | 42 |
39 window.history.pushState(null, '', value); | 43 window.history.pushState(null, '', value); |
40 _notifyHashChange(null); | 44 _notifyHashChange(null); |
41 } | 45 } |
42 | 46 |
43 void _notifyHashChange(_) { | 47 void _notifyHashChange(_) { |
44 notifyChange(new PropertyChangeRecord(#hash)); | 48 var oldValue = _currentHash; |
| 49 _currentHash = hash; |
| 50 notifyPropertyChange(#hash, oldValue, _currentHash); |
45 } | 51 } |
46 } | 52 } |
47 | 53 |
48 /** Add or remove CSS class [className] based on the [value]. */ | 54 /** Add or remove CSS class [className] based on the [value]. */ |
49 void updateCssClass(Element element, String className, bool value) { | 55 void updateCssClass(Element element, String className, bool value) { |
50 if (value == true) { | 56 if (value == true) { |
51 element.classes.add(className); | 57 element.classes.add(className); |
52 } else { | 58 } else { |
53 element.classes.remove(className); | 59 element.classes.remove(className); |
54 } | 60 } |
55 } | 61 } |
56 | 62 |
57 /** Bind a CSS class to the observable [object] and property [path]. */ | 63 /** Bind a CSS class to the observable [object] and property [path]. */ |
58 PathObserver bindCssClass(Element element, String className, | 64 PathObserver bindCssClass(Element element, String className, |
59 Observable object, String path) { | 65 Observable object, String path) { |
60 | 66 |
61 return new PathObserver(object, path)..bindSync((value) { | 67 return new PathObserver(object, path)..bindSync((value) { |
62 updateCssClass(element, className, value); | 68 updateCssClass(element, className, value); |
63 }); | 69 }); |
64 } | 70 } |
OLD | NEW |