| <!-- |
| 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="../../../bower_components/polymer/polymer.html"> |
| <link rel="import" href="../../../bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html"> |
| <link rel="import" href="../../shared/gr-button/gr-button.html"> |
| <link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html"> |
| <link rel="import" href="../../shared/gr-formatted-text/gr-formatted-text.html"> |
| <link rel="import" href="../../shared/gr-storage/gr-storage.html"> |
| <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html"> |
| <link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html"> |
| |
| |
| <dom-module id="gr-diff-comment"> |
| <template> |
| <style> |
| :host { |
| display: block; |
| font-family: var(--font-family); |
| padding: .7em .7em; |
| --iron-autogrow-textarea: { |
| padding: 2px; |
| }; |
| } |
| :host[disabled] { |
| pointer-events: none; |
| } |
| :host[disabled] .container { |
| opacity: .5; |
| } |
| :host[is-robot-comment] { |
| background-color: #cfe8fc; |
| } |
| .header { |
| cursor: pointer; |
| display: flex; |
| font-family: 'Open Sans', sans-serif; |
| margin-bottom: 0.7em; |
| padding-bottom: 0; |
| } |
| .container.collapsed .header { |
| margin: 0; |
| } |
| .headerMiddle { |
| color: #666; |
| flex: 1; |
| overflow: hidden; |
| } |
| .authorName, |
| .draftLabel { |
| display: block; |
| float: left; |
| font-weight: bold; |
| } |
| .draftLabel { |
| color: #999; |
| display: none; |
| } |
| .date { |
| justify-content: flex-end; |
| margin-left: 5px; |
| white-space: nowrap; |
| } |
| a.date:link, |
| a.date:visited { |
| color: #666; |
| } |
| .actions { |
| display: flex; |
| padding-top: 0; |
| } |
| .action { |
| margin-right: .5em; |
| } |
| .editMessage { |
| display: none; |
| margin: .5em 0; |
| width: 100%; |
| } |
| .container:not(.draft) .actions .hideOnPublished { |
| display: none; |
| } |
| .draft .reply, |
| .draft .quote, |
| .draft .ack, |
| .draft .done { |
| display: none; |
| } |
| .draft .draftLabel { |
| display: inline; |
| } |
| .draft:not(.editing) .save, |
| .draft:not(.editing) .cancel, |
| .draft:not(.editing) .resolve { |
| display: none; |
| } |
| .editing .message, |
| .editing .reply, |
| .editing .quote, |
| .editing .ack, |
| .editing .done, |
| .editing .edit, |
| .editing .unresolved { |
| display: none; |
| } |
| .editing .editMessage { |
| background-color: #fff; |
| display: block; |
| } |
| .show-hide { |
| margin-left: .4em; |
| } |
| .robotId { |
| color: #808080; |
| margin-bottom: .8em; |
| margin-top: -.4em; |
| } |
| .runIdInformation { |
| margin: 1em 0; |
| } |
| .robotRun { |
| margin-left: .5em; |
| } |
| .robotRunLink { |
| margin-left: .5em; |
| } |
| input.show-hide { |
| display: none; |
| } |
| label.show-hide { |
| color: #000; |
| cursor: pointer; |
| display: block; |
| font-size: .8em; |
| height: 1.1em; |
| margin-top: .1em; |
| } |
| #container .collapsedContent { |
| display: none; |
| } |
| #container.collapsed { |
| padding-bottom: 3px; |
| } |
| #container.collapsed .collapsedContent { |
| display: block; |
| overflow: hidden; |
| padding-left: 5px; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| #container.collapsed .actions, |
| #container.collapsed gr-formatted-text, |
| #container.collapsed iron-autogrow-textarea { |
| display: none; |
| } |
| .resolve, |
| .unresolved { |
| align-items: center; |
| display: flex; |
| flex: 1; |
| justify-content: flex-end; |
| } |
| .resolve label { |
| color: #333; |
| font-size: 12px; |
| } |
| </style> |
| <div id="container" |
| class="container" |
| on-mouseenter="_handleMouseEnter" |
| on-mouseleave="_handleMouseLeave"> |
| <div class="header" id="header" on-click="_handleToggleCollapsed"> |
| <div class="headerLeft"> |
| <span class="authorName">[[comment.author.name]]</span> |
| <gr-tooltip-content class="draftLabel" |
| has-tooltip |
| title="This draft is only visible to you. To publish drafts, click the red 'Reply' button at the top of the change or press the 'A' key." |
| max-width="20em" |
| show-icon> |
| DRAFT |
| </gr-tooltip-content> |
| </div> |
| <div class="headerMiddle"> |
| <span class="collapsedContent">[[comment.message]]</span> |
| </div> |
| <a class="date" href$="[[_computeLinkToComment(comment)]]" on-tap="_handleLinkTap"> |
| <gr-date-formatter |
| has-tooltip |
| date-str="[[comment.updated]]"></gr-date-formatter> |
| </a> |
| <div class="show-hide"> |
| <label class="show-hide"> |
| <input type="checkbox" class="show-hide" |
| checked$="[[collapsed]]" |
| on-change="_handleToggleCollapsed"> |
| [[_computeShowHideText(collapsed)]] |
| </label> |
| </div> |
| </div> |
| <template is="dom-if" if="[[comment.robot_id]]"> |
| <div class="robotId" hidden$="[[collapsed]]"> |
| [[comment.robot_id]] |
| </div> |
| </template> |
| <iron-autogrow-textarea |
| id="editTextarea" |
| class="editMessage" |
| autocomplete="on" |
| disabled="{{disabled}}" |
| rows="4" |
| bind-value="{{_messageText}}" |
| on-keydown="_handleTextareaKeydown"></iron-autogrow-textarea> |
| <gr-formatted-text class="message" |
| content="[[comment.message]]" |
| no-trailing-margin="[[!comment.__draft]]" |
| collapsed="[[collapsed]]" |
| config="[[projectConfig.commentlinks]]"></gr-formatted-text> |
| <div hidden$="[[!comment.robot_run_id]]"> |
| <div class="runIdInformation" hidden$="[[collapsed]]"> |
| Run ID: |
| <a class="robotRunLink" href$="[[comment.url]]"> |
| <span class="robotRun">[[comment.robot_run_id]]</span> |
| </a> |
| </div> |
| </div> |
| <div class="actions humanActions" hidden$="[[!_showHumanActions]]"> |
| <gr-button class="action edit hideOnPublished" on-tap="_handleEdit"> |
| Edit</gr-button> |
| <gr-button class="action save hideOnPublished" on-tap="_handleSave" |
| disabled$="[[_computeSaveDisabled(_messageText)]]">Save</gr-button> |
| <gr-button class="action cancel hideOnPublished" |
| on-tap="_handleCancel" hidden>Cancel</gr-button> |
| <gr-button class="action discard hideOnPublished" |
| on-tap="_handleDiscard">Discard</gr-button> |
| <div class="action resolve hideOnPublished"> |
| <label> |
| <input type="checkbox" |
| checked$="[[resolved]]" |
| on-change="_handleToggleResolved"> |
| Resolved |
| </label> |
| </div> |
| <div class="action unresolved hideOnPublished" hidden$="[[resolved]]"> |
| Unresolved |
| </div> |
| </div> |
| <div class="actions robotActions" hidden$="[[!_showRobotActions]]"> |
| <gr-button class="action fix" |
| on-tap="_handleFix" |
| disabled="[[robotButtonDisabled]]"> |
| Please Fix |
| </gr-button> |
| </div> |
| </div> |
| <gr-rest-api-interface id="restAPI"></gr-rest-api-interface> |
| <gr-storage id="storage"></gr-storage> |
| </template> |
| <script src="gr-diff-comment.js"></script> |
| </dom-module> |
