view mercurial/templates/paper/graph.tmpl @ 35160:69a865dc2ada

hgweb: define locally used variables as actually local in mercurial.js Variables that are used or assigned without any declaration using var (or let, or const) are considered global. In many cases this is inadvertent and actually causes a variable leaking to a broader scope, such as a temporary variable used inside a loop suddenly being accessible in global scope. (This corresponds to "undef" option of jshint). So this patch limits the scope of variables that don't need to be global. There are a lot of helper variables in Graph.render() used in a loop, I've declared them all on one line to reduce patch size. "radius" is special because it wasn't passed to graph.vertex, but was used there (it worked because this variable leaked to global scope). "window.graph" is created by an inline script in graph.tmpl so that it can be used in ajaxScrollInit() function, this patch makes this fact explicit by assigning window.graph to a local variable.
author Anton Shestakov <av6@dwimlabs.net>
date Wed, 22 Nov 2017 21:49:36 +0800
parents cba4461aa0a0
children 5857eb81c1f3
line wrap: on
line source

{header}
<title>{repo|escape}: revision graph</title>
<link rel="alternate" type="application/atom+xml"
   href="{url|urlescape}atom-log" title="Atom feed for {repo|escape}: log" />
<link rel="alternate" type="application/rss+xml"
   href="{url|urlescape}rss-log" title="RSS feed for {repo|escape}: log" />
<!--[if IE]><script type="text/javascript" src="{staticurl|urlescape}excanvas.js"></script><![endif]-->
</head>
<body>

<div class="container">
<div class="menu">
<div class="logo">
<a href="{logourl}">
<img src="{staticurl|urlescape}{logoimg}" alt="mercurial" /></a>
</div>
<ul>
<li><a href="{url|urlescape}shortlog/{symrev}{sessionvars%urlparameter}">log</a></li>
<li class="active">graph</li>
<li><a href="{url|urlescape}tags{sessionvars%urlparameter}">tags</a></li>
<li><a href="{url|urlescape}bookmarks{sessionvars%urlparameter}">bookmarks</a></li>
<li><a href="{url|urlescape}branches{sessionvars%urlparameter}">branches</a></li>
</ul>
<ul>
<li><a href="{url|urlescape}rev/{symrev}{sessionvars%urlparameter}">changeset</a></li>
<li><a href="{url|urlescape}file/{symrev}{path|urlescape}{sessionvars%urlparameter}">browse</a></li>
</ul>
<ul>
 <li><a href="{url|urlescape}help{sessionvars%urlparameter}">help</a></li>
</ul>
<div class="atom-logo">
<a href="{url|urlescape}atom-log" title="subscribe to atom feed">
<img class="atom-logo" src="{staticurl|urlescape}feed-icon-14x14.png" alt="atom feed" />
</a>
</div>
</div>

<div class="main">
<h2 class="breadcrumb"><a href="/">Mercurial</a> {pathdef%breadcrumb}</h2>
<h3>graph</h3>

{searchform}

<div class="navigate">
<a href="{url|urlescape}graph/{symrev}{lessvars%urlparameter}">less</a>
<a href="{url|urlescape}graph/{symrev}{morevars%urlparameter}">more</a>
| rev {rev}: {changenav%navgraph}
</div>

<noscript><p>The revision graph only works with JavaScript-enabled browsers.</p></noscript>

<div id="wrapper">
<ul id="nodebgs" class="stripes2"></ul>
<canvas id="graph" width="{canvaswidth}" height="{canvasheight}"></canvas>
<ul id="graphnodes"></ul>
</div>

<script type="text/javascript"{if(nonce, ' nonce="{nonce}"')}>
<!-- hide script content

var data = {jsdata|json};
var graph = new Graph();
graph.scale({bg_height});

graph.vertex = function(x, y, radius, color, parity, cur) \{
	
	this.ctx.beginPath();
	color = this.setColor(color, 0.25, 0.75);
	this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);
	this.ctx.fill();
	
	var bg = '<li class="bg"></li>';
	var left = (this.bg_height - this.box_size) + (this.columns + 1) * this.box_size;
	var nstyle = 'padding-left: ' + left + 'px;';

	var tagspan = '';
	if (cur[7].length || cur[8].length || (cur[6][0] != 'default' || cur[6][1])) \{
		tagspan = '<span class="logtags">';
		if (cur[6][1]) \{
			tagspan += '<span class="branchhead" title="' + cur[6][0] + '">';
			tagspan += cur[6][0] + '</span> ';
		} else if (!cur[6][1] && cur[6][0] != 'default') \{
			tagspan += '<span class="branchname" title="' + cur[6][0] + '">';
			tagspan += cur[6][0] + '</span> ';
		}
		if (cur[7].length) \{
			for (var t in cur[7]) \{
				var tag = cur[7][t];
				tagspan += '<span class="tag">' + tag + '</span> ';
			}
		}
		if (cur[8].length) \{
			for (var b in cur[8]) \{
				var bookmark = cur[8][b];
				tagspan += '<span class="tag">' + bookmark + '</span> ';
			}
		}
		tagspan += '</span>';
	}

	var item = '<li style="' + nstyle + '"><span class="desc">';
	item += '<a href="{url|urlescape}rev/' + cur[0] + '{sessionvars%urlparameter}" title="' + cur[0] + '">' + cur[3] + '</a>';
	item += '</span>' + tagspan + '<span class="info">' + cur[5] + ', by ' + cur[4] + '</span></li>';
	
	return [bg, item];
	
}

graph.render(data);

// stop hiding script -->
</script>

<div class="navigate">
<a href="{url|urlescape}graph/{symrev}{lessvars%urlparameter}">less</a>
<a href="{url|urlescape}graph/{symrev}{morevars%urlparameter}">more</a>
| rev {rev}: {changenav%navgraph}
</div>

<script type="text/javascript"{if(nonce, ' nonce="{nonce}"')}>
    ajaxScrollInit(
            '{url|urlescape}graph/{rev}?revcount=%next%&style={style}',
            {revcount}+60,
            function (htmlText, previousVal) \{ return previousVal + 60; },
            '#wrapper',
            '<div class="%class%" style="text-align: center;">%text%</div>',
            'graph'
    );
</script>

</div>
</div>

{footer}