From e7eb0c150056f0afbe8a943c2d962dc415e2ff3d Mon Sep 17 00:00:00 2001
From: jberg <jberg@users.noreply.github.com>
Date: Sat, 7 Sep 2019 10:29:28 -0700
Subject: [PATCH] Implement mouse position (#908)

* Implement mouse position

* move getMousePosition to utils
---
 modern/src/App.js                           |  9 +--------
 modern/src/maki-interpreter/objects.test.js |  4 ----
 modern/src/runtime/Group.ts                 | 12 +++++-------
 modern/src/runtime/PopupMenu.ts             |  2 ++
 modern/src/runtime/System.ts                | 16 +++++++++-------
 modern/src/utils.ts                         | 11 +++++++++++
 6 files changed, 28 insertions(+), 26 deletions(-)

diff --git a/modern/src/App.js b/modern/src/App.js
index 6defa008..b4b51611 100644
--- a/modern/src/App.js
+++ b/modern/src/App.js
@@ -56,8 +56,6 @@ function useJsUpdates(node) {
   useEffect(() => node.js_listen("js_update", forceUpdate));
 }
 
-let mouseposition;
-
 function handleMouseEventDispatch(node, event, eventName) {
   event.stopPropagation();
 
@@ -73,10 +71,6 @@ function handleMouseEventDispatch(node, event, eventName) {
   const y = clientY - (Number(container.attributes.y) || 0);
   node.js_trigger(eventName, x, y);
 
-  if (event.nativeEvent.type === "mousemove") {
-    mouseposition = { x: clientX, y: clientY };
-  }
-
   if (event.nativeEvent.type === "mousedown") {
     // We need to persist the react event so we can access the target
     event.persist();
@@ -465,7 +459,7 @@ function Button({
   );
 }
 
-function Popupmenu({ id, node }) {
+function Popupmenu({ id, node, x, y }) {
   const children = node.commands.map(item => {
     if (item.id === "seperator") {
       return <li />;
@@ -481,7 +475,6 @@ function Popupmenu({ id, node }) {
       </li>
     );
   });
-  const { x, y } = mouseposition;
   // TODO: Actually properly style element
   return (
     <div
diff --git a/modern/src/maki-interpreter/objects.test.js b/modern/src/maki-interpreter/objects.test.js
index 3f534be8..eca8f84f 100644
--- a/modern/src/maki-interpreter/objects.test.js
+++ b/modern/src/maki-interpreter/objects.test.js
@@ -146,8 +146,6 @@ Set {
   "System.seteqband",
   "System.seteqpreamp",
   "System.seteq",
-  "System.getmouseposx",
-  "System.getmouseposy",
   "System.integertolongtime",
   "System.integertotime",
   "System.datetotime",
@@ -268,8 +266,6 @@ Set {
   "Group.getnumobjects",
   "Group.enumobject",
   "Group.oncreateobject",
-  "Group.getmouseposx",
-  "Group.getmouseposy",
   "Group.islayout",
   "GuiObject.onsetvisible",
   "GuiObject.getalpha",
diff --git a/modern/src/runtime/Group.ts b/modern/src/runtime/Group.ts
index daee7628..5572fb80 100644
--- a/modern/src/runtime/Group.ts
+++ b/modern/src/runtime/Group.ts
@@ -1,5 +1,5 @@
 import GuiObject from "./GuiObject";
-import { unimplementedWarning } from "../utils";
+import { getMousePosition, unimplementedWarning } from "../utils";
 
 class Group extends GuiObject {
   /**
@@ -32,14 +32,12 @@ class Group extends GuiObject {
     return;
   }
 
-  getmouseposx() {
-    unimplementedWarning("getmouseposx");
-    return;
+  getmouseposx(): number {
+    return getMousePosition().x;
   }
 
-  getmouseposy() {
-    unimplementedWarning("getmouseposy");
-    return;
+  getmouseposy(): number {
+    return getMousePosition().y;
   }
 
   islayout() {
diff --git a/modern/src/runtime/PopupMenu.ts b/modern/src/runtime/PopupMenu.ts
index dd743330..f2b82580 100644
--- a/modern/src/runtime/PopupMenu.ts
+++ b/modern/src/runtime/PopupMenu.ts
@@ -42,6 +42,8 @@ class PopupMenu extends MakiObject {
   }
 
   popatmouse() {
+    this.attributes.x = this.parent.getmouseposx();
+    this.attributes.y = this.parent.getmouseposy();
     return new Promise(resolve => {
       this.js_selectCommand = value => {
         this.parent.js_removeChild(this);
diff --git a/modern/src/runtime/System.ts b/modern/src/runtime/System.ts
index 14cf055c..670d5ff6 100644
--- a/modern/src/runtime/System.ts
+++ b/modern/src/runtime/System.ts
@@ -1,6 +1,10 @@
 import Group from "./Group";
 import MakiObject from "./MakiObject";
-import { findDescendantByTypeAndId, unimplementedWarning } from "../utils";
+import {
+  findDescendantByTypeAndId,
+  getMousePosition,
+  unimplementedWarning,
+} from "../utils";
 import * as Actions from "../Actions";
 import * as Selectors from "../Selectors";
 
@@ -372,14 +376,12 @@ class System extends MakiObject {
     return;
   }
 
-  getmouseposx() {
-    unimplementedWarning("getmouseposx");
-    return;
+  getmouseposx(): number {
+    return getMousePosition().x;
   }
 
-  getmouseposy() {
-    unimplementedWarning("getmouseposy");
-    return;
+  getmouseposy(): number {
+    return getMousePosition().y;
   }
 
   floattostring(value: number, ndigits: number): string {
diff --git a/modern/src/utils.ts b/modern/src/utils.ts
index a12e9718..d0c85abb 100644
--- a/modern/src/utils.ts
+++ b/modern/src/utils.ts
@@ -310,3 +310,14 @@ export async function getSizeFromUrl(
   const { width, height } = await loadImage(imgUrl);
   return { width, height };
 }
+
+let mousePosition = { x: 0, y: 0 };
+function handleMouseMove(e) {
+  mousePosition = { x: e.clientX, y: e.clientY };
+}
+
+document.addEventListener("mousemove", handleMouseMove);
+
+export function getMousePosition() {
+  return mousePosition;
+}