fabio286
/
antares
mirror of https://github.com/Fabio286/antares.git
1
1
Fork 0
Code Issues Releases Wiki Activity

feat: list of available shortcuts in settings window

This commit is contained in:
Fabio Di Stasio 2022-08-08 16:44:40 +02:00
parent 8bb5bb93cf
commit 44bb75bc60
4 changed files with 110 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/main/libs/ShortcutRegister.ts
View File

@ -5,7 +5,7 @@ const shortcutsStore = new Store({ name: 'shortcuts' });
const isDevelopment = process.env.NODE_ENV !== 'production';
export class ShortcutRegister {
shortcuts: ShortcutRecord[];
private _shortcuts: ShortcutRecord[];
private _mainWindow: BrowserWindow;
constructor (args: { mainWindow: BrowserWindow }) {
@ -13,6 +13,15 @@ export class ShortcutRegister {
this.shortcuts = shortcutsStore.get('shortcuts', defaultShortcuts) as ShortcutRecord[];
}
get shortcuts () {
return this._shortcuts;
}
private set shortcuts (value: ShortcutRecord[]) {
this._shortcuts = value;
shortcutsStore.set('shortcuts', value);
}
init () {
for (const shortcut of this.shortcuts) {
if (shortcut.os.includes(process.platform)) {
@ -39,10 +48,10 @@ export class ShortcutRegister {
updateShortcuts (shortcuts: ShortcutRecord[]) {
this.shortcuts = shortcuts;
this.reload();
}
restoreDefaults () {
shortcutsStore.set('shortcuts', defaultShortcuts);
this.shortcuts = defaultShortcuts;
this.reload();
}

4
src/renderer/components/ModalSettings.vue
View File

@ -289,6 +289,9 @@
</div>
</div>
<div v-show="selectedTab === 'shortcuts'" class="panel-body py-4">
<ModalSettingsShortcuts />
</div>
<div v-show="selectedTab === 'update'" class="panel-body py-4">
<ModalSettingsUpdate />
</div>
@ -333,6 +336,7 @@ import { useFocusTrap } from '@/composables/useFocusTrap';
import { localesNames } from '@/i18n/supported-locales';
import ModalSettingsUpdate from '@/components/ModalSettingsUpdate.vue';
import ModalSettingsChangelog from '@/components/ModalSettingsChangelog.vue';
import ModalSettingsShortcuts from '@/components/ModalSettingsShortcuts.vue';
import BaseTextEditor from '@/components/BaseTextEditor.vue';
import BaseSelect from '@/components/BaseSelect.vue';
import { AvailableLocale } from '@/i18n';

65
src/renderer/components/ModalSettingsShortcuts.vue Normal file
View File

@ -0,0 +1,65 @@
<template>
<div class="p-relative">
<div class="container workspace-query-results">
<div class="table table-hover">
<div class="thead">
<div class="tr text-uppercase">
<div class="th no-border">
<div>
{{ t('word.event') }}
</div>
</div>
<div class="th no-border" style="width: 100%">
<div>
{{ t('word.key', 2) }}
</div>
</div>
</div>
</div>
<div class="tbody">
<div
v-for="(shortcut, i) in shortcuts"
:key="i"
class="tr"
tabindex="0"
>
<div class="td py-1">
{{ shortcut.description }}
</div>
<div class="td py-1" v-html="parseKeys(shortcut.keys)" />
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { useSettingsStore } from '@/stores/settings';
const { t } = useI18n();
const isMacOS = process.platform === 'darwin';
const settingsStore = useSettingsStore();
const { shortcuts } = storeToRefs(settingsStore);
const parseKeys = (keys: {[key: number]: string}[]) => {
return (keys as string[]).map(k => (
k.split('+')
.map(sk => (
`<code class="text-bold">${sk}</code>`
)))
.join('+')
.replaceAll('CommandOrControl', isMacOS ? 'CMD' : 'CTRL')
).join(', ');
};
</script>
<style scoped>
.table .td {
border-right: 3px solid;
border-bottom: 3px solid;
}
</style>

57
src/renderer/stores/settings.ts
View File

@ -2,7 +2,9 @@ import { defineStore } from 'pinia';
import { ipcRenderer } from 'electron';
import { i18n, AvailableLocale } from '@/i18n';
import * as Store from 'electron-store';
const persistentStore = new Store({ name: 'settings' });
import { ShortcutRecord, shortcuts as defaultShortcuts } from 'common/shortcuts';
const settingsStore = new Store({ name: 'settings' });
const shortcutsStore = new Store({ name: 'shortcuts' });
const isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)');
const defaultAppTheme = isDarkTheme.matches ? 'dark' : 'light';
const defaultEditorTheme = isDarkTheme.matches ? 'twilight' : 'sqlserver';
@ -12,74 +14,75 @@ export type ApplicationTheme = 'light' | 'dark';
export const useSettingsStore = defineStore('settings', {
state: () => ({
locale: persistentStore.get('locale', 'en-US') as AvailableLocale,
allowPrerelease: persistentStore.get('allow_prerelease', true) as boolean,
explorebarSize: persistentStore.get('explorebar_size', null) as number,
notificationsTimeout: persistentStore.get('notifications_timeout', 5) as number,
dataTabLimit: persistentStore.get('data_tab_limit', 1000) as number,
autoComplete: persistentStore.get('auto_complete', true) as boolean,
lineWrap: persistentStore.get('line_wrap', true) as boolean,
applicationTheme: persistentStore.get('application_theme', defaultAppTheme) as ApplicationTheme,
editorTheme: persistentStore.get('editor_theme', defaultEditorTheme) as string,
editorFontSize: persistentStore.get('editor_font_size', 'medium') as EditorFontSize,
restoreTabs: persistentStore.get('restore_tabs', true) as boolean,
disableBlur: persistentStore.get('disable_blur', false) as boolean,
disableScratchpad: persistentStore.get('disable_scratchpad', false) as boolean
locale: settingsStore.get('locale', 'en-US') as AvailableLocale,
allowPrerelease: settingsStore.get('allow_prerelease', true) as boolean,
explorebarSize: settingsStore.get('explorebar_size', null) as number,
notificationsTimeout: settingsStore.get('notifications_timeout', 5) as number,
dataTabLimit: settingsStore.get('data_tab_limit', 1000) as number,
autoComplete: settingsStore.get('auto_complete', true) as boolean,
lineWrap: settingsStore.get('line_wrap', true) as boolean,
applicationTheme: settingsStore.get('application_theme', defaultAppTheme) as ApplicationTheme,
editorTheme: settingsStore.get('editor_theme', defaultEditorTheme) as string,
editorFontSize: settingsStore.get('editor_font_size', 'medium') as EditorFontSize,
restoreTabs: settingsStore.get('restore_tabs', true) as boolean,
disableBlur: settingsStore.get('disable_blur', false) as boolean,
disableScratchpad: settingsStore.get('disable_scratchpad', false) as boolean,
shortcuts: shortcutsStore.get('shortcuts', defaultShortcuts) as ShortcutRecord[]
}),
actions: {
changeLocale (locale: AvailableLocale) {
this.locale = locale;
i18n.global.locale = locale;
persistentStore.set('locale', this.locale);
settingsStore.set('locale', this.locale);
},
changePageSize (limit: number) {
this.dataTabLimit = limit;
persistentStore.set('data_tab_limit', this.dataTabLimit);
settingsStore.set('data_tab_limit', this.dataTabLimit);
},
changeAllowPrerelease (allow: boolean) {
this.allowPrerelease = allow;
persistentStore.set('allow_prerelease', this.allowPrerelease);
settingsStore.set('allow_prerelease', this.allowPrerelease);
},
updateNotificationsTimeout (timeout: number) {
this.notificationsTimeout = timeout;
persistentStore.set('notifications_timeout', this.notificationsTimeout);
settingsStore.set('notifications_timeout', this.notificationsTimeout);
},
changeExplorebarSize (size: number) {
this.explorebarSize = size;
persistentStore.set('explorebar_size', this.explorebarSize);
settingsStore.set('explorebar_size', this.explorebarSize);
},
changeAutoComplete (val: boolean) {
this.autoComplete = val;
persistentStore.set('auto_complete', this.autoComplete);
settingsStore.set('auto_complete', this.autoComplete);
},
changeLineWrap (val: boolean) {
this.lineWrap = val;
persistentStore.set('line_wrap', this.lineWrap);
settingsStore.set('line_wrap', this.lineWrap);
},
changeApplicationTheme (theme: string) {
this.applicationTheme = theme;
persistentStore.set('application_theme', this.applicationTheme);
settingsStore.set('application_theme', this.applicationTheme);
ipcRenderer.send('refresh-theme-settings');
},
changeEditorTheme (theme: string) {
this.editorTheme = theme;
persistentStore.set('editor_theme', this.editorTheme);
settingsStore.set('editor_theme', this.editorTheme);
},
changeEditorFontSize (size: EditorFontSize) {
this.editorFontSize = size;
persistentStore.set('editor_font_size', this.editorFontSize);
settingsStore.set('editor_font_size', this.editorFontSize);
},
changeRestoreTabs (val: boolean) {
this.restoreTabs = val;
persistentStore.set('restore_tabs', this.restoreTabs);
settingsStore.set('restore_tabs', this.restoreTabs);
},
changeDisableBlur (val: boolean) {
this.disableBlur = val;
persistentStore.set('disable_blur', this.disableBlur);
settingsStore.set('disable_blur', this.disableBlur);
},
changeDisableScratchpad (val: boolean) {
this.disableScratchpad = val;
persistentStore.set('disable_scratchpad', this.disableScratchpad);
settingsStore.set('disable_scratchpad', this.disableScratchpad);
}
}
});