From: john at keeping.me.uk (John Keeping)
Subject: [PATCH v3 5/6] line-range-highlight: onclick handler and range selection
Date: Sun, 24 Jun 2018 12:35:23 +0100 [thread overview]
Message-ID: <20180624113523.GK6584@john.keeping.me.uk> (raw)
In-Reply-To: <152980828951.2873.11742118399461829064.stgit@mail.warmcat.com>
On Sun, Jun 24, 2018 at 10:44:49AM +0800, Andy Green wrote:
> 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'>");
We normally quote attribute values in all cases (like for "class" here),
and I think we choose kebab-case over snake_case for HTML identifiers,
by the same principle that we do so for CSS classes.
But can we just call this "linenumbers"? I don't think we need the
element type in the identifier.
> 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;
>
next prev parent reply other threads:[~2018-06-24 11:35 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 ` [PATCH v3 4/6] cgit.js: line range highlight: improve vertical scroll logic andy
2018-06-24 2:44 ` [PATCH v3 5/6] line-range-highlight: onclick handler and range selection andy
2018-06-24 11:35 ` john [this message]
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=20180624113523.GK6584@john.keeping.me.uk \
--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).