User dialog notes

html/src/app.js

@@ -7328,6 +7328,9 @@ speechSynthesis.getVoices();
                 if (!match && ctx.memo) {
                     match = String(ctx.memo).toUpperCase().includes(QUERY);
                 }
+                if (!match && ctx.ref.note) {
+                    match = String(ctx.ref.note).toUpperCase().includes(QUERY);
+                }
                 if (match) {
                     results.push({
                         value: ctx.id,
@@ -11731,6 +11734,8 @@ speechSynthesis.getVoices();
     $app.data.randomUserColours = configRepository.getBool(
         'VRCX_randomUserColours'
     );
+    $app.data.hideUserNotes = configRepository.getBool('VRCX_hideUserNotes');
+    $app.data.hideUserMemos = configRepository.getBool('VRCX_hideUserMemos');
     $app.methods.saveOpenVROption = function () {
         configRepository.setBool('openVR', this.openVR);
         configRepository.setBool('openVRAlways', this.openVRAlways);
@@ -11796,6 +11801,10 @@ speechSynthesis.getVoices();
         this.updateVRLastLocation();
         AppApi.ExecuteVrOverlayFunction('notyClear', '');
     };
+    $app.methods.saveUserDialogOption = function () {
+        configRepository.setBool('VRCX_hideUserNotes', this.hideUserNotes);
+        configRepository.setBool('VRCX_hideUserMemos', this.hideUserMemos);
+    };
     $app.data.TTSvoices = speechSynthesis.getVoices();
     $app.methods.saveNotificationTTS = function () {
         speechSynthesis.cancel();
@@ -12976,6 +12985,8 @@ speechSynthesis.getVoices();
         ref: {},
         friend: {},
         isFriend: false,
+        note: '',
+        noteSaving: false,
         incomingRequest: false,
         outgoingRequest: false,
         isBlock: false,
@@ -13039,6 +13050,8 @@ speechSynthesis.getVoices();
             return;
         }
         D.ref = ref;
+        D.note = String(ref.note || '');
+        D.noteSaving = false;
         D.incomingRequest = false;
         D.outgoingRequest = false;
         if (D.ref.friendRequestStatus === 'incoming') {
@@ -13210,6 +13223,8 @@ speechSynthesis.getVoices();
         D.id = userId;
         D.treeData = [];
         D.memo = '';
+        D.note = '';
+        D.noteSaving = false;
         this.getMemo(userId).then((memo) => {
             D.memo = memo;
             var ref = this.friends.get(userId);
@@ -13263,6 +13278,7 @@ speechSynthesis.getVoices();
                     D.ref = args.ref;
                     D.friend = this.friends.get(D.id);
                     D.isFriend = Boolean(D.friend);
+                    D.note = String(D.ref.note || '');
                     D.incomingRequest = false;
                     D.outgoingRequest = false;
                     D.isBlock = false;
@@ -20177,6 +20193,77 @@ speechSynthesis.getVoices();
         this.updateWorldExportDialog();
     };
 
+    // App: user dialog notes
+
+    API.saveNote = function (params) {
+        return this.call('userNotes', {
+            method: 'POST',
+            params
+        }).then((json) => {
+            var args = {
+                json,
+                params
+            };
+            this.$emit('NOTE', args);
+            return args;
+        });
+    };
+
+    API.$on('NOTE', function (args) {
+        var note = '';
+        var targetUserId = '';
+        if (typeof args.json !== 'undefined') {
+            note = args.json.note;
+        }
+        if (typeof args.params !== 'undefined') {
+            targetUserId = args.params.targetUserId;
+        }
+        if (targetUserId === $app.userDialog.id) {
+            if (note === args.params.note) {
+                $app.userDialog.noteSaving = false;
+                $app.userDialog.note = note;
+            } else {
+                // response is cached sadge :<
+                this.getUser({userId: targetUserId});
+            }
+        }
+        var ref = API.cachedUsers.get(targetUserId);
+        if (typeof ref !== 'undefined') {
+            ref.note = note;
+        }
+    });
+
+    $app.methods.checkNote = function (ref, note) {
+        if (ref.note !== note) {
+            this.addNote(ref.id, note);
+        }
+    };
+
+    $app.methods.cleanNote = function (note) {
+        // remove newlines because they aren't supported
+        $app.userDialog.note = note.replace(/[\r\n]/g, '');
+    };
+
+    $app.methods.addNote = function (userId, note) {
+        if (this.userDialog.id === userId) {
+            this.userDialog.noteSaving = true;
+        }
+        return API.saveNote({
+            targetUserId: userId,
+            note
+        });
+    };
+
+    $app.methods.deleteNote = function (userId) {
+        if (this.userDialog.id === userId) {
+            this.userDialog.noteSaving = true;
+        }
+        return API.saveNote({
+            targetUserId: userId,
+            note: ''
+        });
+    };
+
     $app = new Vue($app);
     window.$app = $app;
 })();

html/src/index.pug

@@ -1068,6 +1068,14 @@ html
                             span.sub-header Width
                             div.options-container-item
                                 el-slider(v-model="asideWidth" @input="setAsideWidth" :show-tooltip="false" :marks="{236: ''}" :min="141" :max="500" style="width:300px")
+                        div.options-container
+                            span.header User Dialog
+                            div.options-container-item
+                                span.name Hide VRChat Notes
+                                el-switch(v-model="hideUserNotes" @change="saveUserDialogOption")
+                            div.options-container-item
+                                span.name Hide VRCX Memos
+                                el-switch(v-model="hideUserMemos" @change="saveUserDialogOption")
                         div.options-container
                             span.header User Colours
                             div.options-container-item
@@ -1385,7 +1393,7 @@ html
                                 .avatar(:class="userStatusClass(friend.ref, friend.pendingOffline)")
                                     img(v-lazy="userImage(friend.ref)")
                                 .detail
-                                    span.name(v-if="friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
+                                    span.name(v-if="!hideUserMemos && friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
                                     span.name(v-else v-text="friend.ref.displayName" :style="{'color':friend.ref.$userColour}")
                                     span.extra(v-if="friend.pendingOffline") #[i.el-icon-warning-outline] Pending Offline
                                     location.extra(v-else :location="friend.ref.location" :traveling="friend.ref.travelingToLocation" :link="false")
@@ -1401,7 +1409,7 @@ html
                                 .avatar(:class="userStatusClass(friend.ref, friend.pendingOffline)")
                                     img(v-lazy="userImage(friend.ref)")
                                 .detail
-                                    span.name(v-if="friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
+                                    span.name(v-if="!hideUserMemos && friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
                                     span.name(v-else v-text="friend.ref.displayName" :style="{'color':friend.ref.$userColour}")
                                     span.extra(v-if="friend.pendingOffline") #[i.el-icon-warning-outline] Pending Offline
                                     location.extra(v-else :location="friend.ref.location" :traveling="friend.ref.travelingToLocation" :link="false")
@@ -1417,7 +1425,7 @@ html
                                 .avatar
                                     img(v-lazy="userImage(friend.ref)")
                                 .detail
-                                    span.name(v-if="friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
+                                    span.name(v-if="!hideUserMemos && friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
                                     span.name(v-else v-text="friend.ref.displayName" :style="{'color':friend.ref.$userColour}")
                                     span.extra(v-text="friend.ref.statusDescription" :link="false")
                             template(v-else)
@@ -1432,7 +1440,7 @@ html
                                 .avatar
                                     img(v-lazy="userImage(friend.ref)")
                                 .detail
-                                    span.name(v-if="friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
+                                    span.name(v-if="!hideUserMemos && friend.$nickName" :style="{'color':friend.ref.$userColour}") {{ friend.ref.displayName }} ({{ friend.$nickName }})
                                     span.name(v-else v-text="friend.ref.displayName" :style="{'color':friend.ref.$userColour}")
                                     span.extra(v-text="friend.ref.statusDescription")
                             template(v-else)
@@ -1569,14 +1577,18 @@ html
                                                 span.extra(v-else)
                                                     timer(:epoch="user.$location_at")
                             .x-friend-list(style="max-height:none")
-                                //- .x-friend-item(v-if="userDialog.id !== API.currentUser.id" style="width:100%;cursor:default")
+                                .x-friend-item(v-if="!hideUserNotes" style="width:100%;cursor:default")
-                                //-     .detail
-                                //-         span.name Note
-                                //-         span.extra(v-text="userDialog.ref.note")
-                                .x-friend-item(style="width:100%;cursor:default")
                                     .detail
                                         span.name Note
-                                        el-input.extra(v-model="userDialog.memo" type="textarea" :rows="2" :autosize="{ minRows: 1, maxRows: 20 }" placeholder="Click to add a note" size="mini" resize="none")
+                                        el-input(v-model="userDialog.note" type="textarea" maxlength="256" show-word-limit :rows="2" :autosize="{ minRows: 1, maxRows: 20 }" @change="checkNote(userDialog.ref, userDialog.note)" @input="cleanNote(userDialog.note)" placeholder="Click to add a note" size="mini" resize="none")
+                                        div(style="float:right")
+                                            i.el-icon-loading(v-if="userDialog.noteSaving" style="margin-left:5px")
+                                            i.el-icon-more-outline(v-else-if="userDialog.note !== userDialog.ref.note" style="margin-left:5px")
+                                            el-button(v-if="userDialog.note" type="text" icon="el-icon-delete" size="mini" @click="deleteNote(userDialog.id)" style="margin-left:5px")
+                                .x-friend-item(v-if="!hideUserMemos" style="width:100%;cursor:default")
+                                    .detail
+                                        span.name Memo
+                                        el-input.extra(v-model="userDialog.memo" type="textarea" :rows="2" :autosize="{ minRows: 1, maxRows: 20 }" placeholder="Click to add a memo" size="mini" resize="none")
                                 .x-friend-item(style="width:100%;cursor:default")
                                     .detail
                                         span.name(v-if="userDialog.id !== API.currentUser.id && userDialog.ref.profilePicOverride && userDialog.ref.currentAvatarImageUrl") Avatar Info Last Seen