| OLD | NEW |
| (Empty) |
| 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 | |
| 3 // found in the LICENSE file. | |
| 4 | |
| 5 'use strict'; | |
| 6 | |
| 7 /** | |
| 8 * Strips a scheme from an origin. | |
| 9 * @param {string} origin | |
| 10 * @return {string} The host of the given origin. | |
| 11 */ | |
| 12 function stripScheme(origin) { | |
| 13 return new URL(origin).host; | |
| 14 } | |
| 15 | |
| 16 Polymer({ | |
| 17 is: 'engagement-table', | |
| 18 properties: { | |
| 19 /** | |
| 20 * A list of engagement info objects. | |
| 21 * @type !Array<!SiteEngagementInfo> | |
| 22 */ | |
| 23 engagementInfo: {type: Array, value: function() { return []; } }, | |
| 24 | |
| 25 /** | |
| 26 * The table's current sort key. | |
| 27 * @type {string} | |
| 28 * @private | |
| 29 */ | |
| 30 sortKey_: {type: String, value: 'score'}, | |
| 31 | |
| 32 /** | |
| 33 * Whether the table is in reverse sorting order. | |
| 34 * @type {boolean} | |
| 35 * @private | |
| 36 */ | |
| 37 sortReverse: {type: Boolean, value: true, reflectToAttribute: true}, | |
| 38 }, | |
| 39 | |
| 40 /** | |
| 41 * @param {Event} e | |
| 42 */ | |
| 43 handleSortColumnTap: function(e) { | |
| 44 this.sortTable_(e.currentTarget); | |
| 45 e.preventDefault(); | |
| 46 }, | |
| 47 | |
| 48 /** | |
| 49 * Sorts the engagement table based on the provided sort column header. Sort | |
| 50 * columns have a 'sort-key' attribute that is a property name of a | |
| 51 * SiteEngagementInfo. | |
| 52 * @param {HTMLElement} th The column to sort by. | |
| 53 * @private | |
| 54 */ | |
| 55 sortTable_: function(th) { | |
| 56 // Remove the old sort indicator column. | |
| 57 var sortColumn = this.$$('.sort-column'); | |
| 58 if (sortColumn) | |
| 59 sortColumn.className = ''; | |
| 60 | |
| 61 // Updating these properties recomputes the template sort function. | |
| 62 var newSortKey = th.getAttribute('sort-key'); | |
| 63 if (this.sortKey_) | |
| 64 this.sortReverse = (newSortKey == this.sortKey_) && !this.sortReverse; | |
| 65 | |
| 66 this.sortKey_ = newSortKey; | |
| 67 | |
| 68 // Specify the new sort indicator column. | |
| 69 th.className = 'sort-column'; | |
| 70 }, | |
| 71 | |
| 72 /** | |
| 73 * Returns a sorting function for SiteEngagementInfo objects that sorts based | |
| 74 * on sortKey. | |
| 75 * @param {string} sortKey The name of the property to sort by. | |
| 76 * @param {boolean} reverse Whether the sort should be in reverse order. | |
| 77 * @return {function} A comparator for SiteEngagementInfos. | |
| 78 * @private | |
| 79 */ | |
| 80 getTableSortFunction_: function(sortKey, reverse) { | |
| 81 return function(a, b) { | |
| 82 return (reverse ? -1 : 1) * | |
| 83 this.compareTableItem_(sortKey, a, b); | |
| 84 }.bind(this); | |
| 85 }, | |
| 86 | |
| 87 /** | |
| 88 * Compares two SiteEngagementInfo objects based on the sortKey. | |
| 89 * @param {string} sortKey The name of the property to sort by. | |
| 90 * @return {number} A negative number if |a| should be ordered before |b|, a | |
| 91 * positive number otherwise. | |
| 92 * @private | |
| 93 */ | |
| 94 compareTableItem_: function(sortKey, a, b) { | |
| 95 var val1 = a[sortKey]; | |
| 96 var val2 = b[sortKey]; | |
| 97 | |
| 98 if (sortKey == 'origin') | |
| 99 return stripScheme(val1) > stripScheme(val2) ? 1 : -1; | |
| 100 | |
| 101 if (sortKey == 'score') | |
| 102 return val1 - val2; | |
| 103 | |
| 104 assertNotReached('Unsupported sort key: ' + sortKey); | |
| 105 return 0; | |
| 106 }, | |
| 107 | |
| 108 /** | |
| 109 * Handles a score input change by firing an event that contains the origin | |
| 110 * changed and its new score. | |
| 111 * @param {Event} e The change event for the score input. | |
| 112 */ | |
| 113 scoreChanged: function(e) { | |
| 114 if (e.target.value == '') | |
| 115 return; | |
| 116 | |
| 117 e.model.set('info.score', Number(e.target.value)); | |
| 118 this.fire('score-edited', { | |
| 119 origin: e.model.get('info.origin'), | |
| 120 score: Number(e.target.value) | |
| 121 }); | |
| 122 } | |
| 123 }); | |
| OLD | NEW |