From df0fac95837e71b86656d4bef9338eb174db9240 Mon Sep 17 00:00:00 2001 From: Alejandro Barreto Date: Thu, 18 Jul 2019 11:56:54 -0500 Subject: [PATCH 1/2] Improvements to the PR diff - Make the horizontal scrollbar always visible - Make the file name always visible, even if the user scrolled down the page --- src/azdo-pr-dashboard.user.js | 32 ++++++++++++++++++++++++++++---- 1 file changed, 28 insertions(+), 4 deletions(-) diff --git a/src/azdo-pr-dashboard.user.js b/src/azdo-pr-dashboard.user.js index eae6409..b5b03e0 100644 --- a/src/azdo-pr-dashboard.user.js +++ b/src/azdo-pr-dashboard.user.js @@ -1,7 +1,7 @@ // ==UserScript== // @name AzDO Pull Request Improvements -// @version 2.19.0 +// @version 2.20.0 // @author Alejandro Barreto (National Instruments) // @description Adds sorting and categorization to the PR dashboard. Also adds minor improvements to the PR diff experience, such as a base update selector and per-file checkboxes. // @license MIT @@ -50,11 +50,35 @@ if (/\/(pullrequest)\//i.test(window.location.pathname)) { addCheckboxesToFiles(); addBaseUpdateSelector(); + makePullRequestDiffEasierToScroll(); } else if (/\/(_pulls|pullrequests)/i.test(window.location.pathname)) { sortPullRequestDashboard(); } } + function makePullRequestDiffEasierToScroll() { + addStyleOnce('base-selector-css', /* css */ ` + .vc-change-summary-files .file-container { + /* Make the divs float but clear them so they get stacked on top of each other. We float so that the divs expand to take up the width of the text in it. Finally, we remove the overflow property so that they don't have scrollbars and also such that we can have sticky elements (apparently, sticky elements don't work if the div has overflow). */ + float: left; + clear: both; + min-width: 75%; + overflow: initial; + } + .vc-change-summary-files .file-row { + /* Let the file name section of each diff stick to the top of the page if we're scrolling. */ + position: sticky; + top: 0; + z-index: 100000; + padding-bottom: 10px; + background: var(--background-color,rgba(255, 255, 255, 1)); + } + .vc-change-summary-files .vc-diff-viewer { + /* We borrowed padding from the diff to give to the bottom of the file row. So adjust accordingly (this value was originally 20px). */ + padding-top: 10px; + }`); + } + // The func we'll call to continuously add checkboxes to the PR file listing, once initialization is over. let addCheckboxesToNewFilesFunc = () => { }; @@ -456,9 +480,9 @@ // Helper function to avoid adding CSS twice into a document. function addStyleOnce(id, style) { - if ($(`head #${id}`).length === 0) { - $('