# HG changeset patch # User veltr # Date 1343384530 -7200 # Node ID 7722ec70c01b42545a781ed628c35047edbab87a # Parent 3360c3f7fb18f5aea4e508e125378fdc5226773d Scroll now depends on mouse position diff -r 3360c3f7fb18 -r 7722ec70c01b client/js/main.js --- a/client/js/main.js Thu Jul 26 18:06:05 2012 +0200 +++ b/client/js/main.js Fri Jul 27 12:22:10 2012 +0200 @@ -18,7 +18,10 @@ /* Declaring the Renkan Namespace Rkns */ -Rkns = {} +Rkns = { + _FROM_GRAPHICS: 0, + _FROM_DATA: 1 +} Rkns.$ = jQuery; diff -r 3360c3f7fb18 -r 7722ec70c01b client/js/model.js --- a/client/js/model.js Thu Jul 26 18:06:05 2012 +0200 +++ b/client/js/model.js Fri Jul 27 12:22:10 2012 +0200 @@ -7,7 +7,6 @@ this.title = _props.title || "(untitled " + this.type + ")"; this.description = _props.description || ""; this.uri = _props.uri || ""; -// this._backRefs = []; } } @@ -17,6 +16,24 @@ this[ _propName ] = _element; } +Rkns.Model._BaseElement.prototype.updateGraphics = function() { + this._project._renderer.redraw(); +} + +Rkns.Model._BaseElement.prototype.updateData = function() { +} + +Rkns.Model._BaseElement.prototype.propagateChanges = function(_from) { + switch(_from) { + case Rkns._FROM_GRAPHICS: + this.updateData(); + break; + case Rkns._FROM_DATA: + this.updateGraphics(); + break; + } +} + /* Element Class Generator */ Rkns.Model._elementClass = function(_type) { @@ -42,6 +59,26 @@ this.position = _props.position; } +Rkns.Model.Node.prototype.setPosition = function(_from, _x, _y) { + if (typeof _x === "object") { + if (typeof _x.x !== "undefined" && typeof _x.y !== "undefined") { + this.position.x = _x.x; + this.position.y = _x.y; + } else { + if (typeof _x.length !== "undefined") { + this.position.x = _x[0]; + this.position.y = _x[1]; + } + } + } else { + if (typeof _y !== "undefined") { + this.position.x = +_x; + this.position.y = +_y; + } + } + this.propagateChanges(_from); +} + /* Edge Model */ Rkns.Model.Edge = Rkns.Model._elementClass("edge"); diff -r 3360c3f7fb18 -r 7722ec70c01b client/js/paper-renderer.js --- a/client/js/paper-renderer.js Thu Jul 26 18:06:05 2012 +0200 +++ b/client/js/paper-renderer.js Fri Jul 27 12:22:10 2012 +0200 @@ -29,7 +29,7 @@ } Rkns.Renderers.Paper__Controllers.Node.prototype.redraw = function() { - this.node_model_coords = new paper.Point(this._element.position.x, this._element.position.y); + this.node_model_coords = new paper.Point(this._element.position); this.node_paper_coords = this._renderer.toPaperCoords(this.node_model_coords); this.node_circle.position = this.node_paper_coords; this.node_text.content = this._element.title; @@ -38,10 +38,7 @@ } Rkns.Renderers.Paper__Controllers.Node.prototype.paperShift = function(_delta) { - this.node_paper_coords = this.node_paper_coords.add(_delta); - this.node_model_coords = this._renderer.toModelCoords(this.node_paper_coords); - this._element.position.x = this.node_model_coords.x; - this._element.position.y = this.node_model_coords.y; + this._element.setPosition(Rkns._FROM_GRAPHICS, this._renderer.toModelCoords(this.node_paper_coords.add(_delta))); this._renderer.redraw(); } @@ -137,7 +134,7 @@ _miny = Math.min.apply(Math, _yy), _maxx = Math.max.apply(Math, _xx), _maxy = Math.max.apply(Math, _yy); - this.scale = Math.min((paper.view.size.width - 100) / (_maxx - _minx), (paper.view.size.height - 100) / (_maxy - _miny)); + this.scale = Math.min((paper.view.size.width - 160) / (_maxx - _minx), (paper.view.size.height - 100) / (_maxy - _miny)); this.offset = paper.view.center.subtract(new paper.Point([(_maxx + _minx) / 2, (_maxy + _miny) / 2]).multiply(this.scale)); this.nodes = this._project.nodes.map(function(_node) { return new Rkns.Renderers.Paper__Controllers.Node(_this, _node); @@ -177,15 +174,21 @@ } } -Rkns.Renderers.Paper.prototype.onScroll = function(_event, _delta) { - this.totalScroll += _delta; +Rkns.Renderers.Paper.prototype.onScroll = function(_event, _scrolldelta) { + this.totalScroll += _scrolldelta; if (Math.abs(this.totalScroll) >= 1) { + var _off = Rkns.$("#"+this._project._opts.canvas_id).offset(), + _delta = new paper.Point([ + _event.pageX - _off.left, + _event.pageY - _off.top + ]).subtract(this.offset).multiply( Math.SQRT2 - 1 ); if (this.totalScroll > 0) { + this.offset = this.offset.subtract(_delta); this.scale *= Math.SQRT2; } else { + this.offset = this.offset.add(_delta.divide( Math.SQRT2 )); this.scale *= Math.SQRT1_2; } - console.log(this.scale); this.totalScroll = 0; this.redraw(); }