From 639309ed92a1ad87041c7a34c9a6d9042bc464e6 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Tue, 17 Aug 2021 10:28:03 +0200
Subject: [PATCH] Add some visio services to preconfigured metadata
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
js/src/components/Event/EventMetadataList.vue | 3 +
.../Event/Integrations/JitsiMeet.vue | 38 ++++++++++++
js/src/i18n/en_US.json | 13 ++++-
js/src/i18n/fr_FR.json | 13 ++++-
js/src/services/EventMetadata.ts | 58 +++++++++++++++++++
js/src/types/enums.ts | 1 +
js/src/views/Event/Event.vue | 5 ++
7 files changed, 129 insertions(+), 2 deletions(-)
create mode 100644 js/src/components/Event/Integrations/JitsiMeet.vue
diff --git a/js/src/components/Event/EventMetadataList.vue b/js/src/components/Event/EventMetadataList.vue
index b5779def6..b6b863e77 100644
--- a/js/src/components/Event/EventMetadataList.vue
+++ b/js/src/components/Event/EventMetadataList.vue
@@ -140,6 +140,9 @@ export default class EventMetadataList extends Vue {
[EventMetadataCategories.SOCIAL]: this.$t("Social") as string,
[EventMetadataCategories.DETAILS]: this.$t("Details") as string,
[EventMetadataCategories.BOOKING]: this.$t("Booking") as string,
+ [EventMetadataCategories.VIDEO_CONFERENCE]: this.$t(
+ "Video Conference"
+ ) as string,
};
get filteredDataArray(): GroupedIEventMetadata {
diff --git a/js/src/components/Event/Integrations/JitsiMeet.vue b/js/src/components/Event/Integrations/JitsiMeet.vue
new file mode 100644
index 000000000..2bee04aab
--- /dev/null
+++ b/js/src/components/Event/Integrations/JitsiMeet.vue
@@ -0,0 +1,38 @@
+<template>
+ <div class="jitsi-meet">
+ <div class="jitsi-meet-video" v-if="metadata">
+ <iframe
+ allow="camera; microphone; fullscreen; display-capture; autoplay"
+ :src="metadata.value"
+ style="height: 100%; width: 100%; border: 0px"
+ ></iframe>
+ </div>
+ </div>
+</template>
+<script lang="ts">
+import { IEventMetadataDescription } from "@/types/event-metadata";
+import { PropType } from "vue";
+import { Component, Prop, Vue } from "vue-property-decorator";
+
+@Component
+export default class JitsiMeetIntegration extends Vue {
+ @Prop({ type: Object as PropType<IEventMetadataDescription>, required: true })
+ metadata!: IEventMetadataDescription;
+}
+</script>
+<style lang="scss" scoped>
+.jitsi-meet {
+ .jitsi-meet-video {
+ padding-top: 56.25%;
+ position: relative;
+ height: 0;
+
+ iframe {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ }
+ }
+}
+</style>
diff --git a/js/src/i18n/en_US.json b/js/src/i18n/en_US.json
index faef2ada9..b0196daf8 100644
--- a/js/src/i18n/en_US.json
+++ b/js/src/i18n/en_US.json
@@ -1128,5 +1128,16 @@
"Redirecting in progress…": "Redirecting in progress…",
"Zoom in": "Zoom in",
"Zoom out": "Zoom out",
- "Show me where I am": "Show me where I am"
+ "Show me where I am": "Show me where I am",
+ "Video Conference": "Video Conference",
+ "Jisti Meet": "Jisti Meet",
+ "The Jitsi Meet video teleconference URL": "The Jitsi Meet video teleconference URL",
+ "Zoom": "Zoom",
+ "The Zoom video teleconference URL": "The Zoom video teleconference URL",
+ "Microsoft Teams": "Microsoft Teams",
+ "The Microsoft Teams video teleconference URL": "The Microsoft Teams video teleconference URL",
+ "Google Meet": "Google Meet",
+ "The Google Meet video teleconference URL": "The Google Meet video teleconference URL",
+ "Big Blue Button": "Big Blue Button",
+ "The Big Blue Button video teleconference URL": "The Big Blue Button video teleconference URL"
}
diff --git a/js/src/i18n/fr_FR.json b/js/src/i18n/fr_FR.json
index e7f3473da..76ee8772e 100644
--- a/js/src/i18n/fr_FR.json
+++ b/js/src/i18n/fr_FR.json
@@ -1219,5 +1219,16 @@
"Redirecting in progress…": "Redirection en cours…",
"Zoom in": "Zoomer",
"Zoom out": "Dézoomer",
- "Show me where I am": "Afficher ma position"
+ "Show me where I am": "Afficher ma position",
+ "Video Conference": "Visio-conférence",
+ "Jisti Meet": "Jitsi Meet",
+ "The Jitsi Meet video teleconference URL": "L'URL de visio-conférence Jitsi Meet",
+ "Zoom": "Zoom",
+ "The Zoom video teleconference URL": "L'URL de visio-conférence Zoom",
+ "Microsoft Teams": "Microsoft Teams",
+ "The Microsoft Teams video teleconference URL": "L'URL de visio-conférence Microsoft Teams",
+ "Google Meet": "Google Meet",
+ "The Google Meet video teleconference URL": "L'URL de visio-conférence Google Meet",
+ "Big Blue Button": "Big Blue Button",
+ "The Big Blue Button video teleconference URL": "L'URL de visio-conférence Big Blue Button"
}
diff --git a/js/src/services/EventMetadata.ts b/js/src/services/EventMetadata.ts
index a6b899d85..c964f9d8d 100644
--- a/js/src/services/EventMetadata.ts
+++ b/js/src/services/EventMetadata.ts
@@ -209,4 +209,62 @@ export const eventMetaDataList: IEventMetadataDescription[] = [
keyType: EventMetadataKeyType.URL,
category: EventMetadataCategories.DETAILS,
},
+ {
+ icon: "webcam",
+ key: "mz:visio:jitsi_meet",
+ label: i18n.t("Jisti Meet") as string,
+ description: i18n.t("The Jitsi Meet video teleconference URL") as string,
+ value: "",
+ type: EventMetadataType.STRING,
+ keyType: EventMetadataKeyType.URL,
+ category: EventMetadataCategories.VIDEO_CONFERENCE,
+ placeholder: "https://meet.jit.si/AFewWords",
+ },
+ {
+ icon: "webcam",
+ key: "mz:visio:zoom",
+ label: i18n.t("Zoom") as string,
+ description: i18n.t("The Zoom video teleconference URL") as string,
+ value: "",
+ type: EventMetadataType.STRING,
+ keyType: EventMetadataKeyType.URL,
+ category: EventMetadataCategories.VIDEO_CONFERENCE,
+ pattern: /https:\/\/.*\.?zoom.us\/.*/,
+ },
+ {
+ icon: "microsoft-teams",
+ key: "mz:visio:microsoft_teams",
+ label: i18n.t("Microsoft Teams") as string,
+ description: i18n.t(
+ "The Microsoft Teams video teleconference URL"
+ ) as string,
+ value: "",
+ type: EventMetadataType.STRING,
+ keyType: EventMetadataKeyType.URL,
+ category: EventMetadataCategories.VIDEO_CONFERENCE,
+ pattern: /https:\/\/teams\.live\.com\/meet\/.+/,
+ },
+ {
+ icon: "google-hangouts",
+ key: "mz:visio:google_meet",
+ label: i18n.t("Google Meet") as string,
+ description: i18n.t("The Google Meet video teleconference URL") as string,
+ value: "",
+ type: EventMetadataType.STRING,
+ keyType: EventMetadataKeyType.URL,
+ category: EventMetadataCategories.VIDEO_CONFERENCE,
+ pattern: /https:\/\/meet\.google\.com\/.+/,
+ },
+ {
+ icon: "webcam",
+ key: "mz:visio:big_blue_button",
+ label: i18n.t("Big Blue Button") as string,
+ description: i18n.t(
+ "The Big Blue Button video teleconference URL"
+ ) as string,
+ value: "",
+ type: EventMetadataType.STRING,
+ keyType: EventMetadataKeyType.URL,
+ category: EventMetadataCategories.VIDEO_CONFERENCE,
+ },
];
diff --git a/js/src/types/enums.ts b/js/src/types/enums.ts
index b5c738b7c..34049388b 100644
--- a/js/src/types/enums.ts
+++ b/js/src/types/enums.ts
@@ -274,4 +274,5 @@ export enum EventMetadataCategories {
TOOLS = "TOOLS",
DETAILS = "DETAILS",
BOOKING = "BOOKING",
+ VIDEO_CONFERENCE = "VIDEO_CONFERENCE",
}
diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue
index 5ac44b715..74eab15a4 100755
--- a/js/src/views/Event/Event.vue
+++ b/js/src/views/Event/Event.vue
@@ -533,6 +533,10 @@ import { eventMetaDataList } from "../../services/EventMetadata";
import(
/* webpackChunkName: "YouTubeIntegration" */ "../../components/Event/Integrations/YouTube.vue"
),
+ "integration-jitsi-meet": () =>
+ import(
+ /* webpackChunkName: "JitsiMeetIntegration" */ "../../components/Event/Integrations/JitsiMeet.vue"
+ ),
},
apollo: {
event: {
@@ -1087,6 +1091,7 @@ export default class Event extends EventMixin {
"mz:live:twitch:url": "integration-twitch",
"mz:live:peertube:url": "integration-peertube",
"mz:live:youtube:url": "integration-youtube",
+ "mz:visio:jitsi_meet": "integration-jitsi-meet",
};
get integrations(): Record<string, IEventMetadataDescription> {