Invite and Invite Request

html/src/app.js

@@ -6927,13 +6927,26 @@ speechSynthesis.getVoices();
             this.logout();
         } else if (command === 'Request Invite') {
             API.sendRequestInvite({
-                details: {
+                platform: 'standalonewindows'
-                    platform: 'standalonewindows'
-                }
             }, D.id).then((args) => {
                 this.$message('Request invite sent');
                 return args;
             });
+        } else if (command === 'Invite Message') {
+            var L = API.parseLocation(this.lastLocation);
+            API.getCachedWorld({
+                worldId: L.worldId
+            }).then((args) => {
+                this.showSendInviteDialog({
+                    instanceId: this.lastLocation,
+                    worldId: this.lastLocation,
+                    worldName: args.ref.name
+                }, D.id);
+            });
+        } else if (command === 'Request Invite Message') {
+            this.showSendInviteRequestDialog({
+                platform: 'standalonewindows'
+            }, D.id);
         } else if (command === 'Invite') {
             var L = API.parseLocation(this.lastLocation);
             API.getCachedWorld({
@@ -8234,7 +8247,7 @@ speechSynthesis.getVoices();
 
     $app.data.editInviteMessageDialog = {
         visible: false,
-        inviteMessage: '',
+        inviteMessage: {},
         messageType: '',
         newMessage: ''
     };
@@ -8260,10 +8273,7 @@ speechSynthesis.getVoices();
             API.editInviteMessage(params, messageType, slot).catch((err) => {
                 throw err;
             }).then((args) => {
-                this.$message({
+                this.$message('Invite message updated');
-                    message: 'Invite message updated',
-                    type: 'success'
-                });
                 return args;
             }).finally(() => {
                 API.refreshInviteMessageTableData(messageType);
@@ -8279,7 +8289,7 @@ speechSynthesis.getVoices();
 
     $app.data.editAndSendInviteResponseDialog = {
         visible: false,
-        inviteMessage: '',
+        inviteMessage: {},
         messageType: '',
         newMessage: ''
     };
@@ -8306,10 +8316,6 @@ speechSynthesis.getVoices();
             await API.editInviteMessage(params, messageType, slot).catch((err) => {
                 throw err;
             }).then((args) => {
-                this.$message({
-                    message: 'Invite message updated',
-                    type: 'success'
-                });
                 return args;
             });
             await API.refreshInviteMessageTableData(messageType).catch((err) => {
@@ -8320,7 +8326,9 @@ speechSynthesis.getVoices();
                         message: 'VRChat API didn\'t update message, try again',
                         type: 'error'
                     });
-                    throw 'VRChat API didn\'t update message, try again';
+                    throw new Error('VRChat API didn\'t update message, try again');
+                } else {
+                    this.$message('Invite message updated');
                 }
             });
         }
@@ -8331,17 +8339,12 @@ speechSynthesis.getVoices();
             rsvp: true
         };
         API.sendInviteResponse(params, I.invite.id).catch((err) => {
-            D.visible = false;
             throw err;
         }).then((args) => {
             API.hideNotification({
                 notificationId: I.invite.id
             });
-            this.$message({
+            this.$message('Invite response message sent');
-                message: 'Invite response message sent',
-                type: 'success'
-            });
-            D.visible = false;
             this.sendInviteResponseDialogVisible = false;
             this.sendInviteRequestResponseDialogVisible = false;
             return args;
@@ -8354,8 +8357,8 @@ speechSynthesis.getVoices();
 
     $app.data.sendInviteResponseDialog = {
         message: '',
-        invite: '',
+        messageSlot: 0,
-        messageSlot: ''
+        invite: {}
     };
 
     $app.data.sendInviteResponseDialogVisible = false;
@@ -8407,10 +8410,7 @@ speechSynthesis.getVoices();
             API.hideNotification({
                 notificationId: D.invite.id
             });
-            this.$message({
+            this.$message('Invite response message sent');
-                message: 'Invite response message sent',
-                type: 'success'
-            });
             return args;
         });
         this.sendInviteResponseDialogVisible = false;
@@ -8455,6 +8455,170 @@ speechSynthesis.getVoices();
         this.sendInviteRequestResponseDialogVisible = true;
     };
 
+    // App: Invite Message Dialog
+
+    $app.data.editAndSendInviteDialog = {
+        visible: false,
+        messageType: '',
+        newMessage: '',
+        inviteMessage: {}
+    };
+
+    $app.methods.showEditAndSendInviteDialog = function (messageType, inviteMessage) {
+        this.$nextTick(() => adjustDialogZ(this.$refs.editAndSendInviteDialog.$el));
+        this.editAndSendInviteDialog = {
+            newMessage: inviteMessage.message,
+            visible: true,
+            messageType,
+            inviteMessage
+        };
+    };
+
+    $app.methods.saveEditAndSendInvite = async function () {
+        var D = this.editAndSendInviteDialog;
+        D.visible = false;
+        var messageType = D.messageType;
+        var slot = D.inviteMessage.slot;
+        if (D.inviteMessage.message !== D.newMessage) {
+            var params = {
+                message: D.newMessage
+            };
+            await API.editInviteMessage(params, messageType, slot).catch((err) => {
+                throw err;
+            }).then((args) => {
+                return args;
+            });
+            await API.refreshInviteMessageTableData(messageType).catch((err) => {
+                throw err;
+            }).then((args) => {
+                if (args.json[slot].message !== D.newMessage) {
+                    this.$message({
+                        message: 'VRChat API didn\'t update message, try again',
+                        type: 'error'
+                    });
+                    throw new Error('VRChat API didn\'t update message, try again');
+                } else {
+                    this.$message('Invite message updated');
+                }
+            });
+        }
+        var I = this.sendInviteDialog;
+        if (I.messageType === 'invite') {
+            I.params.messageSlot = slot;
+            API.sendInvite(I.params, I.userId).catch((err) => {
+                throw err;
+            }).then((args) => {
+                this.$message('Invite message sent');
+                return args;
+            });
+        } else if (I.messageType === 'requestInvite') {
+            I.params.requestSlot = slot;
+            API.sendRequestInvite(I.params, I.userId).catch((err) => {
+                throw err;
+            }).then((args) => {
+                this.$message('Request invite message sent');
+                return args;
+            });
+        }
+    };
+
+    $app.methods.cancelEditAndSendInvite = function () {
+        this.editAndSendInviteDialog.visible = false;
+    };
+
+    $app.data.sendInviteDialog = {
+        message: '',
+        messageSlot: 0,
+        userId: '',
+        messageType: '',
+        params: {}
+    };
+
+    $app.data.sendInviteDialogVisible = false;
+
+    $app.data.sendInviteConfirmDialog = {
+        visible: false
+    };
+
+    API.$on('LOGIN', function () {
+        $app.sendInviteDialogVisible = false;
+        $app.sendInviteConfirmDialog.visible = false;
+    });
+
+    $app.methods.showSendInviteDialog = function (params, userId) {
+        this.sendInviteDialog = {
+            params,
+            userId,
+            messageType: 'invite'
+        };
+        API.refreshInviteMessageTableData('message');
+        this.$nextTick(() => adjustDialogZ(this.$refs.sendInviteDialog.$el));
+        this.sendInviteDialogVisible = true;
+    };
+
+    $app.methods.showSendInviteConfirmDialog = function (val) {
+        if (this.editAndSendInviteDialog.visible === true || val === null) {
+            return;
+        }
+        this.$nextTick(() => adjustDialogZ(this.$refs.sendInviteConfirmDialog.$el));
+        this.sendInviteConfirmDialog.visible = true;
+        this.sendInviteDialog.messageSlot = val.slot;
+    };
+
+    $app.methods.cancelSendInvite = function () {
+        this.sendInviteDialogVisible = false;
+    };
+
+    $app.methods.cancelInviteConfirm = function () {
+        this.sendInviteConfirmDialog.visible = false;
+    };
+
+    $app.methods.sendInviteConfirm = function () {
+        var D = this.sendInviteDialog;
+        if (D.messageType === 'invite') {
+            D.params.messageSlot = D.messageSlot;
+            API.sendInvite(D.params, D.userId).catch((err) => {
+                throw err;
+            }).then((args) => {
+                this.$message('Invite message sent');
+                return args;
+            });
+        } else if (D.messageType === 'requestInvite') {
+            D.params.requestSlot = D.messageSlot;
+            API.sendRequestInvite(D.params, D.userId).then((args) => {
+                this.$message('Request invite message sent');
+                return args;
+            });
+        }
+        this.sendInviteDialogVisible = false;
+        this.sendInviteRequestDialogVisible = false;
+        this.sendInviteConfirmDialog.visible = false;
+    };
+
+    // App: Invite Request Message Dialog
+
+    $app.data.sendInviteRequestDialogVisible = false;
+
+    $app.methods.cancelSendInviteRequest = function () {
+        this.sendInviteRequestDialogVisible = false;
+    };
+
+    API.$on('LOGIN', function () {
+        $app.sendInviteRequestDialogVisible = false;
+        $app.showSendInviteConfirmDialog.visible = false;
+    });
+
+    $app.methods.showSendInviteRequestDialog = function (params, userId) {
+        this.sendInviteDialog = {
+            params,
+            userId,
+            messageType: 'requestInvite'
+        };
+        API.refreshInviteMessageTableData('request');
+        this.$nextTick(() => adjustDialogZ(this.$refs.sendInviteRequestDialog.$el));
+        this.sendInviteRequestDialogVisible = true;
+    };
+
     $app = new Vue($app);
     window.$app = $app;
 }());

html/src/index.pug

@@ -401,14 +401,16 @@ html
                         el-table-column(label="Message" prop="message")
                             template(v-once #default="scope")
                                 span(v-if="scope.row.message" v-text="scope.row.message")
-                                span(v-else-if='scope.row.details.responseMessage' v-text="scope.row.details.responseMessage")
                                 span(v-else-if='scope.row.details.inviteMessage' v-text="scope.row.details.inviteMessage")
+                                span(v-else-if='scope.row.details.requestMessage' v-text="scope.row.details.requestMessage")
+                                span(v-else-if='scope.row.details.responseMessage' v-text="scope.row.details.responseMessage")
                         el-table-column(label="Action" width="80" align="right")
                             template(v-once #default="scope")
-                                el-button(v-if="scope.row.type === 'friendRequest'" type="text" icon="el-icon-check" size="mini" @click="acceptNotification(scope.row)")
+                                template(v-if="scope.row.senderUserId !== API.currentUser.id")
-                                el-button(v-else-if="scope.row.type === 'invite'" type="text" icon="el-icon-chat-line-square" size="mini" @click="showSendInviteResponseDialog(scope.row)")
+                                    el-button(v-if="scope.row.type === 'friendRequest'" type="text" icon="el-icon-check" size="mini" @click="acceptNotification(scope.row)")
-                                el-button(v-else-if="scope.row.type === 'requestInvite'" type="text" icon="el-icon-chat-line-square" size="mini" @click="showSendInviteRequestResponseDialog(scope.row)")
+                                    el-button(v-else-if="scope.row.type === 'invite'" type="text" icon="el-icon-chat-line-square" size="mini" @click="showSendInviteResponseDialog(scope.row)")
-                                el-button(type="text" icon="el-icon-close" size="mini" @click="hideNotification(scope.row)")
+                                    el-button(v-else-if="scope.row.type === 'requestInvite'" type="text" icon="el-icon-chat-line-square" size="mini" @click="showSendInviteRequestResponseDialog(scope.row)")
+                                    el-button(type="text" icon="el-icon-close" size="mini" @click="hideNotification(scope.row)")
 
                 //- profile
                 .x-container(v-show="$refs.menu && $refs.menu.activeIndex === 'profile'")
@@ -891,9 +893,10 @@ html
                                             template(v-else)
                                                 template(v-if="lastLocation && isGameRunning")
                                                     el-dropdown-item(icon="el-icon-message" command="Invite") Invite
+                                                    el-dropdown-item(icon="el-icon-message" command="Invite Message") Invite With Message
                                                 template(v-if="userDialog.isFriend")
                                                     el-dropdown-item(icon="el-icon-postcard" command="Request Invite") Request Invite
-                                                    //- el-dropdown-item(icon="el-icon-message" command="Message") Message
+                                                    el-dropdown-item(icon="el-icon-postcard" command="Request Invite Message") Request Invite With Message
                                                 template(v-else-if="userDialog.incomingRequest")
                                                     el-dropdown-item(icon="el-icon-check" command="Accept Friend Request") Accept Friend Request
                                                     el-dropdown-item(icon="el-icon-close" command="Decline Friend Request") Decline Friend Request
@@ -1479,52 +1482,99 @@ html
                         el-button(type="small" @click="cancelEditInviteMessage") Cancel
                         el-button(type="primary" size="small" @click="saveEditInviteMessage") Save
                         
-            //- dialog: Edit And Send Invite Response Message
+                //- dialog: Edit And Send Invite Response Message
-            el-dialog.x-dialog(ref="editAndSendInviteResponseDialog" :visible.sync="editAndSendInviteResponseDialog.visible" title="Edit and Send Invite Message" width="400px")
+                el-dialog.x-dialog(ref="editAndSendInviteResponseDialog" :visible.sync="editAndSendInviteResponseDialog.visible" title="Edit and Send Invite Message" width="400px")
-                div(style='font-size:12px')
+                    div(style='font-size:12px')
-                    span 1 hour edit cool down time.
+                        span 1 hour edit cool down time.
-                el-input(type="textarea" v-model="editAndSendInviteResponseDialog.newMessage" size="mini" maxlength="64" show-word-limit :autosize="{ minRows:2, maxRows:5 }" placeholder="" style="margin-top:10px")
+                    el-input(type="textarea" v-model="editAndSendInviteResponseDialog.newMessage" size="mini" maxlength="64" show-word-limit :autosize="{ minRows:2, maxRows:5 }" placeholder="" style="margin-top:10px")
-                template(#footer)
+                    template(#footer)
-                    el-button(type="small" @click="cancelEditAndSendInviteResponse") Cancel
+                        el-button(type="small" @click="cancelEditAndSendInviteResponse") Cancel
-                    el-button(type="primary" size="small" @click="saveEditAndSendInviteResponse") Send
+                        el-button(type="primary" size="small" @click="saveEditAndSendInviteResponse") Send
                         
-            //- dialog Table: Send Invite Response Message
+                //- dialog Table: Send Invite Response Message
-            el-dialog.x-dialog(ref="sendInviteResponseDialog" :visible.sync="sendInviteResponseDialogVisible" title="Send Invite Response Message" width="800px")
+                el-dialog.x-dialog(ref="sendInviteResponseDialog" :visible.sync="sendInviteResponseDialogVisible" title="Send Invite Response Message" width="800px")
-                data-tables(v-bind="inviteResponseMessageTable" @current-change="showSendInviteResponseConfirmDialog" style="margin-top:10px;cursor:pointer")
+                    data-tables(v-bind="inviteResponseMessageTable" @row-click="showSendInviteResponseConfirmDialog" style="margin-top:10px;cursor:pointer")
-                    el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
+                        el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
-                    el-table-column(label="Message" prop="message")
+                        el-table-column(label="Message" prop="message")
-                    el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
+                        el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
-                        template(v-once #default="scope")
+                            template(v-once #default="scope")
-                            countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
+                                countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
-                    el-table-column(label="Action" width="60" align="right")
+                        el-table-column(label="Action" width="60" align="right")
-                        template(v-once #default="scope")
+                            template(v-once #default="scope")
-                            el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteResponseDialog('response', scope.row)")
+                                el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteResponseDialog('response', scope.row)")
-                template(#footer)
+                    template(#footer)
-                    el-button(type="small" @click="API.refreshInviteMessageTableData('response')") Refresh
+                        el-button(type="small" @click="cancelSendInviteResponse") Cancel
-                    el-button(type="small" @click="cancelSendInviteResponse") Cancel
+                        el-button(type="small" @click="API.refreshInviteMessageTableData('response')") Refresh
                         
-            //- dialog Table: Send Invite Response Message
+                //- dialog Table: Send Invite Request Response Message
-            el-dialog.x-dialog(ref="sendInviteRequestResponseDialog" :visible.sync="sendInviteRequestResponseDialogVisible" title="Send Invite Request Response Message" width="800px")
+                el-dialog.x-dialog(ref="sendInviteRequestResponseDialog" :visible.sync="sendInviteRequestResponseDialogVisible" title="Send Invite Request Response Message" width="800px")
-                data-tables(v-bind="inviteRequestResponseMessageTable" @current-change="showSendInviteResponseConfirmDialog" style="margin-top:10px;cursor:pointer")
+                    data-tables(v-bind="inviteRequestResponseMessageTable" @row-click="showSendInviteResponseConfirmDialog" style="margin-top:10px;cursor:pointer")
-                    el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
+                        el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
-                    el-table-column(label="Message" prop="message")
+                        el-table-column(label="Message" prop="message")
-                    el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
+                        el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
-                        template(v-once #default="scope")
+                            template(v-once #default="scope")
-                            countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
+                                countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
-                    el-table-column(label="Action" width="60" align="right")
+                        el-table-column(label="Action" width="60" align="right")
-                        template(v-once #default="scope")
+                            template(v-once #default="scope")
-                            el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteResponseDialog('requestResponse', scope.row)")
+                                el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteResponseDialog('requestResponse', scope.row)")
-                template(#footer)
+                    template(#footer)
-                    el-button(type="small" @click="API.refreshInviteMessageTableData('requestResponse')") Refresh
+                        el-button(type="small" @click="cancelSendInviteRequestResponse") Cancel
-                    el-button(type="small" @click="cancelSendInviteRequestResponse") Cancel
+                        el-button(type="small" @click="API.refreshInviteMessageTableData('requestResponse')") Refresh
 
-            //- dialog: Send Invite Message Confirm
+                //- dialog: Send Invite Response Message Confirm
-            el-dialog.x-dialog(ref="sendInviteResponseConfirmDialog" :visible.sync="sendInviteResponseConfirmDialog.visible" title="Send Invite Message" width="400px")
+                el-dialog.x-dialog(ref="sendInviteResponseConfirmDialog" :visible.sync="sendInviteResponseConfirmDialog.visible" title="Send Invite Response Message" width="400px")
-                div(style='font-size:12px')
+                    div(style='font-size:12px')
-                    span Are you sure you want to send?
+                        span Are you sure you want to send?
-                template(#footer)
+                    template(#footer)
-                    el-button(type="small" @click="cancelInviteResponseConfirm") Cancel
+                        el-button(type="small" @click="cancelInviteResponseConfirm") Cancel
-                    el-button(type="primary" size="small" @click="sendInviteResponseConfirm") Confirm
+                        el-button(type="primary" size="small" @click="sendInviteResponseConfirm") Confirm
+                        
+                //- dialog Table: Send Invite Message
+                el-dialog.x-dialog(ref="sendInviteDialog" :visible.sync="sendInviteDialogVisible" title="Send Invite Message" width="800px")
+                    data-tables(v-bind="inviteMessageTable" @row-click="showSendInviteConfirmDialog" style="margin-top:10px;cursor:pointer")
+                        el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
+                        el-table-column(label="Message" prop="message")
+                        el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
+                            template(v-once #default="scope")
+                                countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
+                        el-table-column(label="Action" width="60" align="right")
+                            template(v-once #default="scope")
+                                el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteDialog('message', scope.row)")
+                    template(#footer)
+                        el-button(type="small" @click="cancelSendInvite") Cancel
+                        el-button(type="small" @click="API.refreshInviteMessageTableData('message')") Refresh
+                        
+                //- dialog Table: Send Invite Request Message
+                el-dialog.x-dialog(ref="sendInviteRequestDialog" :visible.sync="sendInviteRequestDialogVisible" title="Send Invite Request Message" width="800px")
+                    data-tables(v-bind="inviteRequestMessageTable" @row-click="showSendInviteConfirmDialog" style="margin-top:10px;cursor:pointer")
+                        el-table-column(label="Slot" prop="slot" sortable="custom" width="70")
+                        el-table-column(label="Message" prop="message")
+                        el-table-column(label="Cool Down" prop="updatedAt" sortable="custom" width="110" align="right")
+                            template(v-once #default="scope")
+                                countdown-timer(:datetime="scope.row.updatedAt" :hours="1")
+                        el-table-column(label="Action" width="60" align="right")
+                            template(v-once #default="scope")
+                                el-button(type="text" icon="el-icon-edit" size="mini" @click="showEditAndSendInviteDialog('request', scope.row)")
+                    template(#footer)
+                        el-button(type="small" @click="cancelSendInviteRequest") Cancel
+                        el-button(type="small" @click="API.refreshInviteMessageTableData('request')") Refresh
+                        
+                //- dialog: Send Invite Message Confirm
+                el-dialog.x-dialog(ref="sendInviteConfirmDialog" :visible.sync="sendInviteConfirmDialog.visible" title="Send Invite Message" width="400px")
+                    div(style='font-size:12px')
+                        span Are you sure you want to send?
+                    template(#footer)
+                        el-button(type="small" @click="cancelInviteConfirm") Cancel
+                        el-button(type="primary" size="small" @click="sendInviteConfirm") Confirm
+                        
+                //- dialog: Edit And Send Invite Message
+                el-dialog.x-dialog(ref="editAndSendInviteDialog" :visible.sync="editAndSendInviteDialog.visible" title="Edit and Send Invite Message" width="400px")
+                    div(style='font-size:12px')
+                        span 1 hour edit cool down time.
+                    el-input(type="textarea" v-model="editAndSendInviteDialog.newMessage" size="mini" maxlength="64" show-word-limit :autosize="{ minRows:2, maxRows:5 }" placeholder="" style="margin-top:10px")
+                    template(#footer)
+                        el-button(type="small" @click="cancelEditAndSendInvite") Cancel
+                        el-button(type="primary" size="small" @click="saveEditAndSendInvite") Send
 
                 //- dialog: open source software notice
                 el-dialog.x-dialog(:visible.sync="ossDialog" title="Open Source Software Notice" width="650px")