List for cgit developers and users
 help / color / mirror / Atom feed
From: andy at warmcat.com (Andy Green)
Subject: [PATCH v3 4/6] cgit.js: line range highlight: improve vertical scroll logic
Date: Sun, 24 Jun 2018 10:44:44 +0800	[thread overview]
Message-ID: <152980828443.2873.1414660535936206718.stgit@mail.warmcat.com> (raw)
In-Reply-To: <152980795804.2873.3939128717470466784.stgit@mail.warmcat.com>

Instead of following the browser heuristic to put any matching
id element to the top left of the browser window, compute the
number of visible lines vertically in the window, and the
middle of the highlit range, and try to centre the middle of
the highlit range in the window.

If the top of the range is no longer visible due to a range
consisting of more lines than the window can show, fall back to
placing the top of the range at the top of the window.

Signed-off-by: Andy Green <andy at warmcat.com>
---
 cgit.js |   20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/cgit.js b/cgit.js
index 772843a..29b2c3d 100644
--- a/cgit.js
+++ b/cgit.js
@@ -31,7 +31,7 @@ function cgit_line_range_highlight()
 	if (l2 < l1)
 		l2 = l1;
 
-	var lh, t = 0, e1, e2, de;
+	var lh, t = 0, e1, e2, de, hl, v, n;
 
 	e1 = e = document.getElementById('n' + l1);
 	if (!e)
@@ -60,13 +60,25 @@ function cgit_line_range_highlight()
 
 	e.parentElement.parentElement.insertBefore(de, e.parentElement.parentElement.firstChild);
 
-	while (l1 <= l2) {
+	n = l1;
+	while (n <= l2) {
 		var e1;
-		e1 = document.getElementById('n' + l1++);
+		e1 = document.getElementById('n' + n++);
 		e1.style.backgroundColor = "yellow";
 	}
 
-	e.scrollIntoView(true);
+	hl = (window.innerHeight / (e.offsetHeight + 1));
+	v = (l1 + ((l2 - l1) / 2)) - (hl / 2);
+	if (v > l1)
+		v = l1;
+	if (v < 0)
+		v = 1;
+
+	e1 = document.getElementById('n' + Math.round(v));
+	if (e1)
+		e1.scrollIntoView(true);
+	else
+		e.scrollIntoView(true);
 }
 
 /* line range highlight */



  parent reply	other threads:[~2018-06-24  2:44 UTC|newest]

Thread overview: 73+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2018-06-20  9:39 Highlighting lines or line ranges in tree view andy
2018-06-21  5:42 ` [PATCH 1/3] ui-shared: introduce line range highlight javascript andy
2018-06-21  7:03   ` list
2018-06-21  7:30     ` andy
2018-06-21  5:42 ` [PATCH 2/3] ui-tree: use the line range highlight script andy
2018-06-21  5:43 ` [PATCH 3/3] ui-blame: " andy
2018-06-21  9:34 ` [PATCH v2 0/5] line range highlight andy
2018-06-21  9:34   ` [PATCH v2 1/5] config: add js andy
2018-06-23 10:20     ` john
2018-06-23 10:34       ` andy
2018-06-21  9:34   ` [PATCH v2 2/5] cgit.js: introduce andy
2018-06-23 10:18     ` john
2018-06-21  9:34   ` [PATCH v2 3/5] ui-shared: introduce line range highlight javascript andy
2018-06-23 10:17     ` john
2018-06-24  2:37       ` andy
2018-06-21  9:35   ` [PATCH v2 4/5] ui-tree: use the line range highlight script andy
2018-06-21  9:35   ` [PATCH v2 5/5] ui-blame: " andy
2018-06-22 23:01   ` [PATCH v2 1/2] cgit.js: make line range highlight responsive to url changes andy
2018-06-22 23:02   ` [PATCH v2 2/2] cgit.js: line range highlight: improve vertical scroll logic andy
2018-06-23  7:45   ` [PATCH v2] cgit.js: line range highlight: always hook hashchange in case hash added andy
2018-06-24  2:44 ` [PATCH v3 0/6] line range highlight andy
2018-06-24  2:44   ` [PATCH v3 1/6] config: add js andy
2018-06-24 11:01     ` john
2018-06-24  2:44   ` [PATCH v3 2/6] ui-shared: line range highlight: introduce javascript andy
2018-06-24 11:28     ` john
2018-06-25  2:04       ` andy
2018-06-24  2:44   ` [PATCH v3 3/6] cgit.js: line range highlight: make responsive to url changes andy
2018-06-24  2:44   ` andy [this message]
2018-06-24  2:44   ` [PATCH v3 5/6] line-range-highlight: onclick handler and range selection andy
2018-06-24 11:35     ` john
2018-06-25  2:07       ` andy
2018-06-24  2:44   ` [PATCH v3 6/6] line-range-highlight: copy URL to clipboard on click andy
2018-06-24 11:42     ` john
2018-06-24 12:00       ` andy
2018-06-24 13:39         ` john
2018-06-24 15:06           ` andy
2018-06-24 16:03             ` john
2018-06-25  0:46               ` andy
2018-06-25  5:49 ` [PATCH v4 0/6] line range highlight andy
2018-06-25  5:49   ` [PATCH v4 1/6] config: add js andy
2018-06-26  8:03     ` list
2018-06-25  5:49   ` [PATCH v4 2/6] cgit.js: line range highlight: introduce javascript andy
2018-06-25  5:49   ` [PATCH v4 3/6] cgit.js: line range highlight: make responsive to url changes andy
2018-06-25  5:50   ` [PATCH v4 4/6] cgit.js: line range highlight: improve vertical scroll logic andy
2018-06-25  5:50   ` [PATCH v4 5/6] line-range-highlight: onclick handler and range selection andy
2018-06-25  5:50   ` [PATCH v4 6/6] line-range-highlight: copy URL to clipboard UI andy
2018-06-26 11:25 ` [PATCH v5 0/6] line range highlight andy
2018-06-26 11:25   ` [PATCH v5 1/6] config: add js andy
2018-06-26 11:25   ` [PATCH v5 2/6] cgit.js: line range highlight: introduce javascript andy
2018-06-27 18:02     ` Jason
2018-06-27 21:45       ` andy
2018-06-28 23:58         ` [PATCH] cgit.css: add copyright lines andy
2018-06-26 11:25   ` [PATCH v5 3/6] cgit.js: line range highlight: make responsive to url changes andy
2018-06-26 11:25   ` [PATCH v5 4/6] cgit.js: line range highlight: improve vertical scroll logic andy
2018-06-26 11:25   ` [PATCH v5 5/6] line-range-highlight: onclick handler and range selection andy
2018-06-26 11:51     ` [PATCH v5-ninjaedit] " andy
2018-06-26 11:25   ` [PATCH v5 6/6] line-range-highlight: copy URL to clipboard UI andy
2018-06-27 18:07     ` Jason
2018-06-27 23:24       ` andy
2018-06-27 23:30         ` Jason
2018-06-27 23:38           ` andy
2018-06-29  1:39 ` [PATCH v6 0/7] line range highlight andy
2018-06-29  1:40   ` [PATCH v6 1/7] config: add js andy
2018-06-29  6:14     ` list
2018-06-29  6:16       ` [PATCH v6-ninjaedit] " andy
2018-06-29  6:31         ` [PATCH v6-ninjaedit2] " andy
2018-06-29  6:33         ` [PATCH v6-ninjaedit] " list
2018-06-29  1:40   ` [PATCH v6 2/7] cgit.js: line range highlight: introduce javascript andy
2018-06-29  1:40   ` [PATCH v6 3/7] cgit.js: line range highlight: make responsive to url changes andy
2018-06-29  1:40   ` [PATCH v6 4/7] cgit.js: line range highlight: improve vertical scroll logic andy
2018-06-29  1:40   ` [PATCH v6 5/7] line-range-highlight: onclick handler and range selection andy
2018-06-29  1:40   ` [PATCH v6 6/7] line-range-highlight: burger menu and popup menu andy
2018-06-29  1:40   ` [PATCH v6 7/7] line-range-highlight: copy text andy

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=152980828443.2873.1414660535936206718.stgit@mail.warmcat.com \
    --to=cgit@lists.zx2c4.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for NNTP newsgroup(s).