--- a/client/js/paper-renderer.js Mon Mar 11 14:43:52 2013 +0100
+++ b/client/js/paper-renderer.js Wed Mar 13 10:19:24 2013 +0100
@@ -8,6 +8,7 @@
_EDGE_BUTTON_OUTER: 40,
_NODE_FONT_SIZE: 10,
_EDGE_FONT_SIZE: 9,
+ _EDGE_DISTANCE: 3,
_NODE_MAX_CHAR: 50,
_EDGE_MAX_CHAR: 40,
_ARROW_LENGTH: 16,
@@ -303,7 +304,9 @@
}
this.last_circle_radius = this.circle_radius;
- this.title.content = this.model.get("title") || this.renderer.renkan.translate("(untitled)");
+ var _text = this.model.get("title") || this.renderer.renkan.translate("(untitled)");
+ this.title.content = _text.length > Rkns.Renderer._NODE_MAX_CHAR ? (_text.substr(0,Rkns.Renderer._NODE_MAX_CHAR) + '…') : _text;
+
this.title.position = this.paper_coords.add([0, this.circle_radius + 1.5 *Rkns.Renderer._NODE_FONT_SIZE]);
var _color = this.model.get("color") || (this.model.get("created_by") || Rkns.Renderer._USER_PLACEHOLDER).get("color");
this.circle.strokeColor = _color;
@@ -321,14 +324,18 @@
_this.renderer.node_layer.activate();
var _ratio = Math.min(2 / _image.width, 2 / _image.height );
var _raster = new paper.Raster(_image);
- var _clip = new paper.Path.Circle([0, 0], 1);
- _raster.scale(_ratio);
- _this.node_image = new paper.Group(_clip, _raster);
- _this.node_image.opacity = .9;
- /* This is a workaround to allow clipping at group level
- * If opacity was set to 1, paper.js would merge all clipping groups in one (known bug).
- */
- _this.node_image.clipped = true;
+ if (_this.renderer.renkan.clip_images) {
+ var _clip = new paper.Path.Circle([0, 0], 1);
+ _raster.scale(_ratio);
+ _this.node_image = new paper.Group(_clip, _raster);
+ _this.node_image.opacity = .9;
+ /* This is a workaround to allow clipping at group level
+ * If opacity was set to 1, paper.js would merge all clipping groups in one (known bug).
+ */
+ _this.node_image.clipped = true;
+ } else {
+ _this.node_image = _raster;
+ }
_this.node_image.__representation = _this;
var square = new paper.Size(_this.circle_radius, _this.circle_radius),
topleft = _this.paper_coords.subtract(square),
@@ -493,11 +500,13 @@
_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 = new paper.Point([- _u.y, _u.x]).multiply( 12 * _group_pos ),
+ _delta = _ortho.multiply( 12 * _group_pos ),
_p0b = _p0a.add(_delta), /* Adding a 4 px difference */
_p1b = _p1a.add(_delta), /* to differentiate inbound and outbound links */
_a = _v.angle,
+ _textdelta = _ortho.multiply(-Rkns.Renderer._EDGE_DISTANCE),
_handle = _v.divide(3),
_color = this.model.get("color") || this.model.get("color") || (this.model.get("created_by") || Rkns.Renderer._USER_PLACEHOLDER).get("color");
this.paper_coords = _p0b.add(_p1b).divide(2);
@@ -513,13 +522,16 @@
this.arrow_angle = _a;
if (_a > 90) {
_a -= 180;
+ _textdelta = _textdelta.multiply(-1);
}
if (_a < -90) {
_a += 180;
+ _textdelta = _textdelta.multiply(-1);
}
this.text.rotate(_a - this.text_angle);
- this.text.content = this.model.get("title");
- this.text.position = this.paper_coords;
+ var _text = this.model.get("title");
+ this.text.content = _text.length > Rkns.Renderer._EDGE_MAX_CHAR ? (_text.substr(0,Rkns.Renderer._EDGE_MAX_CHAR) + '…') : _text;
+ this.text.position = this.paper_coords.add(_textdelta);
this.text_angle = _a;
this.edit_button.moveTo(this.paper_coords);
this.remove_button.moveTo(this.paper_coords);