OHIF-223: Add "Clear" all measurements to annotation toolbar (#1861)

* Add clear button

* Use james event

* Create new commands module to default

platform/core/src/services/MeasurementService/MeasurementService.js

@@ -52,6 +52,7 @@ const EVENTS = {
   MEASUREMENT_UPDATED: 'event::measurement_updated',
   MEASUREMENT_ADDED: 'event::measurement_added',
   MEASUREMENT_REMOVED: 'event::measurement_removed',
+  MEASUREMENTS_CLEARED: 'event::measurements_cleared',
 };
 
 const VALUE_TYPES = {
@@ -500,6 +501,14 @@ class MeasurementService {
     }
   }
 
+  /**
+   * Clear all measurements and broadcasts cleared event.
+   */
+  clear() {
+    this.measurements = {};
+    this._broadcastChange(this.EVENTS.MEASUREMENTS_CLEARED);
+  }
+
   /**
    * Get measurement mapping function if matching criteria.
    *
@@ -559,15 +568,27 @@ class MeasurementService {
   /**
    * Broadcasts measurement changes.
    *
-   * @param {string} measurementId The measurement id
-   * @param {MeasurementSource} source The measurement source
    * @param {string} eventName The event name
+   * @param {MeasurementSource} source The measurement source
+   * @param {string} measurement The measurement id
    * @return void
    */
   _broadcastChange(eventName, source, measurement) {
     const hasListeners = Object.keys(this.listeners).length > 0;
     const hasCallbacks = Array.isArray(this.listeners[eventName]);
 
+    if (!source) {
+      /* Broadcast to all sources */
+      /* Object.keys(this.sources).forEach(source => {
+        if (hasListeners && hasCallbacks) {
+          this.listeners[eventName].forEach(listener => {
+            listener.callback({ source, measurement });
+          });
+        }
+      });
+      return; */
+    }
+
     if (hasListeners && hasCallbacks) {
       this.listeners[eventName].forEach(listener => {
         listener.callback({ source, measurement });

platform/ui/src/assets/icons/old-trash.svg

@@ -0,0 +1,9 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 448 512"
+  aria-labelledby="title"
+  fill="currentColor"
+>
+  <title id="title">Trash</title>
+  <path d="M32 464a48 48 0 0 0 48 48h288a48 48 0 0 0 48-48V128H32zm272-256a16 16 0 0 1 32 0v224a16 16 0 0 1-32 0zm-96 0a16 16 0 0 1 32 0v224a16 16 0 0 1-32 0zm-96 0a16 16 0 0 1 32 0v224a16 16 0 0 1-32 0zM432 32H312l-9.4-18.7A24 24 0 0 0 281.1 0H166.8a23.72 23.72 0 0 0-21.4 13.3L136 32H16A16 16 0 0 0 0 48v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16V48a16 16 0 0 0-16-16z" />
+</svg>

platform/ui/src/components/Icon/getIcon.jsx

@@ -57,6 +57,7 @@ import oldDotCircle from './../../assets/icons/old-dot-circle.svg';
 import oldAngleLeft from './../../assets/icons/old-angle-left.svg';
 import oldReset from './../../assets/icons/old-reset.svg';
 import oldCircleO from './../../assets/icons/old-circle-o.svg';
+import oldTrash from './../../assets/icons/old-trash.svg';
 
 const ICONS = {
   'arrow-down': arrowDown,
@@ -114,7 +115,8 @@ const ICONS = {
   'old-dot-circle': oldDotCircle,
   'old-angle-left': oldAngleLeft,
   'old-reset': oldReset,
-  'old-circle-o': oldCircleO
+  'old-circle-o': oldCircleO,
+  'old-trash': oldTrash
 };
 
 /**

platform/viewer/src/appInit.js

@@ -33,7 +33,7 @@ function appInit(appConfigOrFunc, defaultExtensions) {
     /** Used by commands to inject `viewports` from "redux" */
     getAppState: () => { },
     /** Used by commands to determine active context */
-    getActiveContexts: () => ['VIEWER', 'ACTIVE_VIEWPORT::CORNERSTONE'],
+    getActiveContexts: () => ['VIEWER', 'DEFAULT', 'ACTIVE_VIEWPORT::CORNERSTONE'],
   };
 
   const servicesManager = new ServicesManager();