feat(core): create event manager

packages/core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@thatopen/components",
   "description": "Collection of core functionalities to author BIM apps.",
-  "version": "2.4.0-alpha.2",
+  "version": "2.4.0-alpha.3",
   "author": "That Open Company",
   "contributors": [
     "Antonio Gonzalez Viegas (https://github.com/agviegas)",

packages/core/src/core/Types/src/async-event.ts

@@ -2,6 +2,11 @@
  * Simple event handler by [Jason Kleban](https://gist.github.com/JasonKleban/50cee44960c225ac1993c922563aa540). Keep in mind that if you want to remove it later, you might want to declare the callback as an object. If you want to maintain the reference to `this`, you will need to declare the callback as an arrow function.
  */
 export class AsyncEvent<T> {
+  /**
+   * Whether this event is active or not. If not, it won't trigger.
+   */
+  enabled = true;
+
   /**
    * Add a callback to this event instance.
    * @param handler - the callback to be added to this event.
@@ -28,6 +33,9 @@ export class AsyncEvent<T> {
 
   /** Triggers all the callbacks assigned to this event. */
   trigger = async (data?: T) => {
+    if (!this.enabled) {
+      return;
+    }
     const handlers = this.handlers.slice(0);
     for (const handler of handlers) {
       await handler(data as any);

packages/core/src/core/Types/src/event-manager.ts

@@ -0,0 +1,50 @@
+import { Event } from "./event";
+import { AsyncEvent } from "./async-event";
+
+/**
+ * Simple class to easily toggle and reset event lists.
+ */
+export class EventManager {
+  /**
+   * The list of events managed by this instance.
+   */
+  list = new Set<Event<any> | AsyncEvent<any>>();
+
+  /**
+   * Adds events to this manager.
+   * @param events the events to add.
+   */
+  add(events: Iterable<Event<any> | AsyncEvent<any>>) {
+    for (const event of events) {
+      this.list.add(event);
+    }
+  }
+  /**
+   * Removes events from this manager.
+   * @param events the events to remove.
+   */
+  remove(events: Iterable<Event<any> | AsyncEvent<any>>) {
+    for (const event of events) {
+      this.list.delete(event);
+    }
+  }
+
+  /**
+   * Sets all the events managed by this instance as enabled or disabled.
+   * @param active whether to turn on or off the events.
+   */
+  set(active: boolean) {
+    for (const event of this.list) {
+      event.enabled = active;
+    }
+  }
+
+  /**
+   * Resets all the events managed by this instance.
+   */
+  reset() {
+    for (const event of this.list) {
+      event.reset();
+    }
+  }
+}

packages/core/src/core/Types/src/event.ts

@@ -2,6 +2,11 @@
  * Simple event handler by [Jason Kleban](https://gist.github.com/JasonKleban/50cee44960c225ac1993c922563aa540). Keep in mind that if you want to remove it later, you might want to declare the callback as an object. If you want to maintain the reference to `this`, you will need to declare the callback as an arrow function.
  */
 export class Event<T> {
+  /**
+   * Whether this event is active or not. If not, it won't trigger.
+   */
+  enabled = true;
+
   /**
    * Add a callback to this event instance.
    * @param handler - the callback to be added to this event.
@@ -20,6 +25,9 @@ export class Event<T> {
 
   /** Triggers all the callbacks assigned to this event. */
   trigger = (data?: T) => {
+    if (!this.enabled) {
+      return;
+    }
     const handlers = this.handlers.slice(0);
     for (const handler of handlers) {
       handler(data as any);

packages/core/src/core/Types/src/index.ts

@@ -12,3 +12,4 @@ export * from "./data-set";
 export * from "./data-map";
 export * from "./component-with-ui";
 export * from "./config-types";
+export * from "./event-manager";

packages/core/src/core/Types/src/interfaces.ts

@@ -1,6 +1,7 @@
 import * as THREE from "three";
 import CameraControls from "camera-controls";
 import { Event } from "./event";
+import { EventManager } from "./event-manager";
 
 /**
  * Whether this component has to be manually destroyed once you are done with it to prevent [memory leaks](https://threejs.org/docs/#manual/en/introduction/How-to-dispose-of-objects). This also ensures that the DOM events created by that component will be cleaned up.
@@ -125,3 +126,13 @@ export interface CameraControllable {
    */
   controls: CameraControls;
 }
+
+/**
+ * Whether it has events or not.
+ */
+export interface Eventable {
+  /**
+   * The object in charge of managing all the events.
+   */
+  eventManager: EventManager;
+}