updated: hacky note hovering; todo: complete note click handling

modules/behavior/hover.js

@@ -111,14 +111,9 @@ export function behaviorHover(context) {
                 .classed('hover-suppressed', false);
 
             var entity;
-            if (datum instanceof osmEntity) {
+            if (datum instanceof osmNote || datum instanceof osmEntity) {
                 entity = datum;
-            }
-            // TODO: TAH - reintroduce if we need a check for osmNote here
-            // else if (datum instanceof osmNote) {
-            //     entity = datum;
-            // }
-             else {
+            } else {
                 entity = datum && datum.properties && datum.properties.entity;
             }
 
@@ -130,7 +125,7 @@ export function behaviorHover(context) {
                     return;
                 }
 
-                var selector = '.' + entity.id;
+                var selector =  (datum instanceof osmNote) ? 'note-' + entity.id : '.' + entity.id;
 
                 if (entity.type === 'relation') {
                     entity.members.forEach(function(member) {
@@ -143,7 +138,11 @@ export function behaviorHover(context) {
                 _selection.selectAll(selector)
                     .classed(suppressed ? 'hover-suppressed' : 'hover', true);
 
-                dispatch.call('hover', this, !suppressed && entity.id);
+                if (datum instanceof osmNote) {
+                    dispatch.call('hover', this, !suppressed && entity);
+                } else {
+                    dispatch.call('hover', this, !suppressed && entity.id);
+                }
 
             } else {
                 dispatch.call('hover', this, null);

modules/behavior/select.js

@@ -13,7 +13,10 @@ import {
     modeSelect
 } from '../modes';
 
-import { osmEntity } from '../osm';
+import {
+    osmEntity,
+    osmNote
+} from '../osm';
 
 
 export function behaviorSelect(context) {
@@ -115,14 +118,19 @@ export function behaviorSelect(context) {
         var datum = d3_event.target.__data__ || (lastMouse && lastMouse.target.__data__);
         var mode = context.mode();
 
-        var entity = datum && datum.properties && datum.properties.entity;
+        var entity;
+
+        // check if datum is a note
+        if (datum instanceof osmNote) { entity = datum; }
+        else { entity = datum && datum.properties && datum.properties.entity; }
+
         if (entity) datum = entity;
 
         if (datum && datum.type === 'midpoint') {
             datum = datum.parents[0];
         }
 
-        if (!(datum instanceof osmEntity)) {
+        if (!(datum instanceof osmEntity) && !(datum instanceof osmNote)) {
             // clicked nothing..
             if (!isMultiselect && mode.id !== 'browse') {
                 context.enter(modeBrowse(context));

modules/svg/notes.js

@@ -3,6 +3,8 @@ import { select as d3_select } from 'd3-selection';
 import { svgPointTransform } from './index';
 import { services } from '../services';
 
+import { osmNote } from '../osm';
+
 import { uiNoteEditor } from '../ui';
 
 export function svgNotes(projection, context, dispatch) {
@@ -62,36 +64,6 @@ export function svgNotes(projection, context, dispatch) {
             .on('end', editOff);
     }
 
-
-    function click(which) {
-        _selected = which;
-        context.map().centerEase(which.loc);
-
-        layer.selectAll('.note')
-            .classed('selected', function(d) { return d === _selected; });
-
-        context.ui().sidebar.show(noteEditor, which);
-    }
-
-
-    function mouseover(which) {
-        layer.selectAll('.note')
-            .classed('hovered', function(d) { return d === which; });
-
-        context.ui().sidebar.show(noteEditor, which);
-    }
-
-
-    function mouseout() {
-        layer.selectAll('.note')
-            .classed('hovered', false);
-
-        // TODO: check if the item was clicked. If so, it should remain on the sidebar.
-        // TODO: handle multi-clicks. Otherwise, utilize behavior/select.js
-        context.ui().sidebar.hide();
-    }
-
-
     function update() {
         var service = getService();
         var data = (service ? service.notes(projection) : []);
@@ -106,10 +78,7 @@ export function svgNotes(projection, context, dispatch) {
         // enter
         var notesEnter = notes.enter()
             .append('g')
-            .attr('class', function(d) { return 'note note-' + d.id + ' ' + d.status; })
-            .on('click', click)
-            .on('mouseover', mouseover)
-            .on('mouseout', mouseout);
+            .attr('class', function(d) { return 'note note-' + d.id + ' ' + d.status; });
 
         notesEnter
             .append('use')

modules/ui/sidebar.js

@@ -3,24 +3,16 @@ import { uiFeatureList } from './feature_list';
 import { uiInspector } from './inspector';
 import { uiNoteEditor } from './note_editor';
 
+import {
+    osmNote
+} from '../osm';
+
 export function uiSidebar(context) {
 
     var inspector = uiInspector(context),
         noteEditor = uiNoteEditor(context),
         current,
-        wasNote;
-
-    function isNote(id) {
-        var isNote = (id && id.slice(0,4) === 'note') ? id.slice(0,4) : null;
-        // TODO: have a better check, perhaps see if the hover class is activated on a note
-        if (!isNote && wasNote) {
-            wasNote = false;
-            sidebar.hide();
-        } else if (isNote) {
-            wasNote = true;
-            sidebar.show(noteEditor);
-        }
-    }
+        wasNote = false;
 
     function sidebar(selection) {
         var featureListWrap = selection
@@ -34,10 +26,12 @@ export function uiSidebar(context) {
             .attr('class', 'inspector-hidden inspector-wrap fr');
 
 
-        function hover(id) {
-            // isNote(id); TODO: instantiate check if needed
-
-            if (!current && context.hasEntity(id)) {
+        function hover(what) {
+            if ((what instanceof osmNote)) {
+                wasNote = true;
+                context.ui().sidebar.show(noteEditor, what);
+            }
+            else if (!current && context.hasEntity(what)) {
                 featureListWrap
                     .classed('inspector-hidden', true);
 
@@ -45,10 +39,10 @@ export function uiSidebar(context) {
                     .classed('inspector-hidden', false)
                     .classed('inspector-hover', true);
 
-                if (inspector.entityID() !== id || inspector.state() !== 'hover') {
+                if (inspector.entityID() !== what || inspector.state() !== 'hover') {
                     inspector
                         .state('hover')
-                        .entityID(id);
+                        .entityID(what);
 
                     inspectorWrap
                         .call(inspector);
@@ -61,8 +55,10 @@ export function uiSidebar(context) {
                     .classed('inspector-hidden', true);
                 inspector
                     .state('hide');
+            } else if (wasNote) {
+                wasNote = false;
+                context.ui().sidebar.hide();
             }
-            // } // TODO: - remove if note check logic is moved
         }