(trigger CI for fork)

README.md

@@ -1,27 +1,26 @@
-# Introducing Pythonline
+# 这是什么？
 
-Pythonline is a Python interpreter that runs in your browser. It is based on the [Pyodide](https://github.com/pyodide/pyodide) project, which is a WASM build of CPython.
+Pythonline 是一个原生运行于浏览器中的 Python 解释器，所有代码都在本地运行，而不是任何服务器上。这是基于 [一个编译成 WASM 的 CPython](https://github.com/pyodide/pyodide) 实现的。
 
-With Pythonline, you can easily share your Python snippets with others, without the need to install Python on their local machine. You can also use it to run Python code on your phone or tablet, without the need to install any apps. Let's take the `math` module as an example:
+通过本平台你可以与他人分享你的 Python 代码片段，而他们无需在本地机器上安装 Python。你甚至也可以在手机或平板上运行 Python 代码，而无需安装任何应用程序。以 `math` 模块为例：
 
 ```python
 >>> import math
 >>> math.pi
 ```
 
-If you hover over the code block above, you will see a button to run the code.
-After that, you can inspect these values by hovering over them 👇
+如果你将鼠标悬停在上面的代码块上，会看到一个按钮可以运行代码。点击之后，试试看将鼠标悬浮在下面的行内代码上 👇
 
-| Kind           | Examples                                      |
-| -------------- | --------------------------------------------- |
-| Global Names   | `_`, `__name__`, `int`, `Exception`           |
-| Literal Values | `[{}]`, `1,2`, `1+2j`, `.0`, `0b10`           |
-| Expressions    | `math.pi / 2`                                 |
-| Assignments    | `one = -(math.e ** complex(0, math.pi)).real` |
+| 类型     | 示例                                          |
+| -------- | --------------------------------------------- |
+| 全局变量 | `_` `__name__` `int` `Exception`              |
+| 字面量   | `[{}]` `1,2` `1+2j` `.0` `0b10`               |
+| 表达式   | `math.pi / 2`                                 |
+| 赋值语句 | `one = -(math.e ** complex(0, math.pi)).real` |
 
-## Main Features
+## 特性简介
 
-You can use top-level await:
+我们支持一些类似 IPython 的特性，比如你可以直接 await 异步函数：
 
 ```python
 from asyncio import sleep
@@ -31,38 +30,32 @@ for i in range(10):
     await sleep(0.1)
 ```
 
-Native and informative traceback:
+再比如原生的报错，但又能显示源码信息：
 
 ```python
 def reciprocal(x: int):
     return 1 / x
-```
-
-Try this:
 
-```python
 1 + reciprocal(0)
 ```
 
-## Basic Usage
+## 可用的模块
 
-Pyodide supports [a large subset of the Python standard library](https://pyodide.org/en/stable/usage/wasm-constraints.html). You can use all of them here.
-It also supports all pure-python libs or [adapted hybrid libs](https://pyodide.org/en/stable/usage/packages-in-pyodide.html) such as famous scientific libraries like NumPy, Pandas, SciPy, SciKit-Learn, etc.
+我们支持所有 Pyodide 支持的库。包括 [绝大多数 Python 标准库](https://pyodide.org/en/stable/usage/wasm-constraints.html)、所有纯 Python 包、以及 [其它适配了 Pyodide 的库](https://pyodide.org/en/stable/usage/packages-in-pyodide.html)，如常见的科学计算库 NumPy、Pandas 和机器学习库 SciPy、SciKit-Learn 等。
 
-Furthermore, you can use global variables like `navigator` from the `window` scope by:
+此外，你可以使用浏览器 JavaScript 下的全局变量，比如下面这个例子，通过 `navigator` 查看你剪贴板中的文本：
 
 ```python
 from js import navigator
 
-print(navigator.languages)
 await navigator.clipboard.readText()
 ```
 
-Let's try invoking web requests:
+下面这个例子，会并发发起 10 个 HTTP 请求：
 
 ```python
 from asyncio import gather
-from pyodide.http import pyfetch  # which is just a wrapper on the fetch in js
+from pyodide.http import pyfetch  # 这只是 js 中 fetch 的一个包装器
 
 async def f(url):
     res = await pyfetch(url, method="HEAD", cache="no-store")
@@ -72,10 +65,9 @@ async def f(url):
 await gather(*(f(".") for _ in range(10)))
 ```
 
-> This project is still work in progress for now, so feel free to [get in touch](https://github.com/promplate/pyth-on-line/discussions) if you have any feedback or suggestions!
+> 此项目目前仍在活跃开发中，如果你有任何反馈或建议，请随时[联系我们](https://github.com/promplate/pyth-on-line/discussions)，不胜感激！
 
-## Acknowledgements
+## 致谢
 
-- This project is heavily inspired by [StackBlitz](https://stackblitz.com/), [CodePen](https://codepen.io/) and [Marimo](https://github.com/marimo-team/marimo)
-- Developers from [pyodide](https://github.com/pyodide) helped me a lot
-- There are some other similar projects like [futurecoder](https://futurecoder.io/), [JupyterLite](https://jupyterlite.github.io/demo) and [PyScript](https://pyscript.com/)
+- 该项目深受 [StackBlitz](https://stackblitz.com/)、[CodePen](https://codepen.io/) 和 [Marimo](https://github.com/marimo-team/marimo) 的启发
+- 来自 [pyodide](https://github.com/pyodide) 的开发人员给予了大量帮助

package.json

@@ -18,7 +18,6 @@
   "dependencies": {
     "@ethercorps/sveltekit-og": "^3.0.0",
     "@fontsource-variable/fira-code": "^5.1.0",
-    "@fontsource-variable/inter": "^5.1.0",
     "@iconify/json": "^2.2.260",
     "@neodrag/svelte": "^2.0.6",
     "@shikijs/monaco": "^1.22.0",
@@ -33,6 +32,7 @@
     "cmdk-sv": "^0.0.18",
     "dayjs": "^1.11.13",
     "htmlparser2": "^9.1.0",
+    "misans-vf": "^1.0.0",
     "monaco-editor-core": "^0.52.0",
     "openai": "^4.67.3",
     "paneforge": "^0.0.6",

src/lib/components/CodeBlock.svelte

@@ -10,7 +10,7 @@
   code = code.replaceAll("\r", "");
 </script>
 
-<section class="not-prose relative overflow-y-scroll rounded-md [&>pre]:!line-height-relaxed">
+<section class="relative overflow-y-scroll rounded-md not-prose [&>pre]:!line-height-relaxed">
   {#key code}
     {#await highlight(lang, code)}
       <pre class="text-white/70">{code}</pre>

src/lib/components/Console.svelte

@@ -202,7 +202,7 @@
 <svelte:document on:keydown={onKeyDown} on:paste={onPaste} />
 
 <div class="w-full @container">
-  <div class="w-full flex flex-col gap-0.7 overflow-x-scroll whitespace-pre-wrap break-all text-neutral-3 font-mono [&>div:hover]:(rounded-sm bg-white/2) [&>div]:(px-1.7 py-0.6 -mx-1.7 -my-0.6){extras}">
+  <div class="w-full flex flex-col gap-0.7 overflow-x-scroll whitespace-pre-wrap break-all text-neutral-3 font-normal font-mono [&>div:hover]:(rounded-sm bg-white/2) [&>div]:(px-1.7 py-0.6 -mx-1.7 -my-0.6){extras}">
 
     <HeadlessConsole {container} bind:ready bind:log bind:push bind:complete bind:pyConsole bind:status let:loading>
       {#each log as { type, text }, index}

src/lib/components/Editor.svelte

@@ -89,7 +89,7 @@
   <div class="absolute inset-0 grid place-items-center @container" out:fade>
     <div class="flex flex-row items-center gap-2 op-80">
       <div class="i-svg-spinners-90-ring-with-bg" />
-      <div class="hidden text-sm tracking-wide @lg:block">initiating monaco editor</div>
+      <div class="hidden text-sm tracking-wide @lg:block">初始化 monaco 编辑器</div>
     </div>
   </div>
 {/if}

src/lib/components/ErrorExplainer.svelte

@@ -48,16 +48,16 @@
       <div class="flex flex-row items-center gap-1.5 rounded bg-emerald-3/10 px-1.5 py-1 text-emerald-3/80">
         <div class="i-majesticons-lightbulb-shine text-base text-emerald-3" />
         <div class="text-xs capitalize sm:text-sm">
-          error explainer
+          报错解释与修复
         </div>
       </div>
       <div class="flex flex-row [&>button:active]:scale-90 [&>button]:(rounded p-1.5 text-white/80 transition-colors)">
-        <WithTooltip tips="Regenerate" let:builder>
+        <WithTooltip tips="重新生成" let:builder>
           <button class="hover:(bg-cyan-3/10 text-cyan-3/80)" on:click={invoke} {...builder} use:builder.action>
             <div class="i-mingcute-refresh-2-fill" />
           </button>
         </WithTooltip>
-        <WithTooltip tips="Close" let:builder>
+        <WithTooltip tips="关闭" let:builder>
           <button class="hover:(bg-red-3/10 text-red-3/80)" on:click={close} {...builder} use:builder.action>
             <div class="i-mingcute-close-fill" />
           </button>

src/lib/components/Hero.svelte

@@ -19,21 +19,21 @@
 
   <div class="flex flex-col translate-x-0.5 gap-3 lg:gap-5">
     <div class="text-xs">
-      <span class="op-30">Powered by</span>
+      <span class="op-30">由一个将 CPython 编译成 WASM 的项目</span>
       <a class="underline underline-(white op-30 offset-2) op-80 transition hover:op-100" href="https://github.com/pyodide/pyodide">@pyodide</a>
-      <span class="op-30">, a WASM build of CPython</span>
+      <span class="op-30">实现</span>
     </div>
 
-    <h1 class="flex flex-row select-none text-4xl font-bold tracking-wide font-sans -translate-x-0.5">
+    <h1 class="flex flex-row select-none text-4xl font-sans font-semibold tracking-wide -translate-x-0.5">
       <span>Pyth</span>
       <span>on</span>
       <span>line</span>
     </h1>
 
     <div>
-      <h2 class="group w-fit flex flex-row gap-1.5 rounded-sm bg-neutral-1 px-2.5 py-1.5 text-sm text-neutral-9 font-bold font-mono">
-        AI-supercharged online python IDE
-        <span class="hidden select-none group-hover:(block after:content-['🚀'])" />
+      <h2 class="group w-fit flex flex-row gap-1.5 rounded-sm bg-neutral-1 px-2.5 py-1.5 text-sm text-neutral-9 font-500">
+        浏览器中的 Python IDE，内置 Copilot
+        <span class="hidden select-none group-hover:(block after:content-['🥰'])" />
       </h2>
     </div>
   </div>

src/lib/components/Intro.svelte

@@ -6,7 +6,7 @@
 
 <div class="fixed inset-0 z--1 grid place-items-center">
   <div class="flex flex-col gap-10">
-    <h1 class="w-full gap-1 text-xl tracking-wide font-sans">
+    <h1 class="w-full gap-1 text-xl font-sans tracking-wide">
       {#each title.split(" ") as char, i}
         {#if i} <span> </span> {/if}
         {@const t = Math.random() * (i + 1)}

src/lib/components/command/CmdK.svelte

@@ -18,12 +18,12 @@
 
   const navigations = {
     type: "group",
-    text: "Navigation",
+    text: "导航",
     children: [
-      { type: "link", href: "/", text: "Homepage" },
-      { type: "link", href: "/console", text: "Immersive Console" },
-      { type: "link", href: "/github", text: "Open a GitHub Repository" },
-      { type: "link", href: "/cpython", text: "CPython Docs" },
+      { type: "link", href: "/", text: "首页" },
+      { type: "link", href: "/console", text: "Python 控制台" },
+      { type: "link", href: "/github", text: "打开 GitHub 仓库" },
+      { type: "link", href: "/cpython", text: "CPython 官方文档" },
     ],
   } as Group;
 
@@ -50,7 +50,7 @@
       </div>
     {/if}
 
-    <Command.Input autofocus bind:value={$input} class="w-full ws-nowrap bg-transparent py-2 outline-none placeholder-(text-white/30)" placeholder={$placeholder || "Type a command or search..."} />
+    <Command.Input autofocus bind:value={$input} class="w-full ws-nowrap bg-transparent py-2 outline-none placeholder-(text-white/30)" placeholder={$placeholder || "输入或搜索……"} />
 
     <Command.Separator alwaysRender class="mt-1.5 b-1 b-white/10" />
 

src/lib/components/console/Copy.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <UseCopy {text} let:handleClick>
-  <WithTooltip tips="Copy" let:builder>
+  <WithTooltip tips="复制" let:builder>
     <button on:click={handleClick} class="i-icon-park-twotone-copy" {...builder} use:builder.action />
   </WithTooltip>
 </UseCopy>

src/lib/components/console/Err.svelte

@@ -11,7 +11,7 @@
 
   <ButtonGroup>
     <Copy {text} />
-    <WithTooltip tips="Ask AI" let:builder>
+    <WithTooltip tips="AI 解释" let:builder>
       <button on:click class="i-majesticons-lightbulb-shine" {...builder} use:builder.action />
     </WithTooltip>
   </ButtonGroup>

src/lib/components/console/In.svelte

@@ -19,7 +19,7 @@
     <Highlight {text}></Highlight>
     <ButtonGroup>
       <Copy {text} />
-      <WithTooltip tips="Run" let:builder>
+      <WithTooltip tips="再次运行" let:builder>
         <button on:click class="i-mingcute-play-fill" {...builder} use:builder.action />
       </WithTooltip>
     </ButtonGroup>

src/lib/components/console/WithConsoleCommands.svelte

@@ -8,14 +8,14 @@
 
   export let pyConsole: ConsoleAPI;
 
-  const installTitle = "Install Packages";
+  const installTitle = "安装第三方库";
 
-  registerCommandGroup("Console", [
+  registerCommandGroup("控制台", [
     {
       text: installTitle,
       async handler() {
         $prefixes = [installTitle];
-        $placeholder = "<package1> <package2> ...";
+        $placeholder = "<包名1> <包名2> ...";
 
         const unsubscribe = input.subscribe(($input) => {
           $items = [{
@@ -36,7 +36,7 @@
               }
             },
             type: "cmd",
-            text: $input ? `pip install ${$input}` : "(cancel)",
+            text: $input ? `pip install ${$input}` : "<取消>",
             alwaysRender: true,
           }];
         });
@@ -45,7 +45,7 @@
       },
     },
     {
-      text: "Clear Console",
+      text: "清空控制台",
       handler() {
         pyConsole.clear();
       },

src/lib/components/reusable/WithCodeActions.svelte

@@ -21,12 +21,12 @@
 
     <div class="absolute right-0.9em top-0.9em flex flex-row-reverse gap-0.3em transition group-not-hover:(pointer-events-none op-0) [&>button]:(rounded bg-white/5 p-0.6em text-0.725em transition) [&>button:hover]:(bg-white/10)">
       <UseCopy text={code.value} let:handleClick>
-        <WithTooltip let:builder tips="Copy">
+        <WithTooltip let:builder tips="复制">
           <button on:click={handleClick} {...builder} use:builder.action><div class="i-icon-park-twotone-copy" /></button>
         </WithTooltip>
       </UseCopy>
       {#if runnable && run}
-        <WithTooltip let:builder tips="Run">
+        <WithTooltip let:builder tips="运行">
           <button on:click={() => run(code.value)} {...builder} use:builder.action><div class="i-mingcute-play-fill" /></button>
         </WithTooltip>
       {/if}

src/lib/date.ts

@@ -1,7 +1,10 @@
+import "dayjs/locale/zh-cn";
+
 import dayjs from "dayjs";
 import relativeTime from "dayjs/plugin/relativeTime";
 
 dayjs.extend(relativeTime);
+dayjs.locale("zh-cn");
 
 export function fromNow(date: string) {
   return dayjs(date).fromNow();

src/lib/md.css

@@ -1,9 +1,13 @@
+.prose {
+  @apply font-300;
+}
+
 .prose :where(h1, h2, h3, h4, h5, h6) {
-  @apply my-1em text-1.1em text-white font-bold;
+  @apply my-1em text-1.1em text-white font-450;
 }
 
 .prose strong {
-  @apply text-white font-bold;
+  @apply text-white font-450;
 }
 
 .prose pre {
@@ -20,7 +24,7 @@
 
 .prose a,
 .prose a code {
-  @apply underline underline-(white op-30 offset-2) transition;
+  @apply font-400 underline underline-(white op-30 offset-2) transition;
 }
 
 .prose a:hover,
@@ -33,7 +37,11 @@
 }
 
 .prose thead {
-  @apply bg-white/2 font-bold op-90;
+  @apply bg-white/2;
+}
+
+.prose th {
+  @apply font-450;
 }
 
 .prose tr {

src/lib/pyodide/start/init.ts

@@ -9,7 +9,7 @@ import { getEnv } from "$lib/utils/env";
 import { withToast } from "$lib/utils/toast";
 import { toast } from "svelte-sonner";
 
-const getMinimalPyodide = cacheSingleton(withToast({ loading: "loading pyodide runtime" })(async () => {
+const getMinimalPyodide = cacheSingleton(withToast({ loading: "加载 Pyodide 运行时" })(async () => {
   const { loadPyodide } = await import("pyodide");
   const py = await loadPyodide({ indexURL, env: getEnv(), packages: preloadPackages, args: dev ? [] : ["-O"] });
   py.globals.set("toast", toast);

src/python/chat/templates/explain-error.j2

@@ -3,29 +3,22 @@
 
 ---
 
-Your task is to help the user get rid of errors.
+你的任务是帮助用户解释错误，并尽可能提供解决方案，你可能需要猜测用户的意图。
 
 <|user|>
-I am running these code:
+我在运行这段代码时：
 
-code:
 ```py
 {{ code }}
 ```
 
-But I encountered an error:
-
-traceback:
+遇到了这样的报错：
 ```
 {{ traceback }}
 ```
 
-Why?
-
-Can you explain why this happens?
-Can you give me a solution?
-Can you suggest a code snippet to run in a python code block, which may run as-is, without raising any error? (relating to the user's original code)
-
-> Note that you should answer in markdown syntax. Please try to avoid using Markdown lists if possible.
+为什么会发生这种情况？你可以解释一下原因吗？
+你能给我一个解决方案吗？你能给我一段正确的实现我的目的的代码吗？尽可能采用最佳实践。
+注意：请使用 Markdown 语法回答，尽量避免使用 Markdown 列表。
 
 REMEMBER: PRECISE and CONCISE