gauge updated to dist file

2 files changed, 141 insertions, 67 deletions

diff --git a/debian/copyright b/debian/copyright
index 625a019e..34a9ed5f 100644
--- a/debian/copyright
+++ b/debian/copyright
@@ -92,8 +92,8 @@ Copyright: 2014 Dan Vanderkam <danvdk@gmail.com>
 License: Expat
 
 Files:
- web/lib/gauge-d5260c3.min.js
- debian/missing-sources/gauge-d5260c3.coffee
+ web/lib/gauge-1.3.2.min.js
+ debian/missing-sources/gauge-1.3.2.coffee
 Copyright: 2016 Bernard Kobos <bkobos@extensa.pl>
 License: Expat
 
diff --git a/debian/missing-sources/gauge-d5260c3.coffee b/debian/missing-sources/gauge-1.3.2.coffee
index d7366f44..0121446c 100644
--- a/debian/missing-sources/gauge-d5260c3.coffee
+++ b/debian/missing-sources/gauge-1.3.2.coffee
@@ -60,13 +60,10 @@ secondsToString = (sec) ->
 	hr = if hr then hr + ':' else ''
 	return hr + min + ':' + sec
 
-formatNumber = (num) ->
-		return addCommas(num.toFixed(0))
-
-updateObjectValues = (obj1, obj2) ->
-	for own key, val of obj2
-		obj1[key] = val
-	return obj1
+formatNumber = (num...) ->
+	value = num[0]
+	digits = 0 || num[1]
+	return addCommas(value.toFixed(digits))
 
 mergeObjects = (obj1, obj2) ->
 	out = {}
@@ -115,8 +112,8 @@ class ValueUpdater
 class BaseGauge extends ValueUpdater
 	displayScale: 1
 
-	setTextField: (textField) ->
-		@textField = if textField instanceof TextRenderer then textField else new TextRenderer(textField)
+	setTextField: (textField, fractionDigits) ->
+		@textField = if textField instanceof TextRenderer then textField else new TextRenderer(textField, fractionDigits)
 
 	setMinValue: (@minValue, updateStartValue=true) ->
 		if updateStartValue
@@ -130,7 +127,7 @@ class BaseGauge extends ValueUpdater
 			@textField.el.style.fontSize = options.fontSize + 'px'
 
 		if @options.angle > .5
-			@gauge.options.angle = .5
+			@options.angle = .5
 		@configDisplayScale()
 		return @
 
@@ -162,11 +159,11 @@ class BaseGauge extends ValueUpdater
 		return @
 
 class TextRenderer
-	constructor: (@el) ->
+	constructor: (@el, @fractionDigits) ->
 
 	# Default behaviour, override to customize rendering
 	render: (gauge) ->
-		@el.innerHTML = formatNumber(gauge.displayedValue)
+		@el.innerHTML = formatNumber(gauge.displayedValue, @fractionDigits)
 
 class AnimatedText extends ValueUpdater
 	displayedValue: 0
@@ -208,8 +205,8 @@ class GaugePointer extends ValueUpdater
 		@setOptions()
 
 	setOptions: (options=null) ->
-		updateObjectValues(@options, options)
-		@length = @canvas.height * @options.length
+		@options = mergeObjects(@options, options)
+		@length = 2*@gauge.radius * @gauge.options.radiusScale * @options.length
 		@strokeWidth = @canvas.height * @options.strokeWidth
 		@maxValue = @gauge.maxValue
 		@minValue = @gauge.minValue
@@ -218,22 +215,20 @@ class GaugePointer extends ValueUpdater
 
 	render: () ->
 		angle = @gauge.getAngle.call(@, @displayedValue)
-		centerX = @canvas.width / 2
-		centerY = @canvas.height * 0.9
 
-		x = Math.round(centerX + @length * Math.cos(angle))
-		y = Math.round(centerY + @length * Math.sin(angle))
+		x = Math.round(@length * Math.cos(angle))
+		y = Math.round(@length * Math.sin(angle))
 
-		startX = Math.round(centerX + @strokeWidth * Math.cos(angle - Math.PI/2))
-		startY = Math.round(centerY + @strokeWidth * Math.sin(angle - Math.PI/2))
+		startX = Math.round(@strokeWidth * Math.cos(angle - Math.PI/2))
+		startY = Math.round(@strokeWidth * Math.sin(angle - Math.PI/2))
 
-		endX = Math.round(centerX + @strokeWidth * Math.cos(angle + Math.PI/2))
-		endY = Math.round(centerY + @strokeWidth * Math.sin(angle + Math.PI/2))
+		endX = Math.round(@strokeWidth * Math.cos(angle + Math.PI/2))
+		endY = Math.round(@strokeWidth * Math.sin(angle + Math.PI/2))
 
 		@ctx.fillStyle = @options.color
 		@ctx.beginPath()
 
-		@ctx.arc(centerX, centerY, @strokeWidth, 0, Math.PI*2, true)
+		@ctx.arc(0, 0, @strokeWidth, 0, Math.PI*2, true)
 		@ctx.fill()
 
 		@ctx.beginPath()
@@ -271,6 +266,7 @@ class Gauge extends BaseGauge
 	displayedAngle: 0
 	displayedValue: 0
 	lineWidth: 40
+	paddingTop: 0.1
 	paddingBottom: 0.1
 	percentColors: null,
 	options:
@@ -283,15 +279,23 @@ class Gauge extends BaseGauge
 			strokeWidth: 0.035
 		angle: 0.15
 		lineWidth: 0.44
+		radiusScale: 1.0
 		fontSize: 40
 		limitMax: false
+		limitMin: false
 
 	constructor: (@canvas) ->
 		super()
 		@percentColors = null
+		@forceUpdate = true
 		if typeof G_vmlCanvasManager != 'undefined'
 			@canvas = window.G_vmlCanvasManager.initElement(@canvas)
 		@ctx = @canvas.getContext('2d')
+		# Set canvas size to parent size
+		h = @canvas.clientHeight;
+		w = @canvas.clientWidth;
+		@canvas.height = h;
+		@canvas.width = w;
 		@gp = [new GaugePointer(@)]
 		@setOptions()
 		@render()
@@ -299,10 +303,15 @@ class Gauge extends BaseGauge
 	setOptions: (options=null) ->
 		super(options)
 		@configPercentColors()
-		@lineWidth = @canvas.height * (1 - @paddingBottom) * @options.lineWidth # .2 - .7
-		@radius = @canvas.height * (1 - @paddingBottom) - @lineWidth
+		@extraPadding = 0
+		if @options.angle < 0
+			phi = Math.PI*(1 + @options.angle)
+			@extraPadding = Math.sin(phi)
+		@availableHeight = @canvas.height * (1 - @paddingTop - @paddingBottom)
+		@lineWidth = @availableHeight * @options.lineWidth # .2 - .7
+		@radius = (@availableHeight - @lineWidth/2) / (1.0 + @extraPadding)
 		@ctx.clearRect(0, 0, @canvas.width, @canvas.height)
-		@render()
+		# @render()
 		for gauge in @gp
 			gauge.setOptions(@options.pointer)
 			gauge.render()
@@ -319,32 +328,43 @@ class Gauge extends BaseGauge
 				@percentColors[i] = { pct: @options.percentColors[i][0], color: { r: rval, g: gval, b: bval  } }
 
 	set: (value) ->
-
 		if not (value instanceof Array)
 			value = [value]
 		# check if we have enough GaugePointers initialized
 		# lazy initialization
 		if value.length > @gp.length
 			for i in [0...(value.length - @gp.length)]
-				@gp.push(new GaugePointer(@))
+				gp = new GaugePointer(@)
+				gp.setOptions(@options.pointer)
+				@gp.push(gp)
+		else if value.length < @gp.length
+			# Delete redundant GaugePointers
+			@gp = @gp.slice(@gp.length-value.length)
 
 		# get max value and update pointer(s)
 		i = 0
-		max_hit = false
 
 		for val in value
+			# Limit pointer within min and max?
 			if val > @maxValue
-					@maxValue = @value * 1.1
-					max_hit = true
+				if @options.limitMax
+					val = @maxValue
+				else
+					@maxValue = val + 1
+
+			else if val < @minValue
+				if @options.limitMin
+					val = @minValue
+				else
+					@minValue = val - 1
+
 			@gp[i].value = val
-			@gp[i++].setOptions({maxValue: @maxValue, angle: @options.angle})
-		@value = value[value.length - 1] # TODO: Span maybe??
+			@gp[i++].setOptions({minValue: @minValue, maxValue: @maxValue, angle: @options.angle})
+		@value = Math.max(Math.min(value[value.length - 1], @maxValue), @minValue) # TODO: Span maybe??
 
-		if max_hit
-			unless @options.limitMax
-				AnimationUpdater.run()
-		else
-			AnimationUpdater.run()
+		# Force first .set()
+		AnimationUpdater.run(@forceUpdate)
+		@forceUpdate = false
 
 	getAngle: (value) ->
 		return (1 + @options.angle) * Math.PI + ((value - @minValue) / (@maxValue - @minValue)) * (1 - @options.angle * 2) * Math.PI
@@ -358,7 +378,7 @@ class Gauge extends BaseGauge
 				if (pct <= @percentColors[i].pct)
 					if grad == true
 						# Gradually change between colors
-						startColor = @percentColors[i - 1]
+						startColor = @percentColors[i - 1] || @percentColors[0]
 						endColor = @percentColors[i]
 						rangePct = (pct - startColor.pct) / (endColor.pct - startColor.pct)  # How far between both colors
 						color = {
@@ -375,41 +395,94 @@ class Gauge extends BaseGauge
 		pct = (val - @minValue) / (@maxValue - @minValue)
 		return @getColorForPercentage(pct, grad);
 
+	renderStaticLabels: (staticLabels, w, h, radius) ->
+		@ctx.save()
+		@ctx.translate(w, h)
+
+		# Scale font size the hard way - assuming size comes first.
+		font = staticLabels.font or "10px Times"
+		re = /\d+\.?\d?/
+		match = font.match(re)[0]
+		rest = font.slice(match.length);
+		fontsize = parseFloat(match) * this.displayScale;
+		@ctx.font = fontsize + rest;
+		@ctx.fillStyle = staticLabels.color || "#000000";
+
+		@ctx.textBaseline = "bottom"
+		@ctx.textAlign = "center"
+		for value in staticLabels.labels
+			# Draw labels depending on limitMin/Max
+			if (not @options.limitMin or value >= @minValue) and (not @options.limitMax or value <= @maxValue)
+				rotationAngle = @getAngle(value) - 3*Math.PI/2
+				@ctx.rotate(rotationAngle)
+				@ctx.fillText(formatNumber(value, staticLabels.fractionDigits), 0, -radius - @lineWidth/2)
+				@ctx.rotate(-rotationAngle)
+		@ctx.restore()
+
 	render: () ->
 		# Draw using canvas
 		w = @canvas.width / 2
-		h = @canvas.height * (1 - @paddingBottom)
+		h = @canvas.height*@paddingTop + @availableHeight - (@radius + @lineWidth/2)*@extraPadding
 		displayedAngle = @getAngle(@displayedValue)
 		if @textField
 			@textField.render(@)
 
 		@ctx.lineCap = "butt"
-		if @options.customFillStyle != undefined
-			fillStyle = @options.customFillStyle(@)
-		else if @percentColors != null
-			fillStyle = @getColorForValue(@displayedValue, true)
-		else if @options.colorStop != undefined
-			if @options.gradientType == 0
-				fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
-			else
-				fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
-			fillStyle.addColorStop(0, @options.colorStart)
-			fillStyle.addColorStop(1, @options.colorStop)
-		else
-			fillStyle = @options.colorStart
-		@ctx.strokeStyle = fillStyle
 
-		@ctx.beginPath()
-		@ctx.arc(w, h, @radius, (1 + @options.angle) * Math.PI, displayedAngle, false)
-		@ctx.lineWidth = @lineWidth
-		@ctx.stroke()
+		radius = @radius * @options.radiusScale
+		if (@options.staticLabels)
+			@renderStaticLabels(@options.staticLabels, w, h, radius)
+
+		if (@options.staticZones)
+			@ctx.save()
+			@ctx.translate(w, h)
+			@ctx.lineWidth = @lineWidth
+			for zone in @options.staticZones
+				# Draw zones depending on limitMin/Max
+				min = zone.min
+				if @options.limitMin and min < @minValue
+					min = @minValue
+				max = zone.max
+				if @options.limitMax and max > @maxValue
+					max = @maxValue
+				@ctx.strokeStyle = zone.strokeStyle
+				@ctx.beginPath()
+				@ctx.arc(0, 0, radius, @getAngle(min), @getAngle(max), false)
+				@ctx.stroke()
+			@ctx.restore()
 
-		@ctx.strokeStyle = @options.strokeColor
-		@ctx.beginPath()
-		@ctx.arc(w, h, @radius, displayedAngle, (2 - @options.angle) * Math.PI, false)
-		@ctx.stroke()
+		else
+			if @options.customFillStyle != undefined
+				fillStyle = @options.customFillStyle(@)
+			else if @percentColors != null
+				fillStyle = @getColorForValue(@displayedValue, true)
+			else if @options.colorStop != undefined
+				if @options.gradientType == 0
+					fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
+				else
+					fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
+				fillStyle.addColorStop(0, @options.colorStart)
+				fillStyle.addColorStop(1, @options.colorStop)
+			else
+				fillStyle = @options.colorStart
+			@ctx.strokeStyle = fillStyle
+		
+			@ctx.beginPath()
+			@ctx.arc(w, h, radius, (1 + @options.angle) * Math.PI, displayedAngle, false)
+			@ctx.lineWidth = @lineWidth
+			@ctx.stroke()
+	
+			@ctx.strokeStyle = @options.strokeColor
+			@ctx.beginPath()
+			@ctx.arc(w, h, radius, displayedAngle, (2 - @options.angle) * Math.PI, false)
+			@ctx.stroke()
+
+
+		# Draw pointers from (w, h)
+		@ctx.translate(w, h)
 		for gauge in @gp
 			gauge.update(true)
+		@ctx.translate(-w, -h)
 
 
 class BaseDonut extends BaseGauge
@@ -426,6 +499,7 @@ class BaseDonut extends BaseGauge
 		strokeColor: "#eeeeee"
 		shadowColor: "#d5d5d5"
 		angle: 0.35
+		radiusScale: 1.0
 
 	constructor: (@canvas) ->
 		super()
@@ -441,7 +515,7 @@ class BaseDonut extends BaseGauge
 	setOptions: (options=null) ->
 		super(options)
 		@lineWidth = @canvas.height * @options.lineWidth
-		@radius = @canvas.height / 2 - @lineWidth/2
+		@radius = @options.radiusScale * (@canvas.height / 2 - @lineWidth/2)
 		return @
 
 	set: (value) ->
@@ -508,10 +582,10 @@ window.AnimationUpdater =
 	add: (object) ->
 		AnimationUpdater.elements.push(object)
 
-	run: () ->
+	run: (force=false) ->
 		animationFinished = true
 		for elem in AnimationUpdater.elements
-			if elem.update()
+			if elem.update(force is true)
 				animationFinished = false
 		if not animationFinished
 			AnimationUpdater.animId = requestAnimationFrame(AnimationUpdater.run)