mirror of https://github.com/Lissy93/dashy.git
🔀 Merge pull request #322 from Lissy93/REFACTOR/some-updates
[REFACTOR] Minor Code Updates
This commit is contained in:
commit
2543a8993e
|
@ -23,13 +23,11 @@
|
|||
|
||||
---
|
||||
|
||||
### HomeLAb 3.0
|
||||
### EVO Dashboard
|
||||
|
||||
> By [@skoogee](https://github.com/skoogee) (http://zhrn.cc)
|
||||
> By [@EVOTk](https://github.com/EVOTk)
|
||||
|
||||
> Dashy, is the most complete dashboard I ever tried, has all the features, and it sets itself apart from the rest. It is my default homepage now. I am thankful to the developer @Lissy93 for sharing such a wonderful creation.
|
||||
|
||||
[](https://ibb.co/album/ynSwzm)
|
||||

|
||||
|
||||
---
|
||||
|
||||
|
@ -80,6 +78,16 @@
|
|||
|
||||
---
|
||||
|
||||
### HomeLAb 3.0
|
||||
|
||||
> By [@skoogee](https://github.com/skoogee) (http://zhrn.cc)
|
||||
|
||||
> Dashy, is the most complete dashboard I ever tried, has all the features, and it sets itself apart from the rest. It is my default homepage now. I am thankful to the developer @Lissy93 for sharing such a wonderful creation.
|
||||
|
||||
[](https://ibb.co/album/ynSwzm)
|
||||
|
||||
---
|
||||
|
||||
### Ground Control
|
||||
> By [@dtctek](https://github.com/dtctek)
|
||||
|
||||
|
@ -93,14 +101,6 @@
|
|||
|
||||
---
|
||||
|
||||
### EVO Dashboard
|
||||
|
||||
> By [@EVOTk](https://github.com/EVOTk)
|
||||
|
||||

|
||||
|
||||
---
|
||||
|
||||
## Submitting your Dashboard
|
||||
|
||||
#### How to Submit
|
||||
|
|
|
@ -210,6 +210,10 @@
|
|||
"save-disk-tooltip": "Save config to the conf.yml file on disk. This will backup, and then over-write your existing config",
|
||||
"export-config-btn": "Export Config",
|
||||
"export-config-tooltip": "View and export new config, either to a file, or to clipboard",
|
||||
"cloud-backup-btn": "Backup to Cloud",
|
||||
"cloud-backup-tooltip": "Save encrypted backup of configuration to cloud",
|
||||
"edit-raw-config-btn": "Edit Raw Config",
|
||||
"edit-raw-config-tooltip": "View and modify raw config via JSON editor",
|
||||
"cancel-changes-btn": "Cancel Edit",
|
||||
"cancel-changes-tooltip": "Reset current modifications, and exit Edit Mode. This will not affect your saved config",
|
||||
"edit-mode-name": "Edit Mode",
|
||||
|
|
|
@ -10,20 +10,18 @@
|
|||
<!-- Help Links -->
|
||||
<h3>Help & Support</h3>
|
||||
For getting support with running or configuring Dashy, see the <a href="https://github.com/Lissy93/dashy/discussions">Discussions</a>
|
||||
<h3>Report a Bug</h3>
|
||||
If you think you've found a bug, then please <a href="https://github.com/Lissy93/dashy/issues/new/choose">raise it on GitHub</a>.
|
||||
<br>Include version you are running, environment info, output of the console (press F12),
|
||||
and any suppoting scerenshots.
|
||||
<h3>Supporting Dashy</h3>
|
||||
For ways that you can get involved, check out the <a href="https://github.com/Lissy93/dashy/blob/master/docs/contributing.md">Contributing</a> page.
|
||||
<h3>Report a Bug</h3>
|
||||
If you think you've found a bug, then please <a href="https://github.com/Lissy93/dashy/issues/new/choose">raise an Issue</a>.
|
||||
<h3>More Info</h3>
|
||||
Source: <a href="https://github.com/lissy93/dashy">github.com/lissy93/dashy</a><br>
|
||||
Documentation: <a href="https://dashy.to/docs">dashy.to/docs</a>
|
||||
<!-- License -->
|
||||
<h3>License</h3>
|
||||
Licensed under MIT X11. Copyright <a href="https://aliciasykes.com">Alicia Sykes</a> © 2021.<br>
|
||||
For licenses for third-party modules, please see <a href="https://github.com/Lissy93/dashy/blob/master/.github/LEGAL.md">Legal</a>.
|
||||
For a list of contributors, and application thank-you's, see <a href="https://github.com/Lissy93/dashy/blob/master/docs/credits.md">Credits</a>
|
||||
For licenses for third-party modules, please see <a href="https://github.com/Lissy93/dashy/blob/master/.github/LEGAL.md">Legal</a>.<br>
|
||||
For the full list of contributors and thanks, see <a href="https://github.com/Lissy93/dashy/blob/master/docs/credits.md">Credits</a>.
|
||||
<!-- App Version -->
|
||||
<h3>Version</h3>
|
||||
<AppVersion class="app-version" />
|
||||
|
@ -80,8 +78,8 @@ div.about-modal {
|
|||
}
|
||||
}
|
||||
h3 {
|
||||
font-size: 1rem;
|
||||
margin: 0.5rem 0 0.2rem 0;
|
||||
font-size: 1.2rem;
|
||||
margin: 0.75rem 0 0.2rem 0;
|
||||
color: var(--about-page-accent);
|
||||
}
|
||||
a {
|
||||
|
@ -108,3 +106,14 @@ div.about-modal {
|
|||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
div.about-modal {
|
||||
.app-version {
|
||||
text-align: left;
|
||||
display: flex;
|
||||
align-items: self-end;
|
||||
p { margin: 0; }
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -68,7 +68,7 @@ import Input from '@/components/FormElements/Input';
|
|||
import StoreKeys from '@/utils/StoreMutations';
|
||||
import { backup, update, restore } from '@/utils/CloudBackup';
|
||||
import { localStorageKeys } from '@/utils/defaults';
|
||||
import { InfoHandler, WarningInfoHandler } from '@/utils/ErrorHandler';
|
||||
import { InfoHandler, WarningInfoHandler, InfoKeys } from '@/utils/ErrorHandler';
|
||||
// Import Icons
|
||||
import IconBackup from '@/assets/interface-icons/config-backup.svg';
|
||||
import IconRestore from '@/assets/interface-icons/config-restore.svg';
|
||||
|
@ -179,12 +179,12 @@ export default {
|
|||
},
|
||||
/* If the server returns a warning, then show to user and log it */
|
||||
showErrorMsg(errorMsg) {
|
||||
WarningInfoHandler(errorMsg, 'Cloud Backup');
|
||||
WarningInfoHandler(errorMsg, InfoKeys.CLOUD_BACKUP);
|
||||
this.$toasted.show(errorMsg, { className: 'toast-error' });
|
||||
},
|
||||
/* When server returns success message, then show to user and log it */
|
||||
showSuccessMsg(msg) {
|
||||
InfoHandler(msg, 'Cloud Backup');
|
||||
InfoHandler(msg, InfoKeys.CLOUD_BACKUP);
|
||||
this.$toasted.show(msg, { className: 'toast-success' });
|
||||
},
|
||||
/* Call to hash function, to hash the users chosen/ entered password */
|
||||
|
|
|
@ -14,6 +14,10 @@
|
|||
<EditIcon class="button-icon"/>
|
||||
{{ $t('config.edit-config-button') }}
|
||||
</button>
|
||||
<button class="config-button center" @click="openLanguageSwitchModal()">
|
||||
<LanguageIcon class="button-icon"/>
|
||||
{{ $t('config.change-language-button') }}
|
||||
</button>
|
||||
<button class="config-button center" @click="() => navigateToTab(3)">
|
||||
<CustomCssIcon class="button-icon"/>
|
||||
{{ $t('config.edit-css-button') }}
|
||||
|
@ -22,10 +26,6 @@
|
|||
<CloudIcon class="button-icon"/>
|
||||
{{backupId ? $t('config.edit-cloud-sync-button') : $t('config.cloud-sync-button') }}
|
||||
</button>
|
||||
<button class="config-button center" @click="openLanguageSwitchModal()">
|
||||
<LanguageIcon class="button-icon"/>
|
||||
{{ $t('config.change-language-button') }}
|
||||
</button>
|
||||
<button class="config-button center" @click="openRebuildAppModal()">
|
||||
<RebuildIcon class="button-icon"/>
|
||||
{{ $t('config.rebuild-app-button') }}
|
||||
|
@ -153,6 +153,16 @@ export default {
|
|||
const lang = getUsersLanguage();
|
||||
return lang ? `${lang.flag} ${lang.name}` : '';
|
||||
},
|
||||
/* If launching menu from editor, navigate to correct starting tab */
|
||||
navigateToStartingTab() {
|
||||
const navToTab = this.$store.state.navigateConfToTab;
|
||||
const isValidTabIndex = (indx) => typeof indx === 'number' && indx >= 0 && indx <= 5;
|
||||
if (navToTab && isValidTabIndex(navToTab)) this.navigateToTab(navToTab);
|
||||
this.$store.commit(StoreKeys.CONF_MENU_INDEX, undefined);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.navigateToStartingTab();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="css-editor-outer">
|
||||
<!-- Add raw custom CSS -->
|
||||
<div class="css-wrapper">
|
||||
<h2 class="css-input-title">Custom CSS</h2>
|
||||
<div class="style-section css-wrapper">
|
||||
<h3>Custom CSS</h3>
|
||||
<textarea class="css-editor" v-model="customCss" />
|
||||
<Button class="save-button" :click="save">{{ $t('config.css-save-btn') }}</Button>
|
||||
<p class="quick-note">
|
||||
|
@ -10,24 +10,31 @@
|
|||
{{ $t('config.css-note-l1') }} {{ $t('config.css-note-l2') }} {{ $t('config.css-note-l3') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Theme Selector -->
|
||||
<div class="style-section base-theme-wrapper">
|
||||
<h3>Base Theme</h3>
|
||||
<ThemeSelector :hidePallete="true" />
|
||||
</div>
|
||||
<!-- UI color configurator -->
|
||||
<div class="style-section">
|
||||
<CustomThemeMaker :themeToEdit="currentTheme" class="color-config" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import CustomThemeMaker from '@/components/Settings/CustomThemeMaker';
|
||||
import ThemeSelector from '@/components/Settings/ThemeSelector';
|
||||
import Button from '@/components/FormElements/Button';
|
||||
import StoreKeys from '@/utils/StoreMutations';
|
||||
import { InfoHandler } from '@/utils/ErrorHandler';
|
||||
import { localStorageKeys, theme as defaultTheme } from '@/utils/defaults';
|
||||
|
||||
export default {
|
||||
name: 'StyleEditor',
|
||||
components: {
|
||||
Button,
|
||||
ThemeSelector,
|
||||
CustomThemeMaker,
|
||||
},
|
||||
computed: {
|
||||
|
@ -77,7 +84,6 @@ export default {
|
|||
/* Show success toast and lot update */
|
||||
showSuccessMsg() {
|
||||
this.$toasted.show('Changes saved successfully');
|
||||
InfoHandler('User syles has been saved', 'Custom CSS');
|
||||
},
|
||||
},
|
||||
};
|
||||
|
@ -92,24 +98,29 @@ div.css-editor-outer {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.style-section {
|
||||
padding: 1rem;
|
||||
&:not(:last-child) { border-bottom: 1px dashed var(--config-settings-color); }
|
||||
h3 {
|
||||
font-size: 1.4rem;
|
||||
margin: 0.5rem 0 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
div.css-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
h2.css-input-title {
|
||||
margin: 0.5rem 0 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Save button
|
||||
button.save-button {
|
||||
background: var(--config-settings-color);
|
||||
color: var(--config-settings-background);
|
||||
border: 1px solid var(--config-settings-background);
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--config-settings-background);
|
||||
color: var(--config-settings-color);
|
||||
border-color: var(--config-settings-color);
|
||||
border: 1px solid var(--config-settings-color);
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--config-settings-color);
|
||||
color: var(--config-settings-background);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -143,14 +154,38 @@ p.quick-note {
|
|||
border-radius: var(--curve-factor);
|
||||
}
|
||||
|
||||
// Base Theme Selector
|
||||
.base-theme-wrapper {
|
||||
span.theme-label {
|
||||
display: none;
|
||||
}
|
||||
div.vs__dropdown-toggle {
|
||||
border-color: var(--config-settings-color);
|
||||
min-width: 16rem;
|
||||
max-width: 32rem;
|
||||
height: 2.4rem;
|
||||
font-size: 1rem;
|
||||
margin: 0.5rem;
|
||||
}
|
||||
ul.vs__dropdown-menu {
|
||||
min-width: 16rem;
|
||||
max-width: 32rem;
|
||||
background: var(--config-settings-background);
|
||||
border-top: 1px solid var(--config-settings-color);
|
||||
}
|
||||
li.vs__dropdown-option--highlight {
|
||||
background: var(--config-settings-color);
|
||||
color: var(--config-settings-background);
|
||||
}
|
||||
}
|
||||
|
||||
// Theme editor
|
||||
.color-config.theme-configurator-wrapper {
|
||||
border: 1px solid var(--config-settings-color);
|
||||
background: var(--config-settings-background);
|
||||
color: var(--config-settings-color);
|
||||
position: relative;
|
||||
width: 80%;
|
||||
max-width: 24rem;
|
||||
max-width: 32rem;
|
||||
margin: 1rem auto;
|
||||
box-shadow: none;
|
||||
right: 0;
|
||||
|
@ -160,6 +195,12 @@ p.quick-note {
|
|||
text-align: left;
|
||||
max-height: unset;
|
||||
}
|
||||
.misc-input {
|
||||
width: 6rem;
|
||||
}
|
||||
.misc-input.long-input {
|
||||
width: 18rem;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
@ -54,7 +54,7 @@ import axios from 'axios';
|
|||
import ProgressBar from 'rsup-progress';
|
||||
import VJsoneditor from 'v-jsoneditor';
|
||||
import jsYaml from 'js-yaml';
|
||||
import ErrorHandler, { InfoHandler } from '@/utils/ErrorHandler';
|
||||
import ErrorHandler, { InfoHandler, InfoKeys } from '@/utils/ErrorHandler';
|
||||
import configSchema from '@/utils/ConfigSchema.json';
|
||||
import StoreKeys from '@/utils/StoreMutations';
|
||||
import { localStorageKeys, serviceEndpoints, modalNames } from '@/utils/defaults';
|
||||
|
@ -122,7 +122,7 @@ export default {
|
|||
},
|
||||
/* Applies changes to the local state, begins edit mode and closes modal */
|
||||
startPreview() {
|
||||
InfoHandler('Applying changes to local state...', 'Config Update');
|
||||
InfoHandler('Applying changes to local state...', InfoKeys.RAW_EDITOR);
|
||||
const data = this.jsonData;
|
||||
this.$store.commit(StoreKeys.SET_APP_CONFIG, data.appConfig);
|
||||
this.$store.commit(StoreKeys.SET_PAGE_INFO, data.pageInfo);
|
||||
|
@ -152,7 +152,7 @@ export default {
|
|||
} else {
|
||||
this.showToast(this.$t('config-editor.error-msg-cannot-save'), false);
|
||||
}
|
||||
InfoHandler('Config has been written to disk succesfully', 'Config Update');
|
||||
InfoHandler('Config has been written to disk succesfully', InfoKeys.RAW_EDITOR);
|
||||
this.$store.commit(StoreKeys.SET_CONFIG, this.jsonData);
|
||||
this.progress.end();
|
||||
})
|
||||
|
@ -180,7 +180,7 @@ export default {
|
|||
if (data.appConfig.theme) {
|
||||
localStorage.setItem(localStorageKeys.THEME, data.appConfig.theme);
|
||||
}
|
||||
InfoHandler('Config has succesfully been saved in browser storage', 'Config Update');
|
||||
InfoHandler('Config has succesfully been saved in browser storage', InfoKeys.RAW_EDITOR);
|
||||
this.showToast(this.$t('config-editor.success-msg-local'), true);
|
||||
},
|
||||
/* Clears config from browser storage, only removing relevant items */
|
||||
|
|
|
@ -15,20 +15,6 @@
|
|||
<p class="section-sub-title">
|
||||
{{ $t('interactive-editor.menu.config-save-methods-subheading') }}
|
||||
</p>
|
||||
<Button
|
||||
:click="openExportConfigMenu"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.export-config-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.export-config-btn') }}
|
||||
<ExportIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="reset"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.cancel-changes-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.cancel-changes-btn') }}
|
||||
<CancelIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="saveLocally"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.save-locally-tooltip'))"
|
||||
|
@ -43,6 +29,34 @@
|
|||
{{ $t('interactive-editor.menu.save-disk-btn') }}
|
||||
<SaveToDiskIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="openExportConfigMenu"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.export-config-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.export-config-btn') }}
|
||||
<ExportIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="openCloudBackupMenu"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.cloud-backup-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.cloud-backup-btn') }}
|
||||
<CloudBackupIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="openRawConfigEditor"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.edit-raw-config-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.edit-raw-config-btn') }}
|
||||
<EditRawIcon />
|
||||
</Button>
|
||||
<Button
|
||||
:click="reset"
|
||||
v-tooltip="tooltip($t('interactive-editor.menu.cancel-changes-tooltip'))"
|
||||
>
|
||||
{{ $t('interactive-editor.menu.cancel-changes-btn') }}
|
||||
<CancelIcon />
|
||||
</Button>
|
||||
</div>
|
||||
<!-- Open Modal Buttons -->
|
||||
<div class="edit-banner-section edit-site-config-buttons">
|
||||
|
@ -88,6 +102,8 @@ import ExportIcon from '@/assets/interface-icons/interactive-editor-export-chang
|
|||
import CancelIcon from '@/assets/interface-icons/interactive-editor-cancel-changes.svg';
|
||||
import AppConfigIcon from '@/assets/interface-icons/interactive-editor-app-config.svg';
|
||||
import PageInfoIcon from '@/assets/interface-icons/interactive-editor-page-info.svg';
|
||||
import CloudBackupIcon from '@/assets/interface-icons/cloud-backup-restore.svg';
|
||||
import EditRawIcon from '@/assets/interface-icons/config-edit-json.svg';
|
||||
|
||||
export default {
|
||||
name: 'EditModeSaveMenu',
|
||||
|
@ -101,6 +117,8 @@ export default {
|
|||
AppConfigIcon,
|
||||
PageInfoIcon,
|
||||
EditAppConfig,
|
||||
CloudBackupIcon,
|
||||
EditRawIcon,
|
||||
},
|
||||
computed: {
|
||||
config() {
|
||||
|
@ -131,6 +149,16 @@ export default {
|
|||
this.$modal.show(modalNames.EDIT_APP_CONFIG);
|
||||
this.$store.commit(StoreKeys.SET_MODAL_OPEN, true);
|
||||
},
|
||||
openCloudBackupMenu() {
|
||||
this.$store.commit(StoreKeys.CONF_MENU_INDEX, 2);
|
||||
this.$store.commit(StoreKeys.SET_MODAL_OPEN, true);
|
||||
this.$modal.show(modalNames.CONF_EDITOR);
|
||||
},
|
||||
openRawConfigEditor() {
|
||||
this.$store.commit(StoreKeys.CONF_MENU_INDEX, 1);
|
||||
this.$store.commit(StoreKeys.SET_MODAL_OPEN, true);
|
||||
this.$modal.show(modalNames.CONF_EDITOR);
|
||||
},
|
||||
tooltip(content) {
|
||||
return { content, trigger: 'hover focus', delay: 250 };
|
||||
},
|
||||
|
|
|
@ -36,7 +36,7 @@ import StoreKeys from '@/utils/StoreMutations';
|
|||
import { modalNames } from '@/utils/defaults';
|
||||
import DownloadConfigIcon from '@/assets/interface-icons/config-download-file.svg';
|
||||
import CopyConfigIcon from '@/assets/interface-icons/interactive-editor-copy-clipboard.svg';
|
||||
import { InfoHandler } from '@/utils/ErrorHandler';
|
||||
import { InfoHandler, InfoKeys } from '@/utils/ErrorHandler';
|
||||
|
||||
export default {
|
||||
name: 'ExportConfigMenu',
|
||||
|
@ -70,13 +70,13 @@ export default {
|
|||
document.body.appendChild(element);
|
||||
element.click();
|
||||
document.body.removeChild(element);
|
||||
InfoHandler('Config downloaded as YAML file', 'Interactive Editor');
|
||||
InfoHandler('Config downloaded as YAML file', InfoKeys.EDITOR);
|
||||
},
|
||||
copyConfigToClipboard() {
|
||||
const config = this.convertJsonToYaml();
|
||||
navigator.clipboard.writeText(config);
|
||||
this.$toasted.show(this.$t('config.data-copied-msg'));
|
||||
InfoHandler('Config copied to clipboard', 'Interactive Editor');
|
||||
InfoHandler('Config copied to clipboard', InfoKeys.EDITOR);
|
||||
},
|
||||
modalClosed() {
|
||||
this.$store.commit(StoreKeys.SET_MODAL_OPEN, false);
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
/>
|
||||
</div>
|
||||
<IconPalette
|
||||
v-if="!hidePallete"
|
||||
class="color-button"
|
||||
@click="openThemeConfigurator"
|
||||
v-tooltip="$t('theme-maker.title')"
|
||||
|
@ -38,6 +39,9 @@ import IconPalette from '@/assets/interface-icons/config-color-palette.svg';
|
|||
|
||||
export default {
|
||||
name: 'ThemeSelector',
|
||||
props: {
|
||||
hidePallete: Boolean,
|
||||
},
|
||||
components: {
|
||||
CustomThemeMaker,
|
||||
IconPalette,
|
||||
|
|
31
src/store.js
31
src/store.js
|
@ -31,17 +31,15 @@ const {
|
|||
REMOVE_ITEM,
|
||||
INSERT_ITEM,
|
||||
UPDATE_CUSTOM_CSS,
|
||||
CONF_MENU_INDEX,
|
||||
} = Keys;
|
||||
|
||||
const editorLog = (logMessage) => {
|
||||
InfoHandler(logMessage, InfoKeys.EDITOR);
|
||||
};
|
||||
|
||||
const store = new Vuex.Store({
|
||||
state: {
|
||||
config: {},
|
||||
editMode: false, // While true, the user can drag and edit items + sections
|
||||
modalOpen: false, // KB shortcut functionality will be disabled when modal is open
|
||||
navigateConfToTab: undefined, // Used to switch active tab in config modal
|
||||
},
|
||||
getters: {
|
||||
config(state) {
|
||||
|
@ -107,7 +105,7 @@ const store = new Vuex.Store({
|
|||
},
|
||||
[SET_EDIT_MODE](state, editMode) {
|
||||
if (editMode !== state.editMode) {
|
||||
editorLog(editMode ? 'Edit session started' : 'Edit session ended');
|
||||
InfoHandler(editMode ? 'Edit session started' : 'Edit session ended', InfoKeys.EDITOR);
|
||||
state.editMode = editMode;
|
||||
}
|
||||
},
|
||||
|
@ -118,7 +116,7 @@ const store = new Vuex.Store({
|
|||
section.items.forEach((item, itemIndex) => {
|
||||
if (item.id === itemId) {
|
||||
newConfig.sections[secIndex].items[itemIndex] = newItem;
|
||||
editorLog('Item updated');
|
||||
InfoHandler('Item updated', InfoKeys.EDITOR);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -128,40 +126,40 @@ const store = new Vuex.Store({
|
|||
const newConfig = state.config;
|
||||
newConfig.pageInfo = newPageInfo;
|
||||
state.config = newConfig;
|
||||
editorLog('Page info updated');
|
||||
InfoHandler('Page info updated', InfoKeys.EDITOR);
|
||||
},
|
||||
[SET_APP_CONFIG](state, newAppConfig) {
|
||||
const newConfig = state.config;
|
||||
newConfig.appConfig = newAppConfig;
|
||||
state.config = newConfig;
|
||||
editorLog('App config updated');
|
||||
InfoHandler('App config updated', InfoKeys.EDITOR);
|
||||
},
|
||||
[SET_SECTIONS](state, newSections) {
|
||||
const newConfig = state.config;
|
||||
newConfig.sections = newSections;
|
||||
state.config = newConfig;
|
||||
editorLog('Sections updated');
|
||||
InfoHandler('Sections updated', InfoKeys.EDITOR);
|
||||
},
|
||||
[UPDATE_SECTION](state, payload) {
|
||||
const { sectionIndex, sectionData } = payload;
|
||||
const newConfig = { ...state.config };
|
||||
newConfig.sections[sectionIndex] = sectionData;
|
||||
state.config = newConfig;
|
||||
editorLog('Section updated');
|
||||
InfoHandler('Section updated', InfoKeys.EDITOR);
|
||||
},
|
||||
[INSERT_SECTION](state, newSection) {
|
||||
const newConfig = { ...state.config };
|
||||
newSection.items = [];
|
||||
newConfig.sections.push(newSection);
|
||||
state.config = newConfig;
|
||||
editorLog('New section added');
|
||||
InfoHandler('New section added', InfoKeys.EDITOR);
|
||||
},
|
||||
[REMOVE_SECTION](state, payload) {
|
||||
const { sectionIndex, sectionName } = payload;
|
||||
const newConfig = { ...state.config };
|
||||
if (newConfig.sections[sectionIndex].name === sectionName) {
|
||||
newConfig.sections.splice(sectionIndex, 1);
|
||||
editorLog('Section removed');
|
||||
InfoHandler('Section removed', InfoKeys.EDITOR);
|
||||
}
|
||||
state.config = newConfig;
|
||||
},
|
||||
|
@ -171,7 +169,7 @@ const store = new Vuex.Store({
|
|||
config.sections.forEach((section) => {
|
||||
if (section.name === targetSection) {
|
||||
section.items.push(newItem);
|
||||
editorLog('New item added');
|
||||
InfoHandler('New item added', InfoKeys.EDITOR);
|
||||
}
|
||||
});
|
||||
config.sections = applyItemId(config.sections);
|
||||
|
@ -188,7 +186,7 @@ const store = new Vuex.Store({
|
|||
} else {
|
||||
section.items.push(newItem);
|
||||
}
|
||||
editorLog('Item copied');
|
||||
InfoHandler('Item copied', InfoKeys.EDITOR);
|
||||
}
|
||||
});
|
||||
config.sections = applyItemId(config.sections);
|
||||
|
@ -202,7 +200,7 @@ const store = new Vuex.Store({
|
|||
section.items.forEach((item, index) => {
|
||||
if (item.id === itemId) {
|
||||
section.items.splice(index, 1);
|
||||
editorLog('Item removed');
|
||||
InfoHandler('Item removed', InfoKeys.EDITOR);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -233,6 +231,9 @@ const store = new Vuex.Store({
|
|||
state.config.appConfig.customCss = customCss;
|
||||
InfoHandler('Custom colors updated', InfoKeys.VISUAL);
|
||||
},
|
||||
[CONF_MENU_INDEX](state, index) {
|
||||
state.navigateConfToTab = index;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/* Called when app first loaded. Reads config and sets state */
|
||||
|
|
|
@ -988,25 +988,32 @@ html[data-theme="oblivion-scotch"] {
|
|||
}
|
||||
|
||||
html[data-theme="dashy-docs"] {
|
||||
// Base
|
||||
--primary: #f5f6f7;
|
||||
--background: #202020;
|
||||
--background-darker: #121212;
|
||||
// Items
|
||||
--item-background: var(--background);
|
||||
--item-background-hover: var(--background);
|
||||
--item-text-color: var(--primary);
|
||||
// Sections
|
||||
--item-group-background: none;
|
||||
--item-group-outer-background: var(--background-darker);
|
||||
--item-group-heading-text-color: var(--background);
|
||||
--item-group-heading-text-color-hover: var(--background);
|
||||
--item-background: var(--background);
|
||||
--item-background-hover: var(--background);
|
||||
--item-text-color: var(--primary);
|
||||
--minimal-view-section-heading-color: var(--background);
|
||||
// Misc
|
||||
--item-group-padding: 0;
|
||||
--curve-factor: 3px;
|
||||
--curve-factor-navbar: 6px;
|
||||
--item-shadow: 4px 4px 6px #00000080, -2px -2px 4px rgb(0 0 0 / 40%);
|
||||
--item-group-shadow: 0px 3px 2px #222222, 0px 0px 2px #3e3e3e;
|
||||
--font-headings: 'PTMono', 'Courier New', monospace;
|
||||
--minimal-view-section-heading-color: var(--background);
|
||||
// Navbar Links
|
||||
--nav-link-background-color-hover: none;
|
||||
--nav-link-border-color-hover: none;
|
||||
--nav-link-text-color: var(--background);
|
||||
--nav-link-text-color-hover: var(--background-darker);
|
||||
|
||||
footer {
|
||||
box-shadow: 0 -3px 4px #010101;
|
||||
|
@ -1095,10 +1102,10 @@ html[data-theme="dashy-docs"] {
|
|||
color: var(--background);
|
||||
font-weight: bold;
|
||||
svg path { fill: var(--background); }
|
||||
&:nth-child(1n) { @include make-colors(#db78fc, #b83ddd); }
|
||||
&:nth-child(2n) { @include make-colors(#41ef90, #1e9554); }
|
||||
&:nth-child(3n) { @include make-colors(#5c85f7, #3d48dd); }
|
||||
&:nth-child(4n) { @include make-colors(#dcff5a, #ceb73f); }
|
||||
&:nth-child(4n + 1) { @include make-colors(#db78fc, #b83ddd); }
|
||||
&:nth-child(4n + 2) { @include make-colors(#41ef90, #1e9554); }
|
||||
&:nth-child(4n + 3) { @include make-colors(#5c85f7, #3d48dd); }
|
||||
&:nth-child(4n + 4) { @include make-colors(#dcff5a, #ceb73f); }
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -40,7 +40,10 @@ export const WarningInfoHandler = (msg, title, log) => {
|
|||
|
||||
/* Titles for info logging */
|
||||
export const InfoKeys = {
|
||||
AUTH: 'Authentication',
|
||||
CLOUD_BACKUP: 'Cloud Backup & Restore',
|
||||
EDITOR: 'Interactive Editor',
|
||||
RAW_EDITOR: 'Raw Config Editor',
|
||||
VISUAL: 'Layout & Styles',
|
||||
};
|
||||
|
||||
|
|
|
@ -20,6 +20,7 @@ const KEY_NAMES = [
|
|||
'REMOVE_ITEM',
|
||||
'INSERT_ITEM',
|
||||
'UPDATE_CUSTOM_CSS',
|
||||
'CONF_MENU_INDEX',
|
||||
];
|
||||
|
||||
// Convert array of key names into an object, and export
|
||||
|
|
|
@ -76,7 +76,7 @@ import router from '@/router';
|
|||
import Button from '@/components/FormElements/Button';
|
||||
import Input from '@/components/FormElements/Input';
|
||||
import Defaults, { localStorageKeys } from '@/utils/defaults';
|
||||
import { InfoHandler, WarningInfoHandler } from '@/utils/ErrorHandler';
|
||||
import { InfoHandler, WarningInfoHandler, InfoKeys } from '@/utils/ErrorHandler';
|
||||
import {
|
||||
checkCredentials,
|
||||
login,
|
||||
|
@ -158,9 +158,9 @@ export default {
|
|||
if (response.correct) { // Yay, credentials were correct :)
|
||||
login(this.username, this.password, timeout); // Login, to set the cookie
|
||||
this.goHome();
|
||||
InfoHandler(`Succesfully signed in as ${this.username}`, 'Authentication');
|
||||
InfoHandler(`Succesfully signed in as ${this.username}`, InfoKeys.AUTH);
|
||||
} else {
|
||||
WarningInfoHandler('Unable to Sign In', 'Authentication', this.message);
|
||||
WarningInfoHandler('Unable to Sign In', InfoKeys.AUTH, this.message);
|
||||
}
|
||||
},
|
||||
/* Calls function to double-check guest access enabled, then log in as guest */
|
||||
|
@ -168,11 +168,11 @@ export default {
|
|||
const isAllowed = this.isGuestAccessEnabled;
|
||||
if (isAllowed) {
|
||||
this.$toasted.show('Logged in as Guest, Redirecting...', { className: 'toast-success' });
|
||||
InfoHandler('Logged in as Guest', 'Authentication');
|
||||
InfoHandler('Logged in as Guest', InfoKeys.AUTH);
|
||||
this.goHome();
|
||||
} else {
|
||||
this.$toasted.show('Guest Access Not Allowed', { className: 'toast-error' });
|
||||
WarningInfoHandler('Guest Access Not Allowed', 'Authentication');
|
||||
WarningInfoHandler('Guest Access Not Allowed', InfoKeys.AUTH);
|
||||
}
|
||||
},
|
||||
/* Calls logout, shows status message, and refreshed page */
|
||||
|
|
Loading…
Reference in New Issue