feat: add drag-and-drop installation functionality for platform-specific downloads

docs/getting-started/installation.md

@@ -1,19 +1,36 @@
 # 安装与首次配置
 
-AnyImage 的安装分为两步：先安装 Blender Extension，再安装独立运行环境和默认模型。第二步只需在首次使用或环境版本发生变化时执行。
+页面会按当前系统显示对应的安装包，按住按钮拖到 Blender 窗口任意位置即可安装。首次拖入会提示添加 AnyImage 扩展仓库，确认后重新拖入一次，之后升级同样直接拖入。
 
-## 安装 Blender Extension
-
-1. 下载与你的系统匹配的 ZIP 文件：
-   - `AnyImage.v版本号.windows-x64.zip`
-   - `AnyImage.v版本号.macos-arm64.zip`
-   - `AnyImage.v版本号.linux-x64.zip`
-2. 打开 Blender，进入 **Edit > Preferences > Extensions**。
-3. 点击右上角菜单，选择 **Install from Disk**。
-4. 选择下载的 ZIP 文件并完成安装。
-
-!!! warning
-    不要解压扩展包。Blender 需要直接安装 ZIP 文件，并且安装包必须与你的操作系统匹配。
+<div class="anyimage-install">
+  <div class="anyimage-install-item" data-platform="windows-x64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.windows-x64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=windows-x64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>Windows</strong> – 78.3&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.windows-x64.zip" download="AnyImage.v1.0.1.windows-x64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+  <div class="anyimage-install-item" data-platform="macos-arm64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.macos-arm64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=macos-arm64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>macOS<span class="anyimage-install-platform-rest"> - Apple Silicon</span></strong> – 57.5&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.macos-arm64.zip" download="AnyImage.v1.0.1.macos-arm64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+  <div class="anyimage-install-item" data-platform="linux-x64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.linux-x64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=linux-x64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>Linux</strong> – 71.0&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.linux-x64.zip" download="AnyImage.v1.0.1.linux-x64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+</div>
 
 ## 检查扩展偏好设置
 

docs/index.md

@@ -10,3 +10,34 @@ AnyImage 是一款 Blender 扩展，可以粘贴和编辑图片、创建普通 P
 - 用 **Cutout** 从套索选区生成 Surface、Balloon 与两种 Depth Shape
 - 用 **Frame** 从当前视角重新取景并合并 Image Empty，用 **Mask** 的 Lasso、Brush 或 Polyline 编辑 Alpha；Brush 拖动时以红色或灰色填充预览准确范围，释放后提交；用 **Rectify** 校正透视
 - 用 **Remove Background / Upscale** 处理单图、视频和序列帧
+
+
+<div class="anyimage-install">
+  <div class="anyimage-install-item" data-platform="windows-x64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.windows-x64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=windows-x64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>Windows</strong> – 78.3&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.windows-x64.zip" download="AnyImage.v1.0.1.windows-x64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+  <div class="anyimage-install-item" data-platform="macos-arm64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.macos-arm64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=macos-arm64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>macOS<span class="anyimage-install-platform-rest"> - Apple Silicon</span></strong> – 57.5&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.macos-arm64.zip" download="AnyImage.v1.0.1.macos-arm64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+  <div class="anyimage-install-item" data-platform="linux-x64">
+    <div class="anyimage-install-group">
+      <button type="button" draggable="true" class="anyimage-install-button" data-install-url="https://extensions.omoolab.xyz/AnyImage.v1.0.1.linux-x64.zip?repository=.%2Findex.json&amp;blender_version_min=4.5.0&amp;platforms=linux-x64&amp;python_versions=3.11%2C3.13">
+        <i class="i-move"></i><span>拖入 Blender 安装</span>
+      </button>
+      <div class="anyimage-install-platform"><strong>Linux</strong> – 71.0&nbsp;MB</div>
+    </div>
+    <small class="anyimage-install-note">…或<a href="https://extensions.omoolab.xyz/AnyImage.v1.0.1.linux-x64.zip" download="AnyImage.v1.0.1.linux-x64.zip">下载</a>后通过 <a href="https://docs.blender.org/manual/zh-hans/latest/editors/preferences/extensions.html#install" target="_blank">Install from Disk</a> 安装</small>
+  </div>
+</div>

docs/javascripts/extra.js

@@ -0,0 +1,41 @@
+/**
+ * 首页的扩展安装按钮：按系统只留一个平台，并把下载地址拖进 Blender。
+ */
+const INSTALL_PLATFORMS = { win: "windows", mac: "macos", lin: "linux" };
+
+function initInstallDrag() {
+  const container = document.querySelector(".anyimage-install");
+
+  if (!container) {
+    return;
+  }
+
+  // navigator.platform 的取值由浏览器决定，只取前三个字符做粗略匹配。
+  const detectedPlatform = INSTALL_PLATFORMS[navigator.platform.toLowerCase().slice(0, 3)];
+
+  container.querySelectorAll(".anyimage-install-item").forEach(function (item) {
+    const matches = !detectedPlatform || item.dataset.platform.startsWith(detectedPlatform);
+    item.classList.toggle("is-active", matches);
+    item.hidden = !matches;
+  });
+
+  container.querySelectorAll(".anyimage-install-button").forEach(function (button) {
+    const group = button.closest(".anyimage-install-group");
+
+    button.addEventListener("dragstart", function (event) {
+      event.dataTransfer.setData("text/plain", button.dataset.installUrl);
+      event.dataTransfer.effectAllowed = "copy";
+      group.classList.add("is-dragging");
+    });
+
+    button.addEventListener("dragend", function () {
+      group.classList.remove("is-dragging");
+    });
+  });
+}
+
+if (document.readyState === "loading") {
+  document.addEventListener("DOMContentLoaded", initInstallDrag);
+} else {
+  initInstallDrag();
+}

docs/stylesheets/extra.css

@@ -26,3 +26,108 @@
   --md-text-font: "LXGW WenKai";
   --md-code-font: "LXGW WenKai Mono";
 }
+
+/* 首页的扩展安装拖拽组件，数值取自 extensions.blender.org 的按钮。 */
+@font-face {
+  font-family: "fontutti";
+  src: url("../assets/fonts/fontutti.woff2") format("woff2");
+  font-style: normal;
+  font-weight: normal;
+}
+
+.anyimage-install {
+  font-size: 14px;
+  line-height: 1.4286;
+}
+
+.anyimage-install-item {
+  margin-bottom: 1.6rem;
+}
+
+.anyimage-install [class^="i-"]:before,
+.anyimage-install [class*=" i-"]:before {
+  display: inline-block;
+  width: 1em;
+  margin: 0 0.2em;
+  font-family: "fontutti";
+  font-style: normal;
+  font-variant: normal;
+  font-weight: normal;
+  line-height: 1em;
+  text-align: center;
+  text-decoration: inherit;
+  text-transform: none;
+  -webkit-font-smoothing: antialiased;
+}
+
+.anyimage-install .i-move:before {
+  content: "\e8d5";
+}
+
+.anyimage-install-item.is-active ~ .anyimage-install-item.is-active {
+  border-top: 1px solid var(--md-default-fg-color--lightest);
+  padding-top: 1.6rem;
+}
+
+.anyimage-install-group {
+  border: 2px solid transparent;
+  border-radius: 6px;
+  margin-bottom: 8px;
+}
+
+.anyimage-install-group.is-dragging {
+  opacity: 0.5;
+}
+
+.anyimage-install-button {
+  display: inline-block;
+  width: 100%;
+  margin-bottom: 8px;
+  padding: 8px 16px;
+  border: none;
+  border-radius: 6px;
+  background-color: rgba(0, 153, 255, 0.1);
+  color: #0099ff;
+  font-family: inherit;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 24px;
+  outline: 2px dashed currentColor;
+  outline-offset: -2px;
+  text-align: center;
+  text-decoration: none;
+  transition: background-color 150ms, color 150ms ease-out;
+  user-select: none;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+
+.anyimage-install-button:hover {
+  background-color: rgba(0, 153, 255, 0.2);
+  cursor: move;
+}
+
+.anyimage-install-platform {
+  text-align: center;
+}
+
+.anyimage-install-platform strong {
+  font-weight: 600;
+}
+
+.anyimage-install-platform-rest {
+  font-weight: 400;
+}
+
+.anyimage-install small.anyimage-install-note {
+  display: block;
+  width: 100%;
+  font-size: 12px;
+  opacity: 1;
+  text-align: center;
+}
+
+.anyimage-install-note a {
+  color: #0099ff;
+  text-decoration: underline;
+}

mkdocs.yml

@@ -82,6 +82,9 @@ extra:
 extra_css:
   - stylesheets/extra.css
 
+extra_javascript:
+  - javascripts/extra.js
+
 copyright: Copyright © 2026 OmooLab
 
 plugins: