Index: dashboard/dashboard/pinpoint/elements/execution-status.html |
diff --git a/dashboard/dashboard/pinpoint/elements/execution-status.html b/dashboard/dashboard/pinpoint/elements/execution-status.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..87c9dbb1f35f5b8517271f466aead41e89196d9a |
--- /dev/null |
+++ b/dashboard/dashboard/pinpoint/elements/execution-status.html |
@@ -0,0 +1,154 @@ |
+<!DOCTYPE html> |
+<!-- |
+Copyright 2017 The Chromium Authors. All rights reserved. |
+Use of this source code is governed by a BSD-style license that can be |
+found in the LICENSE file. |
+--> |
+ |
+<link rel="import" href="/components/iron-selector/iron-selector.html"> |
+ |
+<link rel="import" href="/dashboard/pinpoint/elements/base-style.html"> |
+ |
+<dom-module id="execution-status"> |
+ <template> |
+ <style include="base-style"> |
+ #exception { |
+ font-size: 0.5em; |
+ white-space: pre-wrap; |
+ } |
+ |
+ #status-boxes { |
+ display: flex; |
+ height: 1em; |
+ margin: 0.5em -1px; |
+ } |
+ |
+ .status-box { |
+ flex: 1; |
+ margin: 0 1px; |
+ } |
+ |
+ .completed { |
+ background-color: var(--paper-green-500); |
+ } |
+ |
+ .completed:hover, |
+ .completed.iron-selected { |
+ background-color: var(--paper-green-700); |
+ } |
+ |
+ .failed { |
+ background-color: var(--paper-red-500); |
+ } |
+ |
+ .failed:hover, |
+ .failed.iron-selected { |
+ background-color: var(--paper-red-700); |
+ } |
+ |
+ .running { |
+ background-color: var(--paper-grey-500); |
+ } |
+ |
+ .running:hover, |
+ .running.iron-selected { |
+ background-color: var(--paper-grey-700); |
+ } |
+ |
+ th { |
+ text-align: right; |
+ width: 8em; |
+ } |
+ </style> |
+ |
+ <iron-selector id="status-boxes" selected="{{attemptIndex}}"> |
+ <template is="dom-repeat" items="[[attempts]]"> |
+ <div id="status-box-[[index]]-[[questIndex]]" |
+ class$="status-box [[status(item, questIndex)]]"> |
+ </div> |
+ </template> |
+ </iron-selector> |
+ <template is="dom-if" if="[[exception(attemptIndex, questIndex)]]"> |
+ <p id="exception">[[exception(attemptIndex, questIndex)]]</p> |
+ </template> |
+ <table> |
+ <template is="dom-repeat" items="[[executionDetails(attemptIndex, questIndex)]]"> |
+ <tr> |
+ <th>[[item.key]] |
+ <td> |
+ <template is="dom-if" if="[[item.url]]"> |
+ <a href="[[item.url]]" target="_blank">[[item.value]]</a> |
+ </template> |
+ <template is="dom-if" if="[[!item.url]]"> |
+ [[item.value]] |
+ </template> |
+ </tr> |
+ </template> |
+ </table> |
+ </template> |
+ |
+ <script> |
+ 'use strict'; |
+ Polymer({ |
+ is: 'execution-status', |
+ |
+ properties: { |
+ attempts: { |
+ type: Object, |
+ }, |
+ |
+ attemptIndex: { |
+ type: Number, |
+ notify: true, |
+ }, |
+ |
+ questIndex: { |
+ type: Number, |
+ }, |
+ }, |
+ |
+ status(attempt, questIndex) { |
+ const execution = attempt.executions[questIndex]; |
+ if (execution.exception) { |
+ return 'failed'; |
+ } |
+ if (execution.completed) { |
+ return 'completed'; |
+ } |
+ return 'running'; |
+ }, |
+ |
+ exception(attemptIndex, questIndex) { |
+ return this.attempts[attemptIndex].executions[questIndex].exception; |
+ }, |
+ |
+ executionDetails(attemptIndex, questIndex) { |
+ const execution = this.attempts[attemptIndex].executions[questIndex]; |
+ const details = |
+ Object.assign(execution.details, execution.result_arguments); |
+ |
+ const executionDetails = []; |
+ for (const key in details) { |
+ const value = details[key]; |
+ if (!value) { |
+ continue; |
+ } |
+ |
+ let url = ''; |
+ if (key == 'bot_id') { |
+ url = 'https://chromium-swarm.appspot.com/bot?id=' + value; |
+ } else if (key == 'build') { |
+ // TODO: Buildbucket doesn't have a UI. Provide some kind of link. |
+ } else if (key == 'isolate_hash') { |
+ url = 'https://isolateserver.appspot.com/browse?digest=' + value; |
+ } else if (key == 'task_id') { |
+ url = 'https://chromium-swarm.appspot.com/task?id=' + value; |
+ } |
+ |
+ executionDetails.push({key, value, url}); |
+ } |
+ return executionDetails; |
+ }, |
+ }); |
+ </script> |
+</dom-module> |