Patchwork [2,of,6] hgweb: only include graph-related data in jsdata variable on /graph pages (BC)

login
register
mail settings
Submitter Anton Shestakov
Date Dec. 4, 2017, 12:40 p.m.
Message ID <c75e3f9f9b321cb5f7e0.1512391239@neuro>
Download mbox | patch
Permalink /patch/25918/
State Accepted
Headers show

Comments

Anton Shestakov - Dec. 4, 2017, 12:40 p.m.
# HG changeset patch
# User Anton Shestakov <av6@dwimlabs.net>
# Date 1512115240 -28800
#      Fri Dec 01 16:00:40 2017 +0800
# Node ID c75e3f9f9b321cb5f7e048302aee3163df46cbc3
# Parent  c90d696319a8e9c451853109b851ab8389b450e9
# EXP-Topic hgweb-more-info
hgweb: only include graph-related data in jsdata variable on /graph pages (BC)

Historically, client-side graph code was not only rendering the graph itself,
but it was also adding all of the changeset information to the page as well.
It meant that JavaScript code needed to construct valid HTML as a string
(although proper escaping was done server-side). It wasn't too clunky, even
though it meant that a lot of server-side things were duplicated client-side
for no good reason, but the worst thing about it was the data format it used.
It was somewhat future-proof, but not human-friendly, because it was just a
tuple: it was possible to append things to it (as was done in e.g.
270f57d35525), but you'd then have to remember the indices and reading the
resulting JS code wasn't easy, because cur[8] is not descriptive at all.

So what would need to happen for graph to have more features, such as more
changeset information or a different vertex style (branch-closing, obsolete)?
First you'd need to take some property, process it (e.g. escape and pass
through templatefilters function, and mind the encoding too), append it to
jsdata and remember its index, then go add nearly identical JavaScript code to
4 different hgweb themes that use jsdata to render HTML, and finally try and
forget how brittle it all felt. Oh yeah, and the indices go to double digits if
we add 2 more items, say phase and obsolescence, and there are more to come.
Rendering vertex in a different style would need another property (say,
character "o", "_", or "x"), except if you want to be backwards-compatible, it
would need to go after tags and bookmarks, and that just doesn't feel right.

So here I'm trying to fix both the duplication of code and the data format:

- changesets will be rendered by hgweb templates the same way as changelog and
  other such pages, so jsdata won't need any information that's not needed for
  rendering the graph itself

- jsdata will be a dict, or an Object in JS, which is a lot nicer to humans and
  is a lot more future-proof in the long run, because it doesn't use numeric
  indices

What about hgweb themes? Obviously, this will break all hgweb themes that
render graph in JavaScript, including 3rd-party custom ones. But this will also
reduce the size of client-side code and make it more uniform, so that it can be
shared across hgweb themes, further reducing its size. The next few patches
demonstrate that it's not hard to adapt a theme to these changes. And in a
later series, I'm planning to move duplicate JS code from */graph.tmpl to
mercurial.js and leave only 4 lines of code embedded in those <script>
elements, and even that would be just to allow redefining graph.vertex
function. So adapting a custom 3rd-party theme to these changes would mean:

- creating or copying graphnode.tmpl and adding it to the map file (if a theme
  doesn't already use __base__)

- modifying one line in graph.tmpl and simply removing the bigger part of
  JavaScript code from there

Making these changes in this patch and not updating every hgweb theme that uses
jsdata at the same time is a bit of a cheat to make this series more
manageable: /graph pages that use jsdata are broken by this patch, but since
there are no tests that would detect this, bisect works fine; and themes are
updated separately, in the next 4 patches of this series to ease reviewing.

Patch

diff --git a/mercurial/hgweb/webcommands.py b/mercurial/hgweb/webcommands.py
--- a/mercurial/hgweb/webcommands.py
+++ b/mercurial/hgweb/webcommands.py
@@ -36,9 +36,7 @@  from .. import (
     revsetlang,
     scmutil,
     smartset,
-    templatefilters,
     templater,
-    url,
     util,
 )
 
@@ -1242,8 +1240,6 @@  def graph(web, req, tmpl):
         return cols
 
     def graphdata(usetuples):
-        # {jsdata} will be passed to |json, so it must be in utf-8
-        encodestr = encoding.fromlocal
         data = []
 
         row = 0
@@ -1253,22 +1249,7 @@  def graph(web, req, tmpl):
 
             if usetuples:
                 node = pycompat.bytestr(ctx)
-                age = encodestr(templatefilters.age(ctx.date()))
-                desc = templatefilters.firstline(encodestr(ctx.description()))
-                desc = url.escape(templatefilters.nonempty(desc))
-                user = templatefilters.person(encodestr(ctx.user()))
-                user = url.escape(user)
-                branch = url.escape(encodestr(ctx.branch()))
-                try:
-                    branchnode = web.repo.branchtip(ctx.branch())
-                except error.RepoLookupError:
-                    branchnode = None
-                branch = branch, branchnode == ctx.node()
-
-                data.append((node, vtx, edges, desc, user, age, branch,
-                             [url.escape(encodestr(x)) for x in ctx.tags()],
-                             [url.escape(encodestr(x))
-                              for x in ctx.bookmarks()]))
+                data.append({'node': node, 'vertex': vtx, 'edges': edges})
             else:
                 entry = webutil.commonentry(web.repo, ctx)
                 edgedata = [{'col': edge[0], 'nextcol': edge[1],
diff --git a/mercurial/templates/static/mercurial.js b/mercurial/templates/static/mercurial.js
--- a/mercurial/templates/static/mercurial.js
+++ b/mercurial/templates/static/mercurial.js
@@ -103,14 +103,12 @@  function Graph() {
 			this.bg[1] += this.bg_height;
 
 			var cur = data[i];
-			var node = cur[1];
-			var edges = cur[2];
 			var fold = false;
 
 			var prevWidth = this.ctx.lineWidth;
-			for (var j = 0; j < edges.length; j++) {
+			for (var j = 0; j < cur.edges.length; j++) {
 
-				line = edges[j];
+				line = cur.edges[j];
 				start = line[0];
 				end = line[1];
 				color = line[2];
@@ -141,8 +139,8 @@  function Graph() {
 
 			// Draw the revision node in the right column
 
-			column = node[0];
-			color = node[1];
+			column = cur.vertex[0];
+			color = cur.vertex[1];
 
 			radius = this.box_size / 8;
 			x = this.cell[0] + this.box_size * column + this.box_size / 2;
diff --git a/tests/test-hgweb-commands.t b/tests/test-hgweb-commands.t
--- a/tests/test-hgweb-commands.t
+++ b/tests/test-hgweb-commands.t
@@ -1788,7 +1788,7 @@  Overviews
   <script>
   <!-- hide script content
   
-  var data = [["cad8025a2e87", [0, 1], [[0, 0, 1, 3, "FF0000"]], "branch commit with null character: \u0000", "test", "1970-01-01", ["unstable", true], ["tip"], ["something"]], ["1d22e65f027e", [0, 1], [[0, 0, 1, 3, ""]], "branch", "test", "1970-01-01", ["stable", true], [], []], ["a4f92ed23982", [0, 1], [[0, 0, 1, 3, ""]], "Added tag 1.0 for changeset 2ef0ac749a14", "test", "1970-01-01", ["default", true], [], []], ["2ef0ac749a14", [0, 1], [], "base", "test", "1970-01-01", ["default", false], ["1.0"], ["anotherthing"]]];
+  var data = [{"edges": [[0, 0, 1, 3, "FF0000"]], "node": "cad8025a2e87", "vertex": [0, 1]}, {"edges": [[0, 0, 1, 3, ""]], "node": "1d22e65f027e", "vertex": [0, 1]}, {"edges": [[0, 0, 1, 3, ""]], "node": "a4f92ed23982", "vertex": [0, 1]}, {"edges": [], "node": "2ef0ac749a14", "vertex": [0, 1]}];
   var graph = new Graph();
   graph.scale(39);