| <!-- |
| The res/js/status.js file must be included before this file. |
| |
| This in an HTML Import-able file that contains the definition |
| of the following elements: |
| |
| <commits-table-sk> |
| |
| This element renders the status table. It includes a UI to filter the table by task spec group |
| (e.g. Interesting, Comments, etc), a UI to type in a search term to filter the task specs by, and |
| a way to change if the author name or commit subject should be displayed. It is important |
| to note that the filtering of the data does not happen here, it happens in commits-data-sk. |
| |
| To use this file import it: |
| |
| <link href="/res/imp/commits-table-sk.html" rel="import" /> |
| |
| Usage: |
| |
| <commits-table-sk></commits-table-sk> |
| |
| Properties: |
| // inputs |
| task_details: Object, a map of commit hash to an object that has the task results by task spec. |
| task_specs: Object, a map of the task spec names to an object that has, among other things, category, subcategory, comments and master. |
| tasks: Object, a map of the task spec names to an object that maps task numbers to task results. |
| categories: Object, a map of the task spec categories to an object that has the subcategories and the colspan (total number of included task specs). |
| category_list: Array<String>, an array of the task spec category names. |
| commits: Array<Object>, the commit objects, in chronological detail. |
| commits_map: Object, a map of commit hash to commit objects. |
| logged_in: Boolean, if the links should be for internal or external pages. |
| relanded_map: Object, a map of a commit hash that was relanded to the commit hash that relands it. |
| repo: String, the current repo. Used to direct comments to the right place. |
| repo_base: The base URL for commits. Commit hashes will be appended to this. |
| reverted_map: Object, a map of a commit hash that was reverted to the commit hash that relands it. |
| swarming_url: String, the URL of the Swarming server. |
| task_scheduler_url: String, the URL of the Task Scheduler. |
| |
| // outputs |
| commit_label: String, "author" or "subject", which indicates what info should be displayed about a commit. |
| drawing: Boolean, if the table is being drawn. |
| filter: String, the task spec filter to be used. |
| search: String, the string to be used if filter is "search". |
| |
| Methods: |
| None. |
| |
| Events: |
| None. |
| --> |
| <link rel="import" href="/res/imp/bower_components/iron-icons/iron-icons.html"> |
| <link rel="import" href="/res/imp/bower_components/iron-icons/communication-icons.html"> |
| <link rel="import" href="/res/imp/bower_components/iron-icons/image-icons.html"> |
| <link rel="import" href="/res/imp/bower_components/paper-button/paper-button.html"> |
| <link rel="import" href="/res/imp/bower_components/paper-dialog/paper-dialog.html"> |
| <link rel="import" href="/res/imp/bower_components/paper-input/paper-input.html"> |
| <link rel="import" href="/res/imp/bower_components/paper-radio-group/paper-radio-group.html"> |
| <link rel="import" href="/res/imp/bower_components/paper-radio-button/paper-radio-button.html"> |
| |
| |
| <link rel="import" href="/res/common/imp/confirm-dialog-sk.html"> |
| |
| <link rel="import" href="commits-table-d3-sk.html"> |
| |
| <dom-module id="commits-table-sk"> |
| <template> |
| <style include="iron-flex iron-flex-alignment iron-positioning"> |
| .filters{ |
| font-size: .75em; |
| height: 50px; |
| min-width: 950px; |
| max-width: 1250px; |
| } |
| div.tooltip { |
| padding-right: 12px; |
| display:inline-block; |
| } |
| |
| #taskSpecTextFilter { |
| max-width:144px; |
| display:inline-block; |
| --paper-input-container-label: { |
| font-size:0.75em; |
| }; |
| } |
| |
| /* Depending on if the subject or author is being shown, we may need more or less space.*/ |
| #filterSelector.near { |
| margin-left: 40px; |
| } |
| |
| #filterSelector.far { |
| margin-left: 380px; |
| } |
| |
| .helpicon { |
| width: 12px; |
| height: 12px; |
| vertical-align: top; |
| } |
| |
| paper-radio-group { |
| --paper-radio-group-item-padding: 2px; |
| } |
| |
| :host { |
| /* prevent the comments-sk from making the popup super wide or super narrow*/ |
| --comments-sk-style: { |
| max-width: 1200px; |
| min-width: 300px; |
| }; |
| } |
| |
| a.nodecorate { |
| color: #000000; |
| text-decoration: none; |
| } |
| </style> |
| |
| <confirm-dialog-sk id="confirm_dialog"></confirm-dialog-sk> |
| <div> |
| <div id="filterWrapper"> |
| <div class="filters horizontal layout center"> |
| <paper-radio-group id="commitLabelSelector" selected="{{commit_label}}"> |
| <template is="dom-repeat" items="{{_commit_labels}}" as="label"> |
| <paper-radio-button name="{{label}}">{{_getPrettyCommitLabel(label)}}</paper-radio-button><br/> |
| </template> |
| </paper-radio-group> |
| |
| <paper-radio-group id="filterSelector" class$="{{_getLeftAlign(commit_label)}} horizontal layout center" selected="{{filter}}"> |
| <template is="dom-repeat" items="{{_short_filters}}" as="filter"> |
| <paper-radio-button name="{{filter}}">{{_getPrettyFilterLabel(filter)}}</paper-radio-button> |
| <div class="tooltip" title$="{{_getPrettyFilterText(filter)}}"> |
| <iron-icon icon="icons:help" class="helpicon"></iron-icon> |
| </div> |
| </template> |
| <paper-radio-button name="search"></paper-radio-button> |
| </paper-radio-group> |
| <paper-input |
| id="taskSpecTextFilter" |
| value="{{_searchVal}}" |
| label="Filter task spec" |
| on-change="_setFilterToSearch" |
| no-label-float> |
| </paper-input> |
| <div class="tooltip" title$="{{_getPrettyFilterText('search')}}"> |
| <iron-icon icon="icons:help" class="helpicon"></iron-icon> |
| </div> |
| <a href$="{{_trigger_job_url}}" target="_blank" class="nodecorate" rel="noopener"> |
| <paper-button raised> |
| <iron-icon icon="icons:add"></iron-icon> |
| Trigger a Job |
| </paper-button> |
| </a> |
| <a href$="{{_rerun_purple_url}}" target="_blank" class="nodecorate" rel="noopener"> |
| <paper-button raised> |
| <iron-icon icon="icons:autorenew"></iron-icon> |
| Re-Run Purple Jobs |
| </paper-button> |
| </a> |
| </div> |
| </div> |
| |
| <commits-table-d3-sk |
| task_specs="[[task_specs]]" |
| tasks="[[tasks]]" |
| categories="[[categories]]" |
| category_list="[[category_list]]" |
| task_details="[[task_details]]" |
| commit_label="[[commit_label]]" |
| commits="[[commits]]" |
| commits_map="[[commits_map]]" |
| logged_in="[[logged_in]]" |
| relanded_map="[[relanded_map]]" |
| repo="[[repo]]" |
| repo_base="[[repo_base]]" |
| reverted_map="[[reverted_map]]" |
| swarming_url="[[swarming_url]]" |
| task_scheduler_url="[[task_scheduler_url]]" |
| time_points="[[time_points]]" |
| |
| drawing="{{drawing}}"> |
| </commits-table-d3-sk> |
| </div> |
| |
| </template> |
| <script> |
| (function(){ |
| var PRETTY_COMMIT_LABELS = { |
| "author": "Author", |
| "subject": "Subject", |
| }; |
| |
| var PRETTY_FILTER_LABELS = { |
| "interesting": ["Interesting", "Bots which have both successes and failures within the visible commit window."], |
| "failures": ["Failures", "Bots which have failures within the visible commit window."], |
| "comments": ["Comments", "Bots which have comments."], |
| "nocomment": ["Failing w/o comment", "Bots which have failures within the visible commit window but have no comments."], |
| "all": ["All", "Display all bots."], |
| "search": [" ", "Enter a search string. Substrings and regular expressions may be used, per the Javascript String match() rules."], |
| }; |
| |
| Polymer({ |
| is: "commits-table-sk", |
| |
| properties: { |
| // inputs from data source to render. |
| task_specs: { |
| type: Object, |
| }, |
| categories: { |
| type: Object, |
| }, |
| category_list: { |
| type: Array, |
| }, |
| task_details: { |
| type: Object, |
| }, |
| tasks: { |
| type: Object, |
| }, |
| commits: { |
| type: Array, |
| }, |
| commits_map: { |
| type: Object, |
| }, |
| logged_in: { |
| type: Boolean, |
| }, |
| purple_tasks: { |
| type: Array, |
| }, |
| relanded_map: { |
| type: Object, |
| }, |
| repo: { |
| type: String, |
| }, |
| repo_base: { |
| type: String, |
| }, |
| reverted_map: { |
| type: Object, |
| }, |
| swarming_url: { |
| type: String, |
| }, |
| task_scheduler_url: { |
| type: String, |
| }, |
| time_points: { |
| type: Object, |
| }, |
| |
| // outputs (from UI elements) |
| commit_label: { |
| type: String, |
| notify:true, |
| }, |
| drawing: { |
| type: Boolean, |
| notify: true, |
| }, |
| filter: { |
| type: String, |
| notify: true, |
| }, |
| search: { |
| type: String, |
| notify:true, |
| }, |
| |
| // private |
| _commit_labels: { |
| type: Array, |
| value: function(){ |
| return ["author", "subject"]; |
| } |
| }, |
| _rerun_purple_url: { |
| type: String, |
| computed: "_getRerunJobsUrl(task_scheduler_url, purple_tasks)", |
| }, |
| _searchVal: { |
| type: String, |
| value: "", |
| }, |
| _short_filters: { |
| type: Array, |
| value: function(){ |
| // "search" is omitted because it is drawn seperately, being a paper-input and all. |
| return ["interesting","failures","comments","nocomment","all"]; |
| } |
| }, |
| _trigger_job_url: { |
| type: String, |
| computed: "_getTriggerJobUrl(task_scheduler_url)", |
| }, |
| _triggered_jobs: { |
| type: Array, |
| value: function() { |
| return []; |
| }, |
| }, |
| }, |
| |
| _getPrettyCommitLabel: function(key) { |
| return PRETTY_COMMIT_LABELS[key]; |
| }, |
| _getPrettyFilterLabel: function(key) { |
| // index 0 is the short name, index 1 is the description |
| return PRETTY_FILTER_LABELS[key][0]; |
| }, |
| _getPrettyFilterText: function(key) { |
| // index 0 is the short name, index 1 is the description |
| return PRETTY_FILTER_LABELS[key][1]; |
| }, |
| _getTriggerJobUrl: function() { |
| return this.task_scheduler_url + "/trigger"; |
| }, |
| |
| _getRerunJobsUrl: function() { |
| var url = this.task_scheduler_url + "/trigger"; |
| for (var i = 0; i < this.purple_tasks.length; i++) { |
| var sep = "&"; |
| if (i === 0) { |
| sep = "?"; |
| } |
| var t = this.purple_tasks[i]; |
| url += sep + "job=" + t.name + "@" + t.commit; |
| } |
| return url; |
| }, |
| |
| _setFilterToSearch: function() { |
| this.set("filter", "search"); |
| this.set("search", this._searchVal); |
| }, |
| |
| _getLeftAlign: function(commit_label) { |
| if (commit_label == "author") { |
| return "near"; |
| } |
| return "far"; |
| } |
| |
| }); |
| })() |
| </script> |
| </dom-module |
