renkan: comparison client/js/renderer/edge.js

Mercurial Mercurial > renkan / comparison

summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help

client/js/renderer/edge.js

changeset 459	98cae534083d
parent 458	423bdf56d103
child 461	48235ed6b07d

equal deleted inserted replaced

-:423bdf56d103
+:98cae534083d
 this.bundle = this.renderer.addToBundles(this);
 this.line = new paper.Path();
 this.line.add([0,0],[0,0],[0,0]);
 this.line.__representation = this;
 this.line.strokeWidth = this.options.edge_stroke_width;
+this.arrow_scale = 1;
 this.arrow = new paper.Path();
 this.arrow.add(
 [ 0, 0 ],
 [ this.options.edge_arrow_length, this.options.edge_arrow_width / 2 ],
 [ 0, this.options.edge_arrow_width ]
 );
+this.arrow.pivot = new paper.Point([ this.options.edge_arrow_length / 2, this.options.edge_arrow_width / 2 ]);
 this.arrow.__representation = this;
 this.text = $('<div class="Rk-Label Rk-Edge-Label">').appendTo(this.renderer.labels_$);
 this.arrow_angle = 0;
 if (this.options.editor_mode) {
 var Renderer = requtils.getRenderer();
 this.minimap_line.add([0,0],[0,0]);
 this.minimap_line.__representation = this.renderer.minimap.miniframe.__representation;
 this.minimap_line.strokeWidth = 1;
 }
 },
+_getStrokeWidth: function() {
+var thickness = (this.model.has('style') && this.model.get('style').thickness) || 1;
+return this.options.edge_stroke_width + (thickness-1) * (this.options.edge_stroke_max_width - this.options.edge_stroke_width) / (this.options.edge_stroke_witdh_scale-1);
+},
+_getSelectedStrokeWidth: function() {
+var thickness = (this.model.has('style') && this.model.get('style').thickness) || 1;
+return this.options.selected_edge_stroke_width + (thickness-1) * (this.options.selected_edge_stroke_max_width - this.options.selected_edge_stroke_width) / (this.options.edge_stroke_witdh_scale-1);
+},
+_getArrowScale: function() {
+var thickness = (this.model.has('style') && this.model.get('style').thickness) || 1;
+return 1 + (thickness-1) * ((this.options.edge_arrow_max_width / this.options.edge_arrow_width) - 1) / (this.options.edge_stroke_witdh_scale-1);
+},
 redraw: function() {
 var from = this.model.get("from"),
 to = this.model.get("to");
 if (!from || !to) {
 return;
 this.from_representation = this.renderer.getRepresentationByModel(from);
 this.to_representation = this.renderer.getRepresentationByModel(to);
 if (typeof this.from_representation === "undefined" || typeof this.to_representation === "undefined") {
 return;
 }
-var _p0a = this.from_representation.paper_coords,
+var _strokeWidth = this._getStrokeWidth(),
+_arrow_scale = this._getArrowScale(),
+_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),
+_textdelta = _ortho.multiply(this.options.edge_label_distance + 0.5 * _arrow_scale * this.options.edge_arrow_width),
 _handle = _v.divide(3),
 _color = (this.model.has("style") && this.model.get("style").color) || (this.model.get("created_by") || Utils._USER_PLACEHOLDER(this.renkan)).get("color"),
 _dash = (this.model.has("style") && this.model.get("style").dash) ? this.options.default_dash_array : null,
 opacity = 1;
 opacity = 1;
 this.line.dashArray = null;
 }
 var old_act_btn = this.active_buttons;
+var array_opacity =
+(this.model.has("style") && this.model.get("style").arrow) || !this.model.has("style") || (typeof this.model.get("style").arrow === 'undefined') ? opacity : 0;
 this.active_buttons = this.model.get("delete_scheduled") ? this.pending_delete_buttons : this.normal_buttons;
 if (this.selected && this.renderer.isEditable() && old_act_btn !== this.active_buttons) {
 old_act_btn.forEach(function(b) {
 }
 this.paper_coords = _p0b.add(_p1b).divide(2);
+this.line.strokeWidth = _strokeWidth;
 this.line.strokeColor = _color;
 this.line.dashArray = _dash;
 this.line.opacity = opacity;
 this.line.segments[0].point = _p0a;
 this.line.segments[1].point = this.paper_coords;
 this.line.segments[1].handleIn = _handle.multiply(-1);
 this.line.segments[1].handleOut = _handle;
 this.line.segments[2].point = _p1a;
-this.arrow.rotate(_a - this.arrow_angle);
+this.arrow.scale(_arrow_scale / this.arrow_scale);
+this.arrow_scale = _arrow_scale;
 this.arrow.fillColor = _color;
-this.arrow.opacity = opacity;
+this.arrow.opacity = array_opacity;
+this.arrow.rotate(_a - this.arrow_angle, this.arrow.bounds.center);
 this.arrow.position = this.paper_coords;
 this.arrow_angle = _a;
 if (_a > 90) {
 _a -= 180;
 _textdelta = _textdelta.multiply(-1);
 }
 _editor.source_representation = this;
 _editor.draw();
 },
 select: function() {
 this.selected = true;
-this.line.strokeWidth = this.options.selected_edge_stroke_width;
+this.line.strokeWidth = this._getSelectedStrokeWidth();
 if (this.renderer.isEditable()) {
 this.active_buttons.forEach(function(b) {
 b.show();
 });
 }
 if (this.options.editor_mode) {
 this.all_buttons.forEach(function(b) {
 b.hide();
 });
 }
-this.line.strokeWidth = this.options.edge_stroke_width;
+this.line.strokeWidth = this._getStrokeWidth();
 this._super("unselect");
 }
 },
 mousedown: function(_event, _isTouch) {
 if (_isTouch) {

renkan