add badges to messages as well
This commit is contained in:
parent
7737dacd05
commit
dfa7987756
|
@ -18,13 +18,26 @@
|
|||
}
|
||||
|
||||
.bd-profile-badge-developer,
|
||||
.bd-profile-badge-contributor {
|
||||
.bd-profile-badge-contributor,
|
||||
.bd-message-badge-developer,
|
||||
.bd-message-badge-contributor {
|
||||
background-image: $logoSmallBw;
|
||||
width: 16px;
|
||||
filter: brightness(10);
|
||||
|
||||
cursor: pointer;
|
||||
.theme-light [class*="topSectionNormal-"] & {
|
||||
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAwMCAyMDAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMDAwIDIwMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGZpbGw9IiMzRTgyRTUiIGQ9Ik0xNDAyLjIsNjMxLjdjLTkuNy0zNTMuNC0yODYuMi00OTYtNjQyLjYtNDk2SDY4LjR2NzE0LjFsNDQyLDM5OFY0OTAuN2gyNTdjMjc0LjUsMCwyNzQuNSwzNDQuOSwwLDM0NC45SDU5Ny42djMyOS41aDE2OS44YzI3NC41LDAsMjc0LjUsMzQ0LjgsMCwzNDQuOGgtNjk5djM1NC45aDY5MS4yYzM1Ni4zLDAsNjMyLjgtMTQyLjYsNjQyLjYtNDk2YzAtMTYyLjYtNDQuNS0yODQuMS0xMjIuOS0zNjguNkMxMzU3LjcsOTE1LjgsMTQwMi4yLDc5NC4zLDE0MDIuMiw2MzEuN3oiLz48cGF0aCBmaWxsPSIjYmJiYmJiIiBkPSJNMTI2Mi41LDEzNS4yTDEyNjIuNSwxMzUuMmwtNzYuOCwwYzI2LjYsMTMuMyw1MS43LDI4LjEsNzUsNDQuM2M3MC43LDQ5LjEsMTI2LjEsMTExLjUsMTY0LjYsMTg1LjNjMzkuOSw3Ni42LDYxLjUsMTY1LjYsNjQuMywyNjQuNmwwLDEuMnYxLjJjMCwxNDEuMSwwLDU5Ni4xLDAsNzM3LjF2MS4ybDAsMS4yYy0yLjcsOTktMjQuMywxODgtNjQuMywyNjQuNmMtMzguNSw3My44LTkzLjgsMTM2LjItMTY0LjYsMTg1LjNjLTIyLjYsMTUuNy00Ni45LDMwLjEtNzIuNiw0My4xaDcyLjVjMzQ2LjIsMS45LDY3MS0xNzEuMiw2NzEtNTY3LjlWNzE2LjdDMTkzMy41LDMxMi4yLDE2MDguNywxMzUuMiwxMjYyLjUsMTM1LjJ6Ii8+PC9nPjwvc3ZnPg==');
|
||||
filter: none;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-message-badges-wrap {
|
||||
display: inline-block;
|
||||
margin-left: 6px;
|
||||
height: 11px;
|
||||
.bd-message-badge-developer,
|
||||
.bd-message-badge-contributor {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
}
|
|
@ -7,7 +7,7 @@
|
|||
@import './bdsettings/index.scss';
|
||||
@import './generic/index.scss';
|
||||
@import './modals/index.scss';
|
||||
@import './profilebadges.scss';
|
||||
@import './badges.scss';
|
||||
|
||||
@import './discordoverrides.scss';
|
||||
@import './helpers.scss';
|
||||
|
|
|
@ -0,0 +1,32 @@
|
|||
/**
|
||||
* BetterDiscord BD Message Badge Component
|
||||
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
||||
* All rights reserved.
|
||||
* https://betterdiscord.net
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
<template>
|
||||
<div class="bd-message-badges-wrap">
|
||||
<div v-if="developer == 'true'" v-tooltip="'BetterDiscord Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="webdev == 'true'" v-tooltip="'BetterDiscord Web Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
|
||||
<div v-else-if="contributor == 'true'" v-tooltip="'BetterDiscord Contributor'" class="bd-message-badge bd-message-badge-contributor" @click="onClick"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// Imports
|
||||
import { shell } from 'electron';
|
||||
|
||||
export default {
|
||||
props: ['webdev', 'developer', 'contributor', 'hasBadges'],
|
||||
methods: {
|
||||
onClick() {
|
||||
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');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -4,3 +4,4 @@ export { default as CssEditorView } from './CssEditor.vue';
|
|||
export { default as PluginsView } from './PluginsView.vue';
|
||||
export { default as ThemesView } from './ThemesView.vue';
|
||||
export { default as BdBadge } from './BdBadge.vue';
|
||||
export { default as BdMessageBadge } from './BdMessageBadge.vue';
|
||||
|
|
|
@ -10,18 +10,20 @@
|
|||
|
||||
import { EventListener } from 'modules';
|
||||
import DOM from './dom';
|
||||
import { BdBadge } from './components/bd';
|
||||
import { BdBadge, BdMessageBadge } from './components/bd';
|
||||
import VueInjector from './vueinjector';
|
||||
|
||||
export default class extends EventListener {
|
||||
|
||||
bindings() {
|
||||
this.uiEvent = this.uiEvent.bind(this);
|
||||
this.messageBadges = this.messageBadges.bind(this);
|
||||
}
|
||||
|
||||
get eventBindings() {
|
||||
return [
|
||||
{ id: 'ui-event', callback: this.uiEvent }
|
||||
{ id: 'discord:MESSAGE_CREATE', callback: this.messageBadges },
|
||||
{ id: 'ui-event', callback: this.uiEvent }
|
||||
];
|
||||
}
|
||||
|
||||
|
@ -34,6 +36,28 @@ export default class extends EventListener {
|
|||
this.inject(userid);
|
||||
}
|
||||
|
||||
messageBadges(e) {
|
||||
if (!e.element) return;
|
||||
const msgGroup = e.element.closest('.message-group');
|
||||
if (msgGroup.dataset.hasBadges) return;
|
||||
msgGroup.setAttribute('data-has-badges', true);
|
||||
if (!msgGroup.dataset.authorId) return;
|
||||
const c = this.contributors.find(c => c.id === msgGroup.dataset.authorId);
|
||||
if (!c) return;
|
||||
const root = document.createElement('span');
|
||||
const wrapperParent = msgGroup.querySelector('.username-wrapper').parentElement;
|
||||
if (!wrapperParent || wrapperParent.children.length < 2) return;
|
||||
wrapperParent.insertBefore(root, wrapperParent.children[1]);
|
||||
const { developer, contributor, webdev } = c;
|
||||
VueInjector.inject(
|
||||
root,
|
||||
DOM.createElement('div', null, 'bdmessagebadges'),
|
||||
{ BdMessageBadge },
|
||||
`<BdMessageBadge developer="${developer}" webdev="${webdev}" contributor="${contributor}"/>`,
|
||||
true
|
||||
);
|
||||
}
|
||||
|
||||
inject(userid) {
|
||||
const c = this.contributors.find(c => c.id === userid);
|
||||
if (!c) return;
|
||||
|
@ -61,6 +85,7 @@ export default class extends EventListener {
|
|||
get contributors() {
|
||||
return [
|
||||
{ 'id': '81388395867156480', 'webdev': true, 'developer': true, 'contributor': true }, // Jiiks
|
||||
{ 'id': '418494039050944513', 'webdev': true, 'developer': true, 'contributor': true }, // Mioni
|
||||
{ 'id': '98003542823944192', 'webdev': false, 'developer': true, 'contributor': true }, // Pohky
|
||||
{ 'id': '138850472541814784', 'webdev': true, 'developer': false, 'contributor': true }, // Hammock
|
||||
{ 'id': '249746236008169473', 'webdev': false, 'developer': true, 'contributor': true }, // Zerebos
|
||||
|
|
Loading…
Reference in New Issue