lightcordwarez
/
BetterDiscordApp-v2
mirror of https://github.com/JsSucks/BetterDiscordApp
1
0
Fork 0
Code Issues 3 Releases Wiki Activity

Move plugin/theme settings modals to the modal manager

This commit is contained in:
Samuel Elliott 2018-02-13 17:06:09 +00:00
parent 21a8554d6f
commit 3b66d320e8
5 changed files with 32 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
client/src/ui/components/bd/PluginsView.vue
View File

@ -32,28 +32,26 @@
<div class="bd-spinner-2"></div>
</div>
</div>
<PluginSettingsModal v-if="settingsOpen !== null" :plugin="settingsOpen" :close="closeSettings" />
</SettingsWrapper>
</template>
<script>
// Imports
import { PluginManager } from 'modules';
import { Modals } from 'ui';
import { SettingsWrapper } from './';
import PluginCard from './PluginCard.vue';
import PluginSettingsModal from './PluginSettingsModal.vue';
import { MiRefresh } from '../common';
export default {
data() {
return {
local: true,
settingsOpen: null,
localPlugins: PluginManager.localPlugins
}
},
components: {
SettingsWrapper, PluginCard, PluginSettingsModal,
SettingsWrapper, PluginCard,
MiRefresh
},
methods: {
@ -91,12 +89,8 @@
})();
},
showSettings(plugin) {
this.settingsOpen = plugin;
},
closeSettings() {
this.settingsOpen = null;
return Modals.pluginSettings(plugin);
}
}
}
</script>

11
client/src/ui/components/bd/ThemesView.vue
View File

@ -32,29 +32,26 @@
<div class="bd-spinner-2"></div>
</div>
</div>
<ThemeSettingsModal v-if="settingsOpen !== null" :theme="settingsOpen" :close="closeSettings" />
</SettingsWrapper>
</template>
<script>
// Imports
import { ThemeManager } from 'modules';
import { Modals } from 'ui';
import { SettingsWrapper } from './';
import { MiRefresh } from '../common';
import ThemeSettingsModal from './ThemeSettingsModal.vue';
import ThemeCard from './ThemeCard.vue';
export default {
data() {
return {
local: true,
settingsOpen: null,
localThemes: ThemeManager.localThemes
}
},
components: {
SettingsWrapper, ThemeCard,
ThemeSettingsModal,
MiRefresh
},
methods: {
@ -92,12 +89,8 @@
})();
},
showSettings(theme) {
this.settingsOpen = theme;
},
closeSettings() {
this.settingsOpen = null;
return Modals.themeSettings(theme);
}
}
}
</script>

16
client/src/ui/components/bd/PluginSettingsModal.vue → client/src/ui/components/bd/modals/PluginSettingsModal.vue
View File

@ -10,8 +10,7 @@
<template>
<div class="bd-plugin-settings-modal" :class="{'bd-edited': changed}">
<div class="bd-backdrop" @click="attemptToClose" :class="{'bd-backdrop-out': closing}"></div>
<Modal :headerText="plugin.name + ' Settings'" :close="attemptToClose" :class="{'bd-modal-out': closing}">
<Modal :headerText="plugin.name + ' Settings'" :close="attemptToClose" :class="{'bd-modal-out': modal.closing}">
<SettingsPanel :settings="configCache" :change="settingChange" slot="body" class="bd-plugin-settings-body" />
<div slot="footer" class="bd-footer-alert" :class ="{'bd-active': changed, 'bd-warn': warnclose}">
<div class="bd-footer-alert-text">Unsaved changes</div>
@ -27,11 +26,11 @@
<script>
// Imports
import Vue from 'vue';
import { Modal } from '../common';
import SettingsPanel from './SettingsPanel.vue';
import { Modal } from '../../common';
import SettingsPanel from '../SettingsPanel.vue';
export default {
props: ['plugin','close'],
props: ['modal'],
data() {
return {
changed: false,
@ -43,7 +42,10 @@
},
components: {
Modal,
SettingsPanel,
SettingsPanel
},
computed: {
plugin() { return this.modal.plugin; }
},
methods: {
checkForChanges() {
@ -96,7 +98,7 @@
if (!this.changed) {
this.closing = true;
setTimeout(() => {
this.close();
this.modal.close();
}, 200);
return;
}

14
client/src/ui/components/bd/ThemeSettingsModal.vue → client/src/ui/components/bd/modals/ThemeSettingsModal.vue
View File

@ -10,8 +10,7 @@
<template>
<div class="bd-plugin-settings-modal" :class="{'bd-edited': changed}">
<div class="bd-backdrop" @click="attemptToClose" :class="{'bd-backdrop-out': closing}"></div>
<Modal :headerText="theme.name + ' Settings'" :close="attemptToClose" :class="{'bd-modal-out': closing}">
<Modal :headerText="theme.name + ' Settings'" :close="attemptToClose" :class="{'bd-modal-out': modal.closing}">
<SettingsPanel :settings="configCache" :change="settingChange" slot="body" class="bd-plugin-settings-body" />
<div slot="footer" class="bd-footer-alert" :class ="{'bd-active': changed, 'bd-warn': warnclose}">
<div class="bd-footer-alert-text">Unsaved changes</div>
@ -27,11 +26,11 @@
<script>
// Imports
import Vue from 'vue';
import { Modal } from '../common';
import SettingsPanel from './SettingsPanel.vue';
import { Modal } from '../../common';
import SettingsPanel from '../SettingsPanel.vue';
export default {
props: ['theme', 'close'],
props: ['modal'],
data() {
return {
changed: false,
@ -45,6 +44,9 @@
Modal,
SettingsPanel
},
computed: {
theme() { return this.modal.theme; }
},
methods: {
checkForChanges() {
let changed = false;
@ -96,7 +98,7 @@
if (!this.changed) {
this.closing = true;
setTimeout(() => {
this.close();
this.modal.close();
}, 200);
return;
}

10
client/src/ui/modals.js
View File

@ -12,6 +12,8 @@ import { FileUtils } from 'common';
import { Events, PluginManager, ThemeManager } from 'modules';
import BasicModal from './components/bd/modals/BasicModal.vue';
import ErrorModal from './components/bd/modals/ErrorModal.vue';
import PluginSettingsModal from './components/bd/modals/PluginSettingsModal.vue';
import ThemeSettingsModal from './components/bd/modals/ThemeSettingsModal.vue';
export default class {
@ -76,6 +78,14 @@ export default class {
});
}
static pluginSettings(plugin) {
return this.add({ plugin }, PluginSettingsModal);
}
static themeSettings(theme) {
return this.add({ theme }, ThemeSettingsModal);
}
static get stack() {
return this._stack ? this._stack : (this._stack = []);
}