view mercurial/templates/gitweb/graph.tmpl @ 26670:ab2cd800f1b0

gitweb: visually highlight source lines when hovering over line numbers Due to how the line links now reside outside of the source lines, hovering over line numbers doesn't count as hovering over the appropriate source line. It can be worked around by using a "+" css selector. However, it's necessary to reorder the elements and put <a> before <span> (which is actually quite logical). It works without further css tweaks because <a> is already absolute-positioned and so the order doesn't matter visually.
author Anton Shestakov <av6@dwimlabs.net>
date Thu, 15 Oct 2015 00:04:58 +0800
parents e901df65b108
children 91ac8cb79125
line wrap: on
line source

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

<div class="page_header">
<a href="{logourl}" title="Mercurial" style="float: right;">Mercurial</a>
<a href="/">Mercurial</a> {pathdef%breadcrumb} / graph
</div>

<form action="{url|urlescape}log">
{sessionvars%hiddenformentry}
<div class="search">
<input type="text" name="rev"  />
</div>
</form>
<div class="page_nav">
<a href="{url|urlescape}summary{sessionvars%urlparameter}">summary</a> |
<a href="{url|urlescape}shortlog/{symrev}{sessionvars%urlparameter}">shortlog</a> |
<a href="{url|urlescape}log/{symrev}{sessionvars%urlparameter}">changelog</a> |
graph |
<a href="{url|urlescape}tags{sessionvars%urlparameter}">tags</a> |
<a href="{url|urlescape}bookmarks{sessionvars%urlparameter}">bookmarks</a> |
<a href="{url|urlescape}branches{sessionvars%urlparameter}">branches</a> |
<a href="{url|urlescape}file/{symrev}{sessionvars%urlparameter}">files</a> |
<a href="{url|urlescape}help{sessionvars%urlparameter}">help</a>
<br/>
<a href="{url|urlescape}graph/{symrev}{lessvars%urlparameter}">less</a>
<a href="{url|urlescape}graph/{symrev}{morevars%urlparameter}">more</a>
| {changenav%navgraph}<br/>
</div>

<div class="title">&nbsp;</div>

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

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

<script>
<!-- hide script content

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

graph.vertex = function(x, y, 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 parity' + parity + '"></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="branchtag" title="' + cur[6][0] + '">';
			tagspan += cur[6][0] + '</span> ';
		} else if (!cur[6][1] && cur[6][0] != 'default') \{
			tagspan += '<span class="inbranchtag" 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="tagtag">' + tag + '</span> ';
			}
		}
		if (cur[8].length) \{
			for (var t in cur[8]) \{
				var bookmark = cur[8][t];
				tagspan += '<span class="bookmarktag">' + bookmark + '</span> ';
			}
		}
		tagspan += '</span>';
	}
	
	var item = '<li style="' + nstyle + '"><span class="desc">';
	item += '<a class="list" href="{url|urlescape}rev/' + cur[0] + '{sessionvars%urlparameter}" title="' + cur[0] + '"><b>' + cur[3] + '</b></a>';
	item += '</span> ' + tagspan + '';
	item += '<span class="info">' + cur[5] + ', by ' + cur[4] + '</span></li>';

	return [bg, item];
	
}

graph.render(data);

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

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

<script type="text/javascript">
    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>

{footer}