Ads view
This commit is contained in:
		
							parent
							
								
									169cc04481
								
							
						
					
					
						commit
						e546972af1
					
				
							
								
								
									
										72
									
								
								chat/AdView.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										72
									
								
								chat/AdView.vue
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,72 @@
 | 
			
		||||
<template>
 | 
			
		||||
   <modal :buttons="false" ref="dialog" @open="onOpen" @close="onClose" style="width:98%" dialogClass="ads-dialog">
 | 
			
		||||
        <template slot="title">
 | 
			
		||||
            Channel Ads for {{character.name}}
 | 
			
		||||
        </template>
 | 
			
		||||
 | 
			
		||||
       <div class="row ad-viewer" ref="pageBody">
 | 
			
		||||
            <template v-for="message in messages">
 | 
			
		||||
                <h3>#{{message.channelName}} <span class="message-time">{{formatTime(message.datePosted)}}</span></h3>
 | 
			
		||||
                <div v-bbcode="message.message" class="border-bottom"></div>
 | 
			
		||||
            </template>
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
   </modal>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
<script lang="ts">
 | 
			
		||||
 | 
			
		||||
import * as _ from 'lodash';
 | 
			
		||||
import { Component, Hook, Prop, Watch } from '@f-list/vue-ts';
 | 
			
		||||
import CustomDialog from '../components/custom_dialog';
 | 
			
		||||
import Modal from '../components/Modal.vue';
 | 
			
		||||
import { Character } from '../fchat/interfaces';
 | 
			
		||||
import { AdCachedPosting } from '../learn/ad-cache';
 | 
			
		||||
import core from './core';
 | 
			
		||||
import {formatTime} from './common';
 | 
			
		||||
 | 
			
		||||
@Component({
 | 
			
		||||
    components: {modal: Modal}
 | 
			
		||||
})
 | 
			
		||||
export default class AdView extends CustomDialog {
 | 
			
		||||
    @Prop({required: true})
 | 
			
		||||
    readonly character!: Character;
 | 
			
		||||
 | 
			
		||||
    messages: AdCachedPosting[] = [];
 | 
			
		||||
    formatTime = formatTime;
 | 
			
		||||
 | 
			
		||||
    @Watch('character')
 | 
			
		||||
    onNameUpdate(): void {
 | 
			
		||||
        this.update();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    @Hook('mounted')
 | 
			
		||||
    onMounted(): void {
 | 
			
		||||
        this.update();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    update(): void {
 | 
			
		||||
        if (!this.character) {
 | 
			
		||||
            this.messages = [];
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        const cache = core.cache.adCache.get(this.character.name);
 | 
			
		||||
 | 
			
		||||
        this.messages = (cache) ? _.takeRight(cache.posts, 20) : [];
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    async onOpen(): Promise<void> {
 | 
			
		||||
        // empty
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    async onClose(): Promise<void> {
 | 
			
		||||
        // empty
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
@ -13,6 +13,10 @@
 | 
			
		||||
                    </a>
 | 
			
		||||
                    <a href="#" @click.prevent="reportDialog.report()" class="btn">
 | 
			
		||||
                        <span class="fa fa-exclamation-triangle"></span><span class="btn-text">{{l('chat.report')}}</span></a>
 | 
			
		||||
 | 
			
		||||
                    <a href="#" @click.prevent="showAds()" class="btn">
 | 
			
		||||
                        <span class="fa fa-ad"></span><span class="btn-text">Ads</span>
 | 
			
		||||
                    </a>
 | 
			
		||||
                </div>
 | 
			
		||||
                <div style="overflow:auto;max-height:50px">
 | 
			
		||||
                    {{l('status.' + conversation.character.status)}}
 | 
			
		||||
@ -136,6 +140,7 @@
 | 
			
		||||
        <settings ref="settingsDialog" :conversation="conversation"></settings>
 | 
			
		||||
        <logs ref="logsDialog" :conversation="conversation"></logs>
 | 
			
		||||
        <manage-channel ref="manageDialog" v-if="isChannel(conversation)" :channel="conversation.channel"></manage-channel>
 | 
			
		||||
        <ad-view ref="adViewer" v-if="isPrivate(conversation)" :character="conversation.character"></ad-view>
 | 
			
		||||
    </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@ -145,6 +150,7 @@
 | 
			
		||||
    import {EditorButton, EditorSelection} from '../bbcode/editor';
 | 
			
		||||
    import {isShowing as anyDialogsShown} from '../components/Modal.vue';
 | 
			
		||||
    import {Keys} from '../keys';
 | 
			
		||||
    import AdView from './AdView.vue';
 | 
			
		||||
    import {BBCodeView, Editor} from './bbcode';
 | 
			
		||||
    import CommandHelp from './CommandHelp.vue';
 | 
			
		||||
    import { characterImage, getByteLength, getKey } from './common';
 | 
			
		||||
@ -162,7 +168,8 @@
 | 
			
		||||
    @Component({
 | 
			
		||||
        components: {
 | 
			
		||||
            user: UserView, 'bbcode-editor': Editor, 'manage-channel': ManageChannel, settings: ConversationSettings,
 | 
			
		||||
            logs: Logs, 'message-view': MessageView, bbcode: BBCodeView, 'command-help': CommandHelp
 | 
			
		||||
            logs: Logs, 'message-view': MessageView, bbcode: BBCodeView, 'command-help': CommandHelp,
 | 
			
		||||
            'ad-view': AdView
 | 
			
		||||
        }
 | 
			
		||||
    })
 | 
			
		||||
    export default class ConversationView extends Vue {
 | 
			
		||||
@ -400,6 +407,10 @@
 | 
			
		||||
            (<ManageChannel>this.$refs['manageDialog']).show();
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        showAds(): void {
 | 
			
		||||
            (<AdView>this.$refs['adViewer']).show();
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        isAutopostingAds(): boolean {
 | 
			
		||||
            return this.conversation.adManager.isActive();
 | 
			
		||||
@ -593,7 +604,36 @@
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .message-time,
 | 
			
		||||
    .message .message-time,
 | 
			
		||||
    .ad-viewer .message-time {
 | 
			
		||||
        background-color: #4f4f61;
 | 
			
		||||
        color: #dadada;
 | 
			
		||||
        border-radius: 3px;
 | 
			
		||||
        padding-left: 3px;
 | 
			
		||||
        padding-right: 3px;
 | 
			
		||||
        padding-bottom: 2px;
 | 
			
		||||
        padding-top: 1px;
 | 
			
		||||
        margin-right: 3px;
 | 
			
		||||
        font-size: 80%;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .ad-viewer {
 | 
			
		||||
       display: block;
 | 
			
		||||
 | 
			
		||||
        h3 {
 | 
			
		||||
            font-size: 12pt;
 | 
			
		||||
 | 
			
		||||
            .message-time {
 | 
			
		||||
                padding-bottom: 1px;
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .border-bottom {
 | 
			
		||||
            margin-bottom: 15px;
 | 
			
		||||
            border-width: 1px;
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .message {
 | 
			
		||||
        &.message-event {
 | 
			
		||||
@ -615,6 +655,20 @@
 | 
			
		||||
                background-color: rgba(0, 58, 0, 0.35);
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            &.neutral {
 | 
			
		||||
                border-left: 12px solid #555;
 | 
			
		||||
 | 
			
		||||
                .bbcode {
 | 
			
		||||
                    filter: grayscale(0.5);
 | 
			
		||||
                }
 | 
			
		||||
 | 
			
		||||
                .bbcode,
 | 
			
		||||
                .user-view,
 | 
			
		||||
                .message-time {
 | 
			
		||||
                    opacity: 0.6;
 | 
			
		||||
                }
 | 
			
		||||
            };
 | 
			
		||||
 | 
			
		||||
            &.weak-mismatch {
 | 
			
		||||
                background-color: rgba(208, 188, 0, 0.0);
 | 
			
		||||
                border-left: 12px solid rgb(138, 123, 0);
 | 
			
		||||
 | 
			
		||||
@ -40,7 +40,7 @@
 | 
			
		||||
 | 
			
		||||
    @Component
 | 
			
		||||
    export default class ImagePreview extends Vue {
 | 
			
		||||
        private readonly MinTimePreviewVisible = 500;
 | 
			
		||||
        private readonly MinTimePreviewVisible = 100;
 | 
			
		||||
 | 
			
		||||
        visible = false;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -26,7 +26,7 @@ const userPostfix: {[key: number]: string | undefined} = {
 | 
			
		||||
        // );
 | 
			
		||||
 | 
			
		||||
        const children: VNodeChildrenArrayContents =
 | 
			
		||||
            [createElement('span', {staticClass: 'message-time'}, `[${formatTime(message.time)}] `)];
 | 
			
		||||
            [createElement('span', {staticClass: 'message-time'}, `${formatTime(message.time)}`)];
 | 
			
		||||
        const separators = core.connection.isOpen ? core.state.settings.messageSeparators : false;
 | 
			
		||||
        /*tslint:disable-next-line:prefer-template*///unreasonable here
 | 
			
		||||
        let classes = `message message-${Conversation.Message.Type[message.type].toLowerCase()}` + (separators ? ' message-block' : '') +
 | 
			
		||||
@ -104,27 +104,11 @@ export default class MessageView extends Vue {
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    getMessageScoreClasses(message: Conversation.Message): string {
 | 
			
		||||
        if (message.score === 0) {
 | 
			
		||||
        if (message.type !== Conversation.Message.Type.Ad) {
 | 
			
		||||
            return '';
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        // console.log('Score was', message.score);
 | 
			
		||||
 | 
			
		||||
        return `message-score ${Score.getClasses(message.score as Scoring)}`;
 | 
			
		||||
 | 
			
		||||
        // const baseClass = message.score > 0 ? 'message-score-positive' : 'message-score-negative';
 | 
			
		||||
        //
 | 
			
		||||
        // const score = Math.abs(message.score);
 | 
			
		||||
        //
 | 
			
		||||
        // let scoreStrength = 'message-score-normal';
 | 
			
		||||
        //
 | 
			
		||||
        // if (score > 3) {
 | 
			
		||||
        //     scoreStrength = 'message-score-high';
 | 
			
		||||
        // } else if (score > 1.5) {
 | 
			
		||||
        //     scoreStrength = 'message-score-medium';
 | 
			
		||||
        // }
 | 
			
		||||
        //
 | 
			
		||||
        // return `message-score ${baseClass} ${scoreStrength}`;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
@ -128,6 +128,7 @@
 | 
			
		||||
        settings!: GeneralSettings;
 | 
			
		||||
        importProgress = 0;
 | 
			
		||||
        profileName = '';
 | 
			
		||||
        adName = '';
 | 
			
		||||
        fixCharacters: ReadonlyArray<string> = [];
 | 
			
		||||
        fixCharacter = '';
 | 
			
		||||
 | 
			
		||||
@ -141,11 +142,13 @@
 | 
			
		||||
 | 
			
		||||
            electron.ipcRenderer.on('settings',
 | 
			
		||||
                (_: Event, settings: GeneralSettings) => core.state.generalSettings = this.settings = settings);
 | 
			
		||||
 | 
			
		||||
            electron.ipcRenderer.on('open-profile', (_: Event, name: string) => {
 | 
			
		||||
                const profileViewer = <Modal>this.$refs['profileViewer'];
 | 
			
		||||
                this.profileName = name;
 | 
			
		||||
                profileViewer.show();
 | 
			
		||||
            });
 | 
			
		||||
 | 
			
		||||
            electron.ipcRenderer.on('fix-logs', async() => {
 | 
			
		||||
                this.fixCharacters = await new SettingsStore().getAvailableCharacters();
 | 
			
		||||
                this.fixCharacter = this.fixCharacters[0];
 | 
			
		||||
 | 
			
		||||
@ -12,7 +12,8 @@ export interface AdPosting extends AdCachedPosting {
 | 
			
		||||
 | 
			
		||||
export class AdCacheRecord {
 | 
			
		||||
    protected name: string;
 | 
			
		||||
    protected posts: AdCachedPosting[] = [];
 | 
			
		||||
 | 
			
		||||
    readonly posts: AdCachedPosting[] = [];
 | 
			
		||||
 | 
			
		||||
    constructor(name: string, posting?: AdPosting) {
 | 
			
		||||
        this.name = name;
 | 
			
		||||
 | 
			
		||||
@ -126,8 +126,11 @@ export class ProfileCache extends AsyncCache<CharacterCacheRecord> {
 | 
			
		||||
 | 
			
		||||
        // const score =  Math.min(m.them.total, m.you.total); // mul * (Math.abs(m.you.total) + Math.abs(m.them.total));
 | 
			
		||||
 | 
			
		||||
        const yourScores = _.values(m.you.scores);
 | 
			
		||||
        const theirScores = _.values(m.them.scores);
 | 
			
		||||
 | 
			
		||||
        const finalScore = _.reduce(
 | 
			
		||||
            _.concat(_.values(m.them.scores), _.values(m.you.scores)),
 | 
			
		||||
            _.concat(yourScores, theirScores),
 | 
			
		||||
            (accum: Scoring | null, score: Score) => {
 | 
			
		||||
                if (accum === null) {
 | 
			
		||||
                    return (score.score !== Scoring.NEUTRAL) ? score.score : null;
 | 
			
		||||
@ -138,6 +141,25 @@ export class ProfileCache extends AsyncCache<CharacterCacheRecord> {
 | 
			
		||||
            null
 | 
			
		||||
        );
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        if ((finalScore !== null) && (finalScore > 0)) {
 | 
			
		||||
            // Manage edge cases where high score may not be ideal
 | 
			
		||||
 | 
			
		||||
            // Nothing to score
 | 
			
		||||
            if ((yourScores.length === 0) || (theirScores.length === 0)) {
 | 
			
		||||
                // can't know
 | 
			
		||||
                return Scoring.NEUTRAL;
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            // Only neutral scores given
 | 
			
		||||
            if (
 | 
			
		||||
                (_.every(yourScores, (n: Scoring) => n === Scoring.NEUTRAL)) ||
 | 
			
		||||
                (_.every(theirScores, (n: Scoring) => n === Scoring.NEUTRAL))
 | 
			
		||||
            ) {
 | 
			
		||||
                return Scoring.NEUTRAL;
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        // console.log('Profile score', c.character.name, score, m.you.total, m.them.total,
 | 
			
		||||
        //    m.you.total + m.them.total, m.you.total * m.them.total);
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user