lv
/
auto-record


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
							<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>预览</title>
    <style>
      html,
      body {
        margin: 0;
        padding: 0;
        height: 100%;
        background: #1f1f1f;
        color: #fff;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
          "Microsoft YaHei", sans-serif;
        overflow: hidden;
        user-select: none;
      }
      .center {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100vh;
        width: 100vw;
      }
      img,
      video {
        max-width: 100%;
        max-height: 100%;
        display: block;
        background: #000;
      }
      .msg {
        padding: 24px;
        text-align: center;
        color: #ccc;
        font-size: 14px;
      }
      .err {
        color: #ff7875;
      }
      .hint {
        position: fixed;
        bottom: 8px;
        left: 0;
        right: 0;
        text-align: center;
        font-size: 12px;
        color: #888;
        pointer-events: none;
      }
    </style>
  </head>
  <body>
    <!-- 入口容器：根据 URL ?type=image|video & path=<abs path> 渲染对应元素 -->
    <div class="center" id="root">
      <div class="msg">加载中…</div>
    </div>
    <div class="hint" id="path-hint"></div>

    <script>
      (function () {
        var params = new URLSearchParams(location.search);
        var type = params.get("type");
        var path = params.get("path");
        var root = document.getElementById("root");
        var hint = document.getElementById("path-hint");

        if (!path || (type !== "image" && type !== "video")) {
          root.innerHTML =
            '<div class="msg err">参数错误：缺少 type 或 path</div>';
          return;
        }

        hint.textContent = path;

        // Tauri v2 在 window 注入 __TAURI__ 全局对象（依赖
        // tauri.conf.json#app.withGlobalTauri = true）。convertFileSrc
        // 会按 OS 把 fs 路径转成 asset://localhost/... 或
        // https://asset.localhost/...，再由 webview 通过 asset 协议加载文件
        var convertFileSrc =
          window.__TAURI__ &&
          window.__TAURI__.core &&
          window.__TAURI__.core.convertFileSrc;

        if (!convertFileSrc) {
          root.innerHTML =
            '<div class="msg err">未找到 __TAURI__.core.convertFileSrc，' +
            "请检查 tauri.conf.json 是否启用 withGlobalTauri</div>";
          return;
        }

        var src = convertFileSrc(path);

        root.innerHTML = "";
        if (type === "image") {
          var img = document.createElement("img");
          img.src = src;
          img.alt = path;
          img.onerror = function () {
            root.innerHTML =
              '<div class="msg err">图片加载失败<br/>' + path + "</div>";
          };
          root.appendChild(img);
        } else {
          var video = document.createElement("video");
          video.src = src;
          video.controls = true;
          video.autoplay = true;
          video.onerror = function () {
            root.innerHTML =
              '<div class="msg err">视频加载失败<br/>' + path + "</div>";
          };
          root.appendChild(video);
        }
      })();
    </script>
  </body>
</html>