mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-07-30 06:28:31 +00:00
4.0.0-rc19.1
* Changed: Remember which sections of the settings menu a user has expanded and restore that state when re-opening the menu. * Changed: Begin tracking which settings a user has seen, so that a future update can begin highlighting newly added settings. * Changed: Clean up the new localization code a bit more.
This commit is contained in:
SirStendec
parent
35316b8827
commit
3e9e1b2ede
21 changed files with 242 additions and 38 deletions
|
|
@ -41,6 +41,7 @@ export default class MainMenu extends Module {
|
|||
|
||||
this.dialog = new Dialog(() => this.buildDialog());
|
||||
this.has_update = false;
|
||||
this.opened = false;
|
||||
|
||||
this.settings.addUI('profiles', {
|
||||
path: 'Data Management @{"sort": 1000, "profile_warning": false} > Profiles @{"profile_warning": false}',
|
||||
|
|
@ -102,6 +103,8 @@ export default class MainMenu extends Module {
|
|||
if ( this._vue )
|
||||
this._vue.$children[0].context.has_update = true;
|
||||
});
|
||||
|
||||
this.scheduleUpdate();
|
||||
}
|
||||
|
||||
openPopout() {
|
||||
|
|
@ -130,7 +133,16 @@ export default class MainMenu extends Module {
|
|||
async onEnable() {
|
||||
await this.site.awaitElement(Dialog.EXCLUSIVE);
|
||||
|
||||
this.dialog.on('hide', this.destroyDialog, this);
|
||||
this.dialog.on('show', () => {
|
||||
this.opened = true;
|
||||
this.updateButtonUnseen();
|
||||
this.emit('show')
|
||||
});
|
||||
this.dialog.on('hide', () => {
|
||||
this.emit('hide');
|
||||
this.destroyDialog();
|
||||
});
|
||||
|
||||
this.dialog.on('resize', () => {
|
||||
if ( this._vue )
|
||||
this._vue.$children[0].maximized = this.dialog.maximized
|
||||
|
|
@ -146,6 +158,20 @@ export default class MainMenu extends Module {
|
|||
}
|
||||
|
||||
|
||||
getUnseen() {
|
||||
const pages = this.getSettingsTree();
|
||||
if ( ! Array.isArray(pages) )
|
||||
return 0;
|
||||
|
||||
let i=0;
|
||||
for(const page of pages)
|
||||
if ( page )
|
||||
i += (page.unseen || 0);
|
||||
|
||||
return i;
|
||||
}
|
||||
|
||||
|
||||
buildDialog() {
|
||||
if ( this._menu )
|
||||
return this._menu;
|
||||
|
|
@ -174,10 +200,19 @@ export default class MainMenu extends Module {
|
|||
}
|
||||
|
||||
|
||||
updateButtonUnseen() {
|
||||
const mb = this.resolve('site.menu_button');
|
||||
if ( mb )
|
||||
mb.new_settings = this.opened ? 0 : this.getUnseen();
|
||||
}
|
||||
|
||||
|
||||
updateLiveMenu() {
|
||||
clearTimeout(this._update_timer);
|
||||
this._update_timer = null;
|
||||
|
||||
this.updateButtonUnseen();
|
||||
|
||||
if ( ! this._vue || ! this._vue.$children || ! this._vue.$children[0] )
|
||||
return;
|
||||
|
||||
|
|
@ -222,7 +257,6 @@ export default class MainMenu extends Module {
|
|||
return;
|
||||
|
||||
const tree = this._settings_tree,
|
||||
expanded = this.settings.provider.get('settings-expanded', {}),
|
||||
tokens = def.ui.path_tokens,
|
||||
len = tokens.length;
|
||||
|
||||
|
|
@ -241,16 +275,13 @@ export default class MainMenu extends Module {
|
|||
full_key: key,
|
||||
sort: 0,
|
||||
parent: prefix,
|
||||
expanded: prefix === null,
|
||||
expanded: prefix == null,
|
||||
i18n_key: `setting.${key}`,
|
||||
desc_i18n_key: `setting.${key}.description`
|
||||
};
|
||||
|
||||
Object.assign(token, raw_token);
|
||||
|
||||
if ( has(expanded, key) )
|
||||
token.expanded = expanded[key];
|
||||
|
||||
prefix = key;
|
||||
}
|
||||
|
||||
|
|
@ -268,6 +299,8 @@ export default class MainMenu extends Module {
|
|||
this.rebuildSettingsTree();
|
||||
|
||||
const tree = this._settings_tree,
|
||||
settings_seen = this.settings.provider.get('cfg-seen', []),
|
||||
collapsed = this.settings.provider.get('cfg-collapsed'),
|
||||
|
||||
root = {},
|
||||
copies = {},
|
||||
|
|
@ -291,6 +324,9 @@ export default class MainMenu extends Module {
|
|||
token.parent = p_key ? parent : null;
|
||||
token.page = token.page || parent.page;
|
||||
|
||||
if ( collapsed )
|
||||
token.expanded = ! collapsed.includes(token.full_key);
|
||||
|
||||
if ( token.page && ! token.component )
|
||||
needs_component.add(token);
|
||||
|
||||
|
|
@ -337,6 +373,18 @@ export default class MainMenu extends Module {
|
|||
|
||||
tok.search_terms = terms.map(format_term).join('\n');
|
||||
|
||||
if ( ! settings_seen.includes(setting_key)) {
|
||||
// Mark existing settings as unseen for now.
|
||||
// Let users run this for a while to build up their cache.
|
||||
settings_seen.push(setting_key);
|
||||
|
||||
/*let i = tok;
|
||||
while(i) {
|
||||
i.unseen = (i.unseen||0) + 1;
|
||||
i = i.parent;
|
||||
}*/
|
||||
}
|
||||
|
||||
list.push(tok);
|
||||
}
|
||||
|
||||
|
|
@ -401,9 +449,24 @@ export default class MainMenu extends Module {
|
|||
return a.key && a.key.localeCompare(b.key);
|
||||
});
|
||||
|
||||
this.log.info(`Built Tree in ${(performance.now() - started).toFixed(5)}ms with ${Object.keys(tree).length} structure nodes and ${this._settings_count} settings nodes.`);
|
||||
const items = root.items || [];
|
||||
items.keys = copies;
|
||||
|
||||
// Save for now, since we just want to mark everything as seen.
|
||||
this.settings.provider.set('cfg-seen', settings_seen);
|
||||
|
||||
if ( ! collapsed ) {
|
||||
const new_collapsed = [];
|
||||
for(const key of Object.keys(copies)) {
|
||||
const item = copies[key];
|
||||
if ( item && item.items && item.parent )
|
||||
new_collapsed.push(key);
|
||||
}
|
||||
|
||||
this.settings.provider.set('cfg-collapsed', new_collapsed);
|
||||
}
|
||||
|
||||
this.log.info(`Built Tree in ${(performance.now() - started).toFixed(5)}ms with ${Object.keys(tree).length} structure nodes and ${this._settings_count} settings nodes.`);
|
||||
return items;
|
||||
}
|
||||
|
||||
|
|
@ -560,9 +623,40 @@ export default class MainMenu extends Module {
|
|||
return _c;
|
||||
}
|
||||
|
||||
markSeen(item, seen) {
|
||||
let had_seen = true;
|
||||
if ( ! seen ) {
|
||||
had_seen = false;
|
||||
seen = this.settings.provider.get('cfg-seen', []);
|
||||
}
|
||||
|
||||
if ( Array.isArray(item.contents) ) {
|
||||
for(const child of item.contents)
|
||||
child && this.markSeen(child, seen);
|
||||
|
||||
} else if ( ! item.setting )
|
||||
return;
|
||||
|
||||
if ( ! seen.includes(item.setting) ) {
|
||||
seen.push(item.setting);
|
||||
|
||||
let i = item.parent;
|
||||
while(i) {
|
||||
i.unseen = (i.unseen || 1) - 1;
|
||||
i = i.parent;
|
||||
}
|
||||
}
|
||||
|
||||
if ( ! had_seen )
|
||||
this.settings.provider.set('cfg-seen', seen);
|
||||
}
|
||||
|
||||
getData() {
|
||||
const settings = this.getSettingsTree(),
|
||||
context = this.getContext();
|
||||
context = this.getContext(),
|
||||
current = this.has_update ? settings.keys['home.changelog'] : settings.keys['home'];
|
||||
|
||||
this.markSeen(current);
|
||||
|
||||
return {
|
||||
context,
|
||||
|
|
@ -571,14 +665,28 @@ export default class MainMenu extends Module {
|
|||
faded: false,
|
||||
|
||||
nav: settings,
|
||||
currentItem: this.has_update ?
|
||||
settings.keys['home.changelog'] :
|
||||
settings.keys['home'], // settings[0],
|
||||
currentItem: current,
|
||||
nav_keys: settings.keys,
|
||||
|
||||
maximized: this.dialog.maximized,
|
||||
exclusive: this.dialog.exclusive,
|
||||
|
||||
markSeen: item => this.markSeen(item),
|
||||
|
||||
markExpanded: item => {
|
||||
const collapsed = this.settings.provider.get('cfg-collapsed', []),
|
||||
included = collapsed.indexOf(item.full_key);
|
||||
|
||||
if ( item.expanded && included !== -1 )
|
||||
collapsed.splice(included, 1);
|
||||
else if ( ! item.expanded && included === -1 )
|
||||
collapsed.push(item.full_key);
|
||||
else
|
||||
return;
|
||||
|
||||
this.settings.provider.set('cfg-collapsed', collapsed);
|
||||
},
|
||||
|
||||
resize: e => ! this.dialog.exclusive && this.dialog.toggleSize(e),
|
||||
close: e => ! this.dialog.exclusive && this.dialog.toggleVisible(e),
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue