kittyfangs
/
fchat-rising
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Portrait next to text input

This commit is contained in:
Mr. Stallion 2022-12-10 14:42:15 -08:00
parent 29c71538d7
commit f8c36187a4
6 changed files with 83 additions and 7 deletions

1
CHANGELOG.md
View File

@ -1,6 +1,7 @@
# Changelog
## 1.19.3
* Added option to have character portrait displayed next to text input
* Fixed asexual orientation ID
* Replaced the action star icon to differentiate with the mod badges

31
bbcode/Editor.vue
View File

@ -8,6 +8,10 @@
<div class="bbcode-toolbar btn-toolbar" role="toolbar" :style="showToolbar ? {display: 'flex'} : undefined" @mousedown.stop.prevent
v-if="hasToolbar" style="flex:1 51%">
<div class="btn-group" style="flex-wrap:wrap">
<div v-if="!!characterName" class="character-btn">
<icon :character="characterName"></icon>
</div>
<div class="btn btn-light btn-sm" v-for="button in buttons" :title="button.title" @click.prevent.stop="apply(button)">
<i :class="(button.class ? button.class : 'fa ') + button.icon"></i>
</div>
@ -43,8 +47,13 @@
import {BBCodeElement, CoreBBCodeParser, urlRegex} from './core';
import {defaultButtons, EditorButton, EditorSelection} from './editor';
import {BBCodeParser} from './parser';
import {default as IconView} from './IconView.vue';
@Component
@Component({
components: {
'icon': IconView
}
})
export default class Editor extends Vue {
@Prop
readonly extras?: EditorButton[];
@ -70,6 +79,9 @@
@Prop({default: false, type: Boolean})
readonly invalid!: boolean;
@Prop({default: null})
readonly characterName: string | null = null;
preview = false;
previewWarnings: ReadonlyArray<string> = [];
previewResult = '';
@ -311,3 +323,20 @@
}
}
</script>
<style lang="scss">
.bbcode-editor .bbcode-toolbar .character-btn {
width: 30px;
height: 30px;
overflow: hidden;
a {
width: 100%;
height: 100%;
img {
width: inherit;
height: inherit;
}
}
}
</style>

42
chat/ConversationView.vue
View File

@ -135,9 +135,12 @@
<bbcode-editor v-model="conversation.enteredText" @keydown="onKeyDown" :extras="extraButtons" @input="keepScroll"
:classes="'form-control chat-text-box' + (isChannel(conversation) && conversation.isSendingAds ? ' ads-text-box' : '')"
:hasToolbar="settings.bbCodeBar" ref="textBox" style="position:relative;margin-top:5px"
:maxlength="isChannel(conversation) || isPrivate(conversation) ? conversation.maxMessageLength : undefined">
:maxlength="isChannel(conversation) || isPrivate(conversation) ? conversation.maxMessageLength : undefined"
:characterName="ownName"
>
<span v-if="isPrivate(conversation) && conversation.typingStatus !== 'clear'" class="chat-info-text">
{{l('chat.typing.' + conversation.typingStatus, conversation.name)}}
<user :character="conversation.character" :match="false" :bookmark="false"></user>&nbsp;{{l('chat.typing.' + conversation.typingStatus, '').trim()}}
</span>
<div v-show="conversation.infoText" class="chat-info-text">
<span class="fa fa-times" style="cursor:pointer" @click.stop="conversation.infoText = ''"></span>
@ -203,13 +206,22 @@
import CharacterChannelList from './character/CharacterChannelList.vue';
import * as _ from 'lodash';
import Dropdown from '../components/Dropdown.vue';
import { EventBus } from './preview/event-bus';
@Component({
components: {
user: UserView, 'bbcode-editor': Editor, 'manage-channel': ManageChannel, settings: ConversationSettings,
logs: Logs, 'message-view': MessageView, bbcode: BBCodeView(core.bbCodeParser), 'command-help': CommandHelp,
'ad-view': CharacterAdView, 'channel-list': CharacterChannelList, dropdown: Dropdown, adSettings: ConversationAdSettings
user: UserView,
'bbcode-editor': Editor,
'manage-channel': ManageChannel,
settings: ConversationSettings,
logs: Logs,
'message-view': MessageView,
bbcode: BBCodeView(core.bbCodeParser),
'command-help': CommandHelp,
'ad-view': CharacterAdView,
'channel-list': CharacterChannelList,
dropdown: Dropdown,
adSettings: ConversationAdSettings
}
})
export default class ConversationView extends Vue {
@ -246,15 +258,20 @@
isPrivate = Conversation.isPrivate;
showNonMatchingAds = true;
ownName?: string;
@Hook('beforeMount')
async onBeforeMount(): Promise<void> {
this.updateOwnName();
this.showNonMatchingAds = !await core.settingsStore.get('hideNonMatchingAds');
}
@Hook('mounted')
mounted(): void {
this.updateOwnName();
this.extraButtons = [{
title: 'Help\n\nClick this button for a quick overview of slash commands.',
tag: '?',
@ -295,8 +312,13 @@
this.$watch(() => this.conversation.adManager.isActive(), () => (this.refreshAutoPostingTimer()));
this.refreshAutoPostingTimer();
this.configUpdateHook = () => this.updateOwnName();
EventBus.$on('configuration-update', this.configUpdateHook);
}
protected configUpdateHook: any;
@Hook('destroyed')
destroyed(): void {
window.removeEventListener('resize', this.resizeHandler);
@ -305,6 +327,8 @@
clearInterval(this.searchTimer);
clearInterval(this.autoPostingUpdater);
clearInterval(this.adCountdown);
EventBus.$off('configuration-update', this.configUpdateHook);
}
hideSearch(): void {
@ -312,6 +336,10 @@
this.searchInput = '';
}
updateOwnName(): void {
this.ownName = core.state.settings.risingShowPortraitNearInput ? core.characters.ownCharacter?.name : undefined;
}
get conversation(): Conversation {
return core.conversations.selectedConversation;
}
@ -328,6 +356,8 @@
@Watch('conversation')
conversationChanged(): void {
this.updateOwnName();
if(!anyDialogsShown) (<Editor>this.$refs['textBox']).focus();
this.$nextTick(() => setTimeout(() => this.messageView.scrollTop = this.messageView.scrollHeight));
this.scrolledDown = true;

14
chat/SettingsView.vue
View File

@ -199,6 +199,12 @@
</label>
</div>
<div class="form-group">
<label class="control-label" for="risingShowPortraitNearInput">
<input type="checkbox" id="risingShowPortraitNearInput" v-model="risingShowPortraitNearInput"/>
Show character portrait by text input
</label>
</div>
</div>
<div v-show="selectedTab === '3'">
@ -325,6 +331,7 @@
import { smartFilterTypes as smartFilterTypesOrigin } from '../learn/filter/types';
import _ from 'lodash';
import { matchesSmartFilters } from '../learn/filter/smart-filter';
import { EventBus } from './preview/event-bus';
@Component({
components: {modal: Modal, tabs: Tabs}
@ -367,6 +374,8 @@
risingShowUnreadOfflineCount!: boolean;
risingColorblindMode!: boolean;
risingShowPortraitNearInput!: boolean;
risingFilter!: SmartFilterSettings = {} as any;
smartFilterTypes = smartFilterTypesOrigin;
@ -408,6 +417,8 @@
this.risingShowUnreadOfflineCount = settings.risingShowUnreadOfflineCount;
this.risingColorblindMode = settings.risingColorblindMode;
this.risingShowPortraitNearInput = settings.risingShowPortraitNearInput;
this.risingFilter = settings.risingFilter;
}
@ -468,6 +479,7 @@
risingComparisonInUserMenu: this.risingComparisonInUserMenu,
risingComparisonInSearch: this.risingComparisonInSearch,
risingShowUnreadOfflineCount: this.risingShowUnreadOfflineCount,
risingShowPortraitNearInput: this.risingShowPortraitNearInput,
risingColorblindMode: this.risingColorblindMode,
risingFilter: {
@ -486,6 +498,8 @@
}
if(this.notifications) await core.notifications.requestPermission();
EventBus.$emit('configuration-update', core.state.settings);
}
rebuildFilters() {

1
chat/common.ts
View File

@ -54,6 +54,7 @@ export class Settings implements ISettings {
risingShowUnreadOfflineCount = true;
risingColorblindMode = false;
risingShowPortraitNearInput = true;
risingFilter = {
hideAds: true,

1
chat/interfaces.ts
View File

@ -226,6 +226,7 @@ export namespace Settings {
readonly risingShowUnreadOfflineCount: boolean;
readonly risingColorblindMode: boolean;
readonly risingShowPortraitNearInput: boolean;
readonly risingFilter: SmartFilterSettings;
}