alex/restaurant-search
1
Fork 0
Code Releases Activity

Merging with master

Browse Source
This commit is contained in:
Alex Yatskov 2014-09-27 10:13:15 +09:00
commit bdb5c93586
4 changed files with 590 additions and 530 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
client/bower.json
View File

@ -14,7 +14,6 @@
],
"dependencies": {
"bootstrap": "~3.2.0",
"closurelibrary": "*",
"fabric": "~1.4.8",
"handlebars": "~1.3.0",
"underscore": "~1.6.0",

21
client/index.html
View File

@ -161,18 +161,15 @@
</div>
</div>
<!-- <script src="bower_components/underscore/underscore.js"></script> -->
<!-- <script src="bower_components/handlebars/handlebars.min.js"></script> -->
<!-- <script src="bower_components/closurelibrary/closure/goog/base.js"></script> -->
<!-- <script src="bower_components/jquery/dist/jquery.min.js"></script> -->
<!-- <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> -->
<!-- <script src="bower_components/fabric/dist/fabric.min.js"></script> -->
<!-- <script src="bower_components/bootstrap-select/dist/js/bootstrap-select.min.js"></script> -->
<!-- <script src="bower_components/tinycolor/tinycolor.js"></script> -->
<script src="bower_components/underscore/underscore.js"></script>
<script src="bower_components/handlebars/handlebars.min.js"></script>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/fabric/dist/fabric.min.js"></script>
<script src="bower_components/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="bower_components/tinycolor/tinycolor.js"></script>
<!-- <script src="js/application.js"></script> -->
<!-- <script src="js/grapher.js"></script> -->
<script src="dist/all.min.js"></script>
<script src="js/application.js"></script>
<script src="js/grapher.js"></script>
</body>
</html>

2
client/js/application.js
View File

@ -49,7 +49,7 @@
ctx.hintSteps = query.hintSteps;
ctx.maxResults = query.maxResults;
ctx.grapher = new Grapher('grapher', ctx.searchRange, 150, true, true);
ctx.grapher = new grapher.Grapher('grapher', ctx.searchRange, 150, true, true);
ctx.grapher.setColumns(results.columns);
ctx.grapher.setValueChangedListener(onAdjust);

114
client/js/grapher.js
View File

@ -1,9 +1,78 @@
'use strict';
goog.require('goog.math');
goog.require('goog.math.Coordinate');
goog.require('goog.math.Range');
goog.require('goog.math.Rect');
(function(grapher) {
//
// Coord
//
function Coord(x, y) {
this.x = x;
this.y = y;
}
//
// Rect
//
function Rect(left, top, width, height) {
this.left = left;
this.top = top;
this.width = width;
this.height = height;
this.right = left + width;
this.bottom = top + height;
this.contains = function(coord) {
var contained =
coord.x >= this.left &&
coord.x < this.right &&
coord.y >= this.top &&
coord.y < this.bottom;
return contained;
};
this.intersection = function(rect) {
var left = Math.max(this.left, rect.left);
var top = Math.max(this.top, rect.top);
var right = Math.min(this.right, rect.right);
var bottom = Math.min(this.bottom, rect.bottom);
return new Rect(left, top, right - left, bottom - top);
};
}
//
// Range
//
function Range(start, end) {
this.start = start;
this.end = end;
this.containsPoint = function(value) {
return value >= this.start && value <= this.end;
};
this.getLength = function() {
return this.end - this.start;
};
this.clamp = function(value) {
if (value < this.start) {
return this.start;
}
if (value > this.end) {
return this.end;
}
return value;
}
}
//
@ -85,7 +154,7 @@ function Column(canvas, name, params, scale, range, bounds) {
fill: this.getHandleColor()
});
if (final && goog.math.Range.containsPoint(this.range, 0.0)) {
if (final && this.range.containsPoint(0.0)) {
var y = this.getPosFromValue(0.0);
var p = [this.bounds.left, y, this.bounds.left + this.tickLength, y];
this.updateLine('baseline', p, {
@ -174,7 +243,7 @@ function Column(canvas, name, params, scale, range, bounds) {
}
this.setClampedValue = function(value, final) {
this.value = goog.math.clamp(value, this.range.start, this.range.end);
this.value = this.range.clamp(value);
this.updateShapes(final);
if (this.onValueChanged && final) {
@ -189,7 +258,7 @@ function Column(canvas, name, params, scale, range, bounds) {
}
this.getLabelBounds = function(bounds) {
return new goog.math.Rect(
return new Rect(
bounds.left,
bounds.top + bounds.height,
bounds.width,
@ -198,7 +267,7 @@ function Column(canvas, name, params, scale, range, bounds) {
}
this.getColumnBounds = function(bounds) {
return new goog.math.Rect(
return new Rect(
bounds.left + this.tickLength,
bounds.top,
bounds.width - this.tickLength,
@ -207,7 +276,7 @@ function Column(canvas, name, params, scale, range, bounds) {
}
this.getHintBounds = function(bounds) {
return new goog.math.Rect(
return new Rect(
bounds.left + bounds.width - this.hintSize,
bounds.top,
this.hintSize,
@ -218,7 +287,7 @@ function Column(canvas, name, params, scale, range, bounds) {
this.getFillBounds = function(bounds) {
var y1 = this.getPosFromValue(0.0);
var y2 = this.getPosFromValue(this.value);
return new goog.math.Rect(
return new Rect(
bounds.left,
Math.min(y1, y2),
bounds.width - this.hintSize,
@ -227,7 +296,7 @@ function Column(canvas, name, params, scale, range, bounds) {
}
this.getHandleBounds = function(bounds, fillBounds) {
var handleBounds = new goog.math.Rect(
var handleBounds = new Rect(
fillBounds.left,
this.getPosFromValue(this.value) - this.handleSize / 2,
fillBounds.width,
@ -303,11 +372,8 @@ function Column(canvas, name, params, scale, range, bounds) {
this.getPosFromValue = function(value) {
var percent = 1.0 - (value - this.range.start) / this.range.getLength();
return goog.math.clamp(
this.columnBounds.top + this.columnBounds.height * percent,
this.columnBounds.top,
this.columnBounds.top + this.columnBounds.height
);
var range = new Range(this.columnBounds.top, this.columnBounds.top + this.columnBounds.height);
return range.clamp(this.columnBounds.top + this.columnBounds.height * percent);
}
this.isHovering = function(position) {
@ -395,7 +461,7 @@ function Column(canvas, name, params, scale, range, bounds) {
// Grapher
//
function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
grapher.Grapher = function(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
this.setColumns = function(columns) {
this.clearColumns();
@ -484,7 +550,7 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
this.getLocalScale = function(hints) {
var counts = _.pluck(hints, 'count');
var min = this.useRelativeScale ? _.min(counts) : 0;
return new goog.math.Range(min, _.max(counts));
return new Range(min, _.max(counts));
}
this.getGlobalScale = function(hintData) {
@ -522,7 +588,7 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
}
this.getCanvasBounds = function() {
return new goog.math.Rect(0, 0, this.canvas.width - 1, this.canvas.height - 1);
return new Rect(0, 0, this.canvas.width - 1, this.canvas.height - 1);
}
this.getGraphBounds = function(bounds) {
@ -531,7 +597,7 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
this.getColumnBounds = function(bounds, index, count) {
var width = this.columnWidth + this.padding * 2;
return new goog.math.Rect(
return new Rect(
bounds.left + width * index + this.padding,
bounds.top,
this.columnWidth,
@ -541,10 +607,7 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
this.getMousePos = function(e) {
var rect = e.target.getBoundingClientRect();
return new goog.math.Coordinate(
e.clientX - rect.left,
e.clientY - rect.top
);
return new Coord(e.clientX - rect.left, e.clientY - rect.top);
}
this.mouseDown = function(e) {
@ -586,7 +649,7 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
this.useRelativeScale = useRelativeScale;
this.columnWidth = columnWidth;
this.canvas = new fabric.StaticCanvas(canvas);
this.range = new goog.math.Range(range.min, range.max);
this.range = new Range(range.min, range.max);
this.padding = 10;
this.indexMap = {};
this.columns = [];
@ -599,3 +662,4 @@ function Grapher(canvas, range, columnWidth, useLocalScale, useRelativeScale) {
c.addEventListener('dblclick', this.mouseDoubleClick, false);
c.grapher = this;
}
}(window.grapher = window.grapher || {}));