--- a/src_js/iconolab-bundle/src/components/editor/ShapeFree.vue Mon Feb 20 17:14:08 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/ShapeFree.vue Mon Feb 20 17:29:55 2017 +0100
@@ -1,6 +1,8 @@
<template>
<g>
- <path ref="path" v-bind:d="path" stroke="#000000" fill="#bdc3c7" style="stroke-width: 10; stroke-dasharray: 20, 20; opacity: 0.6;"></path>
+ <path ref="path" v-bind:d="path" stroke="#000000" fill="#bdc3c7"
+ v-bind:stroke-width="handlerRadius / 2"
+ v-bind:stroke-dasharray="(handlerRadius / 3) + ',' + (handlerRadius / 3)" style="opacity: 0.6;"></path>
<circle
v-for="(point, key) in points"
:key="key"
@@ -9,7 +11,8 @@
v-bind:cx="point.x"
v-bind:cy="point.y"
v-bind:r="handlerRadius"
- stroke="#000000" stroke-width="10"
+ stroke="#000000"
+ v-bind:stroke-width="handlerRadius / 2"
style="opacity: 0.9;"
v-bind:class="{ handler: true, 'handler--first': key === 0 && !closed }"></circle>
</g>
@@ -42,7 +45,6 @@
closed: function(closed) {
if (closed) {
this.path += ' Z';
- setTimeout(() => this.addTooltip(), 50);
}
},
// Redraw the path when the points have changed
@@ -96,7 +98,7 @@
return this.$refs.path;
},
- fromSVGPath: function(pathString) {
+ fromSVGPath: function(pathString, tooltip) {
var segments = Snap.parsePathString(pathString);
var points = [];
@@ -114,6 +116,10 @@
this.$nextTick(() => {
this.addResizeHandlers();
+ if (tooltip) {
+ // FIXME Race condition with destroy
+ setTimeout(() => this.addTooltip(), 250);
+ }
});
},
@@ -123,14 +129,20 @@
addResizeHandler: function(handler) {
+ var self = this;
+
var circle = new Snap(handler);
var isDragged = false;
- circle.click(function(e) {
- var key = parseInt(this.attr('data-key'), 10);
- if (key === 0 && self.points.length > 2) {
- self.closed = true;
+ circle.click((e) => {
+ var key = parseInt(circle.attr('data-key'), 10);
+ if (key === 0 && this.points.length > 2) {
+ this.closed = true;
+ this.$nextTick(() => {
+ // FIXME Race condition with destroy
+ setTimeout(() => this.addTooltip(), 250);
+ });
}
});
@@ -141,8 +153,6 @@
this.points.splice(key, 1);
});
- var self = this;
-
var dragEvents = {
onMove: function(dx, dy, x, y, e) {