oipage 1.7.0 → 1.8.0-alpha.0

package/bin/tools/openBrowser.js

@@ -0,0 +1,26 @@
+const { exec } = require('child_process');
+const os = require('os');
+
+module.exports = function (url) {
+    const platform = os.platform();
+    let command;
+
+    switch (platform) {
+        case 'win32': // Windows
+            command = `start ${url}`;
+            break;
+        case 'darwin': // macOS
+            command = `open ${url}`;
+            break;
+        default: // Linux及其他
+            command = `xdg-open ${url}`;
+    }
+
+    exec(command, (error) => {
+        if (error) {
+            console.error(`无法打开浏览器: ${error}`);
+        } else {
+            // todo
+        }
+    });
+}

package/bin/tools/resolve404.js

@@ -1,84 +1,84 @@
-const { readdirSync, lstatSync, readFileSync, statSync } = require("fs");
-const { join } = require("path");
-const { formatByte, formatTime } = require("./format");
-const mineTypes = require("../data/mineTypes.json");
-
-const img_folder = "data:image/png;base64," + readFileSync(join(__dirname, "../images/folder.png")).toString('base64');
-const img_file = "data:image/png;base64," + readFileSync(join(__dirname, "../images/file.png")).toString('base64');
-
-const template_404 = readFileSync(join(__dirname, "../template/404.html"), {
-    encoding: "utf8"
-})
-    .replace("${img_folder}", img_folder)
-    .replace("${img_file}", img_file);
-
-module.exports = function (filePath, url) {
-
-    let subItems = [];
-
-    try {
-        subItems = readdirSync(filePath);
-        console.log("<i> \x1b[1m\x1b[32m[OIPage-http-server] Read Folder: " + url + '\x1b[0m ' + new Date().toLocaleString());
-    } catch (e) {
-        console.log("<i> \x1b[1m\x1b[32m[OIPage-http-server] Read " + (/\/$/.test(url) ? "Folder" : "File") + ": \x1b[35m" + url + ' 404 Not Found\x1b[0m ' + new Date().toLocaleString());
-        try {
-            if (!/\/$/.test(url) || url === "/") {
-                filePath = join(filePath, "../");
-                subItems = readdirSync(filePath);
-            }
-        } catch (e) { }
-    }
-
-    let template = "";
-    for (let i in subItems) {
-        let isDirectory = lstatSync(join(filePath, subItems[i])).isDirectory();
-        let statObj = statSync(join(filePath, subItems[i]));
-
-        // 文件夹
-        if (isDirectory) {
-            template += `<tr class="folder">
-            <th class="name">
-                <a href='./${subItems[i]}/'>${subItems[i]}</a>
-            </th>
-            <th>
-                ${formatTime(statObj.mtime)}
-            </th>
-            <th>
-                文件夹
-            </th>
-            <th>
-                -
-            </th>
-            <th>
-                <a href='./${subItems[i]}/' class="btn">打开</a>
-            </th>
-        </tr>`;
-        }
-
-        // 文件
-        else {
-            let dotName = /\./.test(subItems[i]) ? subItems[i].match(/\.([^.]+)$/)[1] : "";
-
-            template += `<tr class="file">
-            <th class="name">
-                <a href='./${subItems[i]}'>${subItems[i]}</a>
-            </th>
-            <th>
-                ${formatTime(statObj.mtime)}
-            </th>
-            <th>
-                ${mineTypes[dotName] || "text/plain"}
-            </th>
-            <th>
-            ${formatByte(statObj.size)}
-        </th>
-            <th>
-                <a href='./${subItems[i]}' class="btn">访问</a>
-                <a href='./${subItems[i]}?download' class="btn" download='${subItems[i]}'>下载</a>
-            </th>
-        </tr>`;
-        }
-    }
-
-    return template_404.replace("${current}", filePath).replace("${template}", template);
+const { readdirSync, lstatSync, readFileSync, statSync } = require("fs");
+const { join } = require("path");
+const { formatByte, formatTime } = require("./format");
+const mineTypes = require("../data/mineTypes.json");
+
+const img_folder = "data:image/png;base64," + readFileSync(join(__dirname, "../images/folder.png")).toString('base64');
+const img_file = "data:image/png;base64," + readFileSync(join(__dirname, "../images/file.png")).toString('base64');
+
+const template_404 = readFileSync(join(__dirname, "../template/404.html"), {
+    encoding: "utf8"
+})
+    .replace("${img_folder}", img_folder)
+    .replace("${img_file}", img_file);
+
+module.exports = function (filePath, url) {
+
+    let subItems = [];
+
+    try {
+        subItems = readdirSync(filePath);
+        console.log("<i> \x1b[1m\x1b[32m[OIPage-http-server] Read Folder: " + url + '\x1b[0m ' + new Date().toLocaleString());
+    } catch (e) {
+        console.log("<i> \x1b[1m\x1b[32m[OIPage-http-server] Read " + (/\/$/.test(url) ? "Folder" : "File") + ": \x1b[35m" + url + ' 404 Not Found\x1b[0m ' + new Date().toLocaleString());
+        try {
+            if (!/\/$/.test(url) || url === "/") {
+                filePath = join(filePath, "../");
+                subItems = readdirSync(filePath);
+            }
+        } catch (e) { }
+    }
+
+    let template = "";
+    for (let i in subItems) {
+        let isDirectory = lstatSync(join(filePath, subItems[i])).isDirectory();
+        let statObj = statSync(join(filePath, subItems[i]));
+
+        // 文件夹
+        if (isDirectory) {
+            template += `<tr class="folder">
+            <th class="name">
+                <a href='./${subItems[i]}/'>${subItems[i]}</a>
+            </th>
+            <th>
+                ${formatTime(statObj.mtime)}
+            </th>
+            <th>
+                文件夹
+            </th>
+            <th>
+                -
+            </th>
+            <th>
+                <a href='./${subItems[i]}/' class="btn">打开</a>
+            </th>
+        </tr>`;
+        }
+
+        // 文件
+        else {
+            let dotName = /\./.test(subItems[i]) ? subItems[i].match(/\.([^.]+)$/)[1] : "";
+
+            template += `<tr class="file">
+            <th class="name">
+                <a href='./${subItems[i]}'>${subItems[i]}</a>
+            </th>
+            <th>
+                ${formatTime(statObj.mtime)}
+            </th>
+            <th>
+                ${mineTypes[dotName] || "text/plain"}
+            </th>
+            <th>
+            ${formatByte(statObj.size)}
+        </th>
+            <th>
+                <a href='./${subItems[i]}' class="btn">访问</a>
+                <a href='./${subItems[i]}?download' class="btn" download='${subItems[i]}'>下载</a>
+            </th>
+        </tr>`;
+        }
+    }
+
+    return template_404.replace("${current}", filePath).replace("${template}", template);
 };

package/bin/tools/resolveImport.js

@@ -1,89 +1,89 @@
-const { readFileSync, existsSync, lstatSync } = require("fs");
-const { join } = require("path");
-const { testIntercept } = require("../intercept.js");
-
-module.exports = function (basePath, filePath, entry, intercept, isDownload, isWebsite) {
-    basePath = join(basePath, "./");
-
-    let source = readFileSync(filePath);
-    let resolveImport = content => content;
-
-    let __resolveImport = function (content) {
-        return content.replace(/import [^'"]* from (['"])([^'"]*)['"]/sg, function (_importCode, _, _importUrl) {
-            if (/^[./]/.test(_importUrl)) {
-                return _importCode;
-            } else {
-                return _importCode.replace(_importUrl, _importUrl.replace(/([^/])+/s, function (npmName) {
-
-                    if (testIntercept(npmName, intercept)) {
-                        return (isWebsite ? "/_oipage_website_/@modules/" : "/@modules/") + npmName;
-                    } else {
-
-                        let node_modulesRootPath = join(filePath, "../");
-                        let prePath = "";
-                        while (true) {
-                            let npmBundlePath = join(node_modulesRootPath, "./node_modules/", npmName);
-
-                            // 如果存在
-                            if (existsSync(npmBundlePath) && lstatSync(npmBundlePath).isDirectory()) {
-                                let npmNameValue = npmName;
-
-                                // 对于类似 import VISLite from "vislite"
-                                // 需要把包名解析成具体的文件
-                                if (!/\//.test(_importUrl)) {
-                                    let bundlePackage = require(join(npmBundlePath, "./package.json"));
-                                    npmNameValue = npmName + "/" + bundlePackage.main;
-                                }
-
-                                return (prePath ? prePath : "./") + "node_modules/" + npmNameValue;
-                            }
-
-                            if (node_modulesRootPath === basePath) {
-
-                                // 如果命令行根目录是一个项目
-                                let packagePath = join(basePath, "./package.json");
-                                if (existsSync(packagePath) && !lstatSync(packagePath).isDirectory()) {
-                                    let bundlePackage = require(packagePath);
-                                    if (!/\//.test(_importUrl)) {
-                                        return "/" + bundlePackage.main;
-                                    } else {
-                                        return "/"
-                                    }
-                                }
-
-                                return npmName;
-                            } else {
-                                node_modulesRootPath = join(node_modulesRootPath, "../");
-                                prePath = "../" + prePath;
-                            }
-                        }
-
-                    }
-                }));
-            }
-        });
-    };
-
-    // 如果是下载
-    if (isDownload) {
-        // todo
-    }
-
-    // 如果不是直接访问的
-    else if (!entry) {
-        source += "";
-        resolveImport = (content, notResolve) => notResolve ? content : __resolveImport(content);
-    }
-
-    // 如果是.html或.htm结尾
-    else if (/\.html{0,1}$/.test(filePath)) {
-        source = (source + "").replace(/<script type="module">(.*)<\/script>/sg, function (_, _matchCode) {
-            return `<script type="module">${__resolveImport(_matchCode)}</script>`;
-        });
-    }
-
-    return {
-        source,
-        resolveImport
-    };
+const { readFileSync, existsSync, lstatSync } = require("fs");
+const { join } = require("path");
+const { testIntercept } = require("../intercept.js");
+
+module.exports = function (basePath, filePath, entry, intercept, isDownload, isWebsite) {
+    basePath = join(basePath, "./");
+
+    let source = readFileSync(filePath);
+    let resolveImport = content => content;
+
+    let __resolveImport = function (content) {
+        return content.replace(/import [^'"]* from (['"])([^'"]*)['"]/sg, function (_importCode, _, _importUrl) {
+            if (/^[./]/.test(_importUrl)) {
+                return _importCode;
+            } else {
+                return _importCode.replace(_importUrl, _importUrl.replace(/([^/])+/s, function (npmName) {
+
+                    if (testIntercept(npmName, intercept)) {
+                        return (isWebsite ? "/_oipage_website_/@modules/" : "/@modules/") + npmName;
+                    } else {
+
+                        let node_modulesRootPath = join(filePath, "../");
+                        let prePath = "";
+                        while (true) {
+                            let npmBundlePath = join(node_modulesRootPath, "./node_modules/", npmName);
+
+                            // 如果存在
+                            if (existsSync(npmBundlePath) && lstatSync(npmBundlePath).isDirectory()) {
+                                let npmNameValue = npmName;
+
+                                // 对于类似 import VISLite from "vislite"
+                                // 需要把包名解析成具体的文件
+                                if (!/\//.test(_importUrl)) {
+                                    let bundlePackage = require(join(npmBundlePath, "./package.json"));
+                                    npmNameValue = npmName + "/" + bundlePackage.main;
+                                }
+
+                                return (prePath ? prePath : "./") + "node_modules/" + npmNameValue;
+                            }
+
+                            if (node_modulesRootPath === basePath) {
+
+                                // 如果命令行根目录是一个项目
+                                let packagePath = join(basePath, "./package.json");
+                                if (existsSync(packagePath) && !lstatSync(packagePath).isDirectory()) {
+                                    let bundlePackage = require(packagePath);
+                                    if (!/\//.test(_importUrl)) {
+                                        return "/" + bundlePackage.main;
+                                    } else {
+                                        return "/"
+                                    }
+                                }
+
+                                return npmName;
+                            } else {
+                                node_modulesRootPath = join(node_modulesRootPath, "../");
+                                prePath = "../" + prePath;
+                            }
+                        }
+
+                    }
+                }));
+            }
+        });
+    };
+
+    // 如果是下载
+    if (isDownload) {
+        // todo
+    }
+
+    // 如果不是直接访问的
+    else if (!entry) {
+        source += "";
+        resolveImport = (content, notResolve) => notResolve ? content : __resolveImport(content);
+    }
+
+    // 如果是.html或.htm结尾
+    else if (/\.html{0,1}$/.test(filePath)) {
+        source = (source + "").replace(/<script type="module">(.*)<\/script>/sg, function (_, _matchCode) {
+            return `<script type="module">${__resolveImport(_matchCode)}</script>`;
+        });
+    }
+
+    return {
+        source,
+        resolveImport
+    };
 };

package/bin/website-htmls/components/ui-select-file/index.html

@@ -1,8 +1,8 @@
-<div class="ui-select-file-view">
-    <h2 class="title" z-bind="_props.title"></h2>
-    <div class="tips" z-bind="_props.tips"></div>
-    <div class="file">
-        <input type="file" multiple id="input" z-on:change.stop="doChange" z-bind:accept="accept" />
-        <label for="input" z-bind="'选择'+_props.type+'文件'"></label>
-    </div>
+<div class="ui-select-file-view">
+    <h2 class="title" z-bind="_props.title"></h2>
+    <div class="tips" z-bind="_props.tips"></div>
+    <div class="file">
+        <input type="file" multiple id="input" z-on:change.stop="doChange" z-bind:accept="accept" />
+        <label for="input" z-bind="'选择'+_props.type+'文件'"></label>
+    </div>
 </div>

package/bin/website-htmls/components/ui-select-file/index.js

@@ -1,38 +1,38 @@
-import { defineElement } from "zipaper";
-import template from "./index.html";
-import style from "./index.scss";
-
-export default defineElement({
-    template,
-    emits: ["change"],
-    props: {
-        title: {
-            type: String,
-            required: true,
-        },
-        tips: {
-            type: String,
-            required: true,
-        },
-        type: {
-            type: String,
-            required: true,
-        },
-    },
-    data() {
-        return {
-            accept: {
-                pdf: "application/pdf",
-                image: "image/*"
-            }[this._props.type]
-        };
-    },
-    methods: {
-        doChange(event, target) {
-            this.$emit("change", target.files);
-        }
-    },
-    style: {
-        content: style
-    }
+import { defineElement } from "zipaper";
+import template from "./index.html";
+import style from "./index.scss";
+
+export default defineElement({
+    template,
+    emits: ["change"],
+    props: {
+        title: {
+            type: String,
+            required: true,
+        },
+        tips: {
+            type: String,
+            required: true,
+        },
+        type: {
+            type: String,
+            required: true,
+        },
+    },
+    data() {
+        return {
+            accept: {
+                pdf: "application/pdf",
+                image: "image/*"
+            }[this._props.type]
+        };
+    },
+    methods: {
+        doChange(event, target) {
+            this.$emit("change", target.files);
+        }
+    },
+    style: {
+        content: style
+    }
 });

package/bin/website-htmls/components/ui-select-file/index.scss

@@ -1,45 +1,45 @@
-.ui-select-file-view{
-    &>.title {
-    text-align: center;
-    font-weight: 700;
-    color: rgb(26, 26, 26);
-    font-size: 36px;
-    line-height: 48px;
-    padding-top: 30px;
-  }
-
-  &>.tips {
-    text-align: center;
-    line-height: 30px;
-    font-size: 22px;
-    color: rgb(26, 26, 26);
-    font-weight: 300;
-  }
-
-  &>.file {
-    text-align: center;
-    margin-top: 30px;
-
-    input {
-      display: none;
-    }
-
-    label {
-      line-height: 50px;
-      display: inline-block;
-      border: 1px solid gray;
-      background-image: url("./images/addFile.svg");
-      background-repeat: no-repeat;
-      background-position: 5px center;
-      background-size: auto 70%;
-      padding-left: 40px;
-      padding-right: 10px;
-      border-radius: 5px;
-
-      &:hover {
-        text-decoration: underline;
-        cursor: pointer;
-      }
-    }
-  }
+.ui-select-file-view{
+    &>.title {
+    text-align: center;
+    font-weight: 700;
+    color: rgb(26, 26, 26);
+    font-size: 36px;
+    line-height: 48px;
+    padding-top: 30px;
+  }
+
+  &>.tips {
+    text-align: center;
+    line-height: 30px;
+    font-size: 22px;
+    color: rgb(26, 26, 26);
+    font-weight: 300;
+  }
+
+  &>.file {
+    text-align: center;
+    margin-top: 30px;
+
+    input {
+      display: none;
+    }
+
+    label {
+      line-height: 50px;
+      display: inline-block;
+      border: 1px solid gray;
+      background-image: url("./images/addFile.svg");
+      background-repeat: no-repeat;
+      background-position: 5px center;
+      background-size: auto 70%;
+      padding-left: 40px;
+      padding-right: 10px;
+      border-radius: 5px;
+
+      &:hover {
+        text-decoration: underline;
+        cursor: pointer;
+      }
+    }
+  }
 }