Added language detection
mellobacon committed
Oct 5, 2022 at 17:44 UTC
aee6fc4bfee19252075c3af2c8e287ca0e43d8ad
3 files changed
+45
-10
src/components/Content/Editor/scripts/Editor.ts
new
+11
@@ -0,0 +1,11 @@
1
+import langlist from "../../../../scripts/languages/languages.json";
2
+
3
+let keys = Object.keys(langlist);
4
+export function getLang(ext: string) {
5
+ for (let key of keys) {
6
+ let extensions = langlist[key].extensions;
7
+ if (extensions && extensions.includes(`.${ext}`)) {
8
+ return `${key}`;
9
+ }
10
+ }
11
+}
src/components/Content/Editor/scripts/Tabs.ts
+19
-6
@@ -2,26 +2,36 @@ import { writeFile, writeTextFile } from '@tauri-apps/api/fs';
2
import { writable } from 'svelte/store';
3
import { loadFile } from '../../../FileTree/scripts/TreeData';
4
import CodeMirrorEditor from '../CodeMirrorEditor.svelte';
5
+import { getLang } from './Editor';
6
export let tabs = writable([]);
7
+export let tabinfo = writable("");
8
export let hidden = writable(true);
9
10
class Tab {
11
label: string;
12
path: string;
13
+ language: string = "Plain Text";
14
id: number;
15
active: boolean;
16
editor: CodeMirrorEditor | null;
17
editorcontent: string;
18
saved: boolean;
16
- constructor(id: number, tabname: string = "", path: string, editor = null, editorcontent = "", active: boolean = false, saved: boolean = true) {
19
+ constructor(id: number, file , editor = null, active: boolean = false, saved: boolean = true) {
20
this.id = id;
18
- this.label = tabname === "" ? `Untitled-${id}` : tabname;
19
- this.path = path;
21
+ this.label = file.filename === "" ? `Untitled-${id}` : file.filename;
22
+ this.path = file.path;
23
this.active = active;
21
- this.editor = editor
22
- this.editorcontent = editorcontent
24
+ this.editor = editor;
25
+ this.editorcontent = file.content;
26
this.saved = saved;
27
28
+ let filepath = file.path.split(".");
29
+ let extension = "txt";
30
+ if (filepath.length !== 1) {
31
+ extension = filepath.at(-1);
32
+ }
33
+ this.language = getLang(extension);
34
+
35
let _ = undefined;
36
this.editor.$on("input", (e) => {
37
clearTimeout(_);
@@ -43,11 +53,13 @@ export async function addTab(f: string) {
53
}
54
let file = await loadFile(f);
55
let editor = new CodeMirrorEditor({ target: document.getElementById("tabview"), props: { content: file.content } });
46
- let tab = new Tab(id, file.filename, file.path, editor, file.content);
56
+ let tab = new Tab(id, file, editor);
57
+
58
tablist = [...tablist, tab];
59
if (tablist.length > 0) {
60
hidden.set(false);
61
}
62
+
63
tabs.set(tablist);
64
setActive(id);
65
id++;
@@ -58,6 +70,7 @@ export function setActive(id) {
70
if (tab.id === id) {
71
activeid = id;
72
tab.active = true;
73
+ tabinfo.set(tab.language);
74
}
75
else {
76
tab.active = false;
src/components/Footer/Footer.svelte
+15
-4
@@ -1,5 +1,5 @@
1
<script lang="ts">
2
- // #2117a1
2
+ import { hidden, tabinfo } from "../Content/Editor/scripts/Tabs";
3
</script>
4
5
<div id="footer">
@@ -8,7 +8,11 @@
8
<span>Nucleus</span>
9
</div>
10
</div>
11
- <div id="codeinfo"></div>
11
+ {#if !$hidden}
12
+ <div id="codeinfo">
13
+ <span>{$tabinfo}</span>
14
+ </div>
15
+ {/if}
16
</div>
17
18
<style>
@@ -29,10 +33,17 @@
33
#codeinfo {
34
display: flex;
35
justify-content: flex-end;
32
- align-items: center;
36
+ align-items: center;
37
flex-grow: 1;
38
}
39
+ #codeinfo span {
40
+ padding: 0 7px;
41
+ }
42
+ #codeinfo span:nth-child(even) {
43
+ border-right: 1px solid #393939;
44
+ border-left: 1px solid #393939;
45
+ }
46
#apptitle {
36
- padding: 0 15px 0 15px;
47
+ padding: 0 15px;
48
}
49
</style>
\ No newline at end of file