From 5ffb5c1d55397162a419945eb81b942fad6603fc Mon Sep 17 00:00:00 2001
From: Jeremy Chone <jeremy.chone@gmail.com>
Date: Mon, 20 Jun 2022 12:43:09 -0700
Subject: . full code

---
 src-ui/src/main.ts | 33 ++++++++++++++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

(limited to 'src-ui/src')

diff --git a/src-ui/src/main.ts b/src-ui/src/main.ts
index aa31bb93..6492a32a 100644
--- a/src-ui/src/main.ts
+++ b/src-ui/src/main.ts
@@ -1,4 +1,35 @@
+import { invoke } from '@tauri-apps/api';
+import { Event as TauriEvent, listen } from '@tauri-apps/api/event';
+const $ = document.querySelector.bind(document);
 
 document.addEventListener("DOMContentLoaded", async function () {
-  document.body.textContent = "Hello from main.ts";
+  // get the elements
+  const helloEl = $("div.hello") as HTMLElement;
+  const counterButtonEl = $("counter-button") as HTMLElement;
+  const counterResultEl = $("counter-result") as HTMLElement;
+  const pingEl = $("backend-ping") as HTMLElement;
+
+  // listen backend-ping event
+  listen("backend-ping", function (evt: TauriEvent<any>) {
+    pingEl.classList.add("on");
+    setTimeout(function () {
+      pingEl.classList.remove("on")
+    }, 500);
+  })
+
+  // counter button click
+  counterButtonEl.addEventListener("pointerup", async function () {
+    const result = await invoke("add_count", { num: 3 }) as string;
+    counterResultEl.textContent = result;
+  });
+
+  // hello click
+  helloEl.addEventListener("pointerup", async function () {
+    const result = await invoke("hello_world") as string;
+    helloEl.textContent = result;
+    setTimeout(function () {
+      helloEl.textContent = "Click again";
+    }, 1000);
+  });
+
 });
\ No newline at end of file
-- 
cgit v1.2.3