prelim TLR

2025-02-02 06:08:52 +01:00
parent 80e657e55e
commit e651682e41
23 changed files with 2769 additions and 73 deletions
@@ -0,0 +1,82 @@
+import { ComponentProps, DisplayComponent, FSComponent, Subscribable, VNode } from '@microsoft/msfs-sdk';
+
+function defineDragScroll(ele: HTMLElement, horizontalScroll = true, verticalScroll = true) {
+  let pos = { top: 0, left: 0, x: 0, y: 0 };
+  const mouseDownHandler = function (e: MouseEvent) {
+    pos = {
+      // The current scroll
+      left: ele.scrollLeft,
+      top: ele.scrollTop,
+      // Get the current mouse position
+      x: e.clientX,
+      y: e.clientY,
+    };
+    document.addEventListener('mousemove', mouseMoveHandler);
+    document.addEventListener('mouseup', mouseUpHandler);
+    document.removeEventListener('mouseleave', mouseUpHandler);
+  };
+  const mouseMoveHandler = function (e: MouseEvent) {
+    // How far the mouse has been moved
+    const dx = e.clientX - pos.x;
+    const dy = e.clientY - pos.y;
+    // Scroll the element
+    if (verticalScroll) {
+      ele.scrollTop = pos.top - dy;
+    }
+    if (horizontalScroll) {
+      ele.scrollLeft = pos.left - dx;
+    }
+  };
+  const mouseUpHandler = function (e: MouseEvent) {
+    document.removeEventListener('mousemove', mouseMoveHandler);
+    document.removeEventListener('mouseup', mouseUpHandler);
+    document.removeEventListener('mouseleave', mouseUpHandler);
+  };
+  ele.addEventListener('mousedown', mouseDownHandler);
+}
+
+interface TLRProps extends ComponentProps {
+  content: Subscribable<string>;
+}
+
+export class TLR extends DisplayComponent<TLRProps> {
+  constructor(props: TLRProps) {
+    super(props);
+  }
+
+  onAfterRender() {
+    const ele = document.getElementById('KH_FE_FPLAN');
+    if (ele) defineDragScroll(ele);
+    const toIns = document.getElementById('KH_FE_FPLAN_INS');
+    if (toIns) toIns.onclick = this.toIns;
+    const toTop = document.getElementById('KH_FE_FPLAN_TOP');
+    if (toTop) toTop.onclick = this.toTop;
+  }
+
+  toIns() {
+    SimVar.SetSimVarValue('L:KH_FE_FPLAN_BOARD', 'number', 2);
+  }
+
+  toTop() {
+    const ele = document.getElementById('KH_FE_FPLAN');
+    if (ele) ele.scrollTop = 0;
+  }
+
+  public render(): VNode {
+    return (
+      <>
+        <div id="KH_FE_FPLAN">
+          <div id="TLR">
+            <div>
+              <pre>{this.props.content}</pre>
+            </div>
+          </div>
+        </div>
+        <div id="KH_CTRL">
+          <button id="KH_FE_FPLAN_TOP">To top</button>
+          <button id="KH_FE_FPLAN_INS">Switch to INS</button>
+        </div>
+      </>
+    );
+  }
+}