Merge remote-tracking branch 'upstream/master' into settings
# Conflicts: # client/src/modules/thememanager.js # client/src/ui/components/BdSettings.vue
This commit is contained in:
commit
e94a7c50a4
|
@ -45,8 +45,10 @@ export default class ExtModule {
|
|||
get main() { return this.__pluginInternals.main }
|
||||
get defaultConfig() { return this.configs.defaultConfig }
|
||||
get userConfig() { return this.configs.userConfig }
|
||||
get id() { return this.info.id || this.info.name.toLowerCase().replace(/[^a-zA-Z0-9-]/g, '-').replace(/--/g, '-') }
|
||||
get configSchemes() { return this.configs.schemes }
|
||||
get id() { return this.info.id || this.name.toLowerCase().replace(/[^a-zA-Z0-9-]/g, '-').replace(/--/g, '-') }
|
||||
get name() { return this.info.name }
|
||||
get description() { return this.info.description }
|
||||
get authors() { return this.info.authors }
|
||||
get version() { return this.info.version }
|
||||
get contentPath() { return this.paths.contentPath }
|
||||
|
|
|
@ -58,6 +58,7 @@ export default class Plugin {
|
|||
get configSchemes() { return this.configs.schemes }
|
||||
get id() { return this.info.id || this.name.toLowerCase().replace(/[^a-zA-Z0-9-]/g, '-').replace(/--/g, '-') }
|
||||
get name() { return this.info.name }
|
||||
get description() { return this.info.description }
|
||||
get authors() { return this.info.authors }
|
||||
get version() { return this.info.version }
|
||||
get contentPath() { return this.paths.contentPath }
|
||||
|
|
|
@ -58,6 +58,7 @@ export default class Theme {
|
|||
get configSchemes() { return this.configs.schemes }
|
||||
get id() { return this.info.id || this.name.toLowerCase().replace(/[^a-zA-Z0-9-]/g, '-').replace(/\s+/g, '-') }
|
||||
get name() { return this.info.name }
|
||||
get description() { return this.info.description }
|
||||
get authors() { return this.info.authors }
|
||||
get version() { return this.info.version }
|
||||
get contentPath() { return this.paths.contentPath }
|
||||
|
|
|
@ -49,7 +49,6 @@
|
|||
background: transparent;
|
||||
opacity: 1;
|
||||
box-shadow: none;
|
||||
z-index: 3001;
|
||||
|
||||
.bd-settings-button-btn {
|
||||
background-image: $logoBigBw;
|
||||
|
@ -62,6 +61,11 @@
|
|||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
&.bd-active,
|
||||
&.bd-animating {
|
||||
z-index: 3001;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bd-settings-button-pulse {
|
||||
|
|
|
@ -119,14 +119,33 @@
|
|||
.platform-linux & {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-settings .bd-sidebar-view.bd-stop .bd-content-region {
|
||||
z-index: 3003;
|
||||
}
|
||||
.bd-sidebar-view.bd-stop .bd-content-region {
|
||||
z-index: 3003;
|
||||
}
|
||||
|
||||
.bd-backdrop {
|
||||
z-index: 3003;
|
||||
.bd-sidebar-view.active {
|
||||
.bd-content-region {
|
||||
transition: transform 0.4s ease-in-out, opacity 0.2s ease;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.active) .bd-sidebar-view.active,
|
||||
&.bd-settings-out .bd-sidebar-view.active {
|
||||
.bd-content-region {
|
||||
transform: translate(-600px, 0%);
|
||||
opacity: 0;
|
||||
width: 590px;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.active) .bd-sidebar-view.active {
|
||||
.bd-content-region {
|
||||
transform: translate(-600px, 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bd-sidebar .bd-settings-button {
|
||||
|
|
|
@ -31,6 +31,7 @@
|
|||
background: #36393e;
|
||||
box-shadow: 0 0 4px #202225;
|
||||
backface-visibility: hidden;
|
||||
transition: transform 0.6s ease;
|
||||
}
|
||||
|
||||
&.bd-stop {
|
||||
|
@ -38,10 +39,4 @@
|
|||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
.bd-content-region {
|
||||
animation: bd-slidein .6s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -41,10 +41,11 @@
|
|||
&:hover,
|
||||
&.active {
|
||||
background: $colbdblue;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #fff;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -9,8 +9,8 @@
|
|||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-settings" :class="{active: active}" @keyup="close">
|
||||
<SidebarView :contentVisible="this.activeIndex >= 0" :animating="this.animating" :class="{'bd-stop': !first}">
|
||||
<div class="bd-settings" :class="{active: active, 'bd-settings-out': this.activeIndex === -1 && this.lastActiveIndex >= 0}" @keyup="close">
|
||||
<SidebarView :contentVisible="this.activeIndex >= 0 || this.lastActiveIndex >= 0" :animating="this.animating" :class="{'bd-stop': !first}">
|
||||
<Sidebar slot="sidebar">
|
||||
<div class="bd-settings-x" @click="close">
|
||||
<MiClose size="17"/>
|
||||
|
@ -20,7 +20,7 @@
|
|||
</Sidebar>
|
||||
<div slot="sidebarfooter" class="bd-info">
|
||||
<span class="bd-vtext">v2.0.0a by Jiiks/JsSucks</span>
|
||||
<div @click="openGithub" v-tooltip="'Github'" class="bd-material-button">
|
||||
<div @click="openGithub" v-tooltip="'GitHub'" class="bd-material-button">
|
||||
<MiGithubCircle size="16" />
|
||||
</div>
|
||||
<div @click="openTwitter" v-tooltip="'@Jiiksi'" class="bd-material-button">
|
||||
|
@ -77,8 +77,9 @@
|
|||
lastActiveIndex: -1,
|
||||
animating: false,
|
||||
first: true,
|
||||
Settings
|
||||
};
|
||||
Settings,
|
||||
timeout: null
|
||||
}
|
||||
},
|
||||
props: ['active', 'close'],
|
||||
components: {
|
||||
|
@ -95,10 +96,12 @@
|
|||
this.lastActiveIndex = this.activeIndex;
|
||||
this.activeIndex = id;
|
||||
|
||||
setTimeout(() => {
|
||||
if (this.timeout) clearTimeout(this.timeout);
|
||||
this.timeout = setTimeout(() => {
|
||||
this.first = false;
|
||||
this.animating = false;
|
||||
this.lastActiveIndex = -1;
|
||||
this.timeout = null;
|
||||
}, 400);
|
||||
},
|
||||
activeContent(s) {
|
||||
|
@ -109,6 +112,19 @@
|
|||
const item = this.sidebarItems.find(item => item.contentid === s);
|
||||
return item && item.id === this.lastActiveIndex;
|
||||
},
|
||||
closeContent() {
|
||||
if (this.activeIndex >= 0) this.sidebarItems.find(item => item.id === this.activeIndex).active = false;
|
||||
this.first = true;
|
||||
this.lastActiveIndex = this.activeIndex;
|
||||
this.activeIndex = -1;
|
||||
|
||||
if (this.timeout) clearTimeout(this.timeout);
|
||||
this.timeout = setTimeout(() => {
|
||||
this.animating = false;
|
||||
this.lastActiveIndex = -1;
|
||||
this.timeout = null;
|
||||
}, 400);
|
||||
},
|
||||
openGithub() {
|
||||
shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');
|
||||
},
|
||||
|
@ -120,13 +136,9 @@
|
|||
}
|
||||
},
|
||||
watch: {
|
||||
active(newVal, oldVal) {
|
||||
if (!newVal) {
|
||||
this.sidebarItems.find(item => item.id === this.activeIndex).active = false;
|
||||
this.activeIndex = this.lastActiveIndex = -1;
|
||||
this.animating = false;
|
||||
this.first = true;
|
||||
}
|
||||
active(active) {
|
||||
if (active) return;
|
||||
this.closeContent();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -10,12 +10,12 @@
|
|||
|
||||
<template>
|
||||
<div class="bd-settings-wrapper" :class="[{active: active}, 'platform-' + this.platform]">
|
||||
<div class="bd-settings-button" :class="{'bd-active': active}" @click="showSettings">
|
||||
<div class="bd-settings-button" :class="{'bd-active': active, 'bd-animating': animating}" @click="showSettings">
|
||||
<div v-if="updating === 0" v-tooltip.right="'Checking for updates'" class="bd-settings-button-btn bd-loading"></div>
|
||||
<div v-else-if="updating === 2" v-tooltip.right="'Updates available!'" class="bd-settings-button-btn bd-updates"></div>
|
||||
<div v-else class="bd-settings-button-btn" :class="[{'bd-loading': !loaded}]"></div>
|
||||
</div>
|
||||
<BdSettings :active="active" :close="hideSettings" />
|
||||
<BdSettings ref="settings" :active="active" :close="hideSettings" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
@ -29,6 +29,8 @@
|
|||
loaded: false,
|
||||
updating: false,
|
||||
active: false,
|
||||
animating: false,
|
||||
timeout: null,
|
||||
platform: global.process.platform
|
||||
}
|
||||
},
|
||||
|
@ -44,12 +46,23 @@
|
|||
toggleSettings() { this.active = !this.active },
|
||||
keyupListener(e) {
|
||||
if (document.getElementsByClassName('bd-backdrop').length) return;
|
||||
if (this.$refs.settings.activeIndex !== -1 && e.which === 27) return this.$refs.settings.closeContent();
|
||||
if (this.active && e.which === 27) return this.hideSettings();
|
||||
if (!e.metaKey && !e.ctrlKey || e.key !== 'b') return;
|
||||
this.toggleSettings();
|
||||
e.stopImmediatePropagation();
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
active(active) {
|
||||
this.animating = true;
|
||||
if (this.timeout) clearTimeout(this.timeout);
|
||||
this.timeout = setTimeout(() => {
|
||||
this.animating = false;
|
||||
this.timeout = null;
|
||||
}, 400);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
Events.on('ready', e => this.loaded = true);
|
||||
Events.on('update-check-start', e => this.updating = 0);
|
||||
|
|
Loading…
Reference in New Issue