src/third_party/WebKit/Tools/GardeningServer/ui/ct-failure-card.html

   1 <!--
   2 Copyright 2014 The Chromium Authors. All rights reserved.
   3 Use of this source code is governed by a BSD-style license that can be
   4 found in the LICENSE file.
   5 -->
   6
   7 <link rel="import" href="ct-builder-grid.html">
   8 <link rel="import" href="ct-commit-list.html">
   9 <link rel="import" href="ct-test-list.html">
  10
  11 <polymer-element name="ct-failure-card" attributes="group commits tree">
  12   <template>
  13     <style>
  14       :host {
  15         display: flex;
  16       }
  17
  18       /* FIXME: All this paper-button styling should go in a cr-button component so that
  19          we can use buttons in different places and have them all look the same. */
  20       paper-button {
  21         -webkit-user-select: none;
  22         background: #f5f5f5;
  23         border-radius: 2px;
  24         border: 1px solid #dcdcdc;
  25         color: #444;
  26         padding: 0 16px;
  27         margin-bottom: 5px;
  28         text-align: center;
  29       }
  30
  31       paper-button:focus {
  32         border: 1px solid #4d90fe;
  33         outline: none;
  34       }
  35
  36       paper-button:active {
  37         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);
  38       }
  39
  40       paper-button:active, paper-button:hover {
  41         background: #f8f8f8;
  42         border-color: #c6c6c6;
  43         box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
  44         color: #222;
  45       }
  46
  47       ct-builder-grid {
  48         margin-right: 10px;
  49         width: 250px;
  50       }
  51
  52       #failure {
  53         flex: 1;
  54       }
  55
  56       #buttons {
  57         display: flex;
  58         flex-direction: column;
  59       }
  60
  61       .snoozed {
  62         opacity: 0.5;
  63       }
  64     </style>
  65     <ct-builder-grid failures="{{ group.failures }}"></ct-builder-grid>
  66     <div id="failure" class="{{ { snoozed: group.isSnoozed } | tokenList }}">
  67       <ct-test-list tests="{{ group.failures }}" tree="{{ tree }}"></ct-test-list>
  68       <ct-commit-list first="{{ group.failures[0].lastPassingRevisions }}"
  69           last="{{ group.failures[0].firstFailingRevisions }}"
  70           commits="{{ commits }}"></ct-commit-list>
  71     </div>
  72     <div id="buttons">
  73       <paper-button id="examine" on-tap="{{ examine }}" label="Examine"></paper-button>
  74       <template if="{{ !group.isSnoozed }}">
  75         <paper-button id="snooze" on-tap="{{ snooze }}" label="Snooze"></paper-button>
  76       </template>
  77       <template if="{{ group.isSnoozed }}">
  78         <paper-button id="snooze" on-tap="{{ unsnooze }}" label="Unsnooze"></paper-button>
  79       </template>
  80     </div>
  81   </template>
  82   <script>
  83     Polymer({
  84       group: null,
  85       commits: {},
  86       tree: '',
  87
  88       examine: function() {
  89         this.fire('ct-examine-failures', this.group);
  90       },
  91
  92       snooze: function() {
  93         this.group.snoozeUntil(Date.now() + 60 * 60 * 1000);
  94       },
  95
  96       unsnooze: function() {
  97         this.group.unsnooze();
  98       },
  99     });
 100   </script>
 101 </polymer-element>