@wowlabtech/mini-app-adapter 0.2.2 → 0.2.3

package/dist/index.js

@@ -421,7 +421,7 @@ async function startHtml5Qrcode() {
   if (typeof document === "undefined") {
     throw new Error("QR scanning requires a browser environment.");
   }
-  const [{ Html5Qrcode: Html5Qrcode2 }] = await Promise.all([import("html5-qrcode")]);
+  const [{ Html5Qrcode }] = await Promise.all([import("html5-qrcode")]);
   return new Promise((resolve, reject) => {
     const elementId = `native-shell-qr-${Date.now()}`;
     const overlay = document.createElement("div");
@@ -458,7 +458,7 @@ async function startHtml5Qrcode() {
     const previousOverflow = document.body.style.overflow;
     document.body.style.overflow = "hidden";
     let disposed = false;
-    const scanner = new Html5Qrcode2(elementId);
+    const scanner = new Html5Qrcode(elementId);
     const cleanup = async (result, error) => {
       if (disposed) {
         return;
@@ -2376,7 +2376,7 @@ var VKMiniAppAdapter = class extends BaseMiniAppAdapter {
 };
 
 // src/adapters/webAdapter.ts
-import { Html5Qrcode } from "html5-qrcode";
+import jsQR from "jsqr";
 var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
   constructor() {
     super("web", {
@@ -2446,14 +2446,31 @@ var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
       closeBtn.style.cursor = "pointer";
       closeBtn.style.zIndex = "9999999999";
       overlay.appendChild(closeBtn);
+      const scanSize = Math.min(Math.floor(Math.min(window.innerWidth, window.innerHeight) * 0.72), 320);
+      const scanBox = document.createElement("div");
+      scanBox.style.width = `${scanSize}px`;
+      scanBox.style.height = `${scanSize}px`;
+      scanBox.style.position = "relative";
+      scanBox.style.flex = "0 0 auto";
+      scanBox.style.borderRadius = "18px";
+      scanBox.style.overflow = "hidden";
+      overlay.appendChild(scanBox);
       const scanArea = document.createElement("div");
-      scanArea.id = "qr-reader";
-      scanArea.style.width = "300px";
-      scanArea.style.height = "300px";
-      scanArea.style.borderRadius = "18px";
-      scanArea.style.overflow = "hidden";
-      scanArea.style.position = "relative";
-      overlay.appendChild(scanArea);
+      scanArea.style.position = "absolute";
+      scanArea.style.inset = "0";
+      scanArea.style.zIndex = "1";
+      scanArea.style.background = "#000";
+      scanBox.appendChild(scanArea);
+      const video = document.createElement("video");
+      video.setAttribute("playsinline", "true");
+      video.autoplay = true;
+      video.muted = true;
+      video.style.width = "100%";
+      video.style.height = "100%";
+      video.style.objectFit = "cover";
+      video.style.position = "absolute";
+      video.style.inset = "0";
+      scanArea.appendChild(video);
       const frame = document.createElement("div");
       frame.style.position = "absolute";
       frame.style.top = "0";
@@ -2463,8 +2480,8 @@ var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
       frame.style.border = "3px solid rgba(255,255,255,0.9)";
       frame.style.borderRadius = "18px";
       frame.style.pointerEvents = "none";
-      frame.style.zIndex = "10";
-      scanArea.appendChild(frame);
+      frame.style.zIndex = "3";
+      scanBox.appendChild(frame);
       const line = document.createElement("div");
       line.style.position = "absolute";
       line.style.left = "0";
@@ -2473,8 +2490,8 @@ var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
       line.style.background = "rgba(255,255,255,0.85)";
       line.style.borderRadius = "2px";
       line.style.animation = "qr-line 2s infinite";
-      line.style.zIndex = "11";
-      scanArea.appendChild(line);
+      line.style.zIndex = "4";
+      scanBox.appendChild(line);
       const styleTag = document.createElement("style");
       styleTag.innerHTML = `
         @keyframes qr-line {
@@ -2491,17 +2508,26 @@ var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
       hint.style.fontSize = "17px";
       hint.style.opacity = "0.9";
       overlay.appendChild(hint);
-      const scanner = new Html5Qrcode("qr-reader");
+      const canvas = document.createElement("canvas");
+      const context = canvas.getContext("2d", { willReadFrequently: true });
+      let stream = null;
+      let rafId = null;
+      let lastScanAt = 0;
       let closed = false;
       const finalize = async (result) => {
         if (closed) {
           return;
         }
         closed = true;
-        try {
-          await scanner.stop();
-        } catch {
+        if (rafId !== null) {
+          cancelAnimationFrame(rafId);
+          rafId = null;
         }
+        if (stream) {
+          stream.getTracks().forEach((track) => track.stop());
+          stream = null;
+        }
+        video.srcObject = null;
         overlay.remove();
         styleTag.remove();
         document.body.style.overflow = prevOverflow;
@@ -2520,19 +2546,50 @@ var WebMiniAppAdapter = class extends BaseMiniAppAdapter {
       };
       closeBtn.onclick = () => closeScanner(null);
       try {
-        await scanner.start(
-          { facingMode: "environment" },
-          {
-            fps: 10,
-            qrbox: { width: 250, height: 250 },
-            aspectRatio: 1
-          },
-          (decodedText) => {
-            closeScanner(decodedText);
-          },
-          () => {
+        const constraints = [
+          { video: { facingMode: { ideal: "environment" } }, audio: false },
+          { video: { facingMode: "environment" }, audio: false },
+          { video: true, audio: false }
+        ];
+        let lastError = null;
+        for (const constraint of constraints) {
+          try {
+            stream = await navigator.mediaDevices.getUserMedia(constraint);
+            break;
+          } catch (error) {
+            lastError = error;
+          }
+        }
+        if (!stream) {
+          throw lastError instanceof Error ? lastError : new Error("Unable to access camera");
+        }
+        video.srcObject = stream;
+        await video.play();
+        const scanFrame = (now) => {
+          if (closed) {
+            return;
           }
-        );
+          if (now - lastScanAt >= 100 && context && video.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA) {
+            const width = video.videoWidth;
+            const height = video.videoHeight;
+            if (width > 0 && height > 0) {
+              canvas.width = width;
+              canvas.height = height;
+              context.drawImage(video, 0, 0, width, height);
+              const imageData = context.getImageData(0, 0, width, height);
+              const result = jsQR(imageData.data, width, height, {
+                inversionAttempts: "attemptBoth"
+              });
+              if (result?.data) {
+                closeScanner(result.data);
+                return;
+              }
+              lastScanAt = now;
+            }
+          }
+          rafId = requestAnimationFrame(scanFrame);
+        };
+        rafId = requestAnimationFrame(scanFrame);
       } catch (error) {
         console.error("QR Start error", error);
         closeScanner(null);
@@ -2585,6 +2642,8 @@ ${url}` : url;
 };
 
 // src/adapters/index.ts
+var CONFIRMED_PLATFORM_STORAGE_KEY = "mini-app-adapter:confirmed-platform";
+var CONFIRMED_PLATFORM_TTL_MS = 30 * 60 * 1e3;
 function detectPlatform() {
   if (typeof window === "undefined") {
     return "web";
@@ -2596,30 +2655,76 @@ function detectPlatform() {
   })();
   const getParam = (name) => searchParams.get(name) ?? hashParams.get(name);
   const hasParam = (...names) => names.some((name) => getParam(name));
+  const readConfirmedPlatform = () => {
+    try {
+      const raw = window.sessionStorage.getItem(CONFIRMED_PLATFORM_STORAGE_KEY);
+      if (!raw) {
+        return null;
+      }
+      const parsed = JSON.parse(raw);
+      if (!parsed?.platform || typeof parsed.ts !== "number") {
+        return null;
+      }
+      if (Date.now() - parsed.ts > CONFIRMED_PLATFORM_TTL_MS) {
+        return null;
+      }
+      return parsed.platform;
+    } catch {
+      return null;
+    }
+  };
+  const persistConfirmedPlatform = (platform) => {
+    if (platform === "web") {
+      return;
+    }
+    try {
+      window.sessionStorage.setItem(
+        CONFIRMED_PLATFORM_STORAGE_KEY,
+        JSON.stringify({ platform, ts: Date.now() })
+      );
+    } catch {
+    }
+  };
   const shellPlatform = readShellPlatform();
   if (shellPlatform) {
+    persistConfirmedPlatform(shellPlatform);
     return shellPlatform;
   }
   const userAgent = navigator.userAgent.toLowerCase();
   const hasNativeBridge = typeof window.NativeBridge?.postMessage === "function";
   if (hasNativeBridge) {
     if (userAgent.includes("android")) {
+      persistConfirmedPlatform("shell_android");
       return "shell_android";
     }
+    persistConfirmedPlatform("shell_ios");
     return "shell_ios";
   }
-  if (window.Telegram?.WebApp || hasParam("tgWebAppPlatform", "tgWebAppVersion", "tgWebAppData", "tgWebAppLanguage") || userAgent.includes("telegram")) {
+  const telegramGlobals = window;
+  const hasTelegramGlobal = Boolean(window.Telegram?.WebApp) || typeof telegramGlobals.TelegramWebviewProxy !== "undefined" || typeof telegramGlobals.TelegramGameProxy !== "undefined";
+  const hasTelegramParams = hasParam("tgWebAppPlatform", "tgWebAppVersion", "tgWebAppData", "tgWebAppLanguage");
+  if (hasTelegramGlobal || hasTelegramParams || userAgent.includes("telegram")) {
+    persistConfirmedPlatform("telegram");
     return "telegram";
   }
   if (window.WebApp) {
+    persistConfirmedPlatform("max");
     return "max";
   }
   if (window.MaxMiniApp) {
+    persistConfirmedPlatform("max");
     return "max";
   }
-  if (hasParam("vk_app_id", "vk_platform")) {
+  const hasVkParams = hasParam("vk_app_id", "vk_platform", "vk_user_id", "vk_language", "sign");
+  const hasVkUserAgentSignal = userAgent.includes("vkclient") || userAgent.includes("vk-android") || userAgent.includes("vkontakte");
+  if (hasVkParams || hasVkUserAgentSignal) {
+    persistConfirmedPlatform("vk");
     return "vk";
   }
+  const confirmedPlatform = readConfirmedPlatform();
+  if (confirmedPlatform && confirmedPlatform !== "web") {
+    return confirmedPlatform;
+  }
   return "web";
 }
 function createAdapter(input) {
@@ -2820,14 +2925,18 @@ var cachedPlatform = null;
 function getPlatform() {
   const adapter = getActiveAdapter();
   if (adapter) {
-    cachedPlatform = adapter.platform;
+    if (adapter.platform !== "web") {
+      cachedPlatform = adapter.platform;
+    }
     return adapter.platform;
   }
-  if (cachedPlatform) {
+  if (cachedPlatform && cachedPlatform !== "web") {
     return cachedPlatform;
   }
   const detectedPlatform = detectPlatform();
-  cachedPlatform = detectedPlatform;
+  if (detectedPlatform !== "web") {
+    cachedPlatform = detectedPlatform;
+  }
   return detectedPlatform;
 }