aboutsummaryrefslogtreecommitdiffhomepage
path: root/ui/html/main.js
blob: 420616f4c6ebebf9bc87c65f017b2ba4d5fe6fa8 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
import 'codemirror/lib/codemirror.css';
import './style.css';
import 'codemirror/mode/toml/toml.js';
import CodeMirror from 'codemirror';

const { event, fs, path, tauri } = window.__TAURI__;

class View {
    constructor() {
        Object.assign(this, {
            content: '',
            action_time: 0,
            is_auto_scroll: true,
            is_edit_mode: false,
            is_file_changed: false,
            is_form_changed: false,
            is_content_changed: false
        }, ...arguments);
        addEventListener('DOMContentLoaded', this.init.bind(this));
    }
    async init() {
        this.editor = this.renderEditor();
        this.editor.on('scroll', this.editorScroll.bind(this));
        this.editor.on('keypress', this.editorSave.bind(this));
        this.form = this.renderForm();
        this.form.addEventListener('change', this.formChange.bind(this));
        event.listen('__update__', this.appAction.bind(this));
        event.emit('__action__', '__init__');
        while (true) {
            let now = Date.now();
            try {
                await this.update();
                this.render();
            } catch (e) {
                console.error(e);
            }
            await new Promise(r => setTimeout(r, Math.max(0, 33 - (Date.now() - now))));
        }
    }
    async update() {
        if (this.is_file_changed) {
            this.is_file_changed = false;
            let now = Date.now(),
                file = await path.resolveResource(this.file);
            if (await fs.exists(file)) {
                let content = await fs.readTextFile(file);
                if (this.action_time < now) {
                    this.content = content;
                    this.is_content_changed = true;
                }
            } else {
                if (now >= this.action_time) {
                    if (this.is_edit_mode) {
                        this.content = `# https://github.com/rustdesk/rustdesk-server#env-variables
RUST_LOG=info
`;
                    }
                    this.is_content_changed = true;
                }
                console.warn(`${this.file} file is missing`);
            }
        }
    }
    async editorSave(editor, e) {
        if (e.ctrlKey && e.keyCode === 19 && this.is_edit_mode && !this.locked) {
            this.locked = true;
            try {
                let now = Date.now(),
                    content = this.editor.doc.getValue(),
                    file = await path.resolveResource(this.file);
                await fs.writeTextFile(file, content);
                event.emit('__action__', 'restart');
            } catch (e) {
                console.error(e);
            } finally {
                this.locked = false;
            }
        }
    }
    editorScroll(e) {
        let info = this.editor.getScrollInfo(),
            distance = info.height - info.top - info.clientHeight,
            is_end = distance < 1;
        if (this.is_auto_scroll !== is_end) {
            this.is_auto_scroll = is_end;
            this.is_form_changed = true;
        }
    }
    formChange(e) {
        switch (e.target.tagName.toLowerCase()) {
            case 'input':
                this.is_auto_scroll = e.target.checked;
                break;
        }
    }
    appAction(e) {
        let [action, data] = e.payload;
        switch (action) {
            case 'file':
                if (data === '.env') {
                    this.is_edit_mode = true;
                    this.file = `bin/${data}`;
                } else {
                    this.is_edit_mode = false;
                    this.file = `logs/${data}`;
                }
                this.action_time = Date.now();
                this.is_file_changed = true;
                this.is_form_changed = true;
                break;
        }
    }
    render() {
        if (this.is_form_changed) {
            this.is_form_changed = false;
            this.renderForm();
        }
        if (this.is_content_changed) {
            this.is_content_changed = false;
            this.renderEditor();
        }
        if (this.is_auto_scroll && !this.is_edit_mode) {
            this.renderScrollbar();
        }
    }
    renderForm() {
        let form = this.form || document.querySelector('form'),
            label = form.querySelectorAll('label'),
            input = form.querySelector('input');
        input.checked = this.is_auto_scroll;
        if (this.is_edit_mode) {
            label[0].style.display = 'none';
            label[1].style.display = 'block';
        } else {
            label[0].style.display = 'block';
            label[1].style.display = 'none';
        }
        return form;
    }
    renderEditor() {
        let editor = this.editor || CodeMirror.fromTextArea(document.querySelector('textarea'), {
            mode: { name: 'toml' },
            lineNumbers: true,
            autofocus: true
        });
        editor.setOption('readOnly', !this.is_edit_mode);
        editor.doc.setValue(this.content);
        editor.doc.clearHistory();
        this.content = '';
        editor.focus();
        return editor;
    }
    renderScrollbar() {
        let info = this.editor.getScrollInfo();
        this.editor.scrollTo(info.left, info.height);
    }
}

new View();