Status message history

chat/CharacterSearch.vue

@@ -286,7 +286,7 @@
 
         .search-spinner {
             float: right;
-            animation: search-spin 4s linear infinite;
+            animation: search-spin 0.75s linear infinite;
         }
     }
 

chat/ConversationView.vue

@@ -56,7 +56,7 @@
                             class="nav-link" href="#" @click.prevent="setMode(mode)">{{l('channel.mode.' + mode)}}</a>
                     </li>
                     <li>
-                        <a @click.prevent="toggleNonMatchingAds()" :class="{active: showNonMatchingAds, disabled: !showNonMatchingAds}" v-show="(conversation.mode == 'both' || conversation.mode == 'ads')"
+                        <a @click.prevent="toggleNonMatchingAds()" :class="{active: showNonMatchingAds}" v-show="(conversation.mode == 'both' || conversation.mode == 'ads')"
                             class="nav-link" href="#">Non-Matching</a>
                     </li>
                 </ul>

chat/StatusPicker.vue

@@ -0,0 +1,111 @@
+<template>
+    <modal action="Status message history" buttonText="Select" @open="onMounted()" @submit="selectStatus" dialogClass="w-100 modal-lg">
+        <form class="status-picker" v-if="history.length > 0">
+            <div class="form-row" v-for="(historicStatus, index) in history" :class="{ 'selected-row': (index === selectedStatus)}">
+                <div class="form-col radio-col">
+                    <input type="radio" :id="'history_status_' + index" :name="'history_status_' + index" v-model="selectedStatus" v-bind:value="index" />
+                </div>
+                <div class="form-col content-col">
+                    <label class="custom-control-label" :for="'history_status_' + index">
+                        <bbcode :text="historicStatus"></bbcode>
+                    </label>
+                </div>
+            </div>
+        </form>
+        <div v-else>
+            <i>This character has no status message history.</i>
+        </div>
+    </modal>
+</template>
+
+<script lang="ts">
+    import { Component, Hook, Prop } from '@f-list/vue-ts';
+    import Modal from '../components/Modal.vue';
+    import Dropdown from '../components/Dropdown.vue';
+    import CustomDialog from '../components/custom_dialog';
+    import core from './core';
+    import { BBCodeView } from '../bbcode/view';
+    import * as _ from 'lodash';
+
+    @Component({
+        components: {modal: Modal, dropdown: Dropdown, bbcode: BBCodeView(core.bbCodeParser)}
+    })
+    export default class StatusPicker extends CustomDialog {
+        @Prop({required: true})
+        readonly callback!: (statusMessage: string) => void;
+
+        @Prop({required: true})
+        readonly curStatus!: string | undefined;
+
+        history: string[] = [];
+
+        selectedStatus: number | null = null;
+
+        @Hook('mounted')
+        async onMounted(): Promise<void> {
+            this.history = (await core.settingsStore.get('statusHistory')) || [];
+            this.selectedStatus = null;
+
+            if ((this.curStatus) && (this.curStatus.trim() !== '')) {
+                const cleanedStatus = this.curStatus.toLowerCase().trim();
+
+                const index = _.findIndex(
+                    this.history,
+                  (c: string) => (c.toString().toLowerCase().trim() === cleanedStatus)
+                );
+
+                if (index >= 0) {
+                    this.selectedStatus = index;
+                }
+            }
+        }
+
+
+        selectStatus(): void {
+            if (this.selectedStatus !== null) {
+                this.callback(this.history[this.selectedStatus]);
+            }
+        }
+    }
+</script>
+
+<style lang="scss">
+    .status-picker {
+        .radio-col {
+            display: none;
+        }
+
+        label::before {
+            display:none !important;
+        }
+
+        .content-col {
+            min-width: 100%;
+
+            label {
+                min-width: 100%;
+            }
+        }
+
+        .form-row {
+            margin-bottom: 10px;
+            padding: 3px;
+
+            border: 1px solid rgba(0,0,0,0);
+            border-radius: 2px;
+        }
+
+        .form-row:hover {
+            background-color: #20203e;
+            border: 1px solid #2d2d6b;
+            border-radius: 2px;
+        }
+
+        .selected-row,
+        .form-row.selected-row:hover {
+            background-color: #343461;
+            border: 1px solid #6565b2;
+            border-radius: 2px;
+        }
+    }
+</style>

chat/StatusSwitcher.vue

@@ -17,6 +17,11 @@
                 </div>
             </editor>
         </div>
+        <div class="form-group">
+            <button type="button" @click="showStatusPicker" class="btn btn-outline-secondary">History</button>
+        </div>
+
+        <status-picker ref="statusPicker" :callback="insertStatusMessage" :curStatus="enteredText"></status-picker>
     </modal>
 </template>
 
@@ -31,9 +36,11 @@
     import {Character, userStatuses} from './interfaces';
     import l from './localize';
     import {getStatusIcon} from './UserView.vue';
+    import StatusPicker from './StatusPicker.vue';
+    import * as _ from 'lodash';
 
     @Component({
-        components: {modal: Modal, editor: Editor, dropdown: Dropdown}
+        components: {modal: Modal, editor: Editor, dropdown: Dropdown, 'status-picker': StatusPicker}
     })
     export default class StatusSwitcher extends CustomDialog {
         selectedStatus: Character.Status | undefined;
@@ -65,11 +72,36 @@
 
         setStatus(): void {
             core.connection.send('STA', {status: this.status, statusmsg: this.text});
+
+            // tslint:disable-next-line
+            this.updateHistory(this.text);
         }
 
         reset(): void {
             this.selectedStatus = undefined;
             this.enteredText = undefined;
         }
+
+        insertStatusMessage(statusMessage: string): void {
+            this.text = statusMessage;
+        }
+
+
+        async updateHistory(statusMessage: string): Promise<void> {
+            if ((!statusMessage) || (statusMessage.trim() === '')) {
+                return;
+            }
+
+            const curHistory: string[] = (await core.settingsStore.get('statusHistory')) || [];
+            const statusMessageClean = statusMessage.toString().trim().toLowerCase();
+            const filteredHistory: string[] = _.reject(curHistory, (c: string) => (c.toString().trim().toLowerCase() === statusMessageClean));
+            const newHistory: string[] = _.take(_.concat([statusMessage], filteredHistory), 10);
+
+            await core.settingsStore.set('statusHistory', newHistory);
+        }
+
+        showStatusPicker(): void {
+          (<StatusPicker>this.$refs['statusPicker']).show();
+        }
     }
 </script>

chat/interfaces.ts

@@ -145,13 +145,14 @@ export interface Logs {
 
 export namespace Settings {
     export type Keys = {
-        settings: Settings,
+        settings: Settings
-        pinned: {channels: string[], private: string[]},
+        pinned: {channels: string[], private: string[]}
         conversationSettings: {[key: string]: Conversation.Settings | undefined}
         modes: {[key: string]: Channel.Mode | undefined}
         recent: Conversation.RecentPrivateConversation[]
         recentChannels: Conversation.RecentChannelConversation[]
         hiddenUsers: string[]
+        statusHistory: string[]
     };
 
     export interface Store {

readme.md

@@ -7,10 +7,11 @@ This repository contains a heavily customized version of the mainline F-Chat 3.0
 
 1. **Profile matching** automatically compares your profile with others to determine with whom you are compatible.
 1. **Automatic ad posting** repeatedly posts and rotates ads on selected channels.
-1. **Link previews** pop up shows a preview of an image when you hover your mouse over a link.
+1. **Link previews** popup shows a preview of an image / video when you hover your mouse over a link.
+1. **Caching** speeds up profile loads and other actions.
 
 
-### More Details
+### More Detailed Differences
 
 *   Ads view
     *    Highlight ads from characters most interesting to you
@@ -42,10 +43,13 @@ This repository contains a heavily customized version of the mainline F-Chat 3.0
     *    Display match score in search results
     *    Current search filters are listed in the search dialog
     *    Search filters can be reset
+*   Character status
+    *    Last 10 status messages are stored and can be accessed from the 'Set status' dialog
 *   General
-    *    Character profiles, guestbooks, friend lists, and image lists are cached for faster access.
+    *    Character profiles, guestbooks, friend lists, and image lists are cached for faster access
     *    Conversation dialog can be opened by typing in a character name
-    *    Message search also checks character names
+    *    Message search matches character names
+    *    PM list shows characters' online status as a colored icon
 
 
 ## How to Set Up Ads
@@ -76,10 +80,9 @@ This repository contains a heavily customized version of the mainline F-Chat 3.0
 *   Save character's status messages
 *   Conversation bot API
 *   'Filter unmatching ads' is not channel specific -- it's either on everywhere or nowhere
-*   AD UI Cleanup / hide to popovers
+*   AD UI Cleanup / hide to popovers?
 *   image loading animation
-*   Ad cache is broken
+*   Usually submissive vs usually submissive shows up as 'maybe'?
-*   Show online / offline status on PM list
 
 
 # F-List Exported