view mercurial/templates/monoblue/graph.tmpl @ 18258:bebb05a7e249

hgweb: add a "URL breadcrumb" to the index and repository pages The purpose of this change is to make it much easier to navigate up the repository tree when the hg web server is used to serve more than one repository. A "URL breadcrumb" is a path where each of the path items can be clicked to go to the corresponding path page. This lets you go up the folder hierarchy very quickly. For example, when showing the list of repositories in http://myserver/myteams/myprojects, the following "breadcrumb" will be shown: Mercurial > myteams > myprojects Clicking on "myprojects" reloads the page. Clicking on "myteams" goes up one folder. Clicking on the leftmost "Mercurial" goes to the server root. This "breadcrumb" also appears on all repository pages. For example on the summary page of the repository at http://myserver/myteams/myprojects/myrepo the following will be shown: Mercurial > myteams > myprojects > myrepo / summary This change has been applied to all templates that already had a link to the main repository page (i.e. gitweb, monoblue, paper and coal) plus to the index page of the spartan template. In order to make the breadcumb links stand out the some of the template styles have been customized.
author Angel Ezquerra <angel.ezquerra at gmail.com>
date Wed, 28 Nov 2012 20:21:26 +0100
parents ffe3630cb243
children 9409aeaafdc1
line wrap: on
line source

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

<body>
<div id="container">
    <div class="page-header">
        <h1 class="breadcrumb"><a href="/">Mercurial</a> {pathdef%breadcrumb} / graph</h1>

        <form action="{url}log">
            {sessionvars%hiddenformentry}
            <dl class="search">
                <dt><label>Search: </label></dt>
                <dd><input type="text" name="rev" /></dd>
            </dl>
        </form>

        <ul class="page-nav">
            <li><a href="{url}summary{sessionvars%urlparameter}">summary</a></li>
            <li><a href="{url}shortlog{sessionvars%urlparameter}">shortlog</a></li>
            <li><a href="{url}changelog{sessionvars%urlparameter}">changelog</a></li>
            <li class="current">graph</li>
            <li><a href="{url}tags{sessionvars%urlparameter}">tags</a></li>
            <li><a href="{url}bookmarks{sessionvars%urlparameter}">bookmarks</a></li>
            <li><a href="{url}branches{sessionvars%urlparameter}">branches</a></li>
            <li><a href="{url}file/{node|short}{sessionvars%urlparameter}">files</a></li>
	    <li><a href="{url}help{sessionvars%urlparameter}">help</a></li>
        </ul>
    </div>

    <h2 class="no-link no-border">graph</h2>

    <div id="noscript">The revision graph only works with JavaScript-enabled browsers.</div>
    <div id="wrapper">
        <ul id="nodebgs"></ul>
        <canvas id="graph" width="480" height="{canvasheight}"></canvas>
        <ul id="graphnodes"></ul>
    </div>

    <script>
    <!-- hide script content

    document.getElementById('noscript').style.display = 'none';

    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 href="{url}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="page-path">
        <a href="{url}graph/{rev}{lessvars%urlparameter}">less</a>
        <a href="{url}graph/{rev}{morevars%urlparameter}">more</a>
        | {changenav%navgraph}
    </div>

{footer}