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-main' displays the selected settings page. | 7 * 'settings-main' displays the selected settings page. |
8 */ | 8 */ |
9 Polymer({ | 9 Polymer({ |
10 is: 'settings-main', | 10 is: 'settings-main', |
11 | 11 |
12 properties: { | 12 properties: { |
13 /** @private */ | |
14 isAdvancedMenuOpen_: { | |
15 type: Boolean, | |
16 value: false, | |
17 }, | |
18 | |
19 /** | 13 /** |
20 * Preferences state. | 14 * Preferences state. |
21 */ | 15 */ |
22 prefs: { | 16 prefs: { |
23 type: Object, | 17 type: Object, |
24 notify: true, | 18 notify: true, |
25 }, | 19 }, |
26 | 20 |
27 /** | 21 /** |
28 * The current active route. | 22 * The current active route. |
29 * @type {!SettingsRoute} | 23 * @type {!SettingsRoute} |
30 */ | 24 */ |
31 currentRoute: { | 25 currentRoute: { |
32 type: Object, | 26 type: Object, |
33 notify: true, | 27 notify: true, |
34 observer: 'currentRouteChanged_', | 28 observer: 'currentRouteChanged_', |
35 }, | 29 }, |
36 | 30 |
37 /** @private */ | 31 /** @private */ |
38 showAdvancedPage_: { | 32 advancedToggleExpanded_: { |
39 type: Boolean, | 33 type: Boolean, |
40 value: false, | 34 value: false, |
41 }, | 35 }, |
42 | 36 |
43 /** @private */ | 37 /** @private */ |
44 showAdvancedToggle_: { | 38 inSubpage_: Boolean, |
45 type: Boolean, | |
46 value: true, | |
47 }, | |
48 | 39 |
49 /** @private */ | 40 /** |
50 showBasicPage_: { | 41 * Controls which main pages are displayed via dom-ifs. |
51 type: Boolean, | 42 * @type {!{ABOUT: boolean, ADVANCED: boolean, BASIC: boolean}} |
52 value: true, | 43 * @private |
53 }, | 44 */ |
54 | 45 showPages_: { |
55 /** @private */ | 46 type: Object, |
56 showAboutPage_: { | 47 value: function() { |
57 type: Boolean, | 48 return {ABOUT: false, ADVANCED: false, BASIC: false}; |
58 value: false, | 49 }, |
59 }, | 50 }, |
60 | 51 |
61 toolbarSpinnerActive: { | 52 toolbarSpinnerActive: { |
62 type: Boolean, | 53 type: Boolean, |
63 value: false, | 54 value: false, |
64 notify: true, | 55 notify: true, |
65 }, | 56 }, |
66 }, | 57 }, |
67 | 58 |
68 /** @override */ | 59 /** @override */ |
69 created: function() { | 60 created: function() { |
70 /** @private {!PromiseResolver} */ | 61 /** @private {!PromiseResolver} */ |
71 this.resolver_ = new PromiseResolver; | 62 this.resolver_ = new PromiseResolver; |
72 settings.main.rendered = this.resolver_.promise; | 63 settings.main.rendered = this.resolver_.promise; |
73 }, | 64 }, |
74 | 65 |
75 /** @override */ | 66 /** @override */ |
76 ready: function() { | 67 ready: function() { |
77 settings.getSearchManager().setCallback(function(isRunning) { | 68 settings.getSearchManager().setCallback(function(isRunning) { |
78 this.toolbarSpinnerActive = isRunning; | 69 this.toolbarSpinnerActive = isRunning; |
79 }.bind(this)); | 70 }.bind(this)); |
80 }, | 71 }, |
81 | 72 |
82 /** @override */ | 73 /** @override */ |
83 attached: function() { | 74 attached: function() { |
84 document.addEventListener('toggle-advanced-page', function(e) { | 75 document.addEventListener('toggle-advanced-page', function(e) { |
85 this.showAdvancedPage_ = e.detail; | 76 this.advancedToggleExpanded_ = e.detail; |
86 this.isAdvancedMenuOpen_ = e.detail; | |
87 this.currentRoute = { | 77 this.currentRoute = { |
88 page: this.isAdvancedMenuOpen_ ? 'advanced' : 'basic', | 78 page: this.advancedToggleExpanded_ ? 'advanced' : 'basic', |
89 section: '', | 79 section: '', |
90 subpage: [], | 80 subpage: [], |
91 }; | 81 }; |
92 if (this.showAdvancedPage_) { | 82 if (this.advancedToggleExpanded_) { |
93 doWhenReady( | 83 doWhenReady( |
94 function() { | 84 function() { |
95 var advancedPage = this.$$('settings-advanced-page'); | 85 var advancedPage = this.$$('settings-advanced-page'); |
96 return !!advancedPage && advancedPage.scrollHeight > 0; | 86 return !!advancedPage && advancedPage.scrollHeight > 0; |
97 }.bind(this), | 87 }.bind(this), |
98 function() { | 88 function() { |
99 this.$$('#toggleContainer').scrollIntoView(); | 89 this.$$('#toggleContainer').scrollIntoView(); |
100 }.bind(this)); | 90 }.bind(this)); |
101 } | 91 } |
102 }.bind(this)); | 92 }.bind(this)); |
103 | 93 |
104 doWhenReady( | 94 doWhenReady( |
105 function() { | 95 function() { |
106 var basicPage = this.$$('settings-basic-page'); | 96 var basicPage = this.$$('settings-basic-page'); |
107 return !!basicPage && basicPage.scrollHeight > 0; | 97 return !!basicPage && basicPage.scrollHeight > 0; |
108 }.bind(this), | 98 }.bind(this), |
109 function() { | 99 function() { |
110 this.resolver_.resolve(); | 100 this.resolver_.resolve(); |
111 }.bind(this)); | 101 }.bind(this)); |
112 }, | 102 }, |
113 | 103 |
114 /** | 104 /** |
115 * @param {boolean} opened Whether the menu is expanded. | 105 * @param {boolean} opened Whether the menu is expanded. |
116 * @return {string} Which icon to use. | 106 * @return {string} Which icon to use. |
117 * @private | 107 * @private |
118 * */ | 108 */ |
119 arrowState_: function(opened) { | 109 arrowState_: function(opened) { |
120 return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down'; | 110 return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down'; |
121 }, | 111 }, |
122 | 112 |
123 /** | 113 /** |
124 * @param {!SettingsRoute} newRoute | 114 * @param {!SettingsRoute} newRoute |
125 * @private | 115 * @private |
126 */ | 116 */ |
127 currentRouteChanged_: function(newRoute) { | 117 currentRouteChanged_: function(newRoute) { |
128 var isSubpage = !!newRoute.subpage.length; | 118 this.inSubpage_ = newRoute.subpage.length > 0; |
| 119 this.style.height = this.inSubpage_ ? '100%' : ''; |
129 | 120 |
130 this.showAboutPage_ = newRoute.page == 'about'; | 121 if (newRoute.page == 'about') { |
| 122 this.showPages_ = {ABOUT: true, ADVANCED: false, BASIC: false}; |
| 123 } else { |
| 124 this.showPages_ = { |
| 125 ABOUT: false, |
| 126 BASIC: newRoute.page == 'basic' || !this.inSubpage_, |
| 127 ADVANCED: newRoute.page == 'advanced' || |
| 128 (!this.inSubpage_ && this.advancedToggleExpanded_), |
| 129 }; |
131 | 130 |
132 this.showAdvancedToggle_ = !this.showAboutPage_ && !isSubpage; | 131 if (this.showPages_.ADVANCED) |
133 | 132 this.advancedToggleExpanded_ = true; |
134 this.showBasicPage_ = this.showAdvancedToggle_ || newRoute.page == 'basic'; | 133 } |
135 | |
136 this.showAdvancedPage_ = | |
137 (this.isAdvancedMenuOpen_ && this.showAdvancedToggle_) || | |
138 newRoute.page == 'advanced'; | |
139 | |
140 this.style.height = isSubpage ? '100%' : ''; | |
141 }, | 134 }, |
142 | 135 |
143 /** @private */ | 136 /** @private */ |
144 toggleAdvancedPage_: function() { | 137 toggleAdvancedPage_: function() { |
145 this.fire('toggle-advanced-page', !this.isAdvancedMenuOpen_); | 138 this.fire('toggle-advanced-page', !this.advancedToggleExpanded_); |
146 }, | 139 }, |
147 | 140 |
148 /** | 141 /** |
149 * Navigates to the default search page (if necessary). | 142 * Navigates to the default search page (if necessary). |
150 * @private | 143 * @private |
151 */ | 144 */ |
152 ensureInDefaultSearchPage_: function() { | 145 ensureInDefaultSearchPage_: function() { |
153 if (this.currentRoute.page != 'basic' || | 146 if (this.currentRoute.page != 'basic' || |
154 this.currentRoute.section != '' || | 147 this.currentRoute.section != '' || |
155 this.currentRoute.subpage.length != 0) { | 148 this.currentRoute.subpage.length != 0) { |
156 this.currentRoute = {page: 'basic', section: '', subpage: [], url: ''}; | 149 this.currentRoute = {page: 'basic', section: '', subpage: [], url: ''}; |
157 } | 150 } |
158 }, | 151 }, |
159 | 152 |
160 /** | 153 /** |
161 * @param {string} query | 154 * @param {string} query |
162 */ | 155 */ |
163 searchContents: function(query) { | 156 searchContents: function(query) { |
164 this.ensureInDefaultSearchPage_(); | 157 this.ensureInDefaultSearchPage_(); |
165 | 158 |
166 // Trigger rendering of the basic and advanced pages and search once ready. | 159 // Trigger rendering of the basic and advanced pages and search once ready. |
167 // Even if those are already rendered, yield to the message loop before | 160 // Even if those are already rendered, yield to the message loop before |
168 // initiating searching. | 161 // initiating searching. |
169 this.showBasicPage_ = true; | 162 this.set('showPages_.BASIC', true); |
170 setTimeout(function() { | 163 setTimeout(function() { |
171 settings.getSearchManager().search( | 164 settings.getSearchManager().search( |
172 query, assert(this.$$('settings-basic-page'))); | 165 query, assert(this.$$('settings-basic-page'))); |
173 }.bind(this), 0); | 166 }.bind(this), 0); |
174 | 167 |
175 this.showAdvancedPage_ = true; | 168 this.set('showPages_.ADVANCED', true); |
176 setTimeout(function() { | 169 setTimeout(function() { |
177 settings.getSearchManager().search( | 170 settings.getSearchManager().search( |
178 query, assert(this.$$('settings-advanced-page'))); | 171 query, assert(this.$$('settings-advanced-page'))); |
179 }.bind(this), 0); | 172 }.bind(this), 0); |
180 }, | 173 }, |
181 }); | 174 }); |
OLD | NEW |