diff -r 1a54f4e626df -r b45dda454dd6 client/js/paper-renderer.js --- a/client/js/paper-renderer.js Sat Apr 26 14:32:42 2014 +0200 +++ b/client/js/paper-renderer.js Sat Apr 26 21:24:28 2014 +0200 @@ -270,9 +270,6 @@ this.all_buttons.forEach(function(b) { b.setSectorSize(); }); - var square = new paper.Size(this.circle_radius, this.circle_radius), - topleft = this.paper_coords.subtract(square), - bounds = new paper.Rectangle(topleft, square.multiply(2)); this.circle.scale(this.circle_radius / this.last_circle_radius); if (this.node_image) { this.node_image.scale(this.circle_radius / this.last_circle_radius); @@ -286,12 +283,13 @@ var old_act_btn = this.active_buttons; + var opacity = 1; if (this.model.get("delete_scheduled")) { - var opacity = .5; + opacity = .5; this.active_buttons = this.pending_delete_buttons; this.circle.dashArray = [2,2]; } else { - var opacity = 1; + opacity = 1; this.active_buttons = this.normal_buttons; this.circle.dashArray = null; } @@ -372,12 +370,13 @@ }, showImage: function() { + var _image = null; if (typeof this.renderer.image_cache[this.img] === "undefined") { - var _image = new Image(); + _image = new Image(); this.renderer.image_cache[this.img] = _image; _image.src = this.img; } else { - var _image = this.renderer.image_cache[this.img]; + _image = this.renderer.image_cache[this.img]; } if (_image.width) { if (this.node_image) { @@ -385,17 +384,21 @@ } this.renderer.node_layer.activate(); var width = _image.width, - height = _image.height, - clipPath = this.model.get("clip_path"), - hasClipPath = (typeof clipPath !== "undefined" && clipPath); + height = _image.height, + clipPath = this.model.get("clip_path"), + hasClipPath = (typeof clipPath !== "undefined" && clipPath), + _clip = null, + baseRadius = null, + centerPoint = null; + if (hasClipPath) { - var _clip = new paper.Path(), - instructions = clipPath.match(/[a-z][^a-z]+/gi) || [], - lastCoords = [0,0], - minX = Infinity, - minY = Infinity, - maxX = -Infinity, - maxY = -Infinity; + _clip = new paper.Path(); + var instructions = clipPath.match(/[a-z][^a-z]+/gi) || [], + lastCoords = [0,0], + minX = Infinity, + minY = Infinity, + maxX = -Infinity, + maxY = -Infinity; var transformCoords = function(tabc, relative) { var newCoords = tabc.slice(1).map(function(v, k) { @@ -452,13 +455,13 @@ } }); - var baseRadius = Math[this.options.node_images_fill_mode ? "min" : "max"](maxX - minX, maxY - minY) / 2, + baseRadius = Math[this.options.node_images_fill_mode ? "min" : "max"](maxX - minX, maxY - minY) / 2; centerPoint = new paper.Point((maxX + minX) / 2, (maxY + minY) / 2); if (!this.options.show_node_circles) { this.h_ratio = (maxY - minY) / (2 * baseRadius); } } else { - var baseRadius = Math[this.options.node_images_fill_mode ? "min" : "max"](width, height) / 2, + baseRadius = Math[this.options.node_images_fill_mode ? "min" : "max"](width, height) / 2; centerPoint = new paper.Point(0,0); if (!this.options.show_node_circles) { this.h_ratio = height / (2 * baseRadius); @@ -679,25 +682,26 @@ return; } var _p0a = this.from_representation.paper_coords, - _p1a = this.to_representation.paper_coords, - _v = _p1a.subtract(_p0a), - _r = _v.length, - _u = _v.divide(_r), - _ortho = new paper.Point([- _u.y, _u.x]), - _group_pos = this.bundle.getPosition(this), - _delta = _ortho.multiply( this.options.edge_gap_in_bundles * _group_pos ), - _p0b = _p0a.add(_delta), /* Adding a 4 px difference */ - _p1b = _p1a.add(_delta), /* to differentiate bundled links */ - _a = _v.angle, - _textdelta = _ortho.multiply(this.options.edge_label_distance), - _handle = _v.divide(3), - _color = this.model.get("color") || this.model.get("color") || (this.model.get("created_by") || _USER_PLACEHOLDER(this.renkan)).get("color"); + _p1a = this.to_representation.paper_coords, + _v = _p1a.subtract(_p0a), + _r = _v.length, + _u = _v.divide(_r), + _ortho = new paper.Point([- _u.y, _u.x]), + _group_pos = this.bundle.getPosition(this), + _delta = _ortho.multiply( this.options.edge_gap_in_bundles * _group_pos ), + _p0b = _p0a.add(_delta), /* Adding a 4 px difference */ + _p1b = _p1a.add(_delta), /* to differentiate bundled links */ + _a = _v.angle, + _textdelta = _ortho.multiply(this.options.edge_label_distance), + _handle = _v.divide(3), + _color = this.model.get("color") || this.model.get("color") || (this.model.get("created_by") || _USER_PLACEHOLDER(this.renkan)).get("color"), + opacity = 1; if (this.model.get("delete_scheduled") || this.from_representation.model.get("delete_scheduled") || this.to_representation.model.get("delete_scheduled")) { - var opacity = .5; + opacity = .5; this.line.dashArray = [2, 2]; } else { - var opacity = 1; + opacity = 1; this.line.dashArray = null; } @@ -835,7 +839,7 @@ }); var _this = this; this.bundle.edges = _(this.bundle.edges).reject(function(_edge) { - return _edge === _this; + return _this === _edge; }); } }); @@ -1628,12 +1632,11 @@ this.click_mode = false; var _this = this, - _allowScroll = true, - _originalScale, - _zooming = false, - _lastTapDate, - _lastTapX, - _lastTapY; + _allowScroll = true, + _originalScale = 1, + _zooming = false, + _lastTapX = 0, + _lastTapY = 0; this.image_cache = {}; this.icon_cache = {}; @@ -1709,7 +1712,7 @@ _this.canvas_$.width(), _this.canvas_$.height() ]).multiply( .5 * ( 1 - _scaleRatio ) ).add(_this.offset.multiply( _scaleRatio )); - _this.setScale(_newScale, _this.offset); + _this.setScale(_newScale, _newOffset); } }, touchend: function(_event) { @@ -2042,33 +2045,31 @@ }, drawSector: function(_repr, _inR, _outR, _startAngle, _endAngle, _padding, _imgname, _caption) { var _options = this.renkan.options, - _startRads = _startAngle * Math.PI / 180, - _endRads = _endAngle * Math.PI / 180, - _img = this.icon_cache[_imgname], - _span = _endRads - _startRads, - _startdx = - Math.sin(_startRads), - _startdy = Math.cos(_startRads), - _startXIn = Math.cos(_startRads) * _inR + _padding * _startdx, - _startYIn = Math.sin(_startRads) * _inR + _padding * _startdy, - _startXOut = Math.cos(_startRads) * _outR + _padding * _startdx, - _startYOut = Math.sin(_startRads) * _outR + _padding * _startdy, - _enddx = - Math.sin(_endRads), - _enddy = Math.cos(_endRads), - _endXIn = Math.cos(_endRads) * _inR - _padding * _enddx, - _endYIn = Math.sin(_endRads) * _inR - _padding * _enddy, - _endXOut = Math.cos(_endRads) * _outR - _padding * _enddx, - _endYOut = Math.sin(_endRads) * _outR - _padding * _enddy, - _centerR = (_inR + _outR)/2, - _centerRads = (_startRads + _endRads) / 2, - _centerX = Math.cos(_centerRads) * _centerR, - _centerY = Math.sin(_centerRads) * _centerR, - _centerXIn = Math.cos(_centerRads) * _inR, - _centerXOut = Math.cos(_centerRads) * _outR, - _centerYIn = Math.sin(_centerRads) * _inR, - _centerYOut = Math.sin(_centerRads) * _outR, - _textX = Math.cos(_centerRads) * (_outR + 3), - _textY = Math.sin(_centerRads) * (_outR + _options.buttons_label_font_size) + _options.buttons_label_font_size / 2, - _segments = []; + _startRads = _startAngle * Math.PI / 180, + _endRads = _endAngle * Math.PI / 180, + _img = this.icon_cache[_imgname], + _startdx = - Math.sin(_startRads), + _startdy = Math.cos(_startRads), + _startXIn = Math.cos(_startRads) * _inR + _padding * _startdx, + _startYIn = Math.sin(_startRads) * _inR + _padding * _startdy, + _startXOut = Math.cos(_startRads) * _outR + _padding * _startdx, + _startYOut = Math.sin(_startRads) * _outR + _padding * _startdy, + _enddx = - Math.sin(_endRads), + _enddy = Math.cos(_endRads), + _endXIn = Math.cos(_endRads) * _inR - _padding * _enddx, + _endYIn = Math.sin(_endRads) * _inR - _padding * _enddy, + _endXOut = Math.cos(_endRads) * _outR - _padding * _enddx, + _endYOut = Math.sin(_endRads) * _outR - _padding * _enddy, + _centerR = (_inR + _outR)/2, + _centerRads = (_startRads + _endRads) / 2, + _centerX = Math.cos(_centerRads) * _centerR, + _centerY = Math.sin(_centerRads) * _centerR, + _centerXIn = Math.cos(_centerRads) * _inR, + _centerXOut = Math.cos(_centerRads) * _outR, + _centerYIn = Math.sin(_centerRads) * _inR, + _centerYOut = Math.sin(_centerRads) * _outR, + _textX = Math.cos(_centerRads) * (_outR + 3), + _textY = Math.sin(_centerRads) * (_outR + _options.buttons_label_font_size) + _options.buttons_label_font_size / 2; this.buttons_layer.activate(); var _path = new paper.Path(); _path.add([_startXIn, _startYIn]); @@ -2093,11 +2094,11 @@ } _text.visible = false; var _visible = false, - _restPos = new paper.Point(-200, -200), - _grp = new paper.Group([_path, _text]), - _delta = _grp.position, - _imgdelta = new paper.Point([_centerX, _centerY]), - _currentPos = new paper.Point(0,0); + _restPos = new paper.Point(-200, -200), + _grp = new paper.Group([_path, _text]), + _delta = _grp.position, + _imgdelta = new paper.Point([_centerX, _centerY]), + _currentPos = new paper.Point(0,0); _text.content = _caption; _grp.visible = false; _grp.position = _restPos; @@ -2130,12 +2131,12 @@ _grp.remove(); } }; - function showImage() { + var showImage = function() { var _raster = new paper.Raster(_img); _raster.position = _imgdelta.add(_grp.position).subtract(_delta); _raster.locked = true; // Disable mouse events on icon _grp.addChild(_raster); - } + }; if (_img.width) { showImage(); } else { @@ -2279,7 +2280,6 @@ ulistHtml = '', $userpanel = this.$.find(".Rk-Users"), $name = $userpanel.find(".Rk-CurrentUser-Name"), - $cpwrapper = $userpanel.find(".Rk-Edit-ColorPicker-Wrapper"), $cpitems = $userpanel.find(".Rk-Edit-ColorPicker li"), $colorsquare = $userpanel.find(".Rk-CurrentUser-Color"), _this = this;