| <!-- |
| @license |
| Copyright (C) 2015 The Android Open Source Project |
| |
| Licensed under the Apache License, Version 2.0 (the "License"); |
| you may not use this file except in compliance with the License. |
| You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| --> |
| <link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html"> |
| <link rel="import" href="../../../behaviors/gr-change-table-behavior/gr-change-table-behavior.html"> |
| <link rel="import" href="../../../behaviors/gr-path-list-behavior/gr-path-list-behavior.html"> |
| <link rel="import" href="../../../behaviors/gr-url-encoding-behavior.html"> |
| <link rel="import" href="../../../behaviors/rest-client-behavior/rest-client-behavior.html"> |
| <link rel="import" href="../../../bower_components/polymer/polymer.html"> |
| <link rel="import" href="../../../styles/gr-change-list-styles.html"> |
| <link rel="import" href="../../core/gr-navigation/gr-navigation.html"> |
| <link rel="import" href="../../shared/gr-account-link/gr-account-link.html"> |
| <link rel="import" href="../../shared/gr-change-star/gr-change-star.html"> |
| <link rel="import" href="../../shared/gr-change-status/gr-change-status.html"> |
| <link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html"> |
| <link rel="import" href="../../shared/gr-limited-text/gr-limited-text.html"> |
| <link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html"> |
| <link rel="import" href="../../../styles/shared-styles.html"> |
| |
| <dom-module id="gr-change-list-item"> |
| <template> |
| <style include="shared-styles"> |
| :host { |
| display: table-row; |
| } |
| :host(:focus) { |
| outline: none; |
| } |
| :host(:hover) { |
| background-color: var(--hover-background-color); |
| } |
| :host([needs-review]) { |
| font-family: var(--font-family-bold); |
| } |
| :host([highlight]) { |
| background-color: var(--assignee-highlight-color); |
| } |
| .container { |
| position: relative; |
| } |
| .content { |
| overflow: hidden; |
| position: absolute; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| width: 100%; |
| } |
| .content a { |
| display: block; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| width: 100%; |
| } |
| .spacer { |
| height: 0; |
| overflow: hidden; |
| } |
| .status { |
| align-items: center; |
| display: inline-flex; |
| } |
| .status .comma { |
| padding-right: .2rem; |
| } |
| /* Used to hide the leading separator comma for statuses. */ |
| .status .comma:first-of-type { |
| display: none; |
| } |
| .size gr-tooltip-content { |
| margin: -.4rem -.6rem; |
| max-width: 2.5rem; |
| padding: .4rem .6rem; |
| } |
| a { |
| color: var(--primary-text-color); |
| cursor: pointer; |
| display: inline-block; |
| text-decoration: none; |
| } |
| a:hover { |
| text-decoration: underline; |
| } |
| .u-monospace { |
| font-family: var(--monospace-font-family); |
| } |
| .u-green { |
| color: #388E3C; |
| } |
| .u-red { |
| color: #D32F2F; |
| } |
| .label.u-green:not(.u-monospace), |
| .label.u-red:not(.u-monospace) { |
| font-size: 1.2rem; |
| } |
| .u-gray-background { |
| background-color: var(--table-header-background-color); |
| } |
| .comma, |
| .placeholder { |
| color: var(--deemphasized-text-color); |
| } |
| @media only screen and (max-width: 50em) { |
| :host { |
| display: flex; |
| } |
| } |
| </style> |
| <style include="gr-change-list-styles"></style> |
| <td class="cell leftPadding"></td> |
| <td class="cell star" hidden$="[[!showStar]]" hidden> |
| <gr-change-star change="{{change}}"></gr-change-star> |
| </td> |
| <td class="cell number" hidden$="[[!showNumber]]" hidden> |
| <a href$="[[changeURL]]">[[change._number]]</a> |
| </td> |
| <td class="cell subject" |
| hidden$="[[isColumnHidden('Subject', visibleChangeTableColumns)]]"> |
| <div class="container"> |
| <div class="content"> |
| <a title$="[[change.subject]]" href$="[[changeURL]]"> |
| [[change.subject]] |
| </a> |
| </div> |
| <div class="spacer"> |
| [[change.subject]] |
| </div> |
| <span> </span> |
| </div> |
| </td> |
| <td class="cell status" |
| hidden$="[[isColumnHidden('Status', visibleChangeTableColumns)]]"> |
| <template is="dom-repeat" items="[[statuses]]" as="status"> |
| <div class="comma">,</div> |
| <gr-change-status flat status="[[status]]"></gr-change-status> |
| </template> |
| <template is="dom-if" if="[[!statuses.length]]"> |
| <span class="placeholder">--</span> |
| </template> |
| </td> |
| <td class="cell owner" |
| hidden$="[[isColumnHidden('Owner', visibleChangeTableColumns)]]"> |
| <gr-account-link |
| account="[[change.owner]]" |
| additional-text="[[_computeAccountStatusString(change.owner)]]"></gr-account-link> |
| </td> |
| <td class="cell assignee" |
| hidden$="[[isColumnHidden('Assignee', visibleChangeTableColumns)]]"> |
| <template is="dom-if" if="[[change.assignee]]"> |
| <gr-account-link |
| account="[[change.assignee]]" |
| additional-text="[[_computeAccountStatusString(change.owner)]]"></gr-account-link> |
| </template> |
| <template is="dom-if" if="[[!change.assignee]]"> |
| <span class="placeholder">--</span> |
| </template> |
| </td> |
| <td class="cell project" |
| hidden$="[[isColumnHidden('Project', visibleChangeTableColumns)]]"> |
| <a class="fullProject" href$="[[_computeProjectURL(change.project)]]"> |
| [[change.project]] |
| </a> |
| <a class="truncatedProject" href$="[[_computeProjectURL(change.project)]]"> |
| [[_computeTruncatedProject(change.project)]] |
| </a> |
| </td> |
| <td class="cell branch" |
| hidden$="[[isColumnHidden('Branch', visibleChangeTableColumns)]]"> |
| <a href$="[[_computeProjectBranchURL(change)]]"> |
| [[change.branch]] |
| </a> |
| <template is="dom-if" if="[[change.topic]]"> |
| (<a href$="[[_computeTopicURL(change)]]"><!-- |
| --><gr-limited-text limit="50" text="[[change.topic]]"> |
| </gr-limited-text><!-- |
| --></a>) |
| </template> |
| </td> |
| <td class="cell updated" |
| hidden$="[[isColumnHidden('Updated', visibleChangeTableColumns)]]"> |
| <gr-date-formatter |
| has-tooltip |
| date-str="[[change.updated]]"></gr-date-formatter> |
| </td> |
| <td class="cell size" |
| hidden$="[[isColumnHidden('Size', visibleChangeTableColumns)]]"> |
| <gr-tooltip-content |
| has-tooltip |
| title="[[_computeSizeTooltip(change)]]"> |
| <template is="dom-if" if="[[_changeSize]]"> |
| <span>[[_changeSize]]</span> |
| </template> |
| <template is="dom-if" if="[[!_changeSize]]"> |
| <span class="placeholder">--</span> |
| </template> |
| </gr-tooltip-content> |
| </td> |
| <template is="dom-repeat" items="[[labelNames]]" as="labelName"> |
| <td title$="[[_computeLabelTitle(change, labelName)]]" |
| class$="[[_computeLabelClass(change, labelName)]]"> |
| [[_computeLabelValue(change, labelName)]] |
| </td> |
| </template> |
| </template> |
| <script src="gr-change-list-item.js"></script> |
| </dom-module> |
