diff mercurial/templates/static/mercurial.js @ 16138:6e4de55a41a4

hgweb: refactor graph customization javascript - Avoid flipping lineWidth state around the edge() call, pass it to the function instead. - Pass the line width and color appended to the other parameters instead of in a dictionary. The javascript code is simpler, no need to check for all containers existence, and the JSON output is smaller. - Reindent setColor() comments and fix code spacing.
author Patrick Mezard <patrick@mezard.eu>
date Sun, 22 Jan 2012 19:35:26 +0700
parents 8fd18eb8aab7
children fa714f3ed298
line wrap: on
line diff
--- a/mercurial/templates/static/mercurial.js	Fri Feb 17 16:49:43 2012 +0100
+++ b/mercurial/templates/static/mercurial.js	Sun Jan 22 19:35:26 2012 +0700
@@ -58,16 +58,17 @@
 		
 		// Set the colour.
 		//
-		// If color is hex string "FFFFFF" then append sharp and apply as is 
-		// If color is number
-		// picks a distinct colour based on an internal wheel; the bg
-		// parameter provides the value that should be assigned to the 'zero'
-		// colours and the fg parameter provides the multiplier that should be
-		// applied to the foreground colours.
+		// If color is a string, expect an hexadecimal RGB
+		// value and apply it unchanged. If color is a number,
+		// pick a distinct colour based on an internal wheel;
+		// the bg parameter provides the value that should be
+		// assigned to the 'zero' colours and the fg parameter
+		// provides the multiplier that should be applied to
+		// the foreground colours.
 		var s;
-		if(typeof color == "string"){
-			s = "#"+color;
-		}else{ //typeof color == "number"
+		if(typeof color == "string") {
+			s = "#" + color;
+		} else { //typeof color == "number"
 			color %= colors.length;
 			var red = (colors[color][0] * fg) || bg;
 			var green = (colors[color][1] * fg) || bg;
@@ -83,9 +84,11 @@
 		
 	}
 
-	this.edge = function(x0, y0, x1, y1, color) {
+	this.edge = function(x0, y0, x1, y1, color, width) {
 		
 		this.setColor(color, 0.0, 0.65);
+		if(width >= 0)
+			 this.ctx.lineWidth = width;
 		this.ctx.beginPath();
 		this.ctx.moveTo(x0, y0);
 		this.ctx.lineTo(x1, y1);
@@ -109,13 +112,20 @@
 			var edges = cur[2];
 			var fold = false;
 			
+			var prevWidth = this.ctx.lineWidth;
 			for (var j in edges) {
 				
 				line = edges[j];
 				start = line[0];
 				end = line[1];
 				color = line[2];
-
+				var width = line[3];
+				if(width < 0)
+					 width = prevWidth;
+				var branchcolor = line[4];
+				if(branchcolor)
+					color = branchcolor;
+				
 				if (end > this.columns || start > this.columns) {
 					this.columns += 1;
 				}
@@ -128,17 +138,11 @@
 				y0 = this.bg[1] - this.bg_height / 2;
 				x1 = this.cell[0] + this.box_size * end + this.box_size / 2;
 				y1 = this.bg[1] + this.bg_height / 2;
-				// Width if exists
-				if(line[3] && line[3]['width']){
-					this.ctx.lineWidth = line[3]['width'];
-				}
-				// Color if exists
-				if(line[3] && line[3]['color']){
-					color = line[3]['color'];
-				}
-				this.edge(x0, y0, x1, y1, color);
-				this.ctx.lineWidth = 1;
+				
+				this.edge(x0, y0, x1, y1, color, width);
+				
 			}
+			this.ctx.lineWidth = prevWidth;
 			
 			// Draw the revision node in the right column