| <!-- The <list-page-sk> custom element declaration. |
| |
| Displays the summary of tests that match the search query in the URL. |
| |
| Attributes: |
| None |
| |
| Methods: |
| pageSelected(ctx) - Called by the router when the view becomes visible. |
| ctx is the context provided in the route dispatch of page.js. |
| |
| pageDeselected - Called by the router when the view is no longer visible. |
| |
| Events: |
| None |
| |
| Mailboxes: |
| None |
| |
| --> |
| <link rel="import" href="bower_components/polymer/polymer.html"> |
| <link rel="import" href="bower_components/iron-flex-layout/iron-flex-layout-classes.html"> |
| <link rel="import" href="bower_components/paper-toggle-button/paper-toggle-button.html"> |
| <link rel="import" href="bower_components/iron-icons/iron-icons.html"> |
| <link rel="import" href="bower_components/paper-button/paper-button.html"> |
| <link rel="import" href="bower_components/paper-menu-button/paper-menu-button.html"> |
| |
| <link rel="import" href="../common/imp/sort.html"> |
| |
| <link rel="import" href="activity-sk.html"> |
| <link rel="import" href="test-summary-sk.html"> |
| <link rel="import" href="search-controls-sk.html"> |
| <link rel="import" href="shared-styles.html"> |
| |
| <dom-module id="list-page-sk"> |
| <template> |
| <style include="iron-flex iron-flex-alignment"></style> |
| <style include="shared-styles"></style> |
| <style> |
| test-summary-sk { |
| display: block; |
| margin-top: 0.5em; |
| } |
| |
| .header { |
| width: 25em; |
| float: left; |
| margin-left: .6em; |
| color: #1F78B4; |
| text-decoration: none; |
| cursor: pointer; |
| text-transform: uppercase; |
| } |
| |
| .header.short { |
| width: 6em; |
| } |
| |
| #core { |
| margin-top: 1em; |
| margin-left: 1em; |
| } |
| |
| paper-button[disabled] { |
| background: transparent; |
| color: #1F78B4; |
| } |
| |
| .wrapper { |
| margin-top: 1em; |
| } |
| |
| .actionMenu { |
| max-width: 10em; |
| margin-left: 10em; |
| } |
| |
| .actionButton { |
| color: green; |
| }; |
| |
| </style> |
| |
| <div id="core" class="vertical layout"> |
| <activity-sk id="activityBar" busy="{{_hideAll}}"></activity-sk> |
| <div hidden$="{{_hideAll}}"> |
| <div class="layout horizontal"> |
| <search-controls-sk id="searchControls"></search-controls-sk> |
| <paper-menu-button close-on-activate no-animations class="actionMenu"> |
| <paper-button class="dropdown-trigger actionButton" raised>Actions</paper-button> |
| <paper-menu class="dropdown-content"> |
| <paper-item on-tap="_handleSwitchToSearch">See All Digests</paper-item> |
| </paper-menu> |
| </paper-menu-button> |
| </div> |
| |
| <div class="wrapper"> |
| <sort-sk target="summaries"> |
| <div class="horizontal layout"> |
| <a class="header" data-key="name" data-alpha=true>Name</a> |
| <a class="header short">Grid</a> |
| <a class="header short">Cluster</a> |
| <a class="header short" data-key="pos">Pos</a> |
| <a class="header short" data-key="neg">Neg</a> |
| <a class="header short" data-key="untriaged">Unt</a> |
| <a class="header short" data-key="num">Total</a> |
| <a class="header">Blame</a> |
| </div> |
| </sort-sk> |
| <div id="summaries"></div> |
| </div> |
| </div> |
| </div> |
| </template> |
| |
| <script> |
| (function() { |
| |
| var NAME_FIELD = "name"; |
| |
| Polymer({ |
| is: "list-page-sk", |
| |
| properties: { |
| _state: { |
| type: Object, |
| value: null, |
| notify: true |
| } |
| }, |
| |
| behaviors: [gold.PageStateBehavior], |
| |
| ready: function() { |
| this.listen(this.$.searchControls, 'state-change', '_handleStateChange'); |
| this._setDefaultState(gold.defaultSearchState, false); |
| }, |
| |
| pageSelected: function(ctx) { |
| this._loadParamset(); |
| this._initState(ctx, this._getDefaultStateWithCorpus()); |
| this.$.searchControls.setState(this._state); |
| this._load(); |
| }, |
| |
| pageDeselected: function() {}, |
| |
| _handleStateChange: function(ev) { |
| // Reload the page with the new state in the query parameters. |
| this._redirectToState(ev.detail); |
| }, |
| |
| _load: function() { |
| var q = window.location.search; |
| this.$.activityBar.startSpinner("Loading ..."); |
| sk.get("/json/list" + q).then(JSON.parse).then(function (json) { |
| // Remove the name field from the current query. |
| this._currentQuery = sk.query.toParamSet(this._state.query); |
| delete this._currentQuery[NAME_FIELD]; |
| |
| this._displaySummaries(json); |
| this.$.activityBar.stopSpinner(); |
| }.bind(this)).catch(function(e) { |
| this.$.activityBar.stopSpinner(); |
| sk.errorMessage(e); |
| }.bind(this)); |
| }, |
| |
| _displaySummaries: function(summaries) { |
| var container = this.$.summaries; |
| sk.clearChildren(container); |
| var stateCopy = gold.filterEmpty(this._state); |
| |
| // The search string for the cluster link includes |
| // positive, negatives and untriaged. |
| var clusterStateCopy = gold.filterEmpty(this._state); |
| clusterStateCopy.pos = true; |
| clusterStateCopy.neg = true; |
| clusterStateCopy.unt = true; |
| |
| summaries.forEach(function(c, i) { |
| var s = document.createElement("test-summary-sk"); |
| s.summary = c; |
| s.search = this._searchStr(stateCopy, c); |
| s.clusterSearch = this._searchStr(clusterStateCopy, c); |
| container.appendChild(s); |
| }.bind(this)); |
| }, |
| |
| _searchStr: function(baseState, summary) { |
| // Swap out the test name and generate the search string. |
| this._currentQuery[NAME_FIELD] = [summary.name]; |
| baseState.query = sk.query.fromParamSet(this._currentQuery); |
| return sk.query.fromObject(baseState); |
| }, |
| |
| _loadParamset: function() { |
| sk.get("/json/paramset").then(JSON.parse).then(function (json) { |
| this.$.searchControls.setParamSet(json); |
| }.bind(this)).catch(sk.errorMessage); |
| }, |
| |
| _handleSwitchToSearch: function() { |
| this._redirectToState({}, "/search"); |
| } |
| }); |
| |
| })(); |
| </script> |
| </dom-module> |