From 943e4b0d08bb6b32aa4f3597d48f2296b148e43a Mon Sep 17 00:00:00 2001 From: Alex Yatskov Date: Sat, 30 Aug 2014 12:21:50 +0900 Subject: [PATCH] Make graph scale up and down --- client/grapher.js | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/client/grapher.js b/client/grapher.js index c4220b3..7e5f8b1 100644 --- a/client/grapher.js +++ b/client/grapher.js @@ -223,20 +223,20 @@ function Column(canvas, name, params, scale, range, bounds) { } this.getFillBounds = function(bounds) { - var fill = (this.value - this.range.start) / this.range.getLength(); - var height = bounds.height * (1.0 - goog.math.clamp(fill, 0.0, 1.0)); + var y1 = this.getPosFromValue(0.0); + var y2 = this.getPosFromValue(this.value); return new goog.math.Rect( bounds.left, - bounds.top + height, + Math.min(y1, y2), bounds.width - this.hintSize, - bounds.height - height + Math.abs(y1 - y2) ); } this.getHandleBounds = function(bounds, fillBounds) { var handleBounds = new goog.math.Rect( fillBounds.left, - fillBounds.top, + this.getPosFromValue(this.value) - this.handleSize / 2, fillBounds.width, this.handleSize ); @@ -280,18 +280,22 @@ function Column(canvas, name, params, scale, range, bounds) { this.mouseDoubleClick = function(position) { if (this.isContained(position)) { - this.setClampedValue(this.getValueFromPos(position), true); + this.setClampedValue(this.getValueFromPos(position.y), true); } } this.getValueFromPos = function(position) { - var percent = 1.0 - (position.y - this.columnBounds.top) / this.columnBounds.height; + var percent = 1.0 - (position - this.columnBounds.top) / this.columnBounds.height; return this.range.start + this.range.getLength() * percent; } this.getPosFromValue = function(value) { var percent = 1.0 - (value - this.range.start) / this.range.getLength(); - return this.columnBounds.top + this.columnBounds.height * percent; + return goog.math.clamp( + this.columnBounds.top + this.columnBounds.height * percent, + this.columnBounds.top, + this.columnBounds.top + this.columnBounds.height + ); } this.isHovering = function(position) { @@ -309,7 +313,7 @@ function Column(canvas, name, params, scale, range, bounds) { this.stateUpdate = function(position) { switch (this.state) { case this.State.DRAG: - this.setClampedValue(this.getValueFromPos(position) + this.dragDelta, false); + this.setClampedValue(this.getValueFromPos(position.y) + this.dragDelta, false); break; } } @@ -321,7 +325,7 @@ function Column(canvas, name, params, scale, range, bounds) { switch (this.state) { case this.State.DRAG: - this.setClampedValue(this.getValueFromPos(position) + this.dragDelta, true); + this.setClampedValue(this.getValueFromPos(position.y) + this.dragDelta, true); case this.State.HOVER: if (state == this.State.NORMAL) { this.canvas.contextContainer.canvas.style.cursor = 'default'; @@ -331,7 +335,7 @@ function Column(canvas, name, params, scale, range, bounds) { switch (state) { case this.State.DRAG: - this.dragDelta = this.value - this.getValueFromPos(position); + this.dragDelta = this.value - this.getValueFromPos(position.y); case this.State.HOVER: this.canvas.contextContainer.canvas.style.cursor = 'ns-resize'; break;