schoolbox web extension :)
refactor(storage): modularise
+266
-261
+1
src/utils/index.ts
+1
src/utils/index.ts
···
1
+
export * from "./storage";
-261
src/utils/storage.ts
-261
src/utils/storage.ts
···
1
-
import { StorageState } from "./state.svelte";
2
-
import * as Types from "./types";
3
-
4
-
// Global
5
-
export const globalSettings: StorageState<Types.Settings> = new StorageState<Types.Settings>(
6
-
storage.defineItem<Types.Settings>("local:globalSettings", {
7
-
fallback: {
8
-
global: true,
9
-
plugins: true,
10
-
themes: true,
11
-
snippets: true,
12
-
13
-
themeFlavour: "mocha",
14
-
themeAccent: "mauve",
15
-
themeLogo: "schooltape-rainbow",
16
-
themeLogoAsFavicon: false,
17
-
18
-
userSnippets: {},
19
-
},
20
-
}),
21
-
true,
22
-
);
23
-
24
-
export const needsRefresh = new StorageState(
25
-
storage.defineItem<boolean>("local:needsRefresh", {
26
-
fallback: false,
27
-
}),
28
-
);
29
-
30
-
// whether schooltape was recently updated
31
-
export const updated = new StorageState(
32
-
storage.defineItem<Types.UpdatedBadges>("local:updated", {
33
-
version: 2,
34
-
fallback: {
35
-
icon: false,
36
-
changelog: false,
37
-
},
38
-
migrations: {
39
-
2: async () => {
40
-
// reset to fallback
41
-
await storage.removeItem("local:updated");
42
-
},
43
-
},
44
-
}),
45
-
);
46
-
47
-
// message of the day
48
-
export const motd = new StorageState(
49
-
storage.defineItem<Types.Motd>("local:motd", {
50
-
fallback: {
51
-
motd: "Free and <a href='https://github.com/schooltape/schooltape' class='text-(--ctp-accent)'> open source</a>!",
52
-
},
53
-
}),
54
-
);
55
-
56
-
export const schoolboxUrls = new StorageState(
57
-
storage.defineItem<Types.SchoolboxUrls>("local:urls", {
58
-
version: 1,
59
-
fallback: {
60
-
urls: ["https://help.schoolbox.com.au"],
61
-
},
62
-
}),
63
-
);
64
-
65
-
// Plugins
66
-
function createPlugin(
67
-
id: string,
68
-
name: string,
69
-
description: string,
70
-
fallbackToggle: boolean,
71
-
settings?: Record<string, Types.PluginSetting>,
72
-
) {
73
-
const plugin: Types.PluginData = {
74
-
toggle: new StorageState(
75
-
storage.defineItem<Types.ToggleState>(`local:plugin-${id}`, {
76
-
fallback: {
77
-
toggle: fallbackToggle,
78
-
},
79
-
}),
80
-
true,
81
-
),
82
-
info: {
83
-
name,
84
-
description,
85
-
},
86
-
};
87
-
88
-
if (settings) {
89
-
plugin.settings = settings;
90
-
}
91
-
92
-
return plugin;
93
-
}
94
-
95
-
function pluginToggle(
96
-
pluginId: string,
97
-
settingId: string,
98
-
name: string,
99
-
description: string,
100
-
fallback: boolean,
101
-
): Types.PluginSetting {
102
-
return {
103
-
type: "toggle",
104
-
state: new StorageState(
105
-
storage.defineItem<Types.ToggleState>(`local:${pluginId}-${settingId}`, {
106
-
fallback: { toggle: fallback },
107
-
}),
108
-
),
109
-
info: { name, description },
110
-
};
111
-
}
112
-
113
-
export function pluginSlider(
114
-
pluginId: string,
115
-
settingId: string,
116
-
name: string,
117
-
description: string,
118
-
min: number,
119
-
max: number,
120
-
fallback: number,
121
-
): Types.PluginSetting {
122
-
return {
123
-
type: "slider",
124
-
state: new StorageState(
125
-
storage.defineItem<Types.SliderState>(`local:${pluginId}-${settingId}`, {
126
-
fallback: { value: fallback, min, max },
127
-
}),
128
-
),
129
-
info: { name, description },
130
-
};
131
-
}
132
-
133
-
export const plugins: Record<Types.PluginId, Types.PluginData> = {
134
-
subheader: createPlugin(
135
-
"subheader",
136
-
"Subheader Revamp",
137
-
"Adds a clock and current period info to the subheader.",
138
-
true,
139
-
{
140
-
openInNewTab: pluginToggle(
141
-
"subheaderRevamp",
142
-
"openInNewTab",
143
-
"Open links in new tab",
144
-
"Whether to open the class link in a new tab.",
145
-
true,
146
-
),
147
-
},
148
-
),
149
-
150
-
scrollSegments: createPlugin(
151
-
"scrollSegments",
152
-
"Scroll Segments",
153
-
"Segments the Schoolbox page into scrollable sections.",
154
-
true,
155
-
),
156
-
157
-
scrollPeriod: createPlugin("scrollPeriod", "Scroll Period", "Scrolls to the current period on the timetable.", true, {
158
-
resetCooldownOnMouseMove: pluginToggle(
159
-
"scrollPeriod",
160
-
"resetCooldownOnMouseMove",
161
-
"Reset on mouse move",
162
-
"Whether to reset the scrolling cooldown when you move your mouse.",
163
-
true,
164
-
),
165
-
cooldownDuration: pluginSlider(
166
-
"scrollPeriod",
167
-
"cooldownDuration",
168
-
"Cooldown duration (s)",
169
-
"How long to wait before scrolling.",
170
-
1,
171
-
60,
172
-
10,
173
-
),
174
-
}),
175
-
176
-
progressBar: createPlugin(
177
-
"progressBar",
178
-
"Progress Bar",
179
-
"Displays a progress bar below the timetable to show the time of the day.",
180
-
true,
181
-
),
182
-
183
-
modernIcons: createPlugin("modernIcons", "Modern Icons", "Modernise the icons across Schoolbox.", true, {
184
-
filled: pluginToggle(
185
-
"modernIcons",
186
-
"filled",
187
-
"Filled Icons",
188
-
"Whether the icons should be filled or outlined.",
189
-
true,
190
-
),
191
-
}),
192
-
193
-
tabTitle: createPlugin("tabTitle", "Better Tab Titles", "Improves the tab titles for easier navigation.", true, {
194
-
showSubjectPrefix: pluginToggle(
195
-
"tabTitle",
196
-
"showSubjectPrefix",
197
-
"Show subject prefix",
198
-
`e.g. "ENG - VCE English 1 & 2" becomes "VCE English 1 & 2"`,
199
-
true,
200
-
),
201
-
}),
202
-
203
-
homepageSwitcher: createPlugin(
204
-
"homepageSwitcher",
205
-
"Homepage Switcher",
206
-
"The logo will switch to existing Schoolbox homepage when available.",
207
-
true,
208
-
{
209
-
closeCurrentTab: pluginToggle(
210
-
"homepageSwitcher",
211
-
"closeCurrentTab",
212
-
"Close current tab",
213
-
"When switching to another tab, close the current one.",
214
-
false,
215
-
),
216
-
},
217
-
),
218
-
};
219
-
220
-
// Snippets
221
-
function createSnippet(id: string, name: string, description: string, fallbackToggle: boolean) {
222
-
return {
223
-
toggle: new StorageState(
224
-
storage.defineItem<Types.ToggleState>(`local:snippet-${id}`, {
225
-
fallback: {
226
-
toggle: fallbackToggle,
227
-
},
228
-
}),
229
-
true,
230
-
),
231
-
info: {
232
-
name,
233
-
description,
234
-
},
235
-
};
236
-
}
237
-
238
-
export const snippets: Record<Types.SnippetId, Types.SnippetData> = {
239
-
roundedCorners: createSnippet(
240
-
"roundedCorners",
241
-
"Rounded Corners",
242
-
"Adds rounded corners to all elements across Schoolbox.",
243
-
true,
244
-
),
245
-
246
-
hidePfp: createSnippet("hidePfp", "Hide PFP", "Hide your profile picture across Schoolbox.", true),
247
-
248
-
hidePwaPrompt: createSnippet(
249
-
"hidePwaPrompt",
250
-
"Hide PWA Prompt",
251
-
"Hides the prompt in the notifications menu to install Schoolbox as a PWA and enable notifications.",
252
-
true,
253
-
),
254
-
255
-
censor: createSnippet(
256
-
"censor",
257
-
"Censor",
258
-
"Censors all text and images. This is intended for development purposes.",
259
-
false,
260
-
),
261
-
};
+61
src/utils/storage/global.ts
+61
src/utils/storage/global.ts
···
1
+
import * as Types from "../types";
2
+
3
+
export const globalSettings: StorageState<Types.Settings> = new StorageState<Types.Settings>(
4
+
storage.defineItem<Types.Settings>("local:globalSettings", {
5
+
fallback: {
6
+
global: true,
7
+
plugins: true,
8
+
themes: true,
9
+
snippets: true,
10
+
11
+
themeFlavour: "mocha",
12
+
themeAccent: "mauve",
13
+
themeLogo: "schooltape-rainbow",
14
+
themeLogoAsFavicon: false,
15
+
16
+
userSnippets: {},
17
+
},
18
+
}),
19
+
true,
20
+
);
21
+
22
+
export const needsRefresh = new StorageState(
23
+
storage.defineItem<boolean>("local:needsRefresh", {
24
+
fallback: false,
25
+
}),
26
+
);
27
+
28
+
// whether schooltape was recently updated
29
+
export const updated = new StorageState(
30
+
storage.defineItem<Types.UpdatedBadges>("local:updated", {
31
+
version: 2,
32
+
fallback: {
33
+
icon: false,
34
+
changelog: false,
35
+
},
36
+
migrations: {
37
+
2: async () => {
38
+
// reset to fallback
39
+
await storage.removeItem("local:updated");
40
+
},
41
+
},
42
+
}),
43
+
);
44
+
45
+
// message of the day
46
+
export const motd = new StorageState(
47
+
storage.defineItem<Types.Motd>("local:motd", {
48
+
fallback: {
49
+
motd: "Free and <a href='https://github.com/schooltape/schooltape' class='text-(--ctp-accent)'> open source</a>!",
50
+
},
51
+
}),
52
+
);
53
+
54
+
export const schoolboxUrls = new StorageState(
55
+
storage.defineItem<Types.SchoolboxUrls>("local:urls", {
56
+
version: 1,
57
+
fallback: {
58
+
urls: ["https://help.schoolbox.com.au"],
59
+
},
60
+
}),
61
+
);
+85
src/utils/storage/helpers.ts
+85
src/utils/storage/helpers.ts
···
1
+
import * as Types from "../types";
2
+
3
+
export function createPlugin(
4
+
id: string,
5
+
name: string,
6
+
description: string,
7
+
fallbackToggle: boolean,
8
+
settings?: Record<string, Types.PluginSetting>,
9
+
) {
10
+
const plugin: Types.PluginData = {
11
+
toggle: new StorageState(
12
+
storage.defineItem<Types.ToggleState>(`local:plugin-${id}`, {
13
+
fallback: {
14
+
toggle: fallbackToggle,
15
+
},
16
+
}),
17
+
true,
18
+
),
19
+
info: {
20
+
name,
21
+
description,
22
+
},
23
+
};
24
+
25
+
if (settings) {
26
+
plugin.settings = settings;
27
+
}
28
+
29
+
return plugin;
30
+
}
31
+
32
+
export function pluginToggle(
33
+
pluginId: string,
34
+
settingId: string,
35
+
name: string,
36
+
description: string,
37
+
fallback: boolean,
38
+
): Types.PluginSetting {
39
+
return {
40
+
type: "toggle",
41
+
state: new StorageState(
42
+
storage.defineItem<Types.ToggleState>(`local:${pluginId}-${settingId}`, {
43
+
fallback: { toggle: fallback },
44
+
}),
45
+
),
46
+
info: { name, description },
47
+
};
48
+
}
49
+
50
+
export function pluginSlider(
51
+
pluginId: string,
52
+
settingId: string,
53
+
name: string,
54
+
description: string,
55
+
min: number,
56
+
max: number,
57
+
fallback: number,
58
+
): Types.PluginSetting {
59
+
return {
60
+
type: "slider",
61
+
state: new StorageState(
62
+
storage.defineItem<Types.SliderState>(`local:${pluginId}-${settingId}`, {
63
+
fallback: { value: fallback, min, max },
64
+
}),
65
+
),
66
+
info: { name, description },
67
+
};
68
+
}
69
+
70
+
export function createSnippet(id: string, name: string, description: string, fallbackToggle: boolean) {
71
+
return {
72
+
toggle: new StorageState(
73
+
storage.defineItem<Types.ToggleState>(`local:snippet-${id}`, {
74
+
fallback: {
75
+
toggle: fallbackToggle,
76
+
},
77
+
}),
78
+
true,
79
+
),
80
+
info: {
81
+
name,
82
+
description,
83
+
},
84
+
};
85
+
}
+3
src/utils/storage/index.ts
+3
src/utils/storage/index.ts
+89
src/utils/storage/plugins.ts
+89
src/utils/storage/plugins.ts
···
1
+
import * as Types from "../types";
2
+
import { createPlugin, pluginSlider, pluginToggle } from "./helpers";
3
+
4
+
export const plugins: Record<Types.PluginId, Types.PluginData> = {
5
+
subheader: createPlugin(
6
+
"subheader",
7
+
"Subheader Revamp",
8
+
"Adds a clock and current period info to the subheader.",
9
+
true,
10
+
{
11
+
openInNewTab: pluginToggle(
12
+
"subheaderRevamp",
13
+
"openInNewTab",
14
+
"Open links in new tab",
15
+
"Whether to open the class link in a new tab.",
16
+
true,
17
+
),
18
+
},
19
+
),
20
+
21
+
scrollSegments: createPlugin(
22
+
"scrollSegments",
23
+
"Scroll Segments",
24
+
"Segments the Schoolbox page into scrollable sections.",
25
+
true,
26
+
),
27
+
28
+
scrollPeriod: createPlugin("scrollPeriod", "Scroll Period", "Scrolls to the current period on the timetable.", true, {
29
+
resetCooldownOnMouseMove: pluginToggle(
30
+
"scrollPeriod",
31
+
"resetCooldownOnMouseMove",
32
+
"Reset on mouse move",
33
+
"Whether to reset the scrolling cooldown when you move your mouse.",
34
+
true,
35
+
),
36
+
cooldownDuration: pluginSlider(
37
+
"scrollPeriod",
38
+
"cooldownDuration",
39
+
"Cooldown duration (s)",
40
+
"How long to wait before scrolling.",
41
+
1,
42
+
60,
43
+
10,
44
+
),
45
+
}),
46
+
47
+
progressBar: createPlugin(
48
+
"progressBar",
49
+
"Progress Bar",
50
+
"Displays a progress bar below the timetable to show the time of the day.",
51
+
true,
52
+
),
53
+
54
+
modernIcons: createPlugin("modernIcons", "Modern Icons", "Modernise the icons across Schoolbox.", true, {
55
+
filled: pluginToggle(
56
+
"modernIcons",
57
+
"filled",
58
+
"Filled Icons",
59
+
"Whether the icons should be filled or outlined.",
60
+
true,
61
+
),
62
+
}),
63
+
64
+
tabTitle: createPlugin("tabTitle", "Better Tab Titles", "Improves the tab titles for easier navigation.", true, {
65
+
showSubjectPrefix: pluginToggle(
66
+
"tabTitle",
67
+
"showSubjectPrefix",
68
+
"Show subject prefix",
69
+
`e.g. "ENG - VCE English 1 & 2" becomes "VCE English 1 & 2"`,
70
+
true,
71
+
),
72
+
}),
73
+
74
+
homepageSwitcher: createPlugin(
75
+
"homepageSwitcher",
76
+
"Homepage Switcher",
77
+
"The logo will switch to existing Schoolbox homepage when available.",
78
+
true,
79
+
{
80
+
closeCurrentTab: pluginToggle(
81
+
"homepageSwitcher",
82
+
"closeCurrentTab",
83
+
"Close current tab",
84
+
"When switching to another tab, close the current one.",
85
+
false,
86
+
),
87
+
},
88
+
),
89
+
};
+27
src/utils/storage/snippets.ts
+27
src/utils/storage/snippets.ts
···
1
+
import * as Types from "../types";
2
+
import { createSnippet } from "./helpers";
3
+
4
+
export const snippets: Record<Types.SnippetId, Types.SnippetData> = {
5
+
roundedCorners: createSnippet(
6
+
"roundedCorners",
7
+
"Rounded Corners",
8
+
"Adds rounded corners to all elements across Schoolbox.",
9
+
true,
10
+
),
11
+
12
+
hidePfp: createSnippet("hidePfp", "Hide PFP", "Hide your profile picture across Schoolbox.", true),
13
+
14
+
hidePwaPrompt: createSnippet(
15
+
"hidePwaPrompt",
16
+
"Hide PWA Prompt",
17
+
"Hides the prompt in the notifications menu to install Schoolbox as a PWA and enable notifications.",
18
+
true,
19
+
),
20
+
21
+
censor: createSnippet(
22
+
"censor",
23
+
"Censor",
24
+
"Censors all text and images. This is intended for development purposes.",
25
+
false,
26
+
),
27
+
};