feat: web 输入支持

2025-06-28 06:44:45 +08:00 · 2024-11-07 00:34:11 +08:00
parent 1681e2407b
commit 472fdb08fb
20 changed files with 759 additions and 27 deletions
--- a/assets/web/input_method/index.html
+++ b/assets/web/input_method/index.html
@ -0,0 +1,53 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
+    <meta name="renderer" content="webkit"/>
+
+    <link rel="stylesheet" href="style/mdui2.css">
+    <link href="style/google_icons.css" rel="stylesheet">
+    <script src="js/mdui2.global.js"></script>
+    <script src="js/main.js"></script>
+    <title>SCToolBox Community Input Method Web</title>
+    <style>
+
+    </style>
+</head>
+<body>
+<div class="mdui-theme-light" style="position: relative;overflow: hidden">
+    <mdui-top-app-bar
+            scroll-behavior="shrink"
+            scroll-threshold="30"
+            scroll-target=".scroll-behavior-shrink">
+
+        <mdui-top-app-bar-title>SC汉化盒子社区输入法</mdui-top-app-bar-title>
+        <div style="flex-grow: 1"></div>
+
+        <mdui-button-icon icon="help" onclick="onShowHelp()"></mdui-button-icon>
+
+
+    </mdui-top-app-bar>
+
+    <div class="scroll-behavior-shrink" style="overflow: auto;">
+
+        <mdui-text-field id="input_message" style="padding-top: 6pt;padding-bottom: 6pt" rows="6" variant="outlined"
+                         label="输入消息..."></mdui-text-field>
+
+        <div style="text-align: end">
+            <mdui-checkbox id="auto_copy" checked>自动复制</mdui-checkbox>
+        </div>
+
+        <mdui-button id="send_button" icon="send" onclick="onSendMessage()" full-width>发送</mdui-button>
+
+    </div>
+
+    <mdui-snackbar id="snackbar_message" auto-close-delay="1000">Text</mdui-snackbar>
+</div>
+
+<script>
+    init();
+</script>
+
+</body>
+</html>
--- a/assets/web/input_method/js/main.js
+++ b/assets/web/input_method/js/main.js
@ -0,0 +1,57 @@
+async function init() {
+    try {
+        let response = await fetch("/api");
+        let responseJson = await response.json();
+        if (responseJson.status === "ok") {
+            showMessage("服务连接成功！");
+        } else {
+            showMessage("服务连接失败！" + responseJson);
+        }
+    } catch (e) {
+        showMessage("服务连接失败！" + e);
+    }
+}
+
+
+async function onSendMessage() {
+    let send_button = document.getElementById("send_button");
+    let input = document.getElementById("input_message");
+    let isAutoCopy = document.getElementById("auto_copy").checked;
+    let isAutoSend = document.getElementById("auto_send").checked;
+    let messageJson = {
+        "text": input.value,
+        "autoCopy": isAutoCopy,
+        "autoInput": isAutoSend
+    };
+    send_button.loading = true;
+    try {
+        let response = await fetch("/api/send", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json"
+            },
+            body: JSON.stringify(messageJson)
+        });
+        let responseJson = await response.json();
+        console.log(responseJson);
+        showMessage(responseJson.message);
+        if (response.ok) {
+            input.value = "";
+        }
+    } catch (e) {
+        showMessage("发送失败！" + e);
+    }
+    send_button.loading = false;
+}
+
+function showMessage(message) {
+    let snack = document.getElementById("snackbar_message");
+    snack.open = false;
+    snack.innerText = message;
+    snack.open = true;
+}
+
+function onShowHelp() {
+    alert("在浏览器中输入文本，将发送给汉化盒子转码。" +
+        "\n\n自动复制：勾选后自动复制转码结果到剪贴板。");
+}
--- a/assets/web/input_method/js/mdui2.global.js
+++ b/assets/web/input_method/js/mdui2.global.js
--- a/assets/web/input_method/style/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2
+++ b/assets/web/input_method/style/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2
--- a/assets/web/input_method/style/google_icons.css
+++ b/assets/web/input_method/style/google_icons.css
@ -0,0 +1,23 @@
+/* fallback */
+@font-face {
+    font-family: 'Material Icons';
+    font-style: normal;
+    font-weight: 400;
+    src: url(flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
+}
+
+.material-icons {
+    font-family: 'Material Icons';
+    font-weight: normal;
+    font-style: normal;
+    font-size: 24px;
+    line-height: 1;
+    letter-spacing: normal;
+    text-transform: none;
+    display: inline-block;
+    white-space: nowrap;
+    word-wrap: normal;
+    direction: ltr;
+    -webkit-font-feature-settings: 'liga';
+    -webkit-font-smoothing: antialiased;
+}
--- a/assets/web/input_method/style/mdui2.css
+++ b/assets/web/input_method/style/mdui2.css