selectable label point issue #63

NaturalIntelligence · Oct 22, 2020 · 5983ef5 · 5983ef5
1 parent fc527e5
commit 5983ef5
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 1 deletion.
diff --git a/tags/label-panel.tag.html b/tags/label-panel.tag.html
@@ -97,7 +97,7 @@
             <ul id="fpoints-list">
                 <li class="li-fpoints grey-border" each={fPoint,fid in targetShape.featurePoints}>
                     <div class="input-group small">
-                        <span class={selectedPoint: fPoint.id === this.opts.pointId, input-group-addon: true, drag-handler: fPoint.id !== this.opts.pointId}></span>
+                        <span class={selectedPoint: fPoint.id === this.opts.pointId, input-group-addon: true, drag-handler: fPoint.id !== this.opts.pointId} onclick={updateFPointSelected}></span>
                         <input type="text" class="form-control" value="{ fPoint.label }" onchange={updateFPointLabel} placeholder="Label the feature point">
                         <div class="input-group-btn" onclick={deleteTag}>
                             <i class="icon icon-trash-empty"></i>
@@ -112,6 +112,11 @@
         tag.targetShape = getShape(this.opts.id);
         tag.tags = tag.targetShape.tags.join(", ");
 
+        tag.updateFPointSelected = function(e){
+            eventBus.trigger('selectFeaturePoint', e.item.fPoint.id, opts.id);
+            e.stopPropagation();
+        }
+
         tag.updateTags = function(e){
             tag.targetShape.tags = e.target.value.split(",").map(function(item) {
                 return item.trim();

diff --git a/tags/workarea.tag.html b/tags/workarea.tag.html
@@ -193,6 +193,18 @@
 
             // Make sure label panel is initially hidden/empty
             eventBus.trigger('unmountLabelPanel');
+
+            // Listen to label point selection
+            eventBus.on('selectFeaturePoint', (f_point_id, parent_id) => {
+                let el = SVG.get(f_point_id);
+                deselectAll();
+                riot.mount('label-panel', { id : parent_id, pointId : f_point_id })
+                el.selectize({
+                    rotationPoint: false,
+                    points: []
+                });
+                selectedElements.push(el);
+            })
         });
 
         /**