Changeset - 864e4daef963
Parent rev.
Child rev.
[Not reviewed]
beta
0 3 0
Marcin Kuzminski - 14 years ago 2011-07-16 12:33:40
marcin@python-works.com
improved rendering of dag (they are not trimmed anymore when number of heads exceeds 5)
3 files changed with 19 insertions and 10 deletions:
rhodecode/public/css/style.css
1
2
rhodecode/public/js/graph.js
2
2
rhodecode/templates/changelog/changelog.html
16
6
0 comments (0 inline, 0 general)
rhodecode/public/css/style.css
➞
Show inline comments
 
@@ -1643,201 +1643,200 @@ width:115px;
 
margin:0 !important;
 
padding:5px;
 
}
 
 
#files_data dl dd {
 
margin:0 !important;
 
padding:5px !important;
 
}
 
 
#changeset_content {
 
border:1px solid #CCC;
 
padding:5px;
 
}
 
#changeset_compare_view_content{
 
border:1px solid #CCC;
 
padding:5px;
 
}
 
 
#changeset_content .container {
 
min-height:120px;
 
font-size:1.2em;
 
overflow:hidden;
 
}
 
 
#changeset_compare_view_content .compare_view_commits{
 
width: auto !important;
 
}
 
 
#changeset_compare_view_content .compare_view_commits td{
 
padding:0px 0px 0px 12px !important;
 
}
 
 
#changeset_content .container .right {
 
float:right;
 
width:25%;
 
text-align:right;
 
}
 
 
#changeset_content .container .left .message {
 
font-style:italic;
 
color:#556CB5;
 
white-space:pre-wrap;
 
}
 
 
.cs_files .cur_cs{
 
margin:10px 2px;
 
font-weight: bold;
 
}
 
 
.cs_files .node{
 
float: left;
 
}
 
.cs_files .changes{
 
float: right;
 
}
 
.cs_files .changes .added{
 
background-color: #BBFFBB;
 
float: left;
 
text-align: center;
 
font-size: 90%;
 
}
 
.cs_files .changes .deleted{
 
background-color: #FF8888;
 
float: left;
 
text-align: center;
 
font-size: 90%;
 
}
 
.cs_files .cs_added {
 
background:url("../images/icons/page_white_add.png") no-repeat scroll 3px;
 
height:16px;
 
padding-left:20px;
 
margin-top:7px;
 
text-align:left;
 
}
 
 
.cs_files .cs_changed {
 
background:url("../images/icons/page_white_edit.png") no-repeat scroll 3px;
 
height:16px;
 
padding-left:20px;
 
margin-top:7px;
 
text-align:left;
 
}
 
 
.cs_files .cs_removed {
 
background:url("../images/icons/page_white_delete.png") no-repeat scroll 3px;
 
height:16px;
 
padding-left:20px;
 
margin-top:7px;
 
text-align:left;
 
}
 
 
#graph {
 
overflow:hidden;
 
}
 
 
#graph_nodes {
 
width:160px;
 
float:left;
 
margin-left:-50px;
 
margin-top:5px;
 
}
 
 
#graph_content {
 
width:800px;
 
float:left;
 
 
}
 
 
#graph_content .container_header {
 
border:1px solid #CCC;
 
padding:10px;
 
}
 
#graph_content #rev_range_container{
 
padding:10px 0px;
 
}
 
#graph_content .container {
 
border-bottom:1px solid #CCC;
 
border-left:1px solid #CCC;
 
border-right:1px solid #CCC;
 
min-height:80px;
 
overflow:hidden;
 
font-size:1.2em;
 
}
 
 
#graph_content .container .right {
 
float:right;
 
width:28%;
 
text-align:right;
 
padding-bottom:5px;
 
}
 
 
#graph_content .container .left .date {
 
font-weight:700;
 
padding-bottom:5px;
 
}
 
#graph_content .container .left .date span{
 
vertical-align: text-top;
 
}
 
 
#graph_content .container .left .message {
 
font-size:100%;
 
padding-top:3px;
 
white-space:pre-wrap;
 
}
 
 
.right div {
 
clear:both;
 
}
 
 
.right .changes .added,.changed,.removed {
 
border:1px solid #DDD;
 
display:block;
 
float:right;
 
text-align:center;
 
min-width:15px;
 
cursor: help;
 
}
 
.right .changes .large {
 
border:1px solid #DDD;
 
display:block;
 
float:right;
 
text-align:center;
 
min-width:45px;
 
cursor: help;
 
background: #54A9F7;
 
}
 
 
.right .changes .added {
 
background:#BFB;
 
}
 
 
.right .changes .changed {
 
background:#FD8;
 
}
 
 
.right .changes .removed {
 
background:#F88;
 
}
 
 
.right .merge {
 
vertical-align:top;
 
font-size:0.75em;
 
font-weight:700;
 
}
 
 
.right .parent {
 
font-size:90%;
 
font-family:monospace;
 
}
 
 
.right .logtags .branchtag {
 
background:#FFF url("../images/icons/arrow_branch.png") no-repeat right 6px;
 
display:block;
 
font-size:0.8em;
 
padding:11px 16px 0 0;
 
}
 
 
.right .logtags .tagtag {
 
background:#FFF url("../images/icons/tag_blue.png") no-repeat right 6px;
 
display:block;
 
font-size:0.8em;
 
padding:11px 16px 0 0;
rhodecode/public/js/graph.js
➞
Show inline comments
 
// branch_renderer.js - Rendering of branch DAGs on the client side
 
//
 
// Copyright 2010 Marcin Kuzminski <marcin AT python-works DOT com>
 
// Copyright 2008 Jesper Noehr <jesper AT noehr DOT org>
 
// Copyright 2008 Dirkjan Ochtman <dirkjan AT ochtman DOT nl>
 
// Copyright 2006 Alexander Schremmer <alex AT alexanderweb DOT de>
 
//
 
// derived from code written by Scott James Remnant <scott@ubuntu.com>
 
// Copyright 2005 Canonical Ltd.
 
//
 
// This software may be used and distributed according to the terms
 
// of the GNU General Public License, incorporated herein by reference.
 

			




	
	
	
		
 
var colors = [

			




	
	
	
		
 
	[ 1.0, 0.0, 0.0 ],

			




	
	
	
		
 
	[ 1.0, 1.0, 0.0 ],

			




	
	
	
		
 
	[ 0.0, 1.0, 0.0 ],

			




	
	
	
		
 
	[ 0.0, 1.0, 1.0 ],

			




	
	
	
		
 
	[ 0.0, 0.0, 1.0 ],

			




	
	
	
		
 
	[ 1.0, 0.0, 1.0 ],

			




	
	
	
		
 
	[ 1.0, 1.0, 0.0 ],

			




	
	
	
		
 
	[ 0.0, 0.0, 0.0 ]

			




	
	
	
		
 
];

			




	
	
	
		
 

			




	
	
	
		
 
function BranchRenderer() {

			




	
	
	
		
 
	

			




	
	
	
		
 
	this.canvas = document.getElementById("graph_canvas");

			




	
	
	
		
 
	

			




	
	
	
		
 
	if (navigator.userAgent.indexOf('MSIE') >= 0) 

			




	
	
	
		
 
		this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);

			




	
	
	
		
 
	this.ctx = this.canvas.getContext('2d');

			




	
	
	
		
 
	this.ctx.strokeStyle = 'rgb(0, 0, 0)';

			




	
	
	
		
 
	this.ctx.fillStyle = 'rgb(0, 0, 0)';

			




	
	
	
		
 
	this.cur = [0, 0];

			




	
	
	
		
 
	this.max_column = 1;

			




	
	
	
		
 
	this.line_width = 2.5;

			




	
	
	
		
 
	this.dot_radius = 5.5;

			




	
	
	
		
 
	this.bg = [0, 4];

			




	
	
	
		
 
	this.cell = [2, 0];

			




	
	
	
		
 
	this.revlink = '';

			




	
	
	
		
 
	

			




	
	
	
		
 
	this.scale = function(height) {

			




	
	
	
		
 
		this.box_size = Math.floor(height/1.2);

			




	
	
	
		
 
		this.cell_height = this.box_size;

			




	
	
	
		
 
		this.bg_height = height;

			




	
	
	
		
 
	}

			




	
	
	
		
 
	

			




	
	
	
		
 
	this.setColor = function(color, bg, fg) {

			




	
	
	
		
 
		color %= colors.length;

			




	
	
	
		
 
		var red = (colors[color][0] * fg) || bg;

			




	
	
	
		
 
		var green = (colors[color][1] * fg) || bg;

			




	
	
	
		
 
		var blue = (colors[color][2] * fg) || bg;

			




	
	
	
		
 
		red = Math.round(red * 255);

			




	
	
	
		
 
		green = Math.round(green * 255);

			




	
	
	
		
 
		blue = Math.round(blue * 255);

			




	
	
	
		
 
		var s = 'rgb(' + red + ', ' + green + ', ' + blue + ')';

			




	
	
	
		
 
		this.ctx.strokeStyle = s;

			




	
	
	
		
 
		this.ctx.fillStyle = s;

			




	
	
	
		
 
	}

			




	
	
	
		
 

			




	
	
	
		
 
	this.render = function(data) {

			




	
	
	
		
 
	this.render = function(data,pad) {

			




	
	
	
		
 
		var idx = 1;

			




	
	
	
		
 
		var rela = document.getElementById('graph');

			




	
	
	
		
 
		var pad = 160;

			




	
	
	
		
 
		var pad = pad;

			




	
	
	
		
 
		var scale = 22;

			




	
	
	
		
 
		

			




	
	
	
		
 
		for (var i in data) {

			




	
	
	
		
 
			this.scale(scale);

			




	
	
	
		
 
			var row = document.getElementById("chg_"+idx);

			




	
	
	
		
 
			var	next = document.getElementById("chg_"+idx+1);

			




	
	
	
		
 
			var extra = 0;

			




	
	
	
		
 
			

			




	
	
	
		
 
			//skip this since i don't have DATE in my app

			




	
	
	
		
 
			//if (next.is('.changesets-date')) {

			




	
	
	
		
 
			//	extra = next.outerHeight();

			




	
	
	
		
 
			//}

			




	
	
	
		
 
						

			




	
	
	
		
 
			

			




	
	
	
		
 
			this.cell[1] += row.clientWidth;

			




	
	
	
		
 
			this.bg[1] += this.bg_height;

			




	
	
	
		
 
			

			




	
	
	
		
 
			cur = data[i];

			




	
	
	
		
 
			nodeid = cur[0];

			




	
	
	
		
 
			node = cur[1];

			




	
	
	
		
 
			in_l = cur[2];

			




	
	
	
		
 
			

			




	
	
	
		
 
			for (var j in in_l) {

			




	
	
	
		
 
				

			




	
	
	
		
 
				line = in_l[j];

			




	
	
	
		
 
				start = line[0];

			




	
	
	
		
 
				end = line[1];

			




	
	
	
		
 
				color = line[2];

			




	
	
	
		
 

			




	
	
	
		
 
				if (start > this.max_column) {

			




	
	
	
		
 
					this.max_column = start;

			




	
	
	
		
 
				}

			




	
	
	
		
 
				

			




	
	
	
		
 
				if (end > this.max_column) {

			




	
	
	
		
 
					this.max_column = end;

			




	
	
	
		
 
				}

			




	
	
	
		
 
				

			




	
	
	
		
 
				this.setColor(color, 0.0, 0.65);

			




	
	
	
		
 
				

			




	
	
	
		
 
				

			




	
	
	
		
 
				y = row.offsetTop-rela.offsetTop+4;

			




	
	
	
		
 
				x = pad-((this.cell[0] + this.box_size * start - 1) + this.bg_height-2);

			




	
	
	
		
 
				this.ctx.lineWidth=this.line_width;

			




	
	
	
		
 
				this.ctx.beginPath();

			




	
	
	
		
 
				this.ctx.moveTo(x, y);

			




	
	
	
		
 
				

			




	
	
	
		
 
				//i don't know why it's +1 just fixes some drawing graph.

			




	
	
	
		
 
				y += row.clientHeight+1;

			




	
	
	
		
 
				x = pad-((1 + this.box_size * end) + this.bg_height-2);

			




	
	
	
		
 
				this.ctx.lineTo(x,y+extra,3);

			




	
	
	
		
 
				this.ctx.stroke();

			




	
	
	
		
 
			}

			




	
	
	
		
 
			

			




	
	
	
		
 
			column = node[0]

			




	
	
	
		
 
			color = node[1]

			




	
	
	
		
 
			

			




	
	
	
		
 
			radius = this.dot_radius;

			




	
	
	
		
 
			y = row.offsetTop-rela.offsetTop+4;

			




	
	
	
		
 
			x = pad-(Math.round(this.cell[0] * scale/2 * column + radius) + 15 - (column*4));

			




	
	
	
		
 
		

			




	
	
	
		
 
			this.ctx.beginPath();

			




	
	
	
		
 
			this.setColor(color, 0.25, 0.75);

			




	
	
	
		
 
			this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);

			




	
	
	
		
 
			this.ctx.fill();

			




	
	
	
		
 
			

			




	
	
	
		
 
			idx++;

			




	
	
	
		
 
		}

			




	
	
	
		
 
				

			




	
	
	
		
 
	}

			




	
	
	
		
 

			




	
	
	
		
 
}

			




        

    


    
    

    

        

                

                    rhodecode/templates/changelog/changelog.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -46,120 +46,130 @@ ${c.repo_name} ${_('Changelog')} - ${c.r

			




	
	
	
		
 
					<div id="chg_${cnt+1}" class="container">

			




	
	
	
		
 
						<div class="left">

			




	
	
	
		
 
							<div class="date">

			




	
	
	
		
 
							${h.checkbox(cs.short_id,class_="changeset_range")}

			




	
	
	
		
 
							<span>${_('commit')} ${cs.revision}: ${h.short_id(cs.raw_id)}@${cs.date}</span>

			




	
	
	
		
 
							</div>

			




	
	
	
		
 
							<div class="author">

			




	
	
	
		
 
								<div class="gravatar">

			




	
	
	
		
 
									<img alt="gravatar" src="${h.gravatar_url(h.email(cs.author),20)}"/>

			




	
	
	
		
 
								</div>

			




	
	
	
		
 
								<span>${h.person(cs.author)}</span><br/>

			




	
	
	
		
 
								<span><a href="mailto:${h.email_or_none(cs.author)}">${h.email_or_none(cs.author)}</a></span><br/>

			




	
	
	
		
 
							</div>

			




	
	
	
		
 
							<div class="message">${h.link_to(h.wrap_paragraphs(cs.message),h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}</div>

			




	
	
	
		
 
						</div>	

			




	
	
	
		
 
						<div class="right">

			




	
	
	
		
 
									<div class="changes">

			




	
	
	
		
 
									   % if len(cs.affected_files) <= c.affected_files_cut_off:						

			




	
	
	
		
 
										<span class="removed tooltip" title="<b>${_('removed')}</b>${h.changed_tooltip(cs.removed)}">${len(cs.removed)}</span>

			




	
	
	
		
 
										<span class="changed tooltip" title="<b>${_('changed')}</b>${h.changed_tooltip(cs.changed)}">${len(cs.changed)}</span>

			




	
	
	
		
 
										<span class="added tooltip" title="<b>${_('added')}</b>${h.changed_tooltip(cs.added)}">${len(cs.added)}</span>

			




	
	
	
		
 
									   % else:

			




	
	
	
		
 
				                         <span class="removed tooltip" title="${_('affected %s files') % len(cs.affected_files)}">!</span>

			




	
	
	
		
 
				                         <span class="changed tooltip" title="${_('affected %s files') % len(cs.affected_files)}">!</span>

			




	
	
	
		
 
				                         <span class="added tooltip"   title="${_('affected %s files') % len(cs.affected_files)}">!</span>  									   

			




	
	
	
		
 
									   % endif

			




	
	
	
		
 
									</div>					

			




	
	
	
		
 
										%if len(cs.parents)>1:

			




	
	
	
		
 
										<div class="merge">

			




	
	
	
		
 
											${_('merge')}<img alt="merge" src="${h.url("/images/icons/arrow_join.png")}"/>

			




	
	
	
		
 
										</div>

			




	
	
	
		
 
										%endif

			




	
	
	
		
 
								   %if cs.parents:							

			




	
	
	
		
 
									%for p_cs in reversed(cs.parents):

			




	
	
	
		
 
										<div class="parent">${_('Parent')} ${p_cs.revision}: ${h.link_to(h.short_id(p_cs.raw_id),

			




	
	
	
		
 
											h.url('changeset_home',repo_name=c.repo_name,revision=p_cs.raw_id),title=p_cs.message)}

			




	
	
	
		
 
										</div>

			




	
	
	
		
 
									%endfor

			




	
	
	
		
 
								   %else:	

			




	
	
	
		
 
                                        <div class="parent">${_('No parents')}</div>   

			




	
	
	
		
 
                                   %endif  

			




	
	
	
		
 
                    									

			




	
	
	
		
 
								<span class="logtags">

			




	
	
	
		
 
									%if cs.branch:

			




	
	
	
		
 
									<span class="branchtag" title="${'%s %s' % (_('branch'),cs.branch)}">

			




	
	
	
		
 
									   ${h.link_to(cs.branch,h.url('files_home',repo_name=c.repo_name,revision=cs.raw_id))}</span>

			




	
	
	
		
 
									%endif

			




	
	
	
		
 
									%for tag in cs.tags:

			




	
	
	
		
 
										<span class="tagtag"  title="${'%s %s' % (_('tag'),tag)}">

			




	
	
	
		
 
										${h.link_to(tag,h.url('files_home',repo_name=c.repo_name,revision=cs.raw_id))}</span>

			




	
	
	
		
 
									%endfor

			




	
	
	
		
 
								</span>																	

			




	
	
	
		
 
						</div>				

			




	
	
	
		
 
					</div>

			




	
	
	
		
 
					

			




	
	
	
		
 
				%endfor

			




	
	
	
		
 
				<div class="pagination-wh pagination-left">

			




	
	
	
		
 
					${c.pagination.pager('$link_previous ~2~ $link_next')}

			




	
	
	
		
 
				</div>			

			




	
	
	
		
 
				</div>

			




	
	
	
		
 
			</div>

			




	
	
	
		
 
			

			




	
	
	
		
 
			<script type="text/javascript" src="${h.url('/js/graph.js')}"></script>

			




	
	
	
		
 
			<script type="text/javascript">

			




	
	
	
		
 
				YAHOO.util.Event.onDOMReady(function(){

			




	
	
	
		
 
					

			




	
	
	
		
 
                    //Monitor range checkboxes and build a link to changesets

			




	
	
	
		
 
                    //ranges

			




	
	
	
		
 
                    var checkboxes = YUD.getElementsByClassName('changeset_range');

			




	
	
	
		
 
                    var url_tmpl = "${h.url('changeset_home',repo_name=c.repo_name,revision='__REVRANGE__')}";

			




	
	
	
		
 
                    YUE.on(checkboxes,'click',function(e){      

			




	
	
	
		
 
                        var checked_checkboxes = [];

			




	
	
	
		
 
                        for (pos in checkboxes){

			




	
	
	
		
 
                            if(checkboxes[pos].checked){

			




	
	
	
		
 
                                checked_checkboxes.push(checkboxes[pos]);

			




	
	
	
		
 
                            }

			




	
	
	
		
 
                        }

			




	
	
	
		
 
                        if(checked_checkboxes.length>1){

			




	
	
	
		
 
                        	var rev_end = checked_checkboxes[0].name;

			




	
	
	
		
 
                        	var rev_start = checked_checkboxes[checked_checkboxes.length-1].name;

			




	
	
	
		
 
                        	

			




	
	
	
		
 
                            var url = url_tmpl.replace('__REVRANGE__',

			




	
	
	
		
 
                            		rev_start+'...'+rev_end);

			




	
	
	
		
 
                            

			




	
	
	
		
 
                        var link = "<a href="+url+">${_('Show selected changes __S -> __E')}</a>"

			




	
	
	
		
 
                        link = link.replace('__S',rev_start);

			




	
	
	
		
 
                        link = link.replace('__E',rev_end);

			




	
	
	
		
 
                        YUD.get('rev_range_container').innerHTML = link;

			




	
	
	
		
 
                        YUD.setStyle('rev_range_container','display','');

			




	
	
	
		
 
                        }

			




	
	
	
		
 
                        else{

			




	
	
	
		
 
                        	YUD.setStyle('rev_range_container','display','none');

			




	
	
	
		
 
                        	

			




	
	
	
		
 
                        }

			




	
	
	
		
 
                    });					

			




	
	
	
		
 
					

			




	
	
	
		
 
					function set_canvas() {

			




	
	
	
		
 
					function set_canvas(heads) {

			




	
	
	
		
 
						var c = document.getElementById('graph_nodes');

			




	
	
	
		
 
						var t = document.getElementById('graph_content');

			




	
	
	
		
 
						canvas = document.getElementById('graph_canvas');

			




	
	
	
		
 
						var div_h = t.clientHeight;

			




	
	
	
		
 
						c.style.height=div_h+'px';

			




	
	
	
		
 
						canvas.setAttribute('height',div_h);

			




	
	
	
		
 
						canvas.setAttribute('width',160);

			




	
	
	
		
 
						c.style.height=max_w+'px';

			




	
	
	
		
 
						canvas.setAttribute('width',max_w);

			




	
	
	
		
 
					};

			




	
	
	
		
 
					set_canvas();

			




	
	
	
		
 
					var heads = 1;

			




	
	
	
		
 
					var max_heads = 0;

			




	
	
	
		
 
					var jsdata = ${c.jsdata|n};

			




	
	
	
		
 
					

			




	
	
	
		
 
					for( var i=0;i<jsdata.length;i++){

			




	
	
	
		
 
					    var m = Math.max.apply(Math, jsdata[i][1]);

			




	
	
	
		
 
					    if (m>max_heads){

			




	
	
	
		
 
					        max_heads = m;

			




	
	
	
		
 
					    }

			




	
	
	
		
 
					}

			




	
	
	
		
 
					var max_w = Math.max(100,max_heads*25);

			




	
	
	
		
 
					set_canvas(max_w);

			




	
	
	
		
 
					

			




	
	
	
		
 
					var r = new BranchRenderer();

			




	
	
	
		
 
					r.render(jsdata);

			




	
	
	
		
 
					

			




	
	
	
		
 

			




	
	
	
		
 
					r.render(jsdata,max_w);

			




	
	
	
		
 
					

			




	
	
	
		
 
				});

			




	
	
	
		
 
			</script>

			




	
	
	
		
 
		%else:

			




	
	
	
		
 
			${_('There are no changes yet')}

			




	
	
	
		
 
		%endif  

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
</div>    

			




	
	
	
		
 
</%def>

			




	
	
		
 
\ No newline at end of file

			




        

    



    


    



    



      

      





    
    0 comments (0 inline, 0 general)
    





    


  

  







  


    




    








    
        
    
    
        This site is powered by
            Kallithea 0.7.0,
        which is
        © 2010–2025 by various authors & licensed under GPLv3.