--- a/client/js/paper-renderer.js Mon Apr 15 18:36:59 2013 +0200
+++ b/client/js/paper-renderer.js Tue Apr 16 17:31:00 2013 +0200
@@ -281,12 +281,7 @@
this.circle.opacity = .01;
this.h_ratio = 0;
}
- this.title = new paper.PointText([0,0]);
- this.title.characterStyle = {
- font: this.options.node_label_font,
- fontSize: this.options.node_label_font_size,
- fillColor: this.options.node_label_color
- };
+ this.title = Rkns.$('<div class="Rk-Label">').appendTo(this.renderer.labels_$);
if (this.options.editor_mode) {
this.buttons = [
new Rkns.Renderer.NodeEditButton(this.renderer, null),
@@ -302,7 +297,7 @@
this.buttons = [];
}
this.last_circle_radius = 1;
- this.title.paragraphStyle.justification = 'center';
+// this.title.paragraphStyle.justification = 'center';
if (this.renderer.minimap) {
this.renderer.minimap.node_layer.activate();
@@ -339,12 +334,12 @@
this.last_circle_radius = this.circle_radius;
var _text = this.model.get("title") || this.renkan.translate("(untitled)");
- this.title.content = Rkns.Renderer.Utils.shortenText(_text, this.options.node_label_max_length);
-
- this.title.position = this.paper_coords.add([
- 0,
- this.circle_radius * this.h_ratio + this.options.node_label_font_size + this.options.node_label_distance
- ]);
+ _text = Rkns.Renderer.Utils.shortenText(_text, this.options.node_label_max_length);
+ this.title.text(_text);
+ this.title.css({
+ left: this.paper_coords.x,
+ top: this.paper_coords.y + this.circle_radius * this.h_ratio + this.options.node_label_distance
+ })
var _color = this.model.get("color") || (this.model.get("created_by") || Rkns.Renderer._USER_PLACEHOLDER(this.renkan)).get("color");
this.circle.strokeColor = _color;
var _pc = this.paper_coords;
@@ -564,14 +559,7 @@
[ 0, this.options.edge_arrow_width ]
);
this.arrow.__representation = this;
- this.text = new paper.PointText();
- this.text.characterStyle = {
- font: this.options.edge_label_font,
- fontSize: this.options.edge_label_font_size,
- fillColor: this.options.edge_label_color
- };
- this.text.paragraphStyle.justification = 'center';
- this.text_angle = 0;
+ this.text = Rkns.$('<div class="Rk-Label Rk-Edge-Label">').appendTo(this.renderer.labels_$);
this.arrow_angle = 0;
if (this.options.editor_mode) {
this.edit_button = new Rkns.Renderer.EdgeEditButton(this.renderer, null);
@@ -628,10 +616,17 @@
_a += 180;
_textdelta = _textdelta.multiply(-1);
}
- this.text.rotate(_a - this.text_angle);
var _text = this.model.get("title");
- this.text.content = Rkns.Renderer.Utils.shortenText(_text, this.options.edge_label_max_length);
- this.text.position = this.paper_coords.add(_textdelta);
+ _text = Rkns.Renderer.Utils.shortenText(_text, this.options.node_label_max_length);
+ this.text.text(_text);
+ var _textpos = this.paper_coords.add(_textdelta);
+ this.text.css({
+ left: _textpos.x,
+ top: _textpos.y,
+ transform: "rotate(" + _a + "deg)",
+ "-moz-transform": "rotate(" + _a + "deg)",
+ "-webkit-transform": "rotate(" + _a + "deg)"
+ });
this.text_angle = _a;
if (this.options.editor_mode) {
this.edit_button.moveTo(this.paper_coords);
@@ -1212,8 +1207,8 @@
Rkns.Renderer.NodeRemoveButton.prototype._init = function() {
this.type = "Node-remove-button";
this.lastSectorInner = 0;
- this.startAngle = 90;
- this.endAngle = 180;
+ this.startAngle = 0;
+ this.endAngle = 90;
this.imageFile = 'img/remove.png';
this.text = "Remove";
}
@@ -1234,8 +1229,8 @@
Rkns.Renderer.NodeLinkButton.prototype._init = function() {
this.type = "Node-link-button";
this.lastSectorInner = 0;
- this.startAngle = 0;
- this.endAngle = 90;
+ this.startAngle = 90;
+ this.endAngle = 180;
this.imageFile = 'img/link.png';
this.text = "Link to another node";
}
@@ -1351,6 +1346,7 @@
this.$.html(this.template(_renkan));
this.onStatusChange();
this.canvas_$ = this.$.find(".Rk-Canvas");
+ this.labels_$ = this.$.find(".Rk-Labels");
this.editor_$ = this.$.find(".Rk-Editor");
this.notif_$ = this.$.find(".Rk-Notifications");
paper.setup(this.canvas_$[0]);
@@ -1409,15 +1405,19 @@
this.canvas_$.on({
mousedown: function(_event) {
+ _event.preventDefault();
_this.onMouseDown(_event, false);
},
mousemove: function(_event) {
+ _event.preventDefault();
_this.onMouseMove(_event, false);
},
mouseup: function(_event) {
+ _event.preventDefault();
_this.onMouseUp(_event, false);
},
mousewheel: function(_event, _delta) {
+ _event.preventDefault();
if (_allowScroll) {
_this.onScroll(_event, _delta);
}
@@ -1454,9 +1454,11 @@
_this.onMouseUp(_event.originalEvent.changedTouches[0], true);
},
dblclick: function(_event) {
+ _event.preventDefault();
_this.onDoubleClick(_event);
},
mouseleave: function(_event) {
+ _event.preventDefault();
_this.onMouseUp(_event, false);
_this.click_target = null;
_this.is_dragging = false;
@@ -1465,12 +1467,12 @@
_event.preventDefault();
},
dragenter: function(_event) {
+ _event.preventDefault();
_allowScroll = false;
- _event.preventDefault();
},
dragleave: function(_event) {
+ _event.preventDefault();
_allowScroll = true;
- _event.preventDefault();
},
drop: function(_event) {
_event.preventDefault();
@@ -1702,7 +1704,8 @@
+ '<%-translate("Renkan \'Drag-to-Add\' bookmarklet")%></div></div></a>'
+ '<div class="Rk-TopBar-Separator"></div>'
+ '<% } %></div><% } %>'
- + '<div class="Rk-Editing-Space<% if (!options.show_top_bar) { %> Rk-Editing-Space-Full<% } %>"><canvas class="Rk-Canvas" resize></canvas><div class="Rk-Editor"><div class="Rk-Notifications"></div>'
+ + '<div class="Rk-Editing-Space<% if (!options.show_top_bar) { %> Rk-Editing-Space-Full<% } %>">'
+ + '<div class="Rk-Labels"></div><canvas class="Rk-Canvas" resize></canvas><div class="Rk-Editor"><div class="Rk-Notifications"></div>'
+ '<% if (options.show_bins) { %><div class="Rk-Fold-Bins">«</div><% } %>'
+ '<div class="Rk-ZoomButtons"><div class="Rk-ZoomIn" title="<%-translate("Zoom In")%>"></div><div class="Rk-ZoomOut" title="<%-translate("Zoom Out")%>"></div></div>'
+ '</div></div>'