6cd3de4139
This also adds an intermediate string formatting object for comment string manipulation tasks that are going to be done in the patch range select and diff file dropdown as well. Change-Id: Idee3debd24c40bcc70a0ac27cf1218394d79b53c
407 lines
13 KiB
HTML
407 lines
13 KiB
HTML
<!--
|
|
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="../../../behaviors/async-foreach-behavior/async-foreach-behavior.html">
|
|
<link rel="import" href="../../../behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior.html">
|
|
<link rel="import" href="../../../behaviors/gr-patch-set-behavior/gr-patch-set-behavior.html">
|
|
<link rel="import" href="../../../styles/shared-styles.html">
|
|
<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
|
|
<link rel="import" href="../../core/gr-reporting/gr-reporting.html">
|
|
<link rel="import" href="../../diff/gr-diff/gr-diff.html">
|
|
<link rel="import" href="../../diff/gr-diff-cursor/gr-diff-cursor.html">
|
|
<link rel="import" href="../../edit/gr-edit-file-controls/gr-edit-file-controls.html">
|
|
<link rel="import" href="../../shared/gr-button/gr-button.html">
|
|
<link rel="import" href="../../shared/gr-cursor-manager/gr-cursor-manager.html">
|
|
<link rel="import" href="../../shared/gr-linked-text/gr-linked-text.html">
|
|
<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
|
|
<link rel="import" href="../../shared/gr-select/gr-select.html">
|
|
<link rel="import" href="../../shared/gr-count-string-formatter/gr-count-string-formatter.html">
|
|
<link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html">
|
|
<link rel="import" href="../gr-file-list-constants.html">
|
|
|
|
<dom-module id="gr-file-list">
|
|
<template>
|
|
<style include="shared-styles">
|
|
:host {
|
|
display: block;
|
|
}
|
|
.row {
|
|
align-items: center;
|
|
border-top: 1px solid #ddd;
|
|
display: flex;
|
|
min-height: 2.25em;
|
|
padding: .2em var(--default-horizontal-margin);
|
|
}
|
|
:host(.loading) .row {
|
|
opacity: .5;
|
|
};
|
|
:host(.editLoaded) .hideOnEdit {
|
|
display: none;
|
|
}
|
|
.showOnEdit {
|
|
display: none;
|
|
}
|
|
:host(.editLoaded) .showOnEdit {
|
|
display: initial;
|
|
}
|
|
.reviewed,
|
|
.status {
|
|
align-items: center;
|
|
display: inline-flex;
|
|
}
|
|
.reviewed,
|
|
.status {
|
|
display: inline-block;
|
|
text-align: center;
|
|
width: 1.5em;
|
|
}
|
|
.file-row:hover {
|
|
background-color: #f5fafd;
|
|
}
|
|
.row.selected {
|
|
background-color: #ebf5fb;
|
|
}
|
|
.path {
|
|
cursor: pointer;
|
|
flex: 1;
|
|
padding-left: .35em;
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
}
|
|
.path:hover :first-child {
|
|
text-decoration: underline;
|
|
}
|
|
.path,
|
|
.path div {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.oldPath {
|
|
color: #999;
|
|
}
|
|
.comments,
|
|
.stats {
|
|
text-align: right;
|
|
}
|
|
.comments {
|
|
padding-left: 2em;
|
|
}
|
|
.stats {
|
|
min-width: 7em;
|
|
}
|
|
.invisible {
|
|
visibility: hidden;
|
|
}
|
|
.row:not(.header) .stats,
|
|
.total-stats {
|
|
font-family: var(--monospace-font-family);
|
|
}
|
|
.added {
|
|
color: #388E3C;
|
|
}
|
|
.removed {
|
|
color: #D32F2F;
|
|
}
|
|
.drafts {
|
|
color: #C62828;
|
|
font-family: var(--font-family-bold);
|
|
}
|
|
.show-hide {
|
|
width: 1em;
|
|
}
|
|
.fileListButton {
|
|
margin: .5em;
|
|
}
|
|
.totalChanges {
|
|
justify-content: flex-end;
|
|
text-align: right;
|
|
}
|
|
.warning {
|
|
color: #666;
|
|
}
|
|
input.show-hide {
|
|
display: none;
|
|
}
|
|
label.show-hide {
|
|
color: var(--color-link);
|
|
cursor: pointer;
|
|
display: block;
|
|
font-size: .8em;
|
|
min-width: 2em;
|
|
}
|
|
gr-diff {
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
|
|
display: block;
|
|
margin: .25em 0 1em;
|
|
overflow-x: auto;
|
|
}
|
|
.truncatedFileName {
|
|
display: none;
|
|
}
|
|
.expanded .fullFileName {
|
|
white-space: normal;
|
|
word-wrap: break-word;
|
|
}
|
|
.mobile {
|
|
display: none;
|
|
}
|
|
.reviewed {
|
|
margin-left: 2em;
|
|
width: 15em;
|
|
}
|
|
.reviewed label {
|
|
color: #2A66D9;
|
|
opacity: 0;
|
|
justify-content: flex-end;
|
|
width: 100%;
|
|
}
|
|
.reviewed label:hover {
|
|
cursor: pointer;
|
|
opacity: 100;
|
|
}
|
|
.row:hover .reviewed label,
|
|
.row:focus .reviewed label {
|
|
opacity: 100;
|
|
}
|
|
.reviewed input {
|
|
display: none;
|
|
}
|
|
.reviewedLabel {
|
|
color: rgba(0, 0, 0, .54);
|
|
margin-right: 1em;
|
|
opacity: 0;
|
|
}
|
|
.reviewedLabel.isReviewed {
|
|
display: initial;
|
|
opacity: 100;
|
|
}
|
|
.editFileControls {
|
|
margin-left: 1em;
|
|
width: 10em;
|
|
}
|
|
@media screen and (max-width: 50em) {
|
|
.desktop {
|
|
display: none;
|
|
}
|
|
.mobile {
|
|
display: block;
|
|
}
|
|
.row.selected {
|
|
background-color: transparent;
|
|
}
|
|
.stats {
|
|
display: none;
|
|
}
|
|
.reviewed,
|
|
.status {
|
|
justify-content: flex-start;
|
|
}
|
|
.comments {
|
|
min-width: initial;
|
|
}
|
|
.expanded .fullFileName,
|
|
.truncatedFileName {
|
|
display: block;
|
|
}
|
|
.expanded .truncatedFileName,
|
|
.fullFileName {
|
|
display: none;
|
|
}
|
|
}
|
|
</style>
|
|
<div
|
|
id="container"
|
|
on-tap="_handleFileListTap">
|
|
<template is="dom-repeat"
|
|
items="[[_shownFiles]]"
|
|
id="files"
|
|
as="file"
|
|
initial-count="[[fileListIncrement]]"
|
|
target-framerate="1">
|
|
<div class="file-row row" data-path$="[[file.__path]]" tabindex="-1">
|
|
<div class="show-hide" hidden$="[[_userPrefs.expand_inline_diffs]]">
|
|
<label class="show-hide" data-path$="[[file.__path]]"
|
|
data-expand=true>
|
|
<input type="checkbox" class="show-hide"
|
|
checked$="[[_isFileExpanded(file.__path, _expandedFilePaths.*)]]"
|
|
data-path$="[[file.__path]]" data-expand=true>
|
|
[[_computeShowHideText(file.__path, _expandedFilePaths.*)]]
|
|
</label>
|
|
</div>
|
|
<div class$="[[_computeClass('status', file.__path)]]"
|
|
tabindex="0"
|
|
aria-label$="[[_computeFileStatusLabel(file.status)]]">
|
|
[[_computeFileStatus(file.status)]]
|
|
</div>
|
|
<span
|
|
data-url="[[_computeDiffURL(change, patchRange.patchNum, patchRange.basePatchNum, file.__path)]]"
|
|
class$="[[_computePathClass(file.__path, _expandedFilePaths.*)]]">
|
|
<a href$="[[_computeDiffURL(change, patchRange.patchNum, patchRange.basePatchNum, file.__path)]]">
|
|
<span title$="[[computeDisplayPath(file.__path)]]"
|
|
class="fullFileName">
|
|
[[computeDisplayPath(file.__path)]]
|
|
</span>
|
|
<span title$="[[computeDisplayPath(file.__path)]]"
|
|
class="truncatedFileName">
|
|
[[computeTruncatedPath(file.__path)]]
|
|
</span>
|
|
</a>
|
|
<div class="oldPath" hidden$="[[!file.old_path]]" hidden
|
|
title$="[[file.old_path]]">
|
|
[[file.old_path]]
|
|
</div>
|
|
</span>
|
|
<div class="comments desktop">
|
|
<span class="drafts">
|
|
[[_computeDraftsString(changeComments, patchRange.patchNum, file.__path)]]
|
|
</span>
|
|
[[_computeCommentsString(changeComments, patchRange.patchNum, file.__path)]]
|
|
</div>
|
|
<div class="comments mobile">
|
|
<span class="drafts">
|
|
[[_computeDraftsStringMobile(changeComments, patchRange.patchNum,
|
|
file.__path)]]
|
|
</span>
|
|
[[_computeCommentsStringMobile(changeComments, patchRange.patchNum,
|
|
file.__path)]]
|
|
</div>
|
|
<div class$="[[_computeClass('stats', file.__path)]]">
|
|
<span
|
|
class="added"
|
|
tabindex="0"
|
|
aria-label$="[[file.lines_inserted]] lines added"
|
|
hidden$=[[file.binary]]>
|
|
+[[file.lines_inserted]]
|
|
</span>
|
|
<span
|
|
class="removed"
|
|
tabindex="0"
|
|
aria-label$="[[file.lines_deleted]] lines removed"
|
|
hidden$=[[file.binary]]>
|
|
-[[file.lines_deleted]]
|
|
</span>
|
|
<span class$="[[_computeBinaryClass(file.size_delta)]]"
|
|
hidden$=[[!file.binary]]>
|
|
[[_formatBytes(file.size_delta)]]
|
|
[[_formatPercentage(file.size, file.size_delta)]]
|
|
</span>
|
|
</div>
|
|
<div class="reviewed hideOnEdit" hidden$="[[!_loggedIn]]" hidden>
|
|
<span class$="reviewedLabel [[_computeReviewedClass(file.isReviewed)]]">Reviewed</span>
|
|
<label>
|
|
<input class="reviewed" type="checkbox" checked="[[file.isReviewed]]">
|
|
<span class="markReviewed" title="Mark as reviewed (shortcut: r)">[[_computeReviewedText(file.isReviewed)]]</span>
|
|
</label>
|
|
</div>
|
|
<div class="editFileControls showOnEdit">
|
|
<gr-edit-file-controls
|
|
class$="[[_computeClass('', file.__path)]]"
|
|
file-path="[[file.__path]]"></gr-edit-file-controls>
|
|
</div>
|
|
</div>
|
|
<template is="dom-if"
|
|
if="[[_isFileExpanded(file.__path, _expandedFilePaths.*)]]">
|
|
<gr-diff
|
|
no-auto-render
|
|
display-line="[[_displayLine]]"
|
|
inline-index=[[index]]
|
|
hidden="[[!_isFileExpanded(file.__path, _expandedFilePaths.*)]]"
|
|
change-num="[[changeNum]]"
|
|
patch-range="[[patchRange]]"
|
|
path="[[file.__path]]"
|
|
prefs="[[diffPrefs]]"
|
|
project-name="[[change.project]]"
|
|
project-config="[[projectConfig]]"
|
|
on-line-selected="_onLineSelected"
|
|
no-render-on-prefs-change
|
|
view-mode="[[diffViewMode]]"></gr-diff>
|
|
</template>
|
|
</template>
|
|
</div>
|
|
<div
|
|
class="row totalChanges"
|
|
hidden$="[[_hideChangeTotals]]">
|
|
<div class="total-stats">
|
|
<span
|
|
class="added"
|
|
tabindex="0"
|
|
aria-label$="[[_patchChange.inserted]] lines added">
|
|
+[[_patchChange.inserted]]
|
|
</span>
|
|
<span
|
|
class="removed"
|
|
tabindex="0"
|
|
aria-label$="[[_patchChange.deleted]] lines removed">
|
|
-[[_patchChange.deleted]]
|
|
</span>
|
|
</div>
|
|
<!-- Empty div here exists to keep spacing in sync with file rows. -->
|
|
<div class="reviewed hideOnEdit" hidden$="[[!_loggedIn]]" hidden></div>
|
|
<div class="editFileControls showOnEdit"></div>
|
|
</div>
|
|
<div
|
|
class="row totalChanges"
|
|
hidden$="[[_hideBinaryChangeTotals]]">
|
|
<div class="total-stats">
|
|
<span class="added" aria-label="Total lines added">
|
|
[[_formatBytes(_patchChange.size_delta_inserted)]]
|
|
[[_formatPercentage(_patchChange.total_size,
|
|
_patchChange.size_delta_inserted)]]
|
|
</span>
|
|
<span class="removed" aria-label="Total lines removed">
|
|
[[_formatBytes(_patchChange.size_delta_deleted)]]
|
|
[[_formatPercentage(_patchChange.total_size,
|
|
_patchChange.size_delta_deleted)]]
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<gr-button
|
|
class="fileListButton"
|
|
id="incrementButton"
|
|
hidden$="[[_computeFileListButtonHidden(numFilesShown, _files)]]"
|
|
link on-tap="_incrementNumFilesShown">
|
|
[[_computeIncrementText(numFilesShown, _files)]]
|
|
</gr-button>
|
|
<gr-tooltip-content
|
|
has-tooltip="[[_computeWarnShowAll(_files)]]"
|
|
show-icon="[[_computeWarnShowAll(_files)]]"
|
|
title$="[[_computeShowAllWarning(_files)]]">
|
|
<gr-button
|
|
class="fileListButton"
|
|
id="showAllButton"
|
|
hidden$="[[_computeFileListButtonHidden(numFilesShown, _files)]]"
|
|
link on-tap="_showAllFiles">
|
|
[[_computeShowAllText(_files)]]
|
|
</gr-button><!--
|
|
--></gr-tooltip-content>
|
|
<gr-diff-preferences
|
|
id="diffPreferences"
|
|
prefs="{{diffPrefs}}"
|
|
local-prefs="{{_localPrefs}}"></gr-diff-preferences>
|
|
<gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
|
|
<gr-storage id="storage"></gr-storage>
|
|
<gr-diff-cursor id="diffCursor"></gr-diff-cursor>
|
|
<gr-cursor-manager
|
|
id="fileCursor"
|
|
scroll-behavior="keep-visible"
|
|
focus-on-move
|
|
cursor-target-class="selected"></gr-cursor-manager>
|
|
<gr-reporting id="reporting"></gr-reporting>
|
|
</template>
|
|
<script src="gr-file-list.js"></script>
|
|
</dom-module>
|