Changeset - dba66b0768f4
[Not reviewed]
default
0 4 0
Mads Kiilerich - 11 years ago 2015-01-21 17:35:11
madski@unity3d.com
graph: don't hardcode chg_ prefix ... and just assume canvas and table are aligned
4 files changed with 17 insertions and 18 deletions:
0 comments (0 inline, 0 general)
kallithea/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(canvas_id, content_id) {
 

	
 
function BranchRenderer(canvas_id, content_id, row_id_prefix) {
 
	// canvas_id is canvas to render into
 
	// content_id's height is applied to canvas
 
	// row_id_prefix is prefix that is applied to get row id's
 
	this.canvas = document.getElementById(canvas_id);
 
	var t = document.getElementById(content_id);
 
	var content = document.getElementById(content_id);
 
	
 
	if (!document.createElement("canvas").getContext)
 
		this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);
 
	if (!this.canvas) { // canvas creation did for some reason fail - fail silently
 
		this.render = function(data,canvasWidth) {};
 
		return;
 
	}
 
	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.line_width = 2.0;
 
	this.dot_radius = 3.5;
 
	this.close_x = 1.5 * this.dot_radius;
 
	this.close_y = 0.5 * this.dot_radius;
 

	
 
	this.calcColor = 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 + ')';
 
		return s;
 
	}
 

	
 
	this.setColor = function(color, bg, fg) {
 
		var s = this.calcColor(color, bg, fg);
 
		this.ctx.strokeStyle = s;
 
		this.ctx.fillStyle = s;
 
	}
 

	
 
	this.render = function(data,canvasWidth) {
 
		var idx = 1;
 
		var rela = this.canvas;
 

	
 
		this.canvas.setAttribute('width',canvasWidth);
 
		this.canvas.setAttribute('height',t.clientHeight);
 
		this.canvas.setAttribute('height',content.clientHeight);
 

	
 
		var lineCount = 1;
 
		for (var i=0;i<data.length;i++) {
 
			var in_l = data[i][1];
 
			for (var j in in_l) {
 
				var m = in_l[j][0];
 
				if (m > lineCount)
 
					lineCount = m;
 
			}
 
		}
 

	
 
		var edge_pad = this.dot_radius + 2;
 
		var box_size = Math.min(18, Math.floor((canvasWidth - edge_pad*2)/(lineCount)));
 
		var base_x = canvasWidth - edge_pad;
 

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

	
 
			var row = document.getElementById("chg_"+idx);
 
			var row = document.getElementById(row_id_prefix+idx);
 
			if (row == null) {
 
				console.log("error: row chg_"+idx+" not found");
 
				console.log("error: row "+row_id_prefix+idx+" not found");
 
				continue;
 
			}
 
			var	next = document.getElementById("chg_"+(idx+1));
 
			var next = document.getElementById(row_id_prefix+(idx+1));
 
			var extra = 0;
 
			
 
			cur = data[i];
 
			node = cur[0];
 
			in_l = cur[1];
 
			closing = cur[2];
 

	
 
			var rowY = row.offsetTop + row.offsetHeight/2 - rela.offsetTop;
 
			var nextY = (next == null) ? rowY + row.offsetHeight/2 : next.offsetTop + next.offsetHeight/2 - rela.offsetTop;
 
			var rowY = row.offsetTop + row.offsetHeight/2;
 
			var nextY = (next == null) ? rowY + row.offsetHeight/2 : next.offsetTop + next.offsetHeight/2;
 

	
 
			for (var j in in_l) {
 
				line = in_l[j];
 
				start = line[0];
 
				end = line[1];
 
				color = line[2];
 
				
 
				x = base_x - box_size * start;
 

	
 
				// figure out if this is a dead-end;
 
				// we want to fade away this line
 
				var dead_end = true;
 
				if (next != null) {
 
					nextdata = data[i+1];
 
					next_l = nextdata[1];
 
					for (var k=0; k < next_l.length; ++k) {
 
						if (next_l[k][0] == end) {
 
							dead_end = false;
 
							break;
 
						}
 
					}
 
					if (nextdata[0][0] == end) // this is a root - not a dead end
 
						dead_end = false;
 
				}
 
@@ -128,49 +128,48 @@ function BranchRenderer(canvas_id, conte
 
					gradient.addColorStop(0,this.calcColor(color, 0.0, 0.65));
 
					gradient.addColorStop(1,this.calcColor(color, 1.0, 0.0));
 
					this.ctx.strokeStyle = gradient;
 
					this.ctx.fillStyle = gradient;
 
				}
 
				// if this is a merge of differently
 
				// colored line, make it a gradient towards
 
				// the merged color
 
				else if (color != node[1] && start == node[0])
 
				{
 
					var gradient = this.ctx.createLinearGradient(x,rowY,x,nextY);
 
					gradient.addColorStop(0,this.calcColor(node[1], 0.0, 0.65));
 
					gradient.addColorStop(1,this.calcColor(color, 0.0, 0.65));
 
					this.ctx.strokeStyle = gradient;
 
					this.ctx.fillStyle = gradient;
 
				}
 
				else
 
				{
 
					this.setColor(color, 0.0, 0.65);
 
				}
 
				
 
				this.ctx.lineWidth=this.line_width;
 
				this.ctx.beginPath();
 
				this.ctx.moveTo(x, rowY);
 

	
 
				if (start == end)
 
				{
 
					this.ctx.lineTo(x,nextY+extra,3);
 
				}
 
				else
 
				{
 
					var x2 = base_x - box_size * end;
 
					var ymid = (rowY+nextY) / 2;
 
					this.ctx.bezierCurveTo (x,ymid,x2,ymid,x2,nextY);
 
				}
 
				this.ctx.stroke();
 
			}
 
			
 
			column = node[0];
 
			color = node[1];
 
			
 
			x = base_x - box_size * column;
 
		
 
			this.setColor(color, 0.25, 0.75);
 
			if (closing)
 
			{
 
				this.ctx.fillRect(x - this.close_x, rowY - this.close_y, 2*this.close_x, 2*this.close_y);
 
			}
 
			else
kallithea/templates/changelog/changelog.html
Show inline comments
 
@@ -144,49 +144,49 @@ ${self.repo_context_bar('changelog', c.f
 
                                            ${h.link_to(tag,h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}
 
                                        </div>
 
                                    %endfor
 
                                    %if (not c.branch_name) and cs.branch:
 
                                        <div class="branchtag" title="${_('Branch %s' % cs.branch)}">
 
                                            ${h.link_to(cs.branch,h.url('changelog_home',repo_name=c.repo_name,branch=cs.branch))}
 
                                        </div>
 
                                    %endif
 
                                </div>
 
                            </div>
 
                        </td>
 
                    </tr>
 
                %endfor
 
                </tbody>
 
                </table>
 

	
 
                </div>
 

	
 
                <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" src="${h.url('/js/graph.js', ver=c.kallithea_version)}"></script>
 
        <script type="text/javascript">
 
            $(document).ready(function(){
 
                //Monitor range checkboxes and build a link to changesets ranges
 
                var checkboxes = YUD.getElementsByClassName('changeset_range');
 
                // register extra routes needed for this view
 
                pyroutes.register('changeset_home', "${h.url('changeset_home', repo_name='%(repo_name)s', revision='%(revision)s')}", ['repo_name', 'revision']);
 

	
 
                var checkbox_checker = function(e){
 
                    var checked_checkboxes = [];
 
                    for (pos in checkboxes){
 
                        if(checkboxes[pos].checked){
 
                            checked_checkboxes.push(checkboxes[pos]);
 
                        }
 
                    }
 
                    if(YUD.get('open_new_pr')){
 
                        if(checked_checkboxes.length>1){
 
                            YUD.setStyle('open_new_pr','display','none');
 
                        } else {
 
                            YUD.setStyle('open_new_pr','display','');
 
                            if(checked_checkboxes.length>0){
 
                                YUD.get('open_new_pr').innerHTML = _TM['Open New Pull Request for Selected Changesets'];
 
                            }else{
 
                                YUD.get('open_new_pr').innerHTML = _TM['Open New Pull Request'];
 
                            }
 
@@ -263,35 +263,35 @@ ${self.repo_context_bar('changelog', c.f
 
                    $('#C-'+cid).toggleClass('expanded');
 

	
 
                    //redraw the graph, r and jsdata are bound outside function
 
                    r.render(jsdata,100);
 
                });
 

	
 
                // change branch filter
 
                $("#branch_filter").select2({
 
                    dropdownAutoWidth: true,
 
                    minimumInputLength: 1
 
                    });
 

	
 
                $("#branch_filter").change(function(e){
 
                    var selected_branch = e.currentTarget.options[e.currentTarget.selectedIndex].value;
 
                    if(selected_branch != ''){
 
                        window.location = pyroutes.url('changelog_home', {'repo_name': '${c.repo_name}',
 
                                                                          'branch': selected_branch});
 
                    }else{
 
                        window.location = pyroutes.url('changelog_home', {'repo_name': '${c.repo_name}'});
 
                    }
 
                    $("#changelog").hide();
 
                });
 

	
 
                var jsdata = ${c.jsdata|n};
 
                var r = new BranchRenderer('graph_canvas', 'graph_content');
 
                var r = new BranchRenderer('graph_canvas', 'graph_content', 'chg_');
 
                r.render(jsdata,100);
 
            });
 

	
 
        </script>
 
        %else:
 
            ${_('There are no changes yet')}
 
        %endif
 
    </div>
 
</div>
 
</%def>
kallithea/templates/compare/compare_cs.html
Show inline comments
 
@@ -71,49 +71,49 @@
 
        ${_('Common ancestor')}:
 
        %if c.ancestor:
 
        ${h.link_to(h.short_id(c.ancestor),h.url('changeset_home',repo_name=c.repo_name,revision=c.ancestor))}
 
        %else:
 
        ${_('No common ancestor found - repositories are unrelated')}
 
        %endif
 
      </div>
 
    %endif
 
    %if c.cs_ranges_org is not None:
 
      ## TODO: list actual changesets?
 
      <div style="font-size:1.1em;font-weight: bold;clear:both;padding-top:10px">
 
        ${h.link_to_ref(c.cs_repo.repo_name, c.cs_ref_type, c.cs_ref_name, c.cs_rev)}
 
        ${_('is')}
 
        <a href="${c.swap_url}">${_('%s changesets') % (len(c.cs_ranges_org))}</a>
 
        ${_('behind')}
 
        ${h.link_to_ref(c.a_repo.repo_name, c.a_ref_type, c.a_ref_name)}
 
      </div>
 
    %endif
 
  %endif
 
</div>
 

	
 
%if c.as_form:
 
<div id="jsdata" style="display:none">${c.jsdata|n}</div>
 
%else:
 
<script type="text/javascript" src="${h.url('/js/graph.js')}"></script>
 
<script type="text/javascript" src="${h.url('/js/graph.js', ver=c.kallithea_version)}"></script>
 
%endif
 

	
 
<script type="text/javascript">
 

	
 
    $(document).ready(function(){
 
%if not c.as_form:
 
        var jsdata = ${c.jsdata|n};
 
        var r = new BranchRenderer('graph_canvas', 'graph_content_pr');
 
        var r = new BranchRenderer('graph_canvas', 'graph_content_pr', 'chg_');
 
        r.render(jsdata,100);
 
%endif
 

	
 
        $('.expand_commit').click(function(e){
 
            var cid = $(this).attr('commit_id');
 
            $('#C-'+cid).toggleClass('expanded');
 
            r.render(jsdata,100);
 
        });
 

	
 
        $('.gravatar').click(function(e){
 
            var cid = $(this).attr('commit_id');
 
            $('#row-'+cid).toggleClass('hl', !$('#row-'+cid).hasClass('hl'));
 
        });
 
    });
 

	
 
</script>
kallithea/templates/pullrequests/pullrequest.html
Show inline comments
 
@@ -117,49 +117,49 @@ ${self.repo_context_bar('showpullrequest
 
              <div class='ac'>
 
                <div class="reviewer_ac">
 
                   ${h.text('user', class_='yui-ac-input',placeholder=_('Type name of reviewer to add'))}
 
                   <div id="reviewers_container"></div>
 
                </div>
 
              </div>
 
            </div>
 
        </div>
 

	
 
        <div style="clear:both;padding: 0 0 30px 0;"></div>
 

	
 
        <h4>${_('Changesets')}</h4>
 
        <div style="float:left;padding:0px 30px 30px 30px">
 
           ## overview pulled by ajax
 
           <div style="float:left" id="pull_request_overview"></div>
 
        </div>
 
        <div style="clear:both;"></div>
 

	
 
    </div>
 

	
 
    ${h.end_form()}
 

	
 
</div>
 

	
 
<script type="text/javascript" src="${h.url('/js/graph.js')}"></script>
 
<script type="text/javascript" src="${h.url('/js/graph.js', ver=c.kallithea_version)}"></script>
 
<script type="text/javascript">
 
  var _USERS_AC_DATA = ${c.users_array|n};
 
  var _GROUPS_AC_DATA = ${c.user_groups_array|n};
 
  PullRequestAutoComplete('user', 'reviewers_container', _USERS_AC_DATA, _GROUPS_AC_DATA);
 

	
 
  pyroutes.register('pullrequest_repo_info', "${url('pullrequest_repo_info',repo_name='%(repo_name)s')}", ['repo_name']);
 

	
 
  var pendingajax = undefined;
 
  var otherrepoChanged = function(){
 
      var $other_ref = $('#other_ref');
 
      $other_ref.prop('disabled', true);
 
      var repo_name = $('#other_repo').val();
 
      if (pendingajax) {
 
          pendingajax.abort();
 
          pendingajax = undefined;
 
      }
 
      pendingajax = ajaxGET(pyroutes.url('pullrequest_repo_info', {"repo_name": repo_name}),
 
          function(data){
 
              pendingajax = undefined;
 
              $('#other_repo_desc').html(data.description);
 

	
 
              // replace options of other_ref with the ones for the current other_repo
 
              $other_ref.empty();
 
              for(var i = 0; i < data.refs.length; i++)
 
@@ -209,49 +209,49 @@ ${self.repo_context_bar('showpullrequest
 
      $('#org_rev_span').html(org_ref[2].substr(0,12));
 

	
 
      var other_repo = $('#pull_request_form #other_repo').val();
 
      var other_ref = $('#pull_request_form #other_ref').val().split(':');
 
      $('#other_rev_span').html(other_ref[2].substr(0,12));
 

	
 
      var rev_data = {
 
          '__org_repo__': org_repo,
 
          '__org_ref_name__': org_ref[2],
 
          '__other_repo__': other_repo,
 
          '__other_ref_name__': other_ref[2]
 
      }; // gather the org/other ref and repo here
 

	
 
      for (k in rev_data){
 
          url = url.replace(k,rev_data[k]);
 
      }
 

	
 
      if (pendingajax) {
 
          pendingajax.abort();
 
          pendingajax = undefined;
 
      }
 
      pendingajax = asynchtml(url, $('#pull_request_overview'), function(o){
 
          pendingajax = undefined;
 
          var jsdata = eval('('+YUD.get('jsdata').innerHTML+')'); // TODO: just get json
 
          var r = new BranchRenderer('graph_canvas', 'graph_content_pr');
 
          var r = new BranchRenderer('graph_canvas', 'graph_content_pr', 'chg_');
 
          r.render(jsdata,100);
 
      });
 
  }
 

	
 
  $(document).ready(function(){
 
      $("#org_repo").select2({
 
          dropdownAutoWidth: true
 
      });
 
      ## (org_repo can't change)
 

	
 
      $("#org_ref").select2({
 
          dropdownAutoWidth: true
 
      });
 
      $("#org_ref").on("change", function(e){
 
          loadPreview();
 
      });
 

	
 
      $("#other_repo").select2({
 
          dropdownAutoWidth: true
 
      });
 
      $("#other_repo").on("change", function(e){
 
          otherrepoChanged();
 
      });
 

	
0 comments (0 inline, 0 general)