OLD | NEW |
1 // Copyright 2015 The Chromium Authors. All rights reserved. | 1 // Copyright 2015 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * @fileoverview | 6 * @fileoverview |
7 * 'settings-menu' shows a menu with a hardcoded set of pages and subpages. | 7 * 'settings-menu' shows a menu with a hardcoded set of pages and subpages. |
8 */ | 8 */ |
9 Polymer({ | 9 Polymer({ |
10 is: 'settings-menu', | 10 is: 'settings-menu', |
11 | 11 |
12 properties: { | 12 properties: { |
13 /** @private */ | 13 /** @private */ |
14 advancedOpened_: Boolean, | 14 advancedOpened_: Boolean, |
15 | 15 |
16 /** | 16 /** |
17 * The current active route. | 17 * The current active route. |
18 * @type {!SettingsRoute} | 18 * @type {!settings.Route} |
19 */ | 19 */ |
20 currentRoute: { | 20 currentRoute: { |
21 type: Object, | 21 type: Object, |
22 notify: true, | 22 notify: true, |
23 observer: 'currentRouteChanged_', | 23 observer: 'currentRouteChanged_', |
24 }, | 24 }, |
25 }, | 25 }, |
26 | 26 |
27 attached: function() { | 27 attached: function() { |
28 document.addEventListener('toggle-advanced-page', function(e) { | 28 document.addEventListener('toggle-advanced-page', function(e) { |
29 if (e.detail) | 29 if (e.detail) |
30 this.$.advancedPage.open(); | 30 this.$.advancedPage.open(); |
31 else | 31 else |
32 this.$.advancedPage.close(); | 32 this.$.advancedPage.close(); |
33 }.bind(this)); | 33 }.bind(this)); |
34 | 34 |
35 this.$.advancedPage.addEventListener('paper-submenu-open', function() { | 35 this.$.advancedPage.addEventListener('paper-submenu-open', function() { |
36 this.fire('toggle-advanced-page', true); | 36 this.fire('toggle-advanced-page', true); |
37 }.bind(this)); | 37 }.bind(this)); |
38 | 38 |
39 this.$.advancedPage.addEventListener('paper-submenu-close', function() { | 39 this.$.advancedPage.addEventListener('paper-submenu-close', function() { |
40 this.fire('toggle-advanced-page', false); | 40 this.fire('toggle-advanced-page', false); |
41 }.bind(this)); | 41 }.bind(this)); |
42 | 42 |
43 this.fire('toggle-advanced-page', this.currentRoute.page == 'advanced'); | 43 this.fire('toggle-advanced-page', this.currentRoute.page == 'advanced'); |
44 }, | 44 }, |
45 | 45 |
46 /** | 46 /** |
47 * @param {!SettingsRoute} newRoute | 47 * @param {!settings.Route} newRoute |
48 * @private | 48 * @private |
49 */ | 49 */ |
50 currentRouteChanged_: function(newRoute) { | 50 currentRouteChanged_: function(newRoute) { |
51 // Sync URL changes to the side nav menu. | 51 // Sync URL changes to the side nav menu. |
52 | 52 |
53 if (newRoute.page == 'advanced') { | 53 if (newRoute.page == 'advanced') { |
54 this.$.advancedMenu.selected = this.currentRoute.section; | 54 this.$.advancedMenu.selected = this.currentRoute.section; |
55 this.$.basicMenu.selected = null; | 55 this.$.basicMenu.selected = null; |
56 } else if (newRoute.page == 'basic') { | 56 } else if (newRoute.page == 'basic') { |
57 this.$.advancedMenu.selected = null; | 57 this.$.advancedMenu.selected = null; |
(...skipping 17 matching lines...) Expand all Loading... |
75 ripple.downAction(); | 75 ripple.downAction(); |
76 ripple.upAction(); | 76 ripple.upAction(); |
77 }, | 77 }, |
78 | 78 |
79 /** | 79 /** |
80 * @param {!Event} event | 80 * @param {!Event} event |
81 * @private | 81 * @private |
82 */ | 82 */ |
83 openPage_: function(event) { | 83 openPage_: function(event) { |
84 this.ripple_(/** @type {!Node} */(event.currentTarget)); | 84 this.ripple_(/** @type {!Node} */(event.currentTarget)); |
85 var submenuRoute = event.currentTarget.parentNode.dataset.page; | 85 var page = event.currentTarget.parentNode.dataset.page; |
86 if (submenuRoute) { | 86 if (!page) |
87 this.currentRoute = { | 87 return; |
88 page: submenuRoute, | 88 |
89 section: event.currentTarget.dataset.section, | 89 var section = event.currentTarget.dataset.section; |
90 subpage: [], | 90 // TODO(tommycli): Use Object.values once Closure compilation supports it. |
91 }; | 91 var matchingKey = Object.keys(settings.Route).find(function(key) { |
92 } | 92 var route = settings.Route[key]; |
| 93 // TODO(tommycli): Remove usage of page, section, and subpage properties. |
| 94 // Routes should be somehow directly bound to the menu elements. |
| 95 return route.page == page && route.section == section && |
| 96 route.subpage.length == 0; |
| 97 }); |
| 98 |
| 99 if (matchingKey) |
| 100 settings.navigateTo(settings.Route[matchingKey]); |
93 }, | 101 }, |
94 | 102 |
95 /** | 103 /** |
96 * @param {boolean} opened Whether the menu is expanded. | 104 * @param {boolean} opened Whether the menu is expanded. |
97 * @return {string} Which icon to use. | 105 * @return {string} Which icon to use. |
98 * @private | 106 * @private |
99 * */ | 107 * */ |
100 arrowState_: function(opened) { | 108 arrowState_: function(opened) { |
101 return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down'; | 109 return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down'; |
102 }, | 110 }, |
103 }); | 111 }); |
OLD | NEW |