common code / html support

minetest-go · Sep 25, 2023 · 61fb5f6 · 61fb5f6
1 parent 776528a
commit 61fb5f6
Show file tree

Hide file tree

Showing 7 changed files with 34 additions and 45 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
diff --git a/public/embed.go b/public/embed.go
@@ -22,6 +22,9 @@ import (
 //go:embed node_modules/codemirror/lib/codemirror.*
 //go:embed node_modules/codemirror/mode/lua/lua.js
 //go:embed node_modules/codemirror/mode/javascript/javascript.js
+//go:embed node_modules/codemirror/mode/htmlmixed/htmlmixed.js
+//go:embed node_modules/codemirror/mode/xml/xml.js
+//go:embed node_modules/codemirror/mode/css/css.js
 var Webapp embed.FS
 
 const DefaultCss = "node_modules/bootstrap/dist/css/bootstrap.min.css"

diff --git a/public/index.html b/public/index.html
@@ -36,6 +36,9 @@
 		<script src="node_modules/codemirror/lib/codemirror.js"></script>
 		<script src="node_modules/codemirror/mode/lua/lua.js"></script>
 		<script src="node_modules/codemirror/mode/javascript/javascript.js"></script>
+		<script src="node_modules/codemirror/mode/htmlmixed/htmlmixed.js"></script>
+		<script src="node_modules/codemirror/mode/xml/xml.js"></script>
+		<script src="node_modules/codemirror/mode/css/css.js"></script>
 		{{if .Webdev}}
 		<script src="js/main.js" type="module"></script>
 		{{else}}

diff --git a/public/js/components/pages/filebrowser/FileEdit.js b/public/js/components/pages/filebrowser/FileEdit.js
@@ -1,6 +1,7 @@
 import { START, FILEBROWSER } from "../../Breadcrumb.js";
 import DefaultLayout from "../../layouts/DefaultLayout.js";
 import { download_text, upload } from "../../../api/filebrowser.js";
+import { get_mode_name } from "./common.js";
 
 export default {
     props: ["pathMatch"],
@@ -18,18 +19,12 @@ export default {
         download_text(this.pathMatch)
         .then(t => this.text = t)
         .then(() => {
-
-            const mode = {};
-            if (this.pathMatch.match(/.*(lua)$/i)) {
-                mode.name = "lua";
-            } else if (this.pathMatch.match(/.*(js|json)$/i)) {
-                mode.name = "javascript";
-            }
-
             this.cm = CodeMirror.fromTextArea(this.$refs.textarea, {
                 lineNumbers: true,
                 viewportMargin: Infinity,
-                mode: mode
+                mode: {
+                    name: get_mode_name(this.pathMatch)
+                }
             });
         });
     },
@@ -83,4 +78,4 @@ export default {
         <textarea ref="textarea" class="w-100" style="height: 800px;" v-model="text"></textarea>
     </default-layout>
     `
-};
+};
diff --git a/public/js/components/pages/filebrowser/Filebrowser.js b/public/js/components/pages/filebrowser/Filebrowser.js
@@ -4,6 +4,7 @@ import format_size from "../../../util/format_size.js";
 import format_time from "../../../util/format_time.js";
 import { START, FILEBROWSER } from "../../Breadcrumb.js";
 import { get_maintenance } from "../../../service/stats.js";
+import { can_edit } from "./common.js";
 
 export default {
     props: ["pathMatch"],
@@ -90,18 +91,14 @@ export default {
                 }
             });
         },
-        can_edit: function(filename) {
-            return filename.match(/.*(js|lua|txt|conf|cfg|json|md|mt)$/i);
-        },
+        can_edit: can_edit,
         is_database: function(filename) {
             return filename.match(/.*(sqlite|sqlite-shm|sqlite-wal)$/i);
         },
         get_icon: function(item) {
             if (item.is_dir) {
                 return "folder";
-            } else if (item.name.match(/.*(txt|conf|cfg|md)$/i)) {
-                return "file-lines";
-            } else if (item.name.match(/.*(js|lua|json)$/i)) {
+            } else if (can_edit(item.name)) {
                 return "file-code";
             } else if (item.name.match(/.*(sqlite)$/i)) {
                 return "database";

diff --git a/public/js/components/pages/filebrowser/common.js b/public/js/components/pages/filebrowser/common.js
@@ -0,0 +1,20 @@
+const modes = [{
+    name: "lua", match: /.*(lua)$/i
+},{
+    name: "javascript", match: /.*(js|json)$/i
+},{
+    name: "htmlmixed", match: /.*(html)$/i
+},{
+    name: "xml", match: /.*(xml)$/i
+},{
+    name: "text/css", match: /.*(css)$/i
+}];
+
+export const can_edit = filename => {
+    return filename.match(/.*(js|lua|txt|conf|cfg|json|md|mt|html|css)$/i);
+};
+
+export const get_mode_name = filename => {
+    const mode = modes.find(m => filename.match(m.match));
+    return mode ? mode.name : null;
+};