first commit

2026-07-16 09:35:32 +02:00
commit dd0746e2e6
179 changed files with 25679 additions and 0 deletions
@@ -0,0 +1,55 @@
+// d4rk_tablet — NUI-Shell
+// Relayt zwischen FiveM (SendNUIMessage / NUI-Callbacks) und der Web-App im iframe (postMessage).
+
+const wrap = document.getElementById('wrap');
+const iframe = document.getElementById('mdt');
+
+let pendingAuth = null; // { token, user } bis das iframe "mdt:ready" meldet
+
+function resourceName() {
+  return typeof GetParentResourceName === 'function' ? GetParentResourceName() : 'd4rk_tablet';
+}
+function nui(endpoint, body) {
+  return fetch(`https://${resourceName()}/${endpoint}`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(body || {}),
+  }).catch(() => {});
+}
+function sendAuth() {
+  if (pendingAuth && iframe.contentWindow) {
+    iframe.contentWindow.postMessage(
+      { action: 'auth', token: pendingAuth.token, user: pendingAuth.user },
+      '*',
+    );
+  }
+}
+
+// Token nachschieben, sobald das iframe fertig geladen ist
+iframe.addEventListener('load', sendAuth);
+
+window.addEventListener('message', (event) => {
+  const data = event.data || {};
+
+  // 1) Nachrichten aus der Web-App (iframe)
+  if (event.source === iframe.contentWindow) {
+    if (data.action === 'mdt:ready') sendAuth();
+    else if (data.action === 'mdt:close') nui('close');
+    else if (data.action === 'officer:setWaypoint') nui('setWaypoint', { x: data.x, y: data.y });
+    return;
+  }
+
+  // 2) Nachrichten aus FiveM (SendNUIMessage)
+  if (data.action === 'open') {
+    pendingAuth = { token: data.token, user: data.user };
+    const target = data.webUrl;
+    if (iframe.src !== target) {
+      iframe.src = target; // 'load' → sendAuth()
+    } else {
+      sendAuth(); // bereits geladen (Reopen)
+    }
+    wrap.classList.remove('hidden');
+  } else if (data.action === 'close') {
+    wrap.classList.add('hidden');
+  }
+});
@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>d4rk_tablet</title>
+    <link rel="stylesheet" href="style.css" />
+  </head>
+  <body>
+    <!-- Dünne Shell: bettet die gehostete MDT-Web-App als iframe ein und relayed Nachrichten. -->
+    <div id="wrap" class="hidden">
+      <iframe id="mdt" title="MDT" allow="clipboard-read; clipboard-write"></iframe>
+    </div>
+    <script src="app.js"></script>
+  </body>
+</html>
@@ -0,0 +1,25 @@
+html,
+body {
+  margin: 0;
+  height: 100%;
+  overflow: hidden;
+  background: transparent;
+}
+
+#wrap {
+  position: fixed;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+#wrap.hidden {
+  display: none;
+}
+
+#mdt {
+  width: 100%;
+  height: 100%;
+  border: 0;
+}