v0.6.79

CHANGELOG.md

@@ -1,3 +1,6 @@
+v0.6.79
+* [web] Added "delete point" to the point editing context menu.
+
 v0.6.78
 * [web] Combined "drag points" and "add points" tools into a single "add/edit points" tool.
 * [web] Enable point and path drawing when no layers have been added.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mapshaper",
-  "version": "0.6.78",
+  "version": "0.6.79",
   "description": "A tool for editing vector datasets for mapping and GIS.",
   "keywords": [
     "shapefile",

src/gui/gui-edit-points.mjs

@@ -6,9 +6,11 @@ import {
   deletePoint } from './gui-drawing-utils';
 import { translateDisplayPoint } from './gui-display-utils';
 import { addEmptyLayer } from './gui-add-layer-popup';
+import { showPopupAlert } from './gui-alert';
 
 export function initPointEditing(gui, ext, hit) {
-  var symbolInfo;
+  var instructionsShown = false;
+  var symbolInfo, alert;
   function active(e) {
     return gui.interaction.getMode() == 'edit_points';
   }
@@ -17,12 +19,30 @@ export function initPointEditing(gui, ext, hit) {
     return active(e) && e.id > -1;
   }
 
+  function hideInstructions() {
+    if (!alert) return;
+    alert.close('fade');
+    alert = null;
+  }
+
+  function showInstructions() {
+    var isMac = navigator.userAgent.includes('Mac');
+    var symbol = isMac ? '⌘' : '^';
+    var msg = `Instructions: Click on the map to add points. Move points by dragging. Type ${symbol}Z/${symbol}Y to undo/redo.`;
+    alert = showPopupAlert(msg, null, { non_blocking: true, max_width: '360px'});
+  }
+
   gui.on('interaction_mode_change', function(e) {
     if (e.mode == 'edit_points' && !gui.model.getActiveLayer()) {
       addEmptyLayer(gui, undefined, 'point');
     } else if (e.prev_mode == 'edit_points') {
+      hideInstructions();
       gui.container.findChild('.map-layers').classed('add-points', false);
     }
+    if (e.mode == 'edit_points' && !instructionsShown) {
+      instructionsShown = true;
+      showInstructions();
+    }
   });
 
   hit.on('contextmenu', function(e) {
@@ -48,6 +68,8 @@ export function initPointEditing(gui, ext, hit) {
 
   hit.on('click', function(e) {
     if (overPoint(e) || !active(e)) return;
+    hideInstructions();
+
     // add point
     var p = pixToDataCoords(e.x, e.y);
     var target = hit.getHitTarget();
@@ -64,6 +86,7 @@ export function initPointEditing(gui, ext, hit) {
 
   hit.on('dragstart', function(e) {
     if (!overPoint(e)) return;
+    hideInstructions();
     var target = hit.getHitTarget();
     symbolInfo = {
       FID: e.id,

www/page.css

@@ -343,17 +343,17 @@ div.alert-box {
 }
 
 .mini-drop-area {
-	border: 1.5px dashed #bbb;
-	max-width: 240px;
+	border: 1.5px dashed #999;
+	max-width: 245px;
 	border-radius: 9px;
-	font-size: 15px;
+	font-size: 14px;
 	line-height: 1.5;
-	color: #888;
-/*	background-color: #FFFEF8;*/
-	padding: 6px 4px 7px 7px;
-	padding: 11px 14px;
+/*	color: #555;*/
+	padding: 9px 11px 6px 11px;
 	margin: 9px -1px 3px -1px;
 	min-height: 120px;
+	background: #f8fdff;
+;
 }
 
 .catalog-mode .file-catalog {