Download: release page link, Homebrew command, GitHub links in a new tab

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Author: everettjf

index.html

@@ -32,7 +32,7 @@
   </nav>
   <div class="nav-right">
     <button class="lang" id="lang" type="button" aria-label="Switch language">中文</button>
-    <a class="gh" href="https://github.com/chatcomputer/chatcomputer" aria-label="GitHub">
+    <a class="gh" href="https://github.com/chatcomputer/chatcomputer" target="_blank" rel="noopener" aria-label="GitHub">
       <svg viewBox="0 0 16 16" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
     </a>
   </div>
@@ -45,8 +45,8 @@
     <h1 class="reveal"><span data-i18n="hero.h1a">A second Mac that</span><br><span class="grad" data-i18n="hero.h1b">does the work while you chat.</span></h1>
     <p class="lead reveal" data-i18n="hero.lead">Chat Computer runs a private macOS virtual machine on your Mac. Tell it what you need; an AI agent sees the screen, clicks and types inside the virtual Mac, and the host checks every file before it reaches you.</p>
     <div class="cta reveal">
-      <a class="btn primary" id="dl-hero" href="https://github.com/chatcomputer/chatcomputer/releases"><span data-i18n="hero.download">Download for Mac</span> <small class="ver" data-version></small></a>
-      <a class="btn ghost" href="https://github.com/chatcomputer/chatcomputer"><span data-i18n="hero.source">View source</span> →</a>
+      <a class="btn primary" id="dl-hero" href="https://github.com/chatcomputer/chatcomputer/releases" target="_blank" rel="noopener"><span data-i18n="hero.download">Download for Mac</span> <small class="ver" data-version></small></a>
+      <a class="btn ghost" href="https://github.com/chatcomputer/chatcomputer" target="_blank" rel="noopener"><span data-i18n="hero.source">View source</span> →</a>
     </div>
     <p class="fine reveal" data-i18n="hero.fine">Free · Apache 2.0 · Bring your own model key: Claude, DeepSeek, OpenAI, Gemini and more</p>
 
@@ -176,19 +176,23 @@ <h2 class="reveal" data-i18n="m.h2">Works with the model you already pay for.</h
       <img src="assets/icon-512.png" alt="" width="96" height="96">
       <h2 data-i18n="dl.h2">Get Chat Computer</h2>
       <p class="sub" data-i18n="dl.sub">Signed and notarized by Apple. Setup downloads and installs macOS in the virtual machine (about 26 GB), creates its account and grants the agent its permissions, all without you clicking through.</p>
-      <a class="btn primary big" id="dl-main" href="https://github.com/chatcomputer/chatcomputer/releases"><span data-i18n="hero.download">Download for Mac</span> <small class="ver" data-version></small></a>
+      <a class="btn primary big" id="dl-main" href="https://github.com/chatcomputer/chatcomputer/releases" target="_blank" rel="noopener"><span data-i18n="hero.download">Download for Mac</span> <small class="ver" data-version></small></a>
+      <div class="brew">
+        <p data-i18n="dl.brew">Or install with Homebrew, which also puts the chatcomputer command on your PATH:</p>
+        <div class="cmd"><code>brew install --cask chatcomputer/tap/chatcomputer</code><button type="button" data-copy="brew install --cask chatcomputer/tap/chatcomputer" aria-label="Copy"><span data-i18n="dl.copy">Copy</span></button></div>
+      </div>
       <ul class="req">
         <li><b data-i18n="req.chip">Chip</b><span data-i18n="req.chipv">Apple silicon</span></li>
         <li><b data-i18n="req.os">System</b><span>macOS 27</span></li>
         <li><b data-i18n="req.ram">Memory</b><span>16 GB</span></li>
         <li><b data-i18n="req.disk">Disk</b><span data-i18n="req.diskv">about 70 GB free</span></li>
       </ul>
       <ol class="steps">
-        <li><span class="n">1</span><div><b data-i18n="st.1t">Download and unzip</b><p data-i18n="st.1d">Open ChatComputer.zip and move Chat Computer.app to Applications.</p></div></li>
+        <li><span class="n">1</span><div><b data-i18n="st.1t">Download and unzip</b><p data-i18n="st.1d">Open ChatComputer.zip and move ChatComputer.app to Applications.</p><p class="alt" data-i18n="st.1alt">With Homebrew, this step is already done.</p></div></li>
         <li><span class="n">2</span><div><b data-i18n="st.2t">Open it and click Continue</b><p data-i18n="st.2d">Setup runs on its own for about 10 minutes. The Dock icon bounces when it needs you.</p></div></li>
         <li><span class="n">3</span><div><b data-i18n="st.3t">Add your model</b><p data-i18n="st.3d">Pick a provider, paste an API key, and type your first task.</p></div></li>
       </ol>
-      <a class="gh-link" href="https://github.com/chatcomputer/chatcomputer"><span data-i18n="dl.gh">Source code on GitHub</span> · github.com/chatcomputer/chatcomputer →</a>
+      <a class="gh-link" href="https://github.com/chatcomputer/chatcomputer" target="_blank" rel="noopener"><span data-i18n="dl.gh">Source code on GitHub</span> · github.com/chatcomputer/chatcomputer →</a>
     </div>
   </section>
 
@@ -207,10 +211,10 @@ <h2 data-i18n="dl.h2">Get Chat Computer</h2>
 <footer class="foot">
   <div><img src="assets/icon-512.png" alt="" width="20" height="20"> Chat Computer</div>
   <div class="links">
-    <a href="https://github.com/chatcomputer/chatcomputer">GitHub</a>
-    <a href="https://github.com/chatcomputer/chatcomputer/releases" data-i18n="f.releases">Releases</a>
-    <a href="https://github.com/chatcomputer/chatcomputer/blob/main/PRIVACY.md" data-i18n="f.privacy">Privacy</a>
-    <a href="https://github.com/chatcomputer/chatcomputer/blob/main/LICENSE">Apache 2.0</a>
+    <a href="https://github.com/chatcomputer/chatcomputer" target="_blank" rel="noopener">GitHub</a>
+    <a href="https://github.com/chatcomputer/chatcomputer/releases" target="_blank" rel="noopener" data-i18n="f.releases">Releases</a>
+    <a href="https://github.com/chatcomputer/chatcomputer/blob/main/PRIVACY.md" target="_blank" rel="noopener" data-i18n="f.privacy">Privacy</a>
+    <a href="https://github.com/chatcomputer/chatcomputer/blob/main/LICENSE" target="_blank" rel="noopener">Apache 2.0</a>
   </div>
   <div class="dim" data-i18n="f.note">Not affiliated with Apple. macOS is a trademark of Apple Inc.</div>
 </footer>

main.js

@@ -144,10 +144,11 @@
     "dl.h2": "获取 Chat Computer",
     "dl.sub": "经苹果签名和公证。首次设置会下载并安装虚拟机里的 macOS（约 26 GB）、创建账户、为 agent 授权，全程自动，不用你一步步点。",
     "req.chip": "芯片", "req.chipv": "Apple 芯片", "req.os": "系统", "req.ram": "内存", "req.disk": "磁盘", "req.diskv": "约 70 GB 可用空间",
-    "st.1t": "下载并解压", "st.1d": "打开 ChatComputer.zip，把 Chat Computer.app 拖进「应用程序」。",
+    "st.1t": "下载并解压", "st.1d": "打开 ChatComputer.zip，把 ChatComputer.app 拖进「应用程序」。",
     "st.2t": "打开，点 Continue", "st.2d": "首次设置自动进行，约 10 分钟。需要你时，Dock 图标会跳动提醒。",
     "st.3t": "填上模型", "st.3d": "选服务商、粘贴 API Key，然后写下第一个任务。",
-    "dl.gh": "源码在 GitHub",
+    "dl.gh": "源码在 GitHub", "dl.brew": "或用 Homebrew 安装，同时装好 chatcomputer 命令：", "dl.copy": "复制",
+    "st.1alt": "用 Homebrew 安装的话，这一步已经完成。",
     "faq.eyebrow": "// 常见问题",
     "faq.1q": "我自己的 Mac 安全吗？", "faq.1a": "agent 只操作虚拟机。只有你附上的文件或共享的文件夹它才看得到，共享文件夹默认只读。虚拟机和 App 之间走私有的虚拟 socket，不经过网络。",
     "faq.2q": "模型能看到什么？", "faq.2a": "虚拟机的截图和你的任务文字会发给你选择的模型厂商。你的 API Key 和虚拟机密码不会。",
@@ -245,14 +246,22 @@
   }
   fetch("results.json").then((r) => r.ok ? r.json() : null).then((data) => { results = data; renderMatrix(); }).catch(() => {});
 
+  /* ---------- Copy the Homebrew command ---------- */
+  document.querySelectorAll("[data-copy]").forEach((button) => button.addEventListener("click", () => {
+    navigator.clipboard.writeText(button.dataset.copy).then(() => {
+      button.classList.add("done");
+      setTimeout(() => button.classList.remove("done"), 1500);
+    }).catch(() => {});
+  }));
+
   /* ---------- Latest release ---------- */
   fetch("https://api.github.com/repos/chatcomputer/chatcomputer/releases?per_page=1")
     .then((r) => r.ok ? r.json() : [])
     .then(([release]) => {
       if (!release) return;
-      const zip = (release.assets || []).find((a) => a.name.endsWith(".zip"));
+      // The release page: notes, the zip and its SHA-256 in one place.
       document.querySelectorAll("[data-version]").forEach((el) => { el.textContent = release.tag_name; });
-      if (zip) ["dl-hero", "dl-main"].forEach((id) => { document.getElementById(id).href = zip.browser_download_url; });
+      if (release.html_url) ["dl-hero", "dl-main"].forEach((id) => { document.getElementById(id).href = release.html_url; });
     })
     .catch(() => {});
 

style.css

@@ -242,6 +242,14 @@ h2 { font-size: clamp(32px, 4.6vw, 54px); line-height: 1.08; margin-top: 14px; m
 .steps .n { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 600 13px "JetBrains Mono", monospace; color: #05060f; background: linear-gradient(135deg, var(--cyan), var(--pink)); }
 .steps b { display: block; margin-bottom: 4px; }
 .steps p { margin: 0; color: var(--dim); font-size: 14px; line-height: 1.5; }
+.brew { margin: 26px auto 0; max-width: 760px; }
+.brew p { margin: 0 0 10px; color: var(--dim); font-size: 14px; }
+.cmd { display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 18px; border-radius: 12px; border: 1px solid var(--line); background: rgba(6,8,20,.85); text-align: left; }
+.cmd code { flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; font: 14px "JetBrains Mono", monospace; color: #d6dbff; }
+.cmd button { flex: none; padding: 7px 14px; border-radius: 8px; border: 1px solid var(--line); background: var(--glass); color: var(--ink); font: 500 13px inherit; cursor: pointer; }
+.cmd button:hover { border-color: var(--cyan); }
+.cmd button.done { border-color: var(--cyan); color: var(--cyan); }
+.steps p.alt { margin-top: 6px; font-size: 13px; color: var(--cyan); opacity: .8; }
 .gh-link { display: inline-block; margin-top: 28px; color: var(--dim); font: 500 14px "JetBrains Mono", monospace; text-decoration: none; }
 .gh-link:hover { color: var(--cyan); }