diff options
author | Kristóf Marussy <marussy@mit.bme.hu> | 2021-09-17 19:10:19 +0200 |
---|---|---|
committer | Kristóf Marussy <marussy@mit.bme.hu> | 2021-09-17 19:10:19 +0200 |
commit | efdb6c6620e9ea7f5861efbef7d3462bf3c7bcd7 (patch) | |
tree | c623e8b3fba326dcbb57228f1ddbfbf55eeec494 /language-web/src/main/js/editor | |
parent | Add ESLint config (diff) | |
download | refinery-efdb6c6620e9ea7f5861efbef7d3462bf3c7bcd7.tar.gz refinery-efdb6c6620e9ea7f5861efbef7d3462bf3c7bcd7.tar.zst refinery-efdb6c6620e9ea7f5861efbef7d3462bf3c7bcd7.zip |
Frontend color theme
Diffstat (limited to 'language-web/src/main/js/editor')
-rw-r--r-- | language-web/src/main/js/editor/EditorStore.ts | 16 |
1 files changed, 12 insertions, 4 deletions
diff --git a/language-web/src/main/js/editor/EditorStore.ts b/language-web/src/main/js/editor/EditorStore.ts index 3a0c6f87..5da45ac1 100644 --- a/language-web/src/main/js/editor/EditorStore.ts +++ b/language-web/src/main/js/editor/EditorStore.ts | |||
@@ -1,4 +1,5 @@ | |||
1 | import { Editor, EditorConfiguration } from 'codemirror'; | 1 | import { Editor, EditorConfiguration } from 'codemirror'; |
2 | import 'codemirror/addon/selection/active-line'; | ||
2 | import { | 3 | import { |
3 | createAtom, | 4 | createAtom, |
4 | makeAutoObservable, | 5 | makeAutoObservable, |
@@ -12,6 +13,8 @@ import { | |||
12 | removeServices, | 13 | removeServices, |
13 | } from 'xtext/xtext-codemirror'; | 14 | } from 'xtext/xtext-codemirror'; |
14 | 15 | ||
16 | import { ThemeStore } from '../theme/ThemeStore'; | ||
17 | |||
15 | const xtextLang = 'problem'; | 18 | const xtextLang = 'problem'; |
16 | 19 | ||
17 | const xtextOptions: IXtextOptions = { | 20 | const xtextOptions: IXtextOptions = { |
@@ -22,10 +25,12 @@ const xtextOptions: IXtextOptions = { | |||
22 | const codeMirrorGlobalOptions: EditorConfiguration = { | 25 | const codeMirrorGlobalOptions: EditorConfiguration = { |
23 | mode: `xtext/${xtextLang}`, | 26 | mode: `xtext/${xtextLang}`, |
24 | indentUnit: 2, | 27 | indentUnit: 2, |
25 | theme: 'material-darker', | 28 | styleActiveLine: true, |
26 | }; | 29 | }; |
27 | 30 | ||
28 | export class EditorStore { | 31 | export class EditorStore { |
32 | themeStore; | ||
33 | |||
29 | atom; | 34 | atom; |
30 | 35 | ||
31 | editor?: Editor; | 36 | editor?: Editor; |
@@ -36,9 +41,11 @@ export class EditorStore { | |||
36 | 41 | ||
37 | showLineNumbers = false; | 42 | showLineNumbers = false; |
38 | 43 | ||
39 | constructor() { | 44 | constructor(themeStore: ThemeStore) { |
45 | this.themeStore = themeStore; | ||
40 | this.atom = createAtom('EditorStore'); | 46 | this.atom = createAtom('EditorStore'); |
41 | makeAutoObservable(this, { | 47 | makeAutoObservable(this, { |
48 | themeStore: false, | ||
42 | atom: false, | 49 | atom: false, |
43 | editor: observable.ref, | 50 | editor: observable.ref, |
44 | xtextServices: observable.ref, | 51 | xtextServices: observable.ref, |
@@ -65,8 +72,8 @@ export class EditorStore { | |||
65 | if (this.editor) { | 72 | if (this.editor) { |
66 | removeServices(this.editor); | 73 | removeServices(this.editor); |
67 | } | 74 | } |
68 | this.editor = undefined; | 75 | delete this.editor; |
69 | this.xtextServices = undefined; | 76 | delete this.xtextServices; |
70 | } | 77 | } |
71 | 78 | ||
72 | /** | 79 | /** |
@@ -89,6 +96,7 @@ export class EditorStore { | |||
89 | get codeMirrorOptions(): EditorConfiguration { | 96 | get codeMirrorOptions(): EditorConfiguration { |
90 | return { | 97 | return { |
91 | ...codeMirrorGlobalOptions, | 98 | ...codeMirrorGlobalOptions, |
99 | theme: this.themeStore.codeMirrorTheme, | ||
92 | lineNumbers: this.showLineNumbers, | 100 | lineNumbers: this.showLineNumbers, |
93 | }; | 101 | }; |
94 | } | 102 | } |