Support for polls (can be created by room admins)

src/components/Chat.vue

@@ -73,9 +73,7 @@
         />
 
         <div
-          v-if="
-            !event.isRelation() && !event.isRedacted() && !event.isRedaction()
-          "
+          v-if="!event.isRelation() && !event.isRedacted() && !event.isRedaction()"
           :ref="event.getId()"
         >
           <div
@@ -303,6 +301,23 @@
               />
             </label>
           </v-col>
+
+          <v-col
+            v-if="!showRecorder && canCreatePoll"
+            ref="sendOptions"
+            class="input-area-button text-center flex-grow-0 flex-shrink-1"
+          >
+            <v-menu close-on-click>
+              <template v-slot:activator="{ on, attrs }">
+                <v-btn icon v-bind="attrs" v-on="on">
+                  <v-icon>more_vert</v-icon>
+                </v-btn>
+              </template>
+              <v-list>
+                <v-list-item @click="showCreatePollDialog = true"><v-list-item-title>{{ $t("poll_create.create_poll_menu_option") }}</v-list-item-title></v-list-item>
+              </v-list>
+            </v-menu>
+          </v-col>
         </v-row>
         <VoiceRecorder
           :micButtonRef="$refs.mic_button"
@@ -458,6 +473,11 @@
         </v-card-actions>
       </v-card>
     </v-dialog>
+
+    <CreatePollDialog
+      :show="showCreatePollDialog"
+      @close="showCreatePollDialog = false"
+    />
   </div>
 </template>
 
@@ -470,12 +490,14 @@ import MessageIncomingImage from "./messages/MessageIncomingImage.vue";
 import MessageIncomingAudio from "./messages/MessageIncomingAudio.vue";
 import MessageIncomingVideo from "./messages/MessageIncomingVideo.vue";
 import MessageIncomingSticker from "./messages/MessageIncomingSticker.vue";
+import MessageIncomingPoll from "./messages/MessageIncomingPoll.vue";
 import MessageOutgoingText from "./messages/MessageOutgoingText";
 import MessageOutgoingFile from "./messages/MessageOutgoingFile";
 import MessageOutgoingImage from "./messages/MessageOutgoingImage.vue";
 import MessageOutgoingAudio from "./messages/MessageOutgoingAudio.vue";
 import MessageOutgoingVideo from "./messages/MessageOutgoingVideo.vue";
 import MessageOutgoingSticker from "./messages/MessageOutgoingSticker.vue";
+import MessageOutgoingPoll from "./messages/MessageOutgoingPoll.vue";
 import ContactJoin from "./messages/ContactJoin.vue";
 import ContactLeave from "./messages/ContactLeave.vue";
 import ContactInvited from "./messages/ContactInvited.vue";
@@ -505,6 +527,8 @@ import stickers from "../plugins/stickers";
 import StickerPickerBottomSheet from "./StickerPickerBottomSheet";
 import BottomSheet from "./BottomSheet.vue";
 import ImageResize from "image-resize";
+import CreatePollDialog from "./CreatePollDialog.vue";
+
 const sizeOf = require("image-size");
 const dataUriToBuffer = require("data-uri-to-buffer");
 const prettyBytes = require("pretty-bytes");
@@ -555,6 +579,7 @@ export default {
     MessageOutgoingAudio,
     MessageOutgoingVideo,
     MessageOutgoingSticker,
+    MessageOutgoingPoll,
     ContactJoin,
     ContactLeave,
     ContactInvited,
@@ -580,6 +605,7 @@ export default {
     StickerPickerBottomSheet,
     BottomSheet,
     AvatarOperations,
+    CreatePollDialog
   },
 
   data() {
@@ -606,6 +632,7 @@ export default {
       replyToEvent: null,
       replyToImg: null,
       replyToContentType: null,
+      showCreatePollDialog: false,
       showNoRecordingAvailableDialog: false,
       showContextMenu: false,
       showContextMenuAnchor: null,
@@ -765,6 +792,12 @@ export default {
     },
     invitationCount() {
       return this.$matrix.invites.length;
+    },
+    canCreatePoll() {
+      // We say that if you can redact events, you are allowed to create polls.
+      const me = this.room && this.room.getMember(this.$matrix.currentUserId);
+      let isAdmin = me && this.room.currentState && this.room.currentState.hasSufficientPowerLevelFor("redact", me.powerLevel);
+      return isAdmin;
     }
   },
 
@@ -1133,6 +1166,14 @@ export default {
         case "m.room.encryption":
           return RoomEncrypted;
 
+        case "m.poll.start":
+        case "org.matrix.msc3381.poll.start":
+          if (event.getSender() != this.$matrix.currentUserId) {
+            return MessageIncomingPoll;
+          } else {
+            return MessageOutgoingPoll;
+          }
+
         case "im.keanu.room_deletion_notice": {
           // Custom event for notice 30 seconds before a room is deleted/purged.
           const deletionNotices = this.room.currentState.getStateEvents(
@@ -1815,7 +1856,7 @@ export default {
     },
     onInvitationsClick() {
        this.$navigation.push({ name: "Home" }, -1);
-    }
+    },
   },
 };
 </script>