Skip to content

Commit b462958

Browse files
cstrikeasiacstrikeasia
committed
feat: plugin state
1 parent f7b75ad commit b462958

File tree

3 files changed

+151
-37
lines changed

3 files changed

+151
-37
lines changed

‎src/css/lang/zh-Hant/setting/main/box.css

+3-4
Original file line numberDiff line numberDiff line change
@@ -234,16 +234,15 @@
234234
.eew-1::before {
235235
content: "EEW（收到地震預警時播放）";
236236
}
237+
.extended-list-button[for="extended-state-list"]:before {
238+
content: "擴充狀態";
239+
}
237240
.extended-list-button[for="extended-installed-list"]:before {
238241
content: "擴充列表";
239242
}
240243
.extended-list-button[for="extended-store-list"]:before {
241244
content: "擴充商店";
242245
}
243-
.extended-info:not(:has(.wave-container))::before {
244-
content: "目前沒有啟用中的擴充";
245-
color: red;
246-
}
247246
.copy-debug-log:before {
248247
content: "複製debug log";
249248
}

‎src/js/setting/plugin_list.js

+138-32
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,27 @@ const store = require('./main');
77
const bubble = new store();
88
const fetchData = require('../core/utils/fetch');
99

10-
const pluginStore = document.querySelector('.extended-store-list .extended-info');
10+
const pluginStore = document.querySelector(
11+
'.extended-store-list .extended-info',
12+
);
1113

1214
class PluginList {
1315
constructor() {
14-
this.enablePluginList = JSON.parse(localStorage.getItem('enabled-plugins')) || [];
16+
this.enablePluginList
17+
= JSON.parse(localStorage.getItem('enabled-plugins')) || [];
1518
this.pluginList = JSON.parse(localStorage.getItem('plugin-list')) || [];
16-
this.loadedPlugins = JSON.parse(localStorage.getItem('loaded-plugins')) || [];
19+
this.loadedPlugins
20+
= JSON.parse(localStorage.getItem('loaded-plugins')) || [];
1721
this.extendedInfo = document.querySelector('.extended-info');
1822
this.extendedConfirmWrapper = document.querySelector('.confirm-wrapper');
19-
this.ConfirmSure = this.extendedConfirmWrapper.querySelector('.confirm-sure');
20-
this.ConfirmTitle = this.extendedConfirmWrapper.querySelector('.confirm-title');
23+
this.ConfirmSure
24+
= this.extendedConfirmWrapper.querySelector('.confirm-sure');
25+
this.ConfirmTitle
26+
= this.extendedConfirmWrapper.querySelector('.confirm-title');
2127
this.extendedTopButton = document.querySelectorAll('.extended-list-button');
22-
this.extendedWrapper = document.querySelectorAll('.extended .setting-option');
28+
this.extendedWrapper = document.querySelectorAll(
29+
'.extended .setting-option',
30+
);
2331
this.storeData = [];
2432
this.lastState = null;
2533
this.lastTarget = null;
@@ -56,7 +64,10 @@ class PluginList {
5664
this.storeData = JSON.parse(localStorage.getItem('store-data') ?? '[]');
5765

5866
if (Date.now() - last_time > 600000) {
59-
const ans = await fetchData('https://raw.githubusercontent.com/ExpTechTW/trem-plugins/refs/heads/main/data/repository_stats.json', TREM.constant.HTTP_TIMEOUT.PLUGIN_INFO);
67+
const ans = await fetchData(
68+
'https://raw.githubusercontent.com/ExpTechTW/trem-plugins/refs/heads/main/data/repository_stats.json',
69+
TREM.constant.HTTP_TIMEOUT.PLUGIN_INFO,
70+
);
6071
if (ans && ans.ok) {
6172
const res = await ans.json();
6273

@@ -68,21 +79,74 @@ class PluginList {
6879
}
6980

7081
this.createPluginStoreList();
82+
this.getPluginState();
83+
}
84+
85+
getPluginState() {
86+
let a = '';
87+
const list = [
88+
{
89+
type: 'error',
90+
plugin: 'websocket',
91+
msg: '缺少 logger 依賴',
92+
},
93+
{
94+
type: 'info',
95+
plugin: 'config',
96+
msg: '缺少 logger 依賴',
97+
},
98+
{
99+
type: 'warn',
100+
plugin: 'websocket',
101+
msg: '缺少 logger 依賴',
102+
},
103+
{
104+
type: 'debug',
105+
plugin: 'websocket',
106+
msg: '缺少 logger 依賴',
107+
},
108+
];
109+
list.forEach((item) => {
110+
a += `<div class="wave-container wave-unloaded">
111+
<div class="setting-option">
112+
<div class="extended-list" style="justify-content: space-between;">
113+
<div class="extended-list-box" style="width:95%">
114+
<div class="extended-list-left">
115+
<div class="extended-list-title-box">
116+
<span class="plugin-list-title">${item.plugin}</span>
117+
</div>
118+
</div>
119+
<div class="extended-list-description-box">
120+
<span class="extended-list-descriptions">${item.msg}</span>
121+
</div>
122+
</div>
123+
</div>
124+
</div>
125+
</div>`;
126+
});
127+
document.querySelector('.extended-state-list .extended-info').innerHTML = a;
71128
}
72129

73130
createPluginStoreList() {
74131
this.storeData.forEach((item) => {
75132
if (item.repository.releases.releases.length) {
76133
let button = '';
77134

78-
const new_version = item.repository.releases.releases[0].tag_name.replace('v', '');
135+
const new_version
136+
= item.repository.releases.releases[0].tag_name.replace('v', '');
79137
item.version = new_version;
80138
const local_item = this.pluginList.find((_) => _.name == item.name);
81139

82140
if (!local_item) {
83141
button = 'download';
84142
}
85-
else if (new_version != local_item.version && PluginLoader.getInstance().compareVersions(new_version, local_item.version)) {
143+
else if (
144+
new_version != local_item.version
145+
&& PluginLoader.getInstance().compareVersions(
146+
new_version,
147+
local_item.version,
148+
)
149+
) {
86150
button = 'update';
87151
}
88152
else {
@@ -103,7 +167,10 @@ class PluginList {
103167
e.target.classList.add('disabled');
104168
e.target.classList.add('downloading');
105169
if (new_item) {
106-
await PluginLoader.getInstance().downloadPlugin(pluginName, `https://github.com/${new_item.repository.full_name}/releases/download/${new_item.repository.releases.releases[0].tag_name}/${pluginName}.trem`);
170+
await PluginLoader.getInstance().downloadPlugin(
171+
pluginName,
172+
`https://github.com/${new_item.repository.full_name}/releases/download/${new_item.repository.releases.releases[0].tag_name}/${pluginName}.trem`,
173+
);
107174
}
108175
e.target.classList.add('downloaded');
109176
bubble.showBubble('success-download', 1500);
@@ -185,12 +252,17 @@ class PluginList {
185252
renderStatusBadges(item, isEnabled, isLoaded) {
186253
const badges = [];
187254

188-
badges.push(!item.verified ? '<span class="unverified-badge"></span>' : '<span class="verified-badge"></span>');
255+
badges.push(
256+
!item.verified
257+
? '<span class="unverified-badge"></span>'
258+
: '<span class="verified-badge"></span>',
259+
);
189260

190261
if (isEnabled) {
191-
badges.push(isLoaded
192-
? '<span class="loaded-badge"></span>'
193-
: '<span class="unloaded-badge"></span>',
262+
badges.push(
263+
isLoaded
264+
? '<span class="loaded-badge"></span>'
265+
: '<span class="unloaded-badge"></span>',
194266
);
195267
}
196268

@@ -200,34 +272,49 @@ class PluginList {
200272
renderPluginItem(item, type, btn) {
201273
const isEnabled = !type ? this.enablePluginList.includes(item.name) : '';
202274
const isLoaded = !type ? this.getPluginLoadStatus(item.name) : '';
203-
const waveClassName = !type ? this.getWaveClassName(item, isEnabled, isLoaded) : '';
204-
const statusBadges = !type ? this.renderStatusBadges(item, isEnabled, isLoaded) : '';
275+
const waveClassName = !type
276+
? this.getWaveClassName(item, isEnabled, isLoaded)
277+
: '';
278+
const statusBadges = !type
279+
? this.renderStatusBadges(item, isEnabled, isLoaded)
280+
: '';
205281

206282
const is_config_exist = fs.existsSync(`${item.path}/config.yml`);
207283

208284
return `
209-
<div class="wave-container ${waveClassName}" id="plugin-${this.escapeHtml(item.name)}">
285+
<div class="wave-container ${waveClassName}" id="plugin-${this.escapeHtml(
286+
item.name,
287+
)}">
210288
<div class="setting-option">
211289
<div class="extended-list">
212290
<div class="extended-list-box">
213291
<div class="extended-list-left">
214292
<div class="extended-list-title-box">
215-
<span class="plugin-list-title">${this.escapeHtml(item.name)}</span>
293+
<span class="plugin-list-title">${this.escapeHtml(
294+
item.name,
295+
)}</span>
216296
<div class="status-box">${statusBadges}</div>
217297
</div>
218298
<div class="extended-list-author-version">
219299
<div class="author">
220-
<span class="author-name">${this.escapeHtml(item.author[0])}</span>
221-
<span class="extended-version">${this.escapeHtml(item.version)}</span>
300+
<span class="author-name">${this.escapeHtml(
301+
item.author[0],
302+
)}</span>
303+
<span class="extended-version">${this.escapeHtml(
304+
item.version,
305+
)}</span>
222306
</div>
223307
</div>
224308
</div>
225309
<div class="extended-list-description-box">
226-
<span class="extended-list-descriptions">${this.escapeHtml(item.description?.zh_tw || '')}</span>
310+
<span class="extended-list-descriptions">${this.escapeHtml(
311+
item.description?.zh_tw || '',
312+
)}</span>
227313
</div>
228314
</div>
229-
${!type
230-
? `<div class="extended-list-buttons">
315+
${
316+
!type
317+
? `<div class="extended-list-buttons">
231318
<label class="switch">
232319
<input type="checkbox"
233320
data-name="${this.escapeHtml(item.name)}"
@@ -238,8 +325,16 @@ class PluginList {
238325
${isEnabled ? 'checked' : ''}>
239326
<div class="slider round"></div>
240327
</label>
241-
${is_config_exist ? `<div id="extended-setting-button.${this.escapeHtml(item.name)}" class="extended-setting-button"></div>` : ''}
242-
<div id="extended-remove.${this.escapeHtml(item.name)}" class="extended-remove">
328+
${
329+
is_config_exist
330+
? `<div id="extended-setting-button.${this.escapeHtml(
331+
item.name,
332+
)}" class="extended-setting-button"></div>`
333+
: ''
334+
}
335+
<div id="extended-remove.${this.escapeHtml(
336+
item.name,
337+
)}" class="extended-remove">
243338
<svg fill="currentColor" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 27.965 27.965" xml:space="preserve" height="15px" width="15px">
244339
<g>
245340
<g id="c142_x">
@@ -254,9 +349,12 @@ class PluginList {
254349
</svg>
255350
</div>
256351
</div>`
257-
: `<div class="extended-list-buttons">
258-
<div id="extended-download-button.${this.escapeHtml(item.name)}" class="extended-${btn}-button"></div>
259-
</div>`}
352+
: `<div class="extended-list-buttons">
353+
<div id="extended-download-button.${this.escapeHtml(
354+
item.name,
355+
)}" class="extended-${btn}-button"></div>
356+
</div>`
357+
}
260358
</div>
261359
</div>
262360
</div>
@@ -278,11 +376,14 @@ class PluginList {
278376
return;
279377
}
280378

281-
const settingButton = document.getElementById(`extended-setting-button.${item.name}`);
379+
const settingButton = document.getElementById(
380+
`extended-setting-button.${item.name}`,
381+
);
282382
if (settingButton) {
283383
settingButton.replaceWith(settingButton.cloneNode(true));
284384

285-
document.getElementById(`extended-setting-button.${item.name}`)
385+
document
386+
.getElementById(`extended-setting-button.${item.name}`)
286387
.addEventListener('click', () => {
287388
ipcRenderer.send('open-yaml-editor', `${item.path}/config.yml`);
288389
});
@@ -371,15 +472,20 @@ class PluginList {
371472

372473
if (isEnabled) {
373474
manager.disable(pluginName);
374-
this.enablePluginList = this.enablePluginList.filter((name) => name !== pluginName);
475+
this.enablePluginList = this.enablePluginList.filter(
476+
(name) => name !== pluginName,
477+
);
375478
}
376479
else {
377480
manager.enable(pluginName);
378481
if (!this.enablePluginList.includes(pluginName)) {
379482
this.enablePluginList.push(pluginName);
380483
}
381484
}
382-
localStorage.setItem('enabled-plugins', JSON.stringify(this.enablePluginList));
485+
localStorage.setItem(
486+
'enabled-plugins',
487+
JSON.stringify(this.enablePluginList),
488+
);
383489
this.hideConfirmWrapper();
384490
bubble.showBubble('success', 1500);
385491
}

‎src/view/setting.html

+10-1
Original file line numberDiff line numberDiff line change
@@ -332,14 +332,23 @@
332332
<div class="extended-top-buttons">
333333
<div
334334
class="extended-list-button active"
335+
for="extended-state-list"
336+
></div>
337+
<div
338+
class="extended-list-button"
335339
for="extended-installed-list"
336340
></div>
337341
<div
338342
class="extended-list-button"
339343
for="extended-store-list"
340344
></div>
341345
</div>
342-
<div class="setting-option extended-installed-list show">
346+
<div class="setting-option extended-installed-list">
347+
<div class="extended-info">
348+
<div class="extended-info-warning"></div>
349+
</div>
350+
</div>
351+
<div class="setting-option extended-state-list show">
343352
<div class="extended-info">
344353
<div class="extended-info-warning"></div>
345354
</div>

0 commit comments

Comments
 (0)