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
|
import { mk } from './util';
// An array with all the windows on the screen
export var windows: BaseWindow[] = [];
// The focused window
export var focused_window: BaseWindow = null;
import * as drag from './dragging'
// Windows have a z-index. When we click a window it is sent to the top this will be its new z-index
// We then increment the depth, and the next window we click will go on top of the current one
var depth = 20;
export class BaseWindow {
pwd: string[];
visuals: HTMLElement;
h2: HTMLElement; // The titlebar of the window
fileview: any; // TODO what is this
files: any[];
txt_editor: HTMLElement; // For editable text files, this is the DOM element the user can edit
grid: HTMLElement;
wc: HTMLElement;
constructor(pwd, x, y, w, h) {
this.pwd = pwd; // pwd = [ "Folder1", "Folder2" ] means the current directory of that window is /Folder1/Folder2
this.visuals = null; // The DOM object
this.h2 = null; // The titlebar of the window
this.fileview = null;
this.files = [];
this.txt_editor = null; // For editable text files, this is the DOM element the user can edit
make_window_base(this, pwd, x, y, w, h);
}
destroy() {
var index = windows.indexOf(this);
if (index >= 0)
windows.splice(index, 1);
this.visuals.parentNode.removeChild(this.visuals);
if (this == focused_window)
focused_window = null;
}
focus() {
if (focused_window == this)
return;
// Unfocus the old window
if (focused_window)
focused_window.visuals.classList.remove('focus');
focused_window = this;
// And focus the new one!
this.visuals.classList.add('focus');
this.visuals.style.zIndex = (depth++).toString();
}
get_path(max_length?: number) {
if (max_length == undefined) {
max_length = this.pwd.length;
}
var path = "/";
for (let i = 0; i < max_length; i++) {
path += this.pwd[i];
if (i != max_length - 1)
path += "/";
}
return path;
}
}
export function unfocus_window() {
if (focused_window) {
focused_window.visuals.classList.remove('focus');
focused_window = null;
}
}
// This creates the parts of a window that are common between all window types
// This should only really be called by another function that will then fill up the window
function make_window_base(wnd, pwd, x, y, w, h) {
windows.push(wnd);
wnd.visuals = mk(document.body, 'div', 'window');
wnd.grid = mk(wnd.visuals, 'div', 'windowgrid');
wnd.wc = mk(wnd.grid, 'div', 'wc');
wnd.visuals.style.width = w + "px";
wnd.visuals.style.height = h ? (h + "px") : "unset";
wnd.visuals.style.position = "absolute";
wnd.visuals.style.left = x + "px";
wnd.visuals.style.top = y + "px";
wnd.h2 = mk(wnd.wc, 'h2');
mk(wnd.grid, 'div', 'nw-resize');
wnd.visuals.onmousedown = (_e) => {
wnd.focus();
}
wnd.h2.onmousedown = (e) => {
if (!drag.dragging)
drag.set_dragging_candidate(e, wnd.visuals);
};
return wnd;
}
|