changeset 6288:48a96c4059df

js: set canvas width dynamically based on parent width
author domruf <dominikruf@gmail.com>
date Wed, 21 Sep 2016 21:29:23 +0200
parents 00b5a1bf6d09
children 68d3315c48d4
files kallithea/public/css/style.css kallithea/public/js/graph.js kallithea/templates/changelog/changelog.html kallithea/templates/compare/compare_cs.html kallithea/templates/pullrequests/pullrequest.html kallithea/templates/pullrequests/pullrequest_show.html
diffstat 6 files changed, 13 insertions(+), 11 deletions(-) [+]
line wrap: on
line diff
--- a/kallithea/public/css/style.css	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/public/css/style.css	Wed Sep 21 21:29:23 2016 +0200
@@ -2064,6 +2064,7 @@
 
 #graph_nodes {
     position: absolute;
+    width: 100px;
 }
 
 #graph_content,
--- a/kallithea/public/js/graph.js	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/public/js/graph.js	Wed Sep 21 21:29:23 2016 +0200
@@ -32,7 +32,7 @@
 	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) {};
+		this.render = function(data) {};
 		return;
 	}
 	this.ctx = this.canvas.getContext('2d');
@@ -62,8 +62,9 @@
 		this.ctx.fillStyle = s;
 	}
 
-	this.render = function(data,canvasWidth) {
+	this.render = function(data) {
 		var idx = 1;
+		var canvasWidth = $(this.canvas).parent().width();
 
 		this.canvas.setAttribute('width',canvasWidth);
 		this.canvas.setAttribute('height',content.clientHeight);
--- a/kallithea/templates/changelog/changelog.html	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/templates/changelog/changelog.html	Wed Sep 21 21:29:23 2016 +0200
@@ -272,14 +272,14 @@
                 checkbox_checker();
                 $checkboxes.click(function() {
                     checkbox_checker();
-                    r.render(jsdata,100);
+                    r.render(jsdata);
                 });
                 $('#singlerange').click(checkbox_checker);
 
                 $('#rev_range_clear').click(function(e){
                     $checkboxes.prop('checked', false);
                     checkbox_checker();
-                    r.render(jsdata,100);
+                    r.render(jsdata);
                 });
 
                 var $msgs = $('.message');
@@ -302,7 +302,7 @@
                     $('#C-'+cid).toggleClass('expanded');
 
                     //redraw the graph, r and jsdata are bound outside function
-                    r.render(jsdata,100);
+                    r.render(jsdata);
                 });
 
                 // change branch filter
@@ -325,7 +325,7 @@
 
                 var jsdata = ${c.jsdata|n};
                 var r = new BranchRenderer('graph_canvas', 'graph_content', 'chg_');
-                r.render(jsdata,100);
+                r.render(jsdata);
             });
 
         </script>
--- a/kallithea/templates/compare/compare_cs.html	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/templates/compare/compare_cs.html	Wed Sep 21 21:29:23 2016 +0200
@@ -127,13 +127,13 @@
 %if not c.as_form:
         var jsdata = ${c.jsdata|n};
         var r = new BranchRenderer('graph_canvas', 'graph_content_pr', 'chg_');
-        r.render(jsdata,100);
+        r.render(jsdata);
 %endif
 
         $('.expand_commit').click(function(e){
             var cid = $(this).attr('commit_id');
             $('#C-'+cid).toggleClass('expanded');
-            r.render(jsdata,100);
+            r.render(jsdata);
         });
 
         $('.gravatar').click(function(e){
--- a/kallithea/templates/pullrequests/pullrequest.html	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/templates/pullrequests/pullrequest.html	Wed Sep 21 21:29:23 2016 +0200
@@ -184,7 +184,7 @@
           pendingajax = undefined;
           var jsdata = eval('('+$('#jsdata').html()+')'); // TODO: just get json
           var r = new BranchRenderer('graph_canvas', 'graph_content_pr', 'chg_');
-          r.render(jsdata,100);
+          r.render(jsdata);
       });
   }
 
--- a/kallithea/templates/pullrequests/pullrequest_show.html	Mon Oct 31 22:39:39 2016 +0100
+++ b/kallithea/templates/pullrequests/pullrequest_show.html	Wed Sep 21 21:29:23 2016 +0200
@@ -154,7 +154,7 @@
               <div class="msg-div">${c.update_msg}</div>
               %if c.avail_revs:
               <div id="updaterevs" style="max-height:200px; overflow-y:auto; overflow-x:hidden; margin-bottom: 10px; padding: 1px 0">
-                <div style="height:0">
+                <div style="height:0;width:40px">
                   <canvas id="avail_graph_canvas" style="width:0"></canvas>
                 </div>
                 <table id="updaterevs-table" class="noborder" style="padding-left:50px">
@@ -373,7 +373,7 @@
 
           var avail_jsdata = ${c.avail_jsdata|n};
           var avail_r = new BranchRenderer('avail_graph_canvas', 'updaterevs-table', 'chg_available_');
-          avail_r.render(avail_jsdata,40);
+          avail_r.render(avail_jsdata);
 
           move_comments($(".comments .comments-list-chunk"));