| <!DOCTYPE html> |
| <html lang="zh-CN"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> |
| <title>🤗─=≡Σ((( つ•̀ω•́)つ</title> |
| <link rel="shortcut icon" href="https://huggingface.co/front/assets/huggingface_logo-noborder.svg" /> |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> |
| |
| <link rel="stylesheet" href="style.css"> |
| </head> |
| <body> |
|
|
| <div class="sticky-header-wrapper"> |
| <div class="filter-bar"> |
| <div id="stats"> |
| <div id="total">总数：<span>0</span></div> |
| <div id="chinese">汉字：<span>0</span></div> |
| <div id="punctuation">标点：<span>0</span></div> |
| <div id="alphabet">字母：<span>0</span></div> |
| <div id="numbers">数字：<span>0</span></div> |
| <div id="duplicate">重复：<span>0</span></div> |
| <div id="replace-count">替换：<span>0</span></div> |
| <div id="regex-replace-count">正则：<span>0</span></div> |
| </div> |
| <input type="password" id="globalApiKey" class="global-key-input" placeholder="输入全局 API 密钥 (poixe-xxx)"> |
| <a href="https://poixe.com/i/realfake" target="_blank" class="tag-btn">获取API</a> |
| <a href="https://gemini.google.com" target="_blank" class="tag-btn">谷歌模型</a> |
| <a href="https://labs.google/fx/zh/tools/flow" target="_blank" class="tag-btn">谷歌香蕉</a> |
| <a href="https://cloudstudio.net/" target="_blank" class="tag-btn">腾讯算力</a> |
| <button class="tag-btn" id="btnClearOutput" style="color: #ef4444; border-color: #fca5a5;">🗑️ 清除缓存</button> |
| </div> |
| </div> |
|
|
| <div class="workspace"> |
|
|
| <div class="editor-panel"> |
| <div class="editor-tabs"> |
| <button class="editor-tab active" id="tab-text" onclick="switchTab('text')">📝 文本编辑区</button> |
| <button class="editor-tab" id="tab-chat" onclick="switchTab('chat')">💬 智能对话区</button> |
| <button class="editor-tab" id="tab-image" onclick="switchTab('image')">🖼️ 图像生成区</button> |
| <button class="editor-tab" id="tab-media" onclick="switchTab('media')">🎬 媒体解析区</button> |
| <button class="editor-tab" id="tab-api" onclick="switchTab('api')">📡 API 日志</button> |
| </div> |
|
|
| <div class="error-msg" id="errorMsg"></div> |
|
|
| <div id="view-text" class="workspace-view" style="display: flex;"> |
| <div class="view-header"> |
| <div class="view-header-title">📝 文本处理模式</div> |
| <div class="view-header-controls"> |
| <select id="textModelSelect" class="glass-input" style="width: auto; margin-bottom: 0; padding: 6px 30px 6px 10px; height: 34px;"> |
| <option value="gemini-3.1-pro-preview">gemini-3.1-pro-preview</option> |
| </select> |
| <button id="aiProcessTextBtn" class="btn bg-blue" style="padding: 6px 15px;">🤖 AI 处理文本</button> |
| </div> |
| </div> |
| <textarea id="textarea" placeholder="非数字：[^0-9]* |
| 中文字符的正则表达式：[\u4e00-\u9fa5] |
| 长度为3-20的所有字符：.{3,20} |
| 由数字和26个英文字母组成的字符串：[A-Za-z0-9]+ |
| 由数字、26个英文字母或者下划线组成的字符串：\w+ 或 \w{3,20} |
| |
| curl.exe -o NUL http://speedtest.tele2.net/10GB.zip |
| |
| sudo passwd root |
| grep -rn 'py' /home/ |
| rm -rf /* |
| |
| conda create -n python38 python=3.8 # 创建虚拟环境 |
| conda activate python38 # 切换虚拟环境 |
| conda remove -n python38 --all # 删除虚拟环境 |
| conda create -n python38 --clone old_python38 # 克隆虚拟环境 |
| conda list # 列出已安装的包 |
| conda env list # 列出所有虚拟环境 |
| |
| tracert baidu.cn |
| Get-ChildItem -Recurse -File | Select-String -Pattern # 双引号 Windows 搜索"></textarea> |
| </div> |
|
|
| <div id="view-chat" class="workspace-view" style="display: none;"> |
| <div class="view-header"> |
| <div class="view-header-title">💬 智能连续对话</div> |
| <div class="view-header-controls"> |
| <select id="chatModelSelect" class="glass-input" style="width: auto; margin-bottom: 0; padding: 6px 30px 6px 10px; height: 34px;"> |
| <option value="gemini-3.1-pro-preview">gemini-3.1-pro-preview</option> |
| </select> |
| </div> |
| </div> |
| <div id="chatHistory" class="chat-history"> |
| <div style="color: var(--text-tertiary); text-align: center; margin-top: 50px; font-size: 0.9rem;">欢迎使用 AI 对话。上下文已被记忆，上方可自由切换模型。</div> |
| </div> |
| <div class="chat-input-area"> |
| <button id="clearChatBtn" class="btn btn-glass" style="width: 44px; height: 44px; padding: 0; display: flex; justify-content: center; align-items: center; border-radius: 8px;" title="清空对话记忆">🗑️</button> |
| <textarea id="chatInput" placeholder="输入您的问题，按 Shift+Enter 换行，Enter 发送..."></textarea> |
| <button id="sendChatBtn" class="btn bg-blue" style="width: 80px; height: 44px; flex-shrink: 0; font-size: 0.95rem;">发送</button> |
| </div> |
| </div> |
|
|
| <div id="view-image" class="workspace-view" style="display: none;"> |
| <div class="image-gen-container"> |
| <div class="preview-placeholder" id="imagePlaceholder"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg> |
| <p>AI 绘制的图像将在这里呈现</p> |
| </div> |
| <div class="loader-spinner" id="imageLoader"></div> |
| <div id="aiResultWrapper" style="display: none; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%;"> |
| <img id="aiResultImage" class="result-image" alt="生成的图片"> |
| </div> |
| </div> |
| </div> |
|
|
| <div id="view-media" class="workspace-view" style="display: none; padding: 20px; align-items: center; justify-content: center; overflow-y: auto;"> |
| <div class="preview-placeholder" id="mediaPlaceholder"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><polygon points="23 7 16 12 23 17 23 7"></polygon><rect x="1" y="5" width="15" height="14" rx="2" ry="2"></rect></svg> |
| <p>视频预览及抽帧图片将在这里显示</p> |
| </div> |
| <div id="mediaPlayerContainer" style="display: none; flex-direction: column; align-items: center; width: 100%;"> |
| <div id="mediaPlayerWrapper" style="display:flex; justify-content:center; align-items:center; width:100%; margin-bottom: 20px;"></div> |
| <button class="btn btn-glass" id="btnDownloadMedia" style="color: var(--theme-blue);">⬇️ 下载媒体文件</button> |
| </div> |
| <div id="frameDisplayContainer" style="display: none; flex-direction: column; align-items: center; width: 100%; height: 100%; overflow: hidden;"> |
| <img id="frameDisplayedImage" class="media-image-display" src="" alt="Extracted Frame" /> |
| <div id="framePager" style="color: var(--text-tertiary); font-size: 0.8rem; margin-top: 10px; flex-shrink: 0;">0 / 0</div> |
| <div id="mediaToolbar" class="media-toolbar"> |
| <button class="btn btn-glass frame-btn" id="prevButton">⬅️ 上一帧</button> |
| <button class="btn btn-glass frame-btn" id="nextButton">下一帧 ➡️</button> |
| <button class="btn btn-glass frame-btn" id="btnDownloadFrame" style="color: var(--theme-blue);">⬇️ 保存此图</button> |
| <div class="frame-btn" style="width: 1px; background: var(--border-light); margin: 0 4px; flex-shrink: 0;"></div> |
| <button class="btn btn-glass" id="btnInvert">反色处理</button> |
| <button class="btn btn-glass" id="btnGray">去色黑白</button> |
| <button class="btn btn-glass" id="btnRestore">原图还原</button> |
| <button class="btn btn-glass" id="btnDownloadEditedImage">保存图像</button> |
| </div> |
| </div> |
| </div> |
|
|
| <div id="view-api" class="workspace-view" style="display: none; flex-direction: column; padding: 20px;"> |
| <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;"> |
| <h3 style="color: var(--text-primary); font-size: 0.95rem; margin: 0;">📡 接口调试记录</h3> |
| <button class="btn btn-glass" onclick="clearApiLogs()" style="padding: 4px 10px; font-size: 0.8rem;">🗑️ 清空记录</button> |
| </div> |
| <div id="apiLogContainer" style="flex: 1; overflow-y: auto; background: #f9fafb; border: 1px solid var(--border-light); border-radius: 8px; padding: 15px; color: var(--text-primary);"> |
| </div> |
| </div> |
| </div> |
|
|
| <div class="control-panel"> |
| <div class="glass-card"> |
| <div class="section-title">🔍 查找与替换 (针对文本区)</div> |
| <input type="text" id="search-input" class="glass-input" placeholder="输入查找文本或正则" value='https?:\/\/[^\s\/$.?#]+[^\s]*?(?=")'> |
| <input type="text" id="replace-input" class="glass-input" placeholder="输入替换内容 (为空则删除)"> |
| <div class="btn-grid" style="grid-template-columns: repeat(4, 1fr);"> |
| <button class="btn btn-glass" id="copy-btn">复制</button> |
| <button class="btn btn-glass" id="paste-btn">粘贴</button> |
| <button class="btn btn-glass" id="remove-duplicates-btn">去重</button> |
| <button class="btn btn-glass" id="replace-btn">替换</button> |
| <button class="btn btn-glass" id="regex-replace-btn">正则</button> |
| <button class="btn btn-glass" id="preserve-matches-btn">保留</button> |
| <button class="btn btn-glass" id="clear-text-btn" style="color: #ef4444;">清空</button> |
| <button class="btn btn-glass" id="preview-web-btn" style="color: var(--theme-blue);">网页</button> |
| </div> |
| </div> |
|
|
| <div class="glass-card"> |
| <div class="section-title">📦 文件转码 & 视频抽帧</div> |
| <input type="file" id="fileInput" class="glass-input" accept="image/*,audio/*,video/*"> |
| <input type="number" id="intervalInput" class="glass-input" min="1" placeholder="视频抽帧：输入提取帧率 (FPS)"> |
| <div class="btn-grid" style="grid-template-columns: repeat(3, 1fr);"> |
| <button class="btn btn-glass" id="btnToB64">文件编码</button> |
| <button class="btn btn-glass" id="btnFromB64">编码文件</button> |
| <button class="btn btn-glass" id="btnFrames">视频抽帧</button> |
| </div> |
| </div> |
|
|
| <div class="glass-card" style="margin-bottom: 20px;"> |
| <div class="section-title collapsible-header collapsed" onclick="toggleCollapse('content-ai-image', this)"> |
| <span>✨ AI 图像生成</span> |
| </div> |
| <div id="content-ai-image" class="collapsible-content collapsed"> |
| <select id="imageModelSelect" class="glass-input" style="margin-top: 5px;"> |
| <option value="gemini-2.5-flash-image">Nano Banana (闪电版)</option> |
| <option value="nano-banana-pro" selected>Nano Banana Pro (高画质)</option> |
| </select> |
| <div class="grid-2" style="grid-template-columns: 1fr 1fr; gap: 10px;"> |
| <select id="aspectRatio" class="glass-input"> |
| <option value="16:9">16:9 (横屏)</option> |
| <option value="1:1">1:1 (头像)</option> |
| <option value="9:16">9:16 (竖屏)</option> |
| <option value="21:9">21:9 (宽屏)</option> |
| </select> |
| <select id="imageSize" class="glass-input"> |
| <option value="2K">2K (2048x2048)</option> |
| <option value="1K" selected>1K (1024x1024)</option> |
| <option value="4K">4K (4096x4096)</option> |
| </select> |
| </div> |
| <textarea id="imagePrompt" class="glass-input" style="min-height: 60px; margin-bottom: 10px;" placeholder="输入图像提示词，例如：赛博朋克风格的橘猫..."></textarea> |
| <button id="generateBtn" class="btn bg-blue" style="width: 100%; padding: 10px; font-size: 0.95rem;">🚀 开始绘制图像</button> |
| </div> |
| </div> |
|
|
| <div class="glass-card"> |
| <div class="section-title collapsible-header collapsed" onclick="toggleCollapse('content-tts', this)"> |
| <span>📢 文本语音朗读 (TTS)</span> |
| </div> |
| <div id="content-tts" class="collapsible-content collapsed"> |
| <label class="tts-checkbox" style="margin-top: 8px;"> |
| <input type="checkbox" id="tts-filterChinese" checked> 只显示中文语音 |
| </label> |
| <select id="tts-voiceSelect" class="glass-input"></select> |
| <div class="tts-row"> |
| <span>语速 (<span id="tts-rate-val">1.0x</span>)</span> |
| <input id="tts-rate" type="range" min="0.1" max="10" step="0.1" value="1" /> |
| </div> |
| <div class="tts-row"> |
| <span>音调 (<span id="tts-pitch-val">1.0</span>)</span> |
| <input id="tts-pitch" type="range" min="0" max="10" step="0.1" value="1" /> |
| </div> |
| <div class="tts-row"> |
| <span>音量 (<span id="tts-volume-val">1.0</span>)</span> |
| <input id="tts-volume" type="range" min="0" max="10" step="0.1" value="1" /> |
| </div> |
| <div style="display: flex; gap: 10px; margin-top: 15px;"> |
| <button id="tts-start" class="btn btn-glass" style="flex: 1; color: var(--theme-blue); border-color: #bfdbfe;">▶ 开始朗读文本区</button> |
| <button id="tts-stop" class="btn btn-glass" style="flex: 1; color: var(--theme-red); border-color: #fca5a5;">■ 停止</button> |
| </div> |
| </div> |
| </div> |
| |
| </div> |
| </div> |
|
|
| <script src="app.js"></script> |
| </body> |
| </html> |
