From mboxrd@z Thu Jan  1 00:00:00 1970
From: andy at warmcat.com (Andy Green)
Date: Sun, 24 Jun 2018 10:44:49 +0800
Subject: [PATCH v3 5/6] line-range-highlight: onclick handler and range
 selection
In-Reply-To: <152980795804.2873.3939128717470466784.stgit@mail.warmcat.com>
References: <152980795804.2873.3939128717470466784.stgit@mail.warmcat.com>
Message-ID: <152980828951.2873.11742118399461829064.stgit@mail.warmcat.com>

This allows the user to select line ranges simply by clicking on the
line number links.

 - No selected highlit line, or a range already selected, causes the
click to highlight just the clicked line as usual.

 - Clicking on a second line number link when a single line was already
highlit creates a line range highlight, between the lowest and
highest line numbers of the already-selected and newly-selected
line number links.

The order of the clicks is unimportant, you can click the higher
line number link first and then the lower to define the range of
lines equally well.

The implementation is slightly complicated by our single parent
onclick handler not being able to interrupt the already ongoing
processing of the a href #n change from the link click itself.

Rather than bloat every linenumber link with its own onclick handler
defeating this default we simply do it with a single parent
onclick event and apply any computed range url in the existing
hashchange event handler.

Signed-off-by: Andy Green <andy at warmcat.com>
---
 cgit.js    |   39 +++++++++++++++++++++++++++++++++++++++
 ui-blame.c |    2 +-
 ui-tree.c  |    2 +-
 3 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/cgit.js b/cgit.js
index 29b2c3d..2cfad29 100644
--- a/cgit.js
+++ b/cgit.js
@@ -1,7 +1,15 @@
+var cgit_line_range_override;
+
 function cgit_line_range_highlight()
 {
 	var h = window.location.hash, l1 = 0, l2 = 0, e, t;
 
+	if (cgit_line_range_override) {
+		window.location = cgit_line_range_override;
+		cgit_line_range_override = null;
+		return;
+	}
+
 	e = document.getElementById("cgit_line_range");
 	if (e) {
 		l1 = e.l1;
@@ -81,10 +89,41 @@ function cgit_line_range_highlight()
 		e.scrollIntoView(true);
 }
 
+function cgit_line_range_click(e) {
+	var t = e.target.id;
+
+	cgit_line_range_override = null;
+
+	/*
+	 * We are called while window location update from the
+	 * click on the #n link is underway.  So stash any
+	 * computed range #url for when the hashchange hander
+	 * is called, and override it there.
+	 */
+
+	if (window.location.hash && window.location.hash.indexOf("-") < 0)
+		if (parseInt(window.location.hash.substring(2)) <
+		    parseInt(t.substring(1))) /* forwards */
+			cgit_line_range_override =
+				window.location + '-' + t.substring(1);
+		else /* backwards */
+			cgit_line_range_override =
+				window.location.href.substring(0,
+					window.location.href.length -
+					window.location.hash.length) +
+				'#n' + t.substring(1) + '-' +
+					window.location.href.substring(
+						window.location.href.length -
+						window.location.hash.length + 2);
+}
+
 /* line range highlight */
 
 document.addEventListener("DOMContentLoaded", function() {
 	cgit_line_range_highlight();
+	var e = document.getElementById("linenumber_td");
+	if (e)
+		e.addEventListener("click", cgit_line_range_click, true);
 }, false);
 window.addEventListener("hashchange", function() {
 	cgit_line_range_highlight();
diff --git a/ui-blame.c b/ui-blame.c
index 50d0580..0ba8a5a 100644
--- a/ui-blame.c
+++ b/ui-blame.c
@@ -170,7 +170,7 @@ static void print_object(const struct object_id *oid, const char *path,
 
 	/* Line numbers */
 	if (ctx.cfg.enable_tree_linenumbers) {
-		html("<td class='linenumbers'>");
+		html("<td id=linenumber_td class='linenumbers'>");
 		for (ent = sb.ent; ent; ent = ent->next) {
 			html("<div class='alt'><pre>");
 			emit_blame_entry_linenumber(ent);
diff --git a/ui-tree.c b/ui-tree.c
index e4cb558..6759b11 100644
--- a/ui-tree.c
+++ b/ui-tree.c
@@ -28,7 +28,7 @@ static void print_text_buffer(const char *name, char *buf, unsigned long size)
 	html("<table summary='blob content' class='blob'>\n");
 
 	if (ctx.cfg.enable_tree_linenumbers) {
-		html("<tr><td class='linenumbers'><pre>");
+		html("<tr><td id=linenumber_td class='linenumbers'><pre>");
 		idx = 0;
 		lineno = 0;