59 Commits

Author SHA1 Message Date
Becky Siegel
b159a7f5cc Update styles for shadow dom
- Create a shared style module that is included in every custom element
- Add the shared style module to each existing element

Change-Id: I1ee382955afe4ff630548a6640e7c4d03688849d
2017-06-02 14:54:03 -07:00
Viktar Donich
eeb2d53331 Put horizontal scrolling on screen, take 3
Diff header scrolls with content and sticks to the top, too.
Doesn't scroll the footer horizontally with the header.

Bug: Issue 4491
Change-Id: I5d76aad38a7ae76c15528abcb572cf993f7f595e
2017-05-26 14:16:57 -07:00
Viktar Donich
1057e0505f Add padding to diff when scrollbar is inline
Inline scrollbars are invisible until scrolling starts, or, for
ChromeOS, scrollbar area is hovered.
When scrollbar appears, it overlaps last line of diff.
This change adds a padding to prevent scrollbar overlapping last line of
diff.

Bug: Issue 5964
Change-Id: I072f8e8a4d4d2750f122bc6177b8db492b258f5f
2017-05-12 11:24:31 -07:00
Becky Siegel
727fa5d2e9 Reduce line num padding
Bug: Issue 5426
Change-Id: If7f4056780f55b01ad9295e8cd6b6306d162ab34
2017-04-19 16:12:56 -07:00
Becky Siegel
2fcd34c1ba Merge "Fix diff cursor in file list" 2017-04-17 23:40:07 +00:00
Becky Siegel
eccee3ce49 Fix diff cursor in file list
There was an issue where line numbers would not properly highlight in
inline-diffs rendered in the file view.

There were two separate issues that contributed to this problem:
1 - The diff cursor was not notified of the line being selected and
    needing to move to that cursor stop.
2 - The diff cursor was not properly updated after being moved inside
    a dom-if statement.

Additionally, the way that line selection was previously done was not
extendable to a diff cursor that stored multiple files. It queried
stops based on line number and side. This change also stores the
path of the file in the cursor stop so that the correct diff/line is
selected in the case of multiples.

Bug: Issue 5977
Change-Id: I7496293e19a4e59a3855dc78e273de6a9852e556
2017-04-14 18:00:15 -07:00
Kasper Nilsson
b4893d0ae6 Add header to diff
Adds the header section to the diff. The header is only displayed when
relevant information is contained within, e.g. when a file is renamed
but otherwise left unchanged.

Feature: Issue 5752
Change-Id: I5f8cb56522decd8d3c57bb403cb43f87203d5c6a
2017-04-12 16:15:33 -07:00
Wyatt Allen
1e3cd47707 Highlight add/remove diff lines more consistently
Diffs in PolyGerrit apply two shades of highlight to changed lines
(light and dark) to indicate the granularity of modifications and to
distinguish intraline edits. However, the logic for choosing the
background shade for diff lines would differ from that of GWT UI diffs
subtly.

 +----------------------------------+----------------------------------+
 |       GWT UI Shading Logic       |   PG Shading Logic (incorrect)   |
 +----------------------------------+----------------------------------+
 | Diff lines get a dark background | Diff lines get a dark background |
 | IFF they appear in a delta chunk | IFF they do NOT contain any      |
 | that is empty on the left OR     | intraline differences.           |
 | empty on the right.              |                                  |
 +----------------------------------+----------------------------------+
 |            Diff lines get a light background otherwise.             |
 +---------------------------------------------------------------------+

With this change, the shading logic in PolyGerrit is modified to match
that of the GWT UI.

Bug: Issue 4219
Bug: Issue 5117
Change-Id: Ice24292df777118c08c3e73f771720f8a186a183
2016-12-22 10:41:39 -08:00
Aaron Gable
d5d9a13ec8 Ensure side-by-side diff lines don't collapse to 0px height
Bug: Issue 5091
Change-Id: I647205b2d1c05ddc0c871647331fbe3f773c04b5
2016-12-10 00:42:09 +00:00
Wyatt Allen
d970500d62 Annotate trailing whitespace per user preference
Add a simple annotation layer that marks trailing whitespace in diffs
(guarded by the `show_whitespace_errors` diff preference). The newly
supported diff preference is added to both diff preference controls. The
requirement that all annotation layers must implement `addListener` is
relaxed as the trailing whitespace layer is the third layer that doesn't
use it.

Adds tests for the layer and the diff preference.

Feature: Issue 4836
Change-Id: Ifba05216bf0bc3c0a8a094f5ef392b983091d59f
2016-11-20 13:31:30 -08:00
Wyatt Allen
7d82244218 Merge "Make line marker more distinguished" 2016-11-07 21:17:12 +00:00
Becky Siegel
6a7085e5ab Make line marker more distinguished
Previously, the line marker was only subtly visible by the highlighted
line number. This change adds a bottom border to the selected line if
the user is using keycodes (j, k, up, down) to more the cursor. When
the escape key is pressed, the distinguished line marker will dissapear.

Feature: Issue 4739
Change-Id: If8c751efc137ef87cfdad1c8bf7d905de1219107
2016-11-03 13:34:07 -07:00
Becky Siegel
dc46218284 Fix for issue where line wraps incorrectly on fixed width diff view
A css rule that was added for the full width diff caused lines to wrap
incorrectly. I've adjusted the style so that it is only present with
the full-width class.

Bug: Issue 4870
Change-Id: Ie94d0a06a125efb9fe7fa25ff7f2d45f54331d64
2016-11-03 01:07:03 +00:00
Viktar Donich
bcab19889b Revert "Make horizontal scrolling visible on diff page"
This reverts commit 52c943d88e088894e61e054964ec91ffe410a0bc.

Change-Id: I63f4aa2efd386300c070521c5bccf1c6ac5c594e
2016-11-02 19:10:30 +00:00
Wyatt Allen
c2bea1cc81 Merge "Add preference for line wrapping in diff preferences" 2016-11-01 16:40:03 +00:00
Becky Siegel
e7d19a9976 Add preference for line wrapping in diff preferences
Previously in Polygerrit, diff views were always displayed in the width
specified in diff preferences. This change gives the option to wrap
lines instead, which takes precedence over column width (the column
width option is hidden when line wrapping is selected), and fits the
diff view to screen.

The gerrit API already supports the 'lineWrapping' preference so this
change uses that already existing option.

Feature: Issue 4809
Change-Id: I0d9e292739b5910abfd04af63ec4c745bf06e446
2016-10-31 17:35:21 -07:00
Viktar Donich
52c943d88e Make horizontal scrolling visible on diff page
Diff header scrolls with content and sticks to the top.
Implemented custom gr-header wrapper to accomodate this.

Bug: Issue 4491
Change-Id: I451ecd4f6c454fd9ab3085ad8f9c5bdd27cb9269
2016-10-28 12:31:58 -07:00
Viktar Donich
74975da15e Merge "Revert "Fix app size to make scrollbars visible"" 2016-10-24 20:53:42 +00:00
Viktar Donich
cc6b8300d1 Revert "Fix app size to make scrollbars visible"
This reverts commit a7b89441bda7a1ea7e98969462c2def989bd68c2.

Reason for revert: Got a better idea for app layout, will send follow-up change.

Change-Id: I7b7c86288fb070114e76dd68701e05c539089eab
2016-10-24 20:53:30 +00:00
Viktar Donich
e2d1c6307f Revert "Layout fixes (mostly for Safari)"
This reverts commit 37ef1672f9133b605c5e14f8fbcc241d4c40eb50.

Reason for revert: Got a better idea for app layout, will send follow-up change.

Change-Id: I7bfddcef416d44c7af88d74da6b39c2a93565d32
2016-10-24 20:52:59 +00:00
Viktar Donich
37ef1672f9 Layout fixes (mostly for Safari)
Follow-up for c/89172 for the Safari.

Change-Id: Ifa85f42217f6020991b6644d95d490eb9a8d7b52
2016-10-23 21:28:00 -07:00
Wyatt Allen
85c9b30f75 Merge "Fix table render hinting" 2016-10-21 17:51:20 +00:00
Wyatt Allen
4254ca3f64 Fix table render hinting
Formerly, GPU rendering was hinted for diff tables on TBODY elements for
scrolling performance on large diffs. This would cause the right border
of the table appear inconsistently in Chrome -- likely as a fluke of
GPU layer compositing. With this change, the entire TABLE is hinted
rather than the TBODIES inside it, allowing them to be composited
together.

Bug: Issue 4801
Change-Id: I952a2d71a2ebd2d92b326b565b85fb55b52927cf
2016-10-21 10:43:44 -07:00
Viktar Donich
a7b89441bd Fix app size to make scrollbars visible
Fixes footer at the bottom of the page for all pages and changes
scrolling behavior for diff page.

On the diff page:
- horizontal scrolling is right above footer when required
- all headers stay in place when scrolling

Bug: Issue 4491
Change-Id: I62fdf130376b210c26fadcadc90bf452361ac15d
2016-10-20 12:09:57 -07:00
Wyatt Allen
3894bb9f2a Use semi-transparent intraline highlight color
Because code comments are rendered using italics, and because italics
can sometimes draw text outside of their bounding boxes, some characters
may be visually obscured when they are adjacent to an annotation with a
background color -- particularly intraline difference annotations. With
this change, intraline difference background is given an alpha channel
so that such characters are not obscured.

Bug: Issue 4785
Change-Id: I5372e6f4def5e69126288965eb9829e5680c2102
2016-10-18 18:18:00 -07:00
Becky Siegel
d7dbed640c Add a diff preference for font size
This change adds a font size field in diff preferences in both the
generic preferences page and also the preferences modal from the diff
view. The new field allows users to update their preferred font size
for the diff view to be displayed. This updates both the line number
font size as well as the diff font size.

Feature: Issue 4417
Change-Id: I0fb75fd2186d2ff63b3627e8b0f15f2b3cddbfa3
2016-10-12 16:31:24 -07:00
Wyatt Allen
9fcec7437f Generate clipboard data via diff rather than DOM reconstruction
This change uses a new method of generating the clipboard data that
circumvents several strange issues caused by shadow/shady DOM. This
new method is much more legible and abstracts more logic away from the
DOM.

Bug: Issue 4494
Change-Id: I8c186d6cbbe9536548d934f734856b1f9ced1a26
2016-09-13 14:24:57 -07:00
Kasper Nilsson
613b49c64e Fix copy/paste in diff view
The addition of syntax highlighting silently broke copy/paste
functionality due to the addition of another layer of div nesting.

Related to this bug are some issues with correct text selection in
unified diff view, so this patch addresses them as well.

Bug: Issue 4317
Change-Id: Iac7379de4131ab4e44905a54218d42fcfe67ce62
2016-08-29 16:18:47 -07:00
Wyatt Allen
be0142ca03 Improves visible tabs rendering
This change reverts visible tabs to use the » character. A few different
approaches have been used for rendering these tab indicators:

I:  Before the Annotation Pipeline, tab indicators were configured by a
    class that was optionally applied to tab elements by the diff
    builder. The class was guarded by the show_tabs preference and a CSS
    rule created a `::before` pseudo element to insert the character.
    (Thus also preventing the » from being copyable text.)

II: When the Annotation Pipeline was implemented, the ordering of layers
    called for intraline difference elements being rendered *inside* tab
    indicators. As a result, the » indicator would sometimes have a
    different background than the intraline difference, looking sloppy.

    To solve this, the pseudo element was positioned using absolute,
    allowing the pseudo element to consume no horizontal space and and
    the intraline background to extend across the entire tab.

III:When performance tuning, it was discovered that the
    absolute-positioned tab indicators were positioned incorrectly when
    GPU acceleration was hinted for the diff, so the containing tab
    elements were made relative.

IV: Continuing performance tuning, the tab indicators seemed to slow
    scrolling on very large diffs with tabs. It was mistakenly assumed
    (by me) that this was related to the pseudo-elements when it was
    actually caused by the thousands of positioning contexts they
    created using relative and absolute.

    Instead they were modified to use strike-through instead of a pseudo
    element, which was more-performant, but less-usable (it looked bad).

With this change, we roll-back the clock a little and solve a core
problem: namely that tab indicators were not annotated inside the
intraline differences. Fixing that, positioning tricks are no-longer
needed to make the background look right.

To do this, we decouple the tab elements (which control tab width) from
the tab indicators (which optionally make tabs visible). This is done
using an annotation layer that inserts tab indicator elements wherever
a tab character is used in the source content, and it does so after
intraline differences have been applied.

Bug: Issue 4441
Change-Id: I4fea2a3a20a7039bfeb746bd1e1c1004e43c4801
2016-08-25 11:47:17 -07:00
Andrew Bonventre
87d7d86a3d Merge "Applies optimizations to diff comment DOM attachment" 2016-08-11 20:30:20 +00:00
Wyatt Allen
32b03fc76f Applies optimizations to diff comment DOM attachment
A source of latency when creating diff comments in large diffs is the
work needed to reflow the diff DOM to make room for the new comment.
This is particularly evident when adding comments to new files because
the diff is built as an addition group representing the entire file, so
the comment causes a reflow on every subsequent line.

This change optimizes this process in three ways.

* **Limit the size of ADD & REMOVE groups:** The diff processor will now
  break an add or a remove chunk into a series of smaller chunks of the
  same kind. This is controlled by the MAX_GROUP_SIZE constant. In this
  way the number of nodes that need to be reflowed when a comment is
  added to an add or remove group is limited to the number of subsequent
  lines in that group plus the subsequent number of groups.
* **GPU optimize group in general:** Adds CSS properties to diff TBODY
  elements (which correspond to groups, for the most part) that trigger
  GPU acceleration when available.
* **Apply `table-layout: fixed;`** This style speeds up table reflow in
  general.

Change-Id: Ie0e3665b7752fec67f7123cfae70ae99e6f67521
2016-08-11 12:35:31 -07:00
Andrew Bonventre
a51f78b1b2 Merge "Reduces the cost of Diff Reflow" 2016-08-11 18:06:18 +00:00
Wyatt Allen
a04b5c1ae6 Reduces the cost of Diff Reflow
Improves the speed of diff (particularly when scrolling in a large diff)
by removing the hover state for line numbers and by removing the pseudo
elements used in visible tabs.

Change-Id: I3c8687ec282696842b51f8f43b76aa267a1506b1
2016-08-11 10:55:02 -07:00
Viktar Donich
7706e9cff9 Hide gaps from right diff when hiding left diff
When a change contains removal of large block of text, in left diff side
it is highlighted with red, and in right side there's a corresponding
empty space. Hiding left diff side leaves gaps in the code.

This change hides those gaps when left diff side is hidden by Shift+A.
Feature: Issue 3926

Change-Id: I11c6574c098a9ecfe58d1804ba57c5c4f97e4d1a
2016-08-10 14:55:22 -07:00
Viktar Donich
c282d7b282 Toggle left diff on Shift+A
Feature: Issue 3926
Change-Id: Ia52334f2aefeae4b3f115e5779da3b61af25ba11
2016-08-10 12:54:49 -07:00
Viktar Donich
9187269b56 Prevent empty diff content lines from collapsing
Bug: Issue 4330
Change-Id: I506be8ab6c9cc0e14c41abd78e87736da9f470a1
2016-08-05 16:28:00 -07:00
Wyatt Allen
ec4d6a28a4 Modularize syntax theme
Change-Id: I682bdbeb6b8bd4dbb4b389c52043db4b6c19286e
2016-07-26 10:38:15 -07:00
Wyatt Allen
650c529276 Syntax highlighting
Introduces the gr-syntax-layer element. This element works as an
annotation layer that is configured with the diff and asynchronously
computes/applies syntax for the diff.

Introduces a custom build of Highlight.js which gr-syntax-layer makes
use of. Building the script is documented in
scripts/vendor/highlight/building.md.

The layer is connected to the annotation pipeline in gr-diff-builder as
the lowest layer and syntax processing is triggered only after a diff
has been completely rendered.

A number of styles are added to the gr-diff element for syntax markers.
Tests added for gr-syntax-layer.

Bug: Issue 3916
Change-Id: Ic33e40f4fe39dfce1a62de133cfaf32be5e3f25a
2016-07-25 13:47:30 -07:00
Wyatt Allen
ea97c5b49a Adds diff traversal helper and make diff object a builder property
Adds a polymorphic method to GrDiffBuilder subclasses named
`_getNextContentOnSide` which gets the a content element by traversing
from its preceding content on the same side. This method is dramatically
faster than the query-based method when diff sections are large.

In preparation for the syntax highlighting change, the gr-diff-builder
is refactored to use a property for the diff object, rather than
accepting it as a parameter to the `render` function.

Tests are included for new functions.

Change-Id: Ifd0edb530a303de2626d55a691c3ba1eaed6167c
2016-07-21 22:26:56 -07:00
Wyatt Allen
d0dd392794 Establish annotation pipeline
Apply diff annotations (intraline differences and comment ranges) by
executing the annotation layers in order to each line. The diff builder
maintains an ordered array of annotation layers which are communicated
to GrDiffBuilder subclass instances. The builder also listens to each
layer for notifications that annotations have changed for some line
range and re-renders (i.e. re-applies the pipeline on DIV.contentText
elements) accordingly.

Change-Id: Iea0599d4869cafaadc0974158153a91d927913e8
2016-07-20 12:25:40 -07:00
Viktar Donich
60d8bce771 Release range comments
Remove beta diff setting and enable range comments for all.

Change-Id: I0cee7e1717574ab54317cdce9e2332c8cda7a0cb
2016-07-14 14:45:15 -07:00
Wyatt Allen
b7fa5dd929 Applies intraline differences as annotations
The `_addIntralineHighlights` method of GrDiffBuilder is rewritten to
take advantage of GrAnnotate. In particular, formerly, the method would
apply intraline difference highlights by modifying an HTML string.
With this change, the highlight positions are translated as calls to
`GrAnnotate.annotateElement`, which works on the `DIV.contentText`
element.

Change-Id: I2838ef29f057f1108e2ffd196bb48a239366dc87
2016-07-13 21:07:13 -07:00
Viktar Donich
ab1b211d80 Ranged highlights: initial commit
- Initial commit: structure, 'enabled' property controls sample
mouseDown handler.
- Minimal integration: isRangeSelected
- Minimal test.

Change-Id: I963ac7b158d57a1c24ee302d99eb6af26b0aeeeb
2016-06-13 14:38:08 -07:00
Viktar Donich
e1341972d1 Move text selection out of gr-diff.
Change-Id: I0734653066a1bb78f95c141aa8202fad315b13c0
2016-06-10 12:18:25 -07:00
Viktar Donich
0f02cda57e Make gr-builder a Polymer component
Updated tests, fixed draft comments, context expanding.

Change-Id: Ic4bd9682c63edd8e80fbc2abcb4fa5e406a202ab
2016-06-03 10:22:47 -07:00
Andrew Bonventre
6c9d862e10 Revert "Make gr-builder a Polymer component"
This reverts commit 56689af0f92ce13f90ff9369544c5f9cc0412f09.

Reason for revert: This change broke adding draft comments in the diff
view.

Change-Id: Icfbd3eb4e24cce3e1690e7eaf12e14e5705c7e3e
2016-06-03 13:07:33 +00:00
Viktar Donich
56689af0f9 Make gr-builder a Polymer component
Change-Id: I0d99775332b0ef473459ad481970ad6033427c7d
2016-06-02 13:09:39 -07:00
Wyatt Allen
1097963107 Adds "+10 lines" buttons to diff context controls
Adds two buttons to appear in context control lines in diffs. Whereas
the main button in a context control replaces the control with *all* of
the diff content that was collapsed into it, the new buttons will
instead display 10 lines of diff content either at the start or at the
end of the collapsed area.

If the number of lines collapsed into the context control are fewer than
11, the +10 buttons are not displayed.

Bug: Issue 3942
Change-Id: I03d94d8f1c0aca626e9cec9b63961c5a3e9e0759
2016-06-01 16:25:20 -07:00
Wyatt Allen
88678da403 Add support for images in diffs
If gr-diff recognizes that the file difference it's representing is
between images, it uses a different diff-builder that displays images
in a side-by-side-manner. In this case gr-diff will also make requests
for the image data itself, which it can pass down into the image-based
diff-builder.

Adds methods to gr-rest-api-interface to support rendering the data
relevant to image diffs. For images that are revisions of the current
change, provides "getChangeFileContents". For images that come from the
parent tree (i.e. if the basePatchNum is "PARENT") the interface
provides "getCommitInfo" to determine the SHA of the parent commit, and
"getCommitFileContents" which can get file contents for a given commit.

Bug: Issue 3822
Change-Id: I9be025b4e549fca97c87cdbeede6cb64dea5eac0
2016-05-26 12:02:29 -07:00
Wyatt Allen
8eba594232 Tidies keyboard shortcut dialogs and updated cursor styles
Reorganizes the keyboard shortcut list for change view with smaller
groups of shortcuts. Also tidies up the dialog for the diff view a bit.

Updates the style for the selected line in the diff view and fixes the
focus when the diff expand/collapse buttons are activated. The scroll
behavior is changed slightly.

Change-Id: I8e520f725f4706aaad6e8bd8b99dd0e274d2f830
2016-05-20 13:43:14 -07:00