18069996051/mixly3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update: 优化Python Online板卡下「本地文件系统」

Browse Source
This commit is contained in:
王立帮
2024-11-27 03:08:43 +08:00
parent b984af1998
commit e0534d607d
9 changed files with 205 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
boards/default_src/python_pyodide/others/filesystem-file-tree.js Normal file
View File

@@ -0,0 +1,45 @@
import * as path from 'path';
import { FileTree } from 'mixly';
import FileSystemFS from './filesystem-fs';
export default class FileSystemFileTree extends FileTree {
constructor() {
super(new FileSystemFS());
}
async readFolder(inPath) {
const fs = this.getFS();
const [, status] = await fs.isDirectory(inPath);
let output = [];
if (!status) {
return output;
}
const result = await fs.readDirectory(inPath);
let children = [];
if (result.length == 2) {
children = result[1];
}
for (let data of children) {
const dataPath = path.join(inPath, data);
const [, isDirectory] = await fs.isDirectory(dataPath);
if (isDirectory) {
const [, isDirEmpty] = await fs.isDirectoryEmpty(dataPath);
output.push({
type: 'folder',
id: dataPath,
children: !isDirEmpty,
title: `/${this.getRootFolderName()}${dataPath}`
});
} else {
output.push({
type: 'file',
id: dataPath,
children: false,
title: `/${this.getRootFolderName()}${dataPath}`
});
}
}
return output;
}
}

96
boards/default_src/python_pyodide/others/filesystem-fs.js Normal file
View File

@@ -0,0 +1,96 @@
import { FS } from 'mixly';
export default class FileSystemFS extends FS {
static {
this.pool = window.workerpool.pool('../common/modules/mixly-modules/workers/web/file-system-access.js', {
workerOpts: {
name: 'pyodideFileSystemAccess'
},
workerType: 'web'
});
}
constructor() {
super();
}
async showDirectoryPicker() {
const directoryHandle = await window.showDirectoryPicker({ mode: 'readwrite' });
const permissionStatus = await directoryHandle.requestPermission({ mode: 'readwrite' });
if (permissionStatus !== 'granted') {
throw new Error('readwrite access to directory not granted');
}
await FileSystemFS.pool.exec('addFileSystemHandler', [directoryHandle]);
return directoryHandle;
}
async createFile(filePath) {
return this.writeFile(filePath, '');
}
async readFile(path) {
return FileSystemFS.pool.exec('readFile', [path, 'utf8']);
}
async writeFile(path, data) {
return FileSystemFS.pool.exec('writeFile', [path, data, 'utf8']);
}
async isFile(path) {
const [error, stats] = await FileSystemFS.pool.exec('stat', [path]);
if (stats && stats.mode === 33188) {
return [error, true];
}
return [error, false];
}
async renameFile(oldFilePath, newFilePath) {
return await FileSystemFS.pool.exec('rename', [oldFilePath, newFilePath]);
}
async moveFile(oldFilePath, newFilePath) {
return this.renameFile(oldFilePath, newFilePath);
}
async deleteFile(filePath) {
return FileSystemFS.pool.exec('unlink', [filePath]);
}
async createDirectory(folderPath) {
return FileSystemFS.pool.exec('mkdir', [folderPath, 0o777]);
}
async readDirectory(path) {
const result = await FileSystemFS.pool.exec('readdir', [path]);
if (result[0]) {
return [result[0], null];
}
return result;
}
async isDirectory(path) {
const [error, stats] = await FileSystemFS.pool.exec('stat', [path]);
if (stats && stats.mode === 33188) {
return [error, false];
}
return [error, true];
}
async isDirectoryEmpty(path) {
const [error, result = []] = await this.readDirectory(path);
return [error, !result?.length];
}
async renameDirectory(oldFolderPath, newFolderPath) {
return await FileSystemFS.pool.exec('rename', [oldFolderPath, newFolderPath]);
}
async moveDirectory(oldFolderPath, newFolderPath) {
return FileSystemFS.pool.exec('rename', [oldFolderPath, newFolderPath]);
}
async deleteDirectory(folderPath) {
return FileSystemFS.pool.exec('rmdir', [folderPath]);
}
}

4
boards/default_src/python_pyodide/others/python-shell.js
View File

@@ -37,8 +37,6 @@ export default class PythonShell {
const $content = footerBar.getContent();
$content.after(this.$loader);
this.statusBarImage = StatusBarImage.init();
this.statusBarFileSystem = StatusBarFileSystem.init();
const projectPath = path.relative(Env.indexDirPath, Env.boardDirPath);
const loader = new KernelLoader({
rootPath: path.join(projectPath, 'deps'),
@@ -61,6 +59,8 @@ export default class PythonShell {
this.kernelLoaded = true;
this.$loader.remove();
this.$loader = null;
this.statusBarImage = StatusBarImage.init();
this.statusBarFileSystem = StatusBarFileSystem.init();
}
this.run = async function () {

54
boards/default_src/python_pyodide/others/statusbar-filesystem.js
View File

@@ -11,14 +11,13 @@ import {
ContextMenu,
Debug,
StatusBarsManager,
Workspace,
Web
Workspace
} from 'mixly';
import FileSystemFileTree from './filesystem-file-tree';
import FILE_SYSTEM_TEMPLATE from '../templates/html/statusbar-filesystem.html';
import FILE_SYSTEM_OPEN_FS_TEMPLATE from '../templates/html/statusbar-filesystem-open-fs.html';
import FILE_SYSTEM_EDITOR_EMPTY_TEMPLATE from '../templates/html/statusbar-filesystem-editor-empty.html';
const { FileTree } = Web;
export default class StatusBarFileSystem extends PageBase {
@@ -65,7 +64,7 @@ export default class StatusBarFileSystem extends PageBase {
super();
const $content = $(HTMLTemplate.get('html/statusbar/statusbar-filesystem.html').render());
this.setContent($content);
this.#fileTree_ = new FileTree();
this.#fileTree_ = new FileSystemFileTree();
this.#$fileTree_ = $content.children('.file-tree');
this.#$openFS_ = $(HTMLTemplate.get('html/statusbar/statusbar-filesystem-open-fs.html').render({
msg: {
@@ -109,12 +108,17 @@ export default class StatusBarFileSystem extends PageBase {
const filePath = selected[0].id;
this.#fileTree_.showProgress();
const fs = this.#fileTree_.getFS();
const result = await fs.readFile(filePath);
this.showEditor();
this.#editor_.setValue(result);
this.#editor_.scrollToTop();
this.#editor_.focus();
this.setStatus(false);
const [error, result] = await fs.readFile(filePath);
if (error) {
this.hideEditor();
this.#fileTree_.deselectAll();
} else {
this.showEditor();
this.#editor_.setValue(result);
this.#editor_.scrollToTop();
this.#editor_.focus();
this.setStatus(false);
}
this.#fileTree_.hideProgress();
});
@@ -140,6 +144,25 @@ export default class StatusBarFileSystem extends PageBase {
const fileTreeContextMenu = this.#fileTree_.getContextMenu();
const fileTreeMenu = fileTreeContextMenu.getItem('menu');
fileTreeMenu.add({
weight: 7,
type: 'copy_path',
data: {
isHtmlName: true,
name: ContextMenu.getItem(Msg.Lang['fileTree.copyPath'], ''),
callback: (_, { $trigger }) => {
let outPath = null;
let type = $trigger.attr('type');
if (type === 'root') {
outPath = this.#fileTree_.getRootFolderTitle();
} else {
outPath = $trigger.attr('title');
}
navigator.clipboard.writeText(outPath).catch(Debug.error);
}
}
});
fileTreeMenu.add({
weight: 14,
type: 'sep5',
@@ -384,25 +407,26 @@ export default class StatusBarFileSystem extends PageBase {
if (!directoryHandle.name) {
return;
}
const rootPath = '/' + directoryHandle.name;
this.#fileTree_.setFolderPath('/');
this.#fileTree_.setRootFolderTitle(rootPath);
this.#fileTree_.setRootFolderName(directoryHandle.name);
this.#fileTree_.openRootFolder();
this.showFileTree();
return window.pyodide.mountNativeFS('/' + directoryHandle.name, directoryHandle);
return window.pyodide.mountNativeFS(rootPath, directoryHandle);
})
.then((nativefs) => {
console.log(nativefs)
this.#nativefs_ = nativefs;
})
.catch(Debug.error);
}
closeFS() {
const rootPath = this.#fileTree_.getFolderPath();
const rootPath = '/' + this.#fileTree_.getRootFolderTitle();
const lookup = window.pyodide.FS.lookupPath(rootPath, {
follow_mount: false
});
if (window.pyodide.isMountpoint(lookup.node)) {
if (window.pyodide.FS.isMountpoint(lookup.node)) {
window.pyodide.FS.unmount(rootPath);
}
this.#fileTree_.deselectAll();
@@ -433,7 +457,7 @@ export default class StatusBarFileSystem extends PageBase {
}
setStatus(isChanged) {
if (this.#changed_ === isChanged || !this.#$close_) {
if (this.#changed_ === isChanged) {
return;
}
this.#changed_ = isChanged;