Use events

This commit is contained in:
Samuel Elliott 2018-03-30 01:07:56 +01:00
parent 8983256ade
commit 8c09112cff
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
22 changed files with 54 additions and 44 deletions

View File

@ -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">

View File

@ -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');

View File

@ -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');

View File

@ -29,6 +29,7 @@
</div>
</div>
</template>
<script>
// Imports
import { MiExtension } from '../common';

View File

@ -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>

View File

@ -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';

View File

@ -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>

View File

@ -21,6 +21,7 @@
</ScrollerWrap>
</div>
</template>
<script>
// Imports
import { ScrollerWrap } from '../common';

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -13,7 +13,7 @@
<slot />
</div>
</template>
<script>
export default {
}
export default {}
</script>

View File

@ -21,6 +21,7 @@
</div>
</div>
</template>
<script>
export default {
props: ['options', 'value', 'disabled'],

View File

@ -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>

View File

@ -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>

View File

@ -15,8 +15,9 @@
</div>
</div>
</template>
<script>
export default {
props: ['dark']
}
</script>
</script>

View File

@ -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>

View File

@ -13,6 +13,7 @@
<slot/>
</div>
</template>
<script>
export default {}
</script>

View File

@ -13,6 +13,7 @@
{{item.text}}
</div>
</template>
<script>
export default {
props: ['item']

View File

@ -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

View File

@ -13,8 +13,7 @@
<slot/>
</div>
</template>
<script>
export default {
}
<script>
export default {}
</script>

View File

@ -23,6 +23,7 @@
</div>
</div>
</template>
<script>
// Imports
import { ScrollerWrap } from '../common';