| OLD | NEW |
| 1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 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 Polymer({ | 5 Polymer({ |
| 6 is: 'history-router', | 6 is: 'history-router', |
| 7 | 7 |
| 8 properties: { | 8 properties: { |
| 9 selectedPage: { | 9 selectedPage: { |
| 10 type: String, | 10 type: String, |
| 11 notify: true, | 11 notify: true, |
| 12 observer: 'selectedPageChanged_' | 12 observer: 'selectedPageChanged_' |
| 13 }, | 13 }, |
| 14 | 14 |
| 15 /** @type {QueryState} */ | 15 /** @type {QueryState} */ |
| 16 queryState: Object, | 16 queryState: Object, |
| 17 | 17 |
| 18 grouped: Boolean, | |
| 19 | |
| 20 path_: String, | 18 path_: String, |
| 21 | 19 |
| 22 queryParams_: Object, | 20 queryParams_: Object, |
| 23 }, | 21 }, |
| 24 | 22 |
| 25 /** @private {boolean} */ | 23 /** @private {boolean} */ |
| 26 parsing_: false, | 24 parsing_: false, |
| 27 | 25 |
| 28 observers: [ | 26 observers: [ |
| 29 'onUrlChanged_(path_, queryParams_)', | 27 'onUrlChanged_(path_, queryParams_)', |
| 30 ], | 28 ], |
| 31 | 29 |
| 32 /** @override */ | 30 /** @override */ |
| 33 attached: function() { | 31 attached: function() { |
| 34 // Redirect legacy search URLs to URLs compatible with material history. | 32 // Redirect legacy search URLs to URLs compatible with material history. |
| 35 if (window.location.hash) { | 33 if (window.location.hash) { |
| 36 window.location.href = window.location.href.split('#')[0] + '?' + | 34 window.location.href = window.location.href.split('#')[0] + '?' + |
| 37 window.location.hash.substr(1); | 35 window.location.hash.substr(1); |
| 38 } | 36 } |
| 39 }, | 37 }, |
| 40 | 38 |
| 41 /** | 39 /** |
| 42 * Write all relevant page state to the URL. | 40 * Write all relevant page state to the URL. |
| 43 */ | 41 */ |
| 44 serializeUrl: function() { | 42 serializeUrl: function() { |
| 45 var path = this.selectedPage; | 43 var path = this.selectedPage; |
| 46 | 44 |
| 47 if (path == 'history' && this.queryState.range != HistoryRange.ALL_TIME) | |
| 48 path += '/' + this.rangeToString_(this.queryState.range); | |
| 49 | |
| 50 if (path == 'history') | 45 if (path == 'history') |
| 51 path = ''; | 46 path = ''; |
| 52 | 47 |
| 53 var offsetParam = null; | |
| 54 if (this.selectedPage == 'history' && this.queryState.groupedOffset) | |
| 55 offsetParam = this.queryState.groupedOffset; | |
| 56 | |
| 57 // Make all modifications at the end of the method so observers can't change | 48 // Make all modifications at the end of the method so observers can't change |
| 58 // the outcome. | 49 // the outcome. |
| 59 this.path_ = '/' + path; | 50 this.path_ = '/' + path; |
| 60 this.set('queryParams_.offset', offsetParam); | |
| 61 this.set('queryParams_.q', this.queryState.searchTerm || null); | 51 this.set('queryParams_.q', this.queryState.searchTerm || null); |
| 62 }, | 52 }, |
| 63 | 53 |
| 64 /** @private */ | 54 /** @private */ |
| 65 selectedPageChanged_: function() { | 55 selectedPageChanged_: function() { |
| 66 // Update the URL if the page was changed externally, but ignore the update | 56 // Update the URL if the page was changed externally, but ignore the update |
| 67 // if it came from parseUrl_(). | 57 // if it came from parseUrl_(). |
| 68 if (!this.parsing_) | 58 if (!this.parsing_) |
| 69 this.serializeUrl(); | 59 this.serializeUrl(); |
| 70 }, | 60 }, |
| 71 | 61 |
| 72 /** @private */ | 62 /** @private */ |
| 73 parseUrl_: function() { | 63 parseUrl_: function() { |
| 74 this.parsing_ = true; | 64 this.parsing_ = true; |
| 75 var changes = {}; | 65 var changes = {}; |
| 76 var sections = this.path_.substr(1).split('/'); | 66 var sections = this.path_.substr(1).split('/'); |
| 77 var page = sections[0] || 'history'; | 67 var page = sections[0] || 'history'; |
| 78 | 68 |
| 79 if (page == 'history' && this.grouped) { | |
| 80 var range = sections.length > 1 ? this.stringToRange_(sections[1]) : | |
| 81 HistoryRange.ALL_TIME; | |
| 82 changes.range = range; | |
| 83 changes.offset = Number(this.queryParams_.offset) || 0; | |
| 84 } | |
| 85 | |
| 86 changes.search = this.queryParams_.q || ''; | 69 changes.search = this.queryParams_.q || ''; |
| 87 | 70 |
| 88 // Must change selectedPage before `change-query`, otherwise the | 71 // Must change selectedPage before `change-query`, otherwise the |
| 89 // query-manager will call serializeUrl() with the old page. | 72 // query-manager will call serializeUrl() with the old page. |
| 90 this.selectedPage = page; | 73 this.selectedPage = page; |
| 91 this.fire('change-query', changes); | 74 this.fire('change-query', changes); |
| 92 this.serializeUrl(); | 75 this.serializeUrl(); |
| 93 | 76 |
| 94 this.parsing_ = false; | 77 this.parsing_ = false; |
| 95 }, | 78 }, |
| 96 | 79 |
| 97 /** @private */ | 80 /** @private */ |
| 98 onUrlChanged_: function() { | 81 onUrlChanged_: function() { |
| 99 // Changing the url and query parameters at the same time will cause two | 82 // Changing the url and query parameters at the same time will cause two |
| 100 // calls to onUrlChanged_. Debounce the actual work so that these two | 83 // calls to onUrlChanged_. Debounce the actual work so that these two |
| 101 // changes get processed together. | 84 // changes get processed together. |
| 102 this.debounce('parseUrl', this.parseUrl_.bind(this)); | 85 this.debounce('parseUrl', this.parseUrl_.bind(this)); |
| 103 }, | 86 }, |
| 104 | |
| 105 /** | |
| 106 * @param {!HistoryRange} range | |
| 107 * @return {string} | |
| 108 */ | |
| 109 rangeToString_: function(range) { | |
| 110 switch (range) { | |
| 111 case HistoryRange.WEEK: | |
| 112 return 'week'; | |
| 113 case HistoryRange.MONTH: | |
| 114 return 'month'; | |
| 115 default: | |
| 116 return ''; | |
| 117 } | |
| 118 }, | |
| 119 | |
| 120 /** | |
| 121 * @param {string} str | |
| 122 * @return {HistoryRange} | |
| 123 */ | |
| 124 stringToRange_: function(str) { | |
| 125 switch (str) { | |
| 126 case 'week': | |
| 127 return HistoryRange.WEEK; | |
| 128 case 'month': | |
| 129 return HistoryRange.MONTH; | |
| 130 default: | |
| 131 return HistoryRange.ALL_TIME; | |
| 132 } | |
| 133 } | |
| 134 }); | 87 }); |
| OLD | NEW |