##// END OF EJS Templates
upstream » mercurial-mirror
RSS

Clone from https://www.mercurial-scm.org/repo/hg-all

graph: improve script hiding tricks
Dirkjan Ochtman -
r6729:855851ea default
parent child Browse files
Show More
Show file before | Show file after | Hide comments
@@ -1,110 +1,113
1 1 {header}
2 2 <title>{repo|escape}: revision graph</title>
3 3 <link rel="alternate" type="application/atom+xml"
4 4 href="{url}atom-log" title="Atom feed for {repo|escape}: log">
5 5 <link rel="alternate" type="application/rss+xml"
6 6 href="{url}rss-log" title="RSS feed for {repo|escape}: log">
7 7 <!--[if IE]><script type="text/javascript" src="{staticurl}excanvas.js"></script><![endif]-->
8 8 </head>
9 9 <body>
10 10
11 11 <div class="container">
12 12 <div class="menu">
13 13 <div class="logo">
14 14 <a href="http://www.selenic.com/mercurial/">
15 15 <img src="{staticurl}hglogo.png" width=75 height=90 border=0 alt="mercurial"></a>
16 16 </div>
17 17 <ul>
18 18 <li><a href="{url}shortlog{sessionvars%urlparameter}">log</a></li>
19 19 <li class="active">graph</li>
20 20 <li><a href="{url}tags{sessionvars%urlparameter}">tags</a></li>
21 21 </ul>
22 22 <ul>
23 23 <li><a href="{url}rev/{node|short}{sessionvars%urlparameter}">changeset</a></li>
24 24 <li><a href="{url}file/{node|short}{path|urlescape}{sessionvars%urlparameter}">browse</a></li>
25 25 </ul>
26 26 </div>
27 27
28 28 <div class="main">
29 29 <h2>{repo|escape}</h2>
30 30 <h3>graph</h3>
31 31
32 32 <form class="search" action="{url}log">
33 33 {sessionvars%hiddenformentry}
34 34 <p><input name="rev" id="search1" type="text" size="30"></p>
35 35 </form>
36 36
37 37 <div class="navigate">
38 38 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountless}">less</a>
39 39 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountmore}">more</a>
40 40 | {changenav%navgraphentry}
41 41 </div>
42 42
43 43 <div id="noscript">The revision graph only works with JavaScript-enabled browsers.</div>
44 44
45 45 <div id="wrapper">
46 46 <ul id="nodebgs"></ul>
47 47 <canvas id="graph" width="224" height="{canvasheight}"></canvas>
48 48 <ul id="graphnodes"></ul>
49 49 </div>
50 50
51 51 <script type="text/javascript" src="{staticurl}graph.js"></script>
52 52 <script>
53 <!-- hide script content
53 54
54 document.getElementById('noscript').style.visibility = 'hidden';
55 document.getElementById('noscript').style.display = 'none';
55 56
56 57 data = {jsdata|json};
57 58 graph = new Graph();
58 59 graph.scale({bg_height});
59 60
60 61 graph.edge = function(x0, y0, x1, y1, color) {
61 62
62 63 this.setColor(color, 0.0, 0.65);
63 64 this.ctx.beginPath();
64 65 this.ctx.moveTo(x0, y0);
65 66 this.ctx.lineTo(x1, y1);
66 67 this.ctx.stroke();
67 68
68 69 }
69 70
70 71 var revlink = '<li style="_STYLE"><span class="desc">';
71 72 revlink += '<a href="{url}rev/_NODEID{sessionvars%urlparameter}" title="_NODEID">_DESC</a>';
72 73 revlink += '</span><span class="tag">_TAGS</span>';
73 74 revlink += '<span class="info">_DATE ago, by _USER</span></li>';
74 75
75 76 graph.vertex = function(x, y, color, parity, cur) {
76 77
77 78 this.ctx.beginPath();
78 79 color = this.setColor(color, 0.25, 0.75);
79 80 this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);
80 81 this.ctx.fill();
81 82
82 83 var bg = '<li class="bg parity' + parity + '"></li>';
83 84 var left = (this.columns + 1) * this.bg_height;
84 85 var nstyle = 'padding-left: ' + left + 'px;';
85 86 var item = revlink.replace(/_STYLE/, nstyle);
86 87 item = item.replace(/_PARITY/, 'parity' + parity);
87 88 item = item.replace(/_NODEID/, cur[0]);
88 89 item = item.replace(/_NODEID/, cur[0]);
89 90 item = item.replace(/_DESC/, cur[3]);
90 91 item = item.replace(/_USER/, cur[4]);
91 92 item = item.replace(/_DATE/, cur[5]);
92 93 item = item.replace(/_TAGS/, cur[7].join('&nbsp; '));
93 94
94 95 return [bg, item];
95 96
96 97 }
97 98
98 99 graph.render(data);
100
101 // stop hiding script -->
99 102 </script>
100 103
101 104 <div class="navigate">
102 105 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountless}">less</a>
103 106 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountmore}">more</a>
104 107 | {changenav%navgraphentry}
105 108 </div>
106 109
107 110 </div>
108 111 </div>
109 112
110 113 {footer}
Show file before | Show file after | Hide comments
@@ -1,118 +1,121
1 1 #header#
2 2 <title>#repo|escape#: Graph</title>
3 3 <link rel="alternate" type="application/atom+xml"
4 4 href="{url}atom-log" title="Atom feed for #repo|escape#"/>
5 5 <link rel="alternate" type="application/rss+xml"
6 6 href="{url}rss-log" title="RSS feed for #repo|escape#"/>
7 7 </head>
8 8 <body>
9 9
10 10 <div class="page_header">
11 11 <a href="http://www.selenic.com/mercurial/" title="Mercurial" style="float: right;">Mercurial</a><a href="{url}summary{sessionvars%urlparameter}">#repo|escape#</a> / graph
12 12 </div>
13 13
14 14 <form action="{url}log">
15 15 {sessionvars%hiddenformentry}
16 16 <div class="search">
17 17 <input type="text" name="rev" />
18 18 </div>
19 19 </form>
20 20 <div class="page_nav">
21 21 <a href="{url}summary{sessionvars%urlparameter}">summary</a> |
22 22 <a href="{url}shortlog{sessionvars%urlparameter}">shortlog</a> |
23 23 <a href="{url}log/#rev#{sessionvars%urlparameter}">changelog</a> |
24 24 graph |
25 25 <a href="{url}tags{sessionvars%urlparameter}">tags</a> |
26 26 <a href="{url}file/#node|short#{sessionvars%urlparameter}">files</a>
27 27 <br/>
28 28 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountless}">less</a>
29 29 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountmore}">more</a>
30 30 | #changenav%navgraphentry#<br/>
31 31 </div>
32 32
33 33 <div class="title">&nbsp;</div>
34 34
35 35 <div id="noscript">The revision graph only works with JavaScript-enabled browsers.</div>
36 36
37 37 <div id="wrapper">
38 38 <ul id="nodebgs"></ul>
39 39 <canvas id="graph" width="224" height="#canvasheight#"></canvas>
40 40 <ul id="graphnodes"></ul>
41 41 </div>
42 42
43 43 <script type="text/javascript" src="#staticurl#graph.js"></script>
44 44 <script>
45 <!-- hide script content
45 46
46 document.getElementById('noscript').style.visibility = 'hidden';
47 document.getElementById('noscript').style.display = 'none';
47 48
48 49 data = {jsdata|json};
49 50 graph = new Graph();
50 51 graph.scale({bg_height});
51 52
52 53 graph.edge = function(x0, y0, x1, y1, color) {
53 54
54 55 this.setColor(color, 0.0, 0.65);
55 56 this.ctx.beginPath();
56 57 this.ctx.moveTo(x0, y0);
57 58 this.ctx.lineTo(x1, y1);
58 59 this.ctx.stroke();
59 60
60 61 }
61 62
62 63 var revlink = '<li style="_STYLE"><span class="desc">';
63 64 revlink += '<a class="list" href="{url}rev/_NODEID{sessionvars%urlparameter}" title="_NODEID"><b>_DESC</b></a>';
64 65 revlink += '</span> _TAGS';
65 66 revlink += '<span class="info">_DATE ago, by _USER</span></li>';
66 67
67 68 graph.vertex = function(x, y, color, parity, cur) {
68 69
69 70 this.ctx.beginPath();
70 71 color = this.setColor(color, 0.25, 0.75);
71 72 this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);
72 73 this.ctx.fill();
73 74
74 75 var bg = '<li class="bg parity' + parity + '"></li>';
75 76 var left = (this.columns + 1) * this.bg_height;
76 77 var nstyle = 'padding-left: ' + left + 'px;';
77 78 var item = revlink.replace(/_STYLE/, nstyle);
78 79 item = item.replace(/_PARITY/, 'parity' + parity);
79 80 item = item.replace(/_NODEID/, cur[0]);
80 81 item = item.replace(/_NODEID/, cur[0]);
81 82 item = item.replace(/_DESC/, cur[3]);
82 83 item = item.replace(/_USER/, cur[4]);
83 84 item = item.replace(/_DATE/, cur[5]);
84 85
85 86 var tagspan = '';
86 87 if (cur[7].length || (cur[6][0] != 'default' || cur[6][1])) {
87 88 tagspan = '<span class="logtags">';
88 89 if (cur[6][1]) {
89 90 tagspan += '<span class="branchtag" title="' + cur[6][0] + '">';
90 91 tagspan += cur[6][0] + '</span> ';
91 92 } else if (!cur[6][1] && cur[6][0] != 'default') {
92 93 tagspan += '<span class="inbranchtag" title="' + cur[6][0] + '">';
93 94 tagspan += cur[6][0] + '</span> ';
94 95 }
95 96 if (cur[7].length) {
96 97 for (var t in cur[7]) {
97 98 var tag = cur[7][t];
98 99 tagspan += '<span class="tagtag">' + tag + '</span> ';
99 100 }
100 101 }
101 102 tagspan += '</span>';
102 103 }
103 104
104 105 item = item.replace(/_TAGS/, tagspan);
105 106 return [bg, item];
106 107
107 108 }
108 109
109 110 graph.render(data);
111
112 // stop hiding script -->
110 113 </script>
111 114
112 115 <div class="page_nav">
113 116 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountless}">less</a>
114 117 <a href="{url}graph/{uprev}{sessionvars%urlparameter}?revcount={revcountmore}">more</a>
115 118 | {changenav%navgraphentry}
116 119 </div>
117 120
118 121 #footer#
Show file before | Show file after | Hide comments
@@ -1,93 +1,96
1 1 #header#
2 2 <title>#repo|escape#: graph</title>
3 3 <link rel="alternate" type="application/atom+xml"
4 4 href="#url#atom-tags" title="Atom feed for #repo|escape#: tags">
5 5 <link rel="alternate" type="application/rss+xml"
6 6 href="#url#rss-tags" title="RSS feed for #repo|escape#: tags">
7 7 </head>
8 8 <body>
9 9
10 10 <div class="buttons">
11 11 <a href="#url#log{sessionvars%urlparameter}">changelog</a>
12 12 <a href="#url#shortlog{sessionvars%urlparameter}">shortlog</a>
13 13 <a href="#url#tags{sessionvars%urlparameter}">tags</a>
14 14 <a href="#url#file/#node|short#/{sessionvars%urlparameter}">files</a>
15 15 </div>
16 16
17 17 <h2>graph</h2>
18 18
19 19 <form action="#url#log">
20 20 {sessionvars%hiddenformentry}
21 21 <p>
22 22 <label for="search1">search:</label>
23 23 <input name="rev" id="search1" type="text" size="30">
24 24 navigate: <small class="navigate">#changenav%navgraphentry#</small>
25 25 </p>
26 26 </form>
27 27
28 28 <div id="noscript">The revision graph only works with JavaScript-enabled browsers.</div>
29 29
30 30 <div id="wrapper">
31 31 <ul id="nodebgs"></ul>
32 32 <canvas id="graph" width="224" height="#canvasheight#"></canvas>
33 33 <ul id="graphnodes"></ul>
34 34 </div>
35 35
36 36 <script type="text/javascript" src="#staticurl#graph.js"></script>
37 37 <script>
38 <!-- hide script content
38 39
39 document.getElementById('noscript').style.visibility = 'hidden';
40 document.getElementById('noscript').style.display = 'none';
40 41
41 42 data = {jsdata|json};
42 43 graph = new Graph();
43 44 graph.scale({bg_height});
44 45
45 46 graph.edge = function(x0, y0, x1, y1, color) {
46 47
47 48 this.setColor(color, 0.0, 0.65);
48 49 this.ctx.beginPath();
49 50 this.ctx.moveTo(x0, y0);
50 51 this.ctx.lineTo(x1, y1);
51 52 this.ctx.stroke();
52 53
53 54 }
54 55
55 56 var revlink = '<li style="_STYLE"><span class="desc">';
56 57 revlink += '<a href="{url}rev/_NODEID{sessionvars%urlparameter}" title="_NODEID">_DESC</a>';
57 58 revlink += '</span><span class="info">_DATE ago, by _USER</span></li>';
58 59
59 60 graph.vertex = function(x, y, color, parity, cur) {
60 61
61 62 this.ctx.beginPath();
62 63 color = this.setColor(color, 0.25, 0.75);
63 64 this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);
64 65 this.ctx.fill();
65 66
66 67 var bg = '<li class="bg parity' + parity + '"></li>';
67 68 var left = (this.columns + 1) * this.bg_height;
68 69 var nstyle = 'padding-left: ' + left + 'px;';
69 70 var item = revlink.replace(/_STYLE/, nstyle);
70 71 item = item.replace(/_PARITY/, 'parity' + parity);
71 72 item = item.replace(/_NODEID/, cur[0]);
72 73 item = item.replace(/_NODEID/, cur[0]);
73 74 item = item.replace(/_DESC/, cur[3]);
74 75 item = item.replace(/_USER/, cur[4]);
75 76 item = item.replace(/_DATE/, cur[5]);
76 77
77 78 return [bg, item];
78 79
79 80 }
80 81
81 82 graph.render(data);
83
84 // stop hiding script -->
82 85 </script>
83 86
84 87 <form action="#url#log">
85 88 {sessionvars%hiddenformentry}
86 89 <p>
87 90 <label for="search1">search:</label>
88 91 <input name="rev" id="search1" type="text" size="30">
89 92 navigate: <small class="navigate">#changenav%navgraphentry#</small>
90 93 </p>
91 94 </form>
92 95
93 96 #footer#
Show file before | Show file after | Hide comments
@@ -1,122 +1,123
1 1 body { font-family: sans-serif; font-size: 12px; margin:0px; border:solid #d9d8d1; border-width:1px; margin:10px; }
2 2 a { color:#0000cc; }
3 3 a:hover, a:visited, a:active { color:#880000; }
4 4 div.page_header { height:25px; padding:8px; font-size:18px; font-weight:bold; background-color:#d9d8d1; }
5 5 div.page_header a:visited { color:#0000cc; }
6 6 div.page_header a:hover { color:#880000; }
7 7 div.page_nav { padding:8px; }
8 8 div.page_nav a:visited { color:#0000cc; }
9 9 div.page_path { padding:8px; border:solid #d9d8d1; border-width:0px 0px 1px}
10 10 div.page_footer { padding:4px 8px; background-color: #d9d8d1; }
11 11 div.page_footer_text { float:left; color:#555555; font-style:italic; }
12 12 div.page_body { padding:8px; }
13 13 div.title, a.title {
14 14 display:block; padding:6px 8px;
15 15 font-weight:bold; background-color:#edece6; text-decoration:none; color:#000000;
16 16 }
17 17 a.title:hover { background-color: #d9d8d1; }
18 18 div.title_text { padding:6px 0px; border: solid #d9d8d1; border-width:0px 0px 1px; }
19 19 div.log_body { padding:8px 8px 8px 150px; }
20 20 .age { white-space:nowrap; }
21 21 span.age { position:relative; float:left; width:142px; font-style:italic; }
22 22 div.log_link {
23 23 padding:0px 8px;
24 24 font-size:10px; font-family:sans-serif; font-style:normal;
25 25 position:relative; float:left; width:136px;
26 26 }
27 27 div.list_head { padding:6px 8px 4px; border:solid #d9d8d1; border-width:1px 0px 0px; font-style:italic; }
28 28 a.list { text-decoration:none; color:#000000; }
29 29 a.list:hover { text-decoration:underline; color:#880000; }
30 30 table { padding:8px 4px; }
31 31 th { padding:2px 5px; font-size:12px; text-align:left; }
32 32 tr.light:hover, .parity0:hover { background-color:#edece6; }
33 33 tr.dark, .parity1 { background-color:#f6f6f0; }
34 34 tr.dark:hover, .parity1:hover { background-color:#edece6; }
35 35 td { padding:2px 5px; font-size:12px; vertical-align:top; }
36 36 td.link { padding:2px 5px; font-family:sans-serif; font-size:10px; }
37 37 td.indexlinks { white-space: nowrap; }
38 38 td.indexlinks a {
39 39 padding: 2px 5px; line-height: 10px;
40 40 border: 1px solid;
41 41 color: #ffffff; background-color: #7777bb;
42 42 border-color: #aaaadd #333366 #333366 #aaaadd;
43 43 font-weight: bold; text-align: center; text-decoration: none;
44 44 font-size: 10px;
45 45 }
46 46 td.indexlinks a:hover { background-color: #6666aa; }
47 47 div.pre { font-family:monospace; font-size:12px; white-space:pre; }
48 48 div.diff_info { font-family:monospace; color:#000099; background-color:#edece6; font-style:italic; }
49 49 div.index_include { border:solid #d9d8d1; border-width:0px 0px 1px; padding:12px 8px; }
50 50 div.search { margin:4px 8px; position:absolute; top:56px; right:12px }
51 51 .linenr { color:#999999; text-decoration:none }
52 52 div.rss_logo { float: right; white-space: nowrap; }
53 53 div.rss_logo a {
54 54 padding:3px 6px; line-height:10px;
55 55 border:1px solid; border-color:#fcc7a5 #7d3302 #3e1a01 #ff954e;
56 56 color:#ffffff; background-color:#ff6600;
57 57 font-weight:bold; font-family:sans-serif; font-size:10px;
58 58 text-align:center; text-decoration:none;
59 59 }
60 60 div.rss_logo a:hover { background-color:#ee5500; }
61 61 pre { margin: 0; }
62 62 span.logtags span {
63 63 padding: 0px 4px;
64 64 font-size: 10px;
65 65 font-weight: normal;
66 66 border: 1px solid;
67 67 background-color: #ffaaff;
68 68 border-color: #ffccff #ff00ee #ff00ee #ffccff;
69 69 }
70 70 span.logtags span.tagtag {
71 71 background-color: #ffffaa;
72 72 border-color: #ffffcc #ffee00 #ffee00 #ffffcc;
73 73 }
74 74 span.logtags span.branchtag {
75 75 background-color: #aaffaa;
76 76 border-color: #ccffcc #00cc33 #00cc33 #ccffcc;
77 77 }
78 78 span.logtags span.inbranchtag {
79 79 background-color: #d5dde6;
80 80 border-color: #e3ecf4 #9398f4 #9398f4 #e3ecf4;
81 81 }
82 82
83 83 /* Graph */
84 84 div#wrapper {
85 85 position: relative;
86 86 margin: 0;
87 87 padding: 0;
88 margin-top: 3px;
88 89 }
89 90
90 91 canvas {
91 92 position: absolute;
92 93 z-index: 5;
93 94 top: -0.9em;
94 95 margin: 0;
95 96 }
96 97
97 98 ul#nodebgs {
98 99 list-style: none inside none;
99 100 padding: 0;
100 101 margin: 0;
101 102 top: -0.7em;
102 103 }
103 104
104 105 ul#graphnodes li, ul#nodebgs li {
105 106 height: 39px;
106 107 }
107 108
108 109 ul#graphnodes {
109 110 position: absolute;
110 111 z-index: 10;
111 112 top: -0.8em;
112 113 list-style: none inside none;
113 114 padding: 0;
114 115 }
115 116
116 117 ul#graphnodes li .info {
117 118 display: block;
118 119 font-size: 100%;
119 120 position: relative;
120 121 top: -3px;
121 122 font-style: italic;
122 123 }
General Comments 0
You need to be logged in to leave comments. Login now