diff -r bdf851bb1c4f -r 48235ed6b07d client/js/renderer/edge.js --- a/client/js/renderer/edge.js Wed Jun 03 19:16:58 2015 +0200 +++ b/client/js/renderer/edge.js Thu Jun 04 10:04:01 2015 +0200 @@ -13,6 +13,8 @@ _init: function() { this.renderer.edge_layer.activate(); this.type = "Edge"; + this.hidden = false; + this.ghost = false; this.from_representation = this.renderer.getRepresentationByModel(this.model.get("from")); this.to_representation = this.renderer.getRepresentationByModel(this.model.get("to")); this.bundle = this.renderer.addToBundles(this); @@ -72,12 +74,15 @@ redraw: function() { var from = this.model.get("from"), to = this.model.get("to"); - if (!from || !to) { + if (!from || !to || (this.hidden && !this.ghost)) { 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") { + if (typeof this.from_representation === "undefined" || typeof this.to_representation === "undefined" || + (this.from_representation.hidden && !this.from_representation.ghost) || + (this.to_representation.hidden && !this.to_representation.ghost)) { + this.hide(); return; } var _strokeWidth = this._getStrokeWidth(), @@ -129,7 +134,7 @@ this.line.strokeWidth = _strokeWidth; this.line.strokeColor = _color; this.line.dashArray = _dash; - this.line.opacity = opacity; + this.line.opacity = this.ghost ? 0.3 : opacity; this.line.segments[0].point = _p0a; this.line.segments[1].point = this.paper_coords; this.line.segments[1].handleIn = _handle.multiply(-1); @@ -138,7 +143,7 @@ this.arrow.scale(_arrow_scale / this.arrow_scale); this.arrow_scale = _arrow_scale; this.arrow.fillColor = _color; - this.arrow.opacity = array_opacity; + this.arrow.opacity = this.ghost ? 0.3 : array_opacity; //TODO: magic constant + var name this.arrow.rotate(_a - this.arrow_angle, this.arrow.bounds.center); this.arrow.position = this.paper_coords; @@ -161,7 +166,7 @@ transform: "rotate(" + _a + "deg)", "-moz-transform": "rotate(" + _a + "deg)", "-webkit-transform": "rotate(" + _a + "deg)", - opacity: opacity + opacity: this.ghost ? 0.3 : opacity }); this.text_angle = _a; @@ -176,6 +181,36 @@ this.minimap_line.segments[1].point = this.renderer.toMinimapCoords(new paper.Point(this.to_representation.model.get("position"))); } }, + hide: function(){ + this.hidden = true; + this.ghost = false; + + this.text.hide(); + this.line.visible = false; + this.arrow.visible = false; + this.minimap_line.visible = false; + }, + show: function(ghost){ + this.ghost = ghost; + if (this.ghost) { + this.text.css('opacity', 0.3); + this.line.opacity = 0.3; + this.arrow.opacity = 0.3; + this.minimap_line.opacity = 0.3; + } else { + this.hidden = false; + + this.text.css('opacity', 1); + this.line.opacity = 1; + this.arrow.opacity = 1; + this.minimap_line.opacity = 1; + } + this.text.show(); + this.line.visible = true; + this.arrow.visible = true; + this.minimap_line.visible = true; + this.redraw(); + }, openEditor: function() { this.renderer.removeRepresentationsOfType("editor"); var _editor = this.renderer.addRepresentation("EdgeEditor",null);