Use events
This commit is contained in:
parent
8983256ade
commit
8c09112cff
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
<template v-for="(category, text) in sidebar">
|
||||
<SidebarItem :item="{text, type: 'header'}" />
|
||||
<SidebarItem v-for="item in category" :item="item" :key="item.id" :onClick="itemOnClick" />
|
||||
<SidebarItem v-for="item in category" :item="item" :key="item.id" @click="itemOnClick(item.id)" />
|
||||
</template>
|
||||
</Sidebar>
|
||||
<div slot="sidebarfooter" class="bd-info">
|
||||
|
|
|
@ -11,12 +11,13 @@
|
|||
<template>
|
||||
<div :class="{'bd-profile-badges-wrap': !hasBadges}">
|
||||
<div class="bd-profile-badges">
|
||||
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="onClick"></div>
|
||||
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
||||
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
||||
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="click"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { shell } from 'electron';
|
||||
|
@ -24,7 +25,7 @@
|
|||
export default {
|
||||
props: ['webdev', 'developer', 'contributor', 'hasBadges'],
|
||||
methods: {
|
||||
onClick() {
|
||||
click() {
|
||||
if (this.developer) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');
|
||||
if (this.webdev) return shell.openExternal('https://betterdiscord.net');
|
||||
if (this.contributor) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp/graphs/contributors');
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
|
||||
<template>
|
||||
<div class="bd-message-badges-wrap">
|
||||
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-message-badge bd-message-badge-contributor" @click="onClick"></div>
|
||||
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-message-badge bd-message-badge-developer" @click="click"></div>
|
||||
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-message-badge bd-message-badge-developer" @click="click"></div>
|
||||
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-message-badge bd-message-badge-contributor" @click="click"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
@ -22,7 +22,7 @@
|
|||
export default {
|
||||
props: ['webdev', 'developer', 'contributor', 'hasBadges'],
|
||||
methods: {
|
||||
onClick() {
|
||||
click() {
|
||||
if (this.developer) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');
|
||||
if (this.webdev) return shell.openExternal('https://betterdiscord.net');
|
||||
if (this.contributor) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp/graphs/contributors');
|
||||
|
|
|
@ -29,6 +29,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { MiExtension } from '../common';
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
|
||||
<div class="bd-form-item">
|
||||
<h5>Custom Editor</h5>
|
||||
<FormButton v-if="internalEditorIsInstalled" :onClick="openInternalEditor">Open</FormButton>
|
||||
<FormButton v-if="internalEditorIsInstalled" @click="openInternalEditor">Open</FormButton>
|
||||
<template v-else>
|
||||
<div class="bd-form-warning">
|
||||
<div class="bd-text">Custom Editor is not installed!</div>
|
||||
|
@ -32,7 +32,7 @@
|
|||
|
||||
<div class="bd-form-item">
|
||||
<h5>System Editor</h5>
|
||||
<FormButton :onClick="openSystemEditor">Open</FormButton>
|
||||
<FormButton @click="openSystemEditor">Open</FormButton>
|
||||
<p class="bd-hint">This will open {{ systemEditorPath }} in your system's default editor.</p>
|
||||
</div>
|
||||
<div class="bd-form-divider"></div>
|
||||
|
@ -42,10 +42,7 @@
|
|||
</div>
|
||||
<SettingsPanel :settings="settingsset" />
|
||||
|
||||
<!-- <Setting :setting="liveUpdateSetting" />
|
||||
<Setting :setting="watchFilesSetting" /> -->
|
||||
|
||||
<FormButton :onClick="recompile" :loading="compiling">Recompile</FormButton>
|
||||
<FormButton @click="recompile" :loading="compiling">Recompile</FormButton>
|
||||
</div>
|
||||
</SettingsWrapper>
|
||||
</template>
|
||||
|
|
|
@ -12,13 +12,14 @@
|
|||
<Card :item="plugin">
|
||||
<SettingSwitch v-if="plugin.type === 'plugin'" slot="toggle" :value="plugin.enabled" @input="togglePlugin" />
|
||||
<ButtonGroup slot="controls">
|
||||
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="plugin.hasSettings" :onClick="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
|
||||
<Button v-tooltip="'Reload'" :onClick="reloadPlugin"><MiRefresh size="18" /></Button>
|
||||
<Button v-tooltip="'Edit'" :onClick="editPlugin"><MiPencil size="18" /></Button>
|
||||
<Button v-tooltip="'Uninstall (shift + click to unload)'" :onClick="e => deletePlugin(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
|
||||
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="plugin.hasSettings" @click="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
|
||||
<Button v-tooltip="'Reload'" @click="reloadPlugin"><MiRefresh size="18" /></Button>
|
||||
<Button v-tooltip="'Edit'" @click="editPlugin"><MiPencil size="18" /></Button>
|
||||
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="e => deletePlugin(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
|
||||
</ButtonGroup>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { ClientLogger as Logger } from 'common';
|
||||
|
|
|
@ -13,11 +13,11 @@
|
|||
<div class="bd-tabbar" slot="header">
|
||||
<div class="bd-button" :class="{'bd-active': local}" @click="showLocal">
|
||||
<h3>Installed</h3>
|
||||
<RefreshBtn v-if="local" :onClick="refreshLocal" />
|
||||
<RefreshBtn v-if="local" @click="refreshLocal" />
|
||||
</div>
|
||||
<div class="bd-button" :class="{'bd-active': !local}" @click="showOnline">
|
||||
<h3>Browse</h3>
|
||||
<RefreshBtn v-if="!local" :onClick="refreshOnline" />
|
||||
<RefreshBtn v-if="!local" @click="refreshOnline" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
</ScrollerWrap>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { ScrollerWrap } from '../common';
|
||||
|
|
|
@ -12,10 +12,10 @@
|
|||
<Card :item="theme">
|
||||
<SettingSwitch slot="toggle" :value="theme.enabled" @input="toggleTheme" />
|
||||
<ButtonGroup slot="controls">
|
||||
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="theme.hasSettings" :onClick="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
|
||||
<Button v-tooltip="'Recompile (shift + click to reload)'" :onClick="e => reloadTheme(e.shiftKey)"><MiRefresh size="18" /></Button>
|
||||
<Button v-tooltip="'Edit'" :onClick="editTheme"><MiPencil size="18" /></Button>
|
||||
<Button v-tooltip="'Uninstall (shift + click to unload)'" :onClick="e => deleteTheme(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
|
||||
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="theme.hasSettings" @click="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
|
||||
<Button v-tooltip="'Recompile (shift + click to reload)'" @click="e => reloadTheme(e.shiftKey)"><MiRefresh size="18" /></Button>
|
||||
<Button v-tooltip="'Edit'" @click="editTheme"><MiPencil size="18" /></Button>
|
||||
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="e => deleteTheme(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
|
||||
</ButtonGroup>
|
||||
</Card>
|
||||
</template>
|
||||
|
|
|
@ -13,11 +13,11 @@
|
|||
<div class="bd-tabbar" slot="header">
|
||||
<div class="bd-button" :class="{'bd-active': local}" @click="showLocal">
|
||||
<h3>Installed</h3>
|
||||
<RefreshBtn v-if="local" :onClick="refreshLocal"/>
|
||||
<RefreshBtn v-if="local" @click="refreshLocal"/>
|
||||
</div>
|
||||
<div class="bd-button" :class="{'bd-active': !local}" @click="showOnline">
|
||||
<h3>Browse</h3>
|
||||
<RefreshBtn v-if="!local" :onClick="refreshOnline" />
|
||||
<RefreshBtn v-if="!local" @click="refreshOnline" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -9,13 +9,14 @@
|
|||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-button" :class="[{'bd-disabled': disabled}, {'bd-err': type === 'err'}]" @click="!disabled && !loading ? onClick($event) : null">
|
||||
<div class="bd-button" :class="[{'bd-disabled': disabled}, {'bd-err': type === 'err'}]" @click="!disabled && !loading ? $emit('click', $event) : null">
|
||||
<div v-if="loading" class="bd-spinner-7"></div>
|
||||
<slot v-else />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['loading', 'disabled', 'type', 'onClick', 'type']
|
||||
props: ['loading', 'disabled', 'type']
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
}
|
||||
export default {}
|
||||
</script>
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['options', 'value', 'disabled'],
|
||||
|
|
|
@ -9,13 +9,14 @@
|
|||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-form-button bd-button" :class="{'bd-disabled': disabled}" @click="!disabled && !loading ? onClick() : null">
|
||||
<div class="bd-form-button bd-button" :class="{'bd-disabled': disabled}" @click="!disabled && !loading ? $emit('click', $event) : null">
|
||||
<div v-if="loading" class="bd-spinner-7"></div>
|
||||
<slot v-else />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['loading', 'disabled', 'type', 'onClick']
|
||||
props: ['loading', 'disabled', 'type']
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
/**
|
||||
* BetterDiscord RefreshBtn
|
||||
* BetterDiscord Refresh Button
|
||||
* Copyright (c) 2018 Lilian Tedone http://beard-design.com/
|
||||
* All rights reserved.
|
||||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-refresh-button" :class="{'bd-refreshed': state === 'refreshed', 'bd-refreshing': state === 'refreshing'}" @click="onClick">
|
||||
<div class="bd-refresh-button" :class="{'bd-refreshed': state === 'refreshed', 'bd-refreshing': state === 'refreshing'}" @click="$emit('click')">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<g class="bd-svg-refresh">
|
||||
<g class="bd-svg-circle">
|
||||
|
@ -24,8 +24,9 @@
|
|||
</svg>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['state', 'onClick']
|
||||
props: ['state']
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -15,8 +15,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['dark']
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
@ -9,12 +9,13 @@
|
|||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-item" :class="{active: item.active}" @click="onClick(item.id)">
|
||||
<div class="bd-item" :class="{active: item.active}" @click="$emit('click', item.id)">
|
||||
{{item.text}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['item', 'onClick']
|
||||
props: ['item']
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
<slot/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
{{item.text}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['item']
|
||||
|
|
|
@ -9,15 +9,16 @@
|
|||
*/
|
||||
|
||||
<template>
|
||||
<SidebarButton v-if="item._type === 'button'" :item="item" :onClick="onClick"/>
|
||||
<SidebarButton v-if="item._type === 'button'" :item="item" @click="$emit('click', $event)" />
|
||||
<SidebarHeader v-else :item="item" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { SidebarHeader, SidebarButton } from './';
|
||||
|
||||
export default {
|
||||
props: ['item', 'onClick'],
|
||||
props: ['item'],
|
||||
components: {
|
||||
SidebarHeader,
|
||||
SidebarButton
|
||||
|
|
|
@ -13,8 +13,7 @@
|
|||
<slot/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
|
|
@ -23,6 +23,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Imports
|
||||
import { ScrollerWrap } from '../common';
|
||||
|
|
Loading…
Reference in New Issue