Forward haptic events to external apps (#3116)

* Forward haptic events to external apps

* Fix types

src/external_app/external_events_forwarder.ts

@@ -8,3 +8,8 @@ export const externalForwardConnectionEvents = (bus: ExternalMessaging) => {
     })
   );
 };
+
+export const externalForwardHaptics = (bus: ExternalMessaging) =>
+  document.addEventListener("haptic", (ev) =>
+    bus.fireMessage({ type: "haptic", payload: { hapticType: ev.detail } })
+  );

src/external_app/external_messaging.ts

@@ -1,4 +1,7 @@
-import { externalForwardConnectionEvents } from "./external_events_forwarder";
+import {
+  externalForwardConnectionEvents,
+  externalForwardHaptics,
+} from "./external_events_forwarder";
 
 const CALLBACK_EXTERNAL_BUS = "externalBus";
 
@@ -41,6 +44,7 @@ export class ExternalMessaging {
 
   public attach() {
     externalForwardConnectionEvents(this);
+    externalForwardHaptics(this);
     window[CALLBACK_EXTERNAL_BUS] = (msg) => this.receiveMessage(msg);
   }
 

src/util/haptics.ts

@@ -2,7 +2,7 @@
  * Utility function that enables haptic feedback
  */
 
-import { fireEvent } from "../common/dom/fire_event";
+import { fireEvent, HASSDomEvent } from "../common/dom/fire_event";
 
 // Allowed types are from iOS HIG.
 // https://developer.apple.com/design/human-interface-guidelines/ios/user-interaction/feedback/#haptics
@@ -21,6 +21,10 @@ declare global {
   interface HASSDomEvents {
     haptic: HapticType;
   }
+
+  interface GlobalEventHandlersEventMap {
+    haptic: HASSDomEvent<HapticType>;
+  }
 }
 
 export const forwardHaptic = (el: HTMLElement, hapticType: HapticType) => {