@icvdeveloper/common-module 0.0.103 → 0.0.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/README.md +6 -6
  2. package/dist/module.json +1 -1
  3. package/dist/runtime/@types/components.d.ts +1 -0
  4. package/dist/runtime/assets/svg/answer.svg +14 -14
  5. package/dist/runtime/assets/svg/avatar.svg +1 -1
  6. package/dist/runtime/assets/svg/bell-icon.svg +3 -3
  7. package/dist/runtime/assets/svg/checkmark-icon.svg +1 -1
  8. package/dist/runtime/assets/svg/close-icon.svg +1 -1
  9. package/dist/runtime/assets/svg/icon-avatar.svg +1 -1
  10. package/dist/runtime/assets/svg/icon-chevron.svg +4 -4
  11. package/dist/runtime/assets/svg/icon-circle-plus.svg +1 -1
  12. package/dist/runtime/assets/svg/icon-close.svg +1 -1
  13. package/dist/runtime/assets/svg/icon-info.svg +2 -2
  14. package/dist/runtime/assets/svg/icon-new-window.svg +11 -11
  15. package/dist/runtime/assets/svg/icon-offline.svg +3 -3
  16. package/dist/runtime/assets/svg/icon-online.svg +3 -3
  17. package/dist/runtime/assets/svg/icon-person.svg +2 -2
  18. package/dist/runtime/assets/svg/icon-play.svg +2 -2
  19. package/dist/runtime/assets/svg/icon-star-filled.svg +29 -29
  20. package/dist/runtime/assets/svg/icon-star.svg +24 -24
  21. package/dist/runtime/assets/svg/icon-video-chat.svg +14 -14
  22. package/dist/runtime/assets/svg/icon-website.svg +2 -2
  23. package/dist/runtime/assets/svg/icon-zoom.svg +10 -10
  24. package/dist/runtime/assets/svg/notification-icon.svg +32 -32
  25. package/dist/runtime/assets/svg/offline-icon.svg +1 -1
  26. package/dist/runtime/assets/svg/online-icon.svg +3 -3
  27. package/dist/runtime/assets/svg/peer2peer.svg +3 -3
  28. package/dist/runtime/assets/svg/phone.svg +1 -1
  29. package/dist/runtime/assets/svg/plus-icon.svg +1 -1
  30. package/dist/runtime/assets/svg/red-icon.svg +3 -3
  31. package/dist/runtime/assets/svg/reject.svg +14 -14
  32. package/dist/runtime/assets/svg/search-icon.svg +3 -3
  33. package/dist/runtime/components/affiliates/AffiliatePage.vue +17 -17
  34. package/dist/runtime/components/agenda/AgendaList.vue +243 -243
  35. package/dist/runtime/components/agenda/AgendaTabbed.vue +309 -309
  36. package/dist/runtime/components/agenda/components/AgendaListAccordion.vue +53 -53
  37. package/dist/runtime/components/agenda/components/Calendar.vue +97 -89
  38. package/dist/runtime/components/agenda/components/InfoLink.vue +56 -56
  39. package/dist/runtime/components/agenda/components/PlayIcon.vue +49 -49
  40. package/dist/runtime/components/agenda/components/PresentationLink.vue +137 -137
  41. package/dist/runtime/components/agenda/components/Sponsor.vue +132 -132
  42. package/dist/runtime/components/auth/LoginFullWidth.vue +78 -78
  43. package/dist/runtime/components/auth/PasswordReset.vue +60 -60
  44. package/dist/runtime/components/auth/Registration.vue +27 -27
  45. package/dist/runtime/components/auth/Ucc.vue +124 -124
  46. package/dist/runtime/components/core/Accordion.vue +97 -97
  47. package/dist/runtime/components/core/CountdownTimer.vue +357 -357
  48. package/dist/runtime/components/core/DynamicHtml.vue +1 -1
  49. package/dist/runtime/components/core/Modal.vue +111 -111
  50. package/dist/runtime/components/core/Navbar.vue +154 -154
  51. package/dist/runtime/components/core/SvgIcon.vue +151 -151
  52. package/dist/runtime/components/core/ZoomModal.vue +37 -37
  53. package/dist/runtime/components/events/EventHeader.vue +133 -133
  54. package/dist/runtime/components/events/ListEvents.vue +551 -531
  55. package/dist/runtime/components/forms/AlertBox.vue +21 -21
  56. package/dist/runtime/components/forms/ErrorField.vue +17 -17
  57. package/dist/runtime/components/forms/Message.vue +27 -27
  58. package/dist/runtime/components/forms/SearchInput.vue +38 -38
  59. package/dist/runtime/components/forms/SupportForm.vue +112 -112
  60. package/dist/runtime/components/forms/SwitchInput.vue +42 -42
  61. package/dist/runtime/components/forms/TextArea.vue +26 -26
  62. package/dist/runtime/components/forms/TextInput.vue +28 -28
  63. package/dist/runtime/components/layouts/Accordion.vue +78 -78
  64. package/dist/runtime/components/media/ArchivePlayerAndContentContainer.vue +157 -157
  65. package/dist/runtime/components/media/ArchiveVideoPlayer.vue +186 -186
  66. package/dist/runtime/components/media/PlayerAndContentContainer.vue +175 -175
  67. package/dist/runtime/components/media/WebcastVideoPlayer.vue +167 -167
  68. package/dist/runtime/components/media/components/AgendaPanel.vue +43 -43
  69. package/dist/runtime/components/media/components/ArchiveMediaContainer.vue +91 -91
  70. package/dist/runtime/components/media/components/CeCreditNotification.vue +95 -95
  71. package/dist/runtime/components/media/components/ContentAccordion.vue +63 -63
  72. package/dist/runtime/components/media/components/ContentAccordion.vue.d.ts +3 -1
  73. package/dist/runtime/components/media/components/ContentArea.vue +158 -158
  74. package/dist/runtime/components/media/components/ContentTabs.vue +231 -231
  75. package/dist/runtime/components/media/components/DocumentsPanel.vue +31 -31
  76. package/dist/runtime/components/media/components/JsonApi.vue +31 -31
  77. package/dist/runtime/components/media/components/MediaContainer.vue +63 -63
  78. package/dist/runtime/components/media/components/OverviewPanel.vue +52 -52
  79. package/dist/runtime/components/media/components/PresentersPanel.vue +52 -52
  80. package/dist/runtime/components/media/components/SessionReporting.vue +93 -93
  81. package/dist/runtime/components/media/components/SponsorsPanel.vue +71 -71
  82. package/dist/runtime/components/media/components/WindowContent.vue +92 -92
  83. package/dist/runtime/components/media/components/WindowSlide.vue +72 -72
  84. package/dist/runtime/components/presenters/PresenterListing.vue +164 -164
  85. package/dist/runtime/components/presenters/PresenterModal.vue +223 -223
  86. package/dist/runtime/components/profile/Profile.vue +149 -149
  87. package/dist/runtime/components/profile/components/Sidebar.vue +27 -27
  88. package/dist/runtime/components/profile/components/SidebarNavItem.vue +39 -39
  89. package/dist/runtime/components/profile/tabs/Favorites.vue +21 -21
  90. package/dist/runtime/components/profile/tabs/GeneralInformation.vue +122 -122
  91. package/dist/runtime/components/profile/tabs/ProfileImage.vue +75 -75
  92. package/dist/runtime/components/support/FAQAccordion.vue +140 -140
  93. package/dist/runtime/composables/useEvents.d.ts +1 -1
  94. package/dist/runtime/composables/useEvents.mjs +2 -4
  95. package/package.json +1 -1
@@ -1,78 +1,78 @@
1
- <script lang="ts" setup>
2
- import { toRefs } from "vue";
3
- import { storeToRefs } from "pinia";
4
- import { Conference } from "../../models/conference";
5
- import { useLogin } from "../../composables/useLogin";
6
- import { useTemplateConfigsStore } from "../../store";
7
-
8
- interface Props {
9
- conference?: Conference | null;
10
- }
11
-
12
- const props = withDefaults(defineProps<Props>(), {
13
- conference: null,
14
- });
15
-
16
- const { conference } = toRefs<Props>(props);
17
-
18
- const { globalConfigValue } = storeToRefs(useTemplateConfigsStore());
19
-
20
- // Methods
21
- const { loginError, handleLogin, email, password, tooManySessions, showReset } =
22
- useLogin(conference);
23
- </script>
24
-
25
- <template>
26
- <div class="px-2">
27
- <div class="flex flex-1 flex-col text-center pt-8">
28
- <h1 class="mb-3 heading-color-3">Log In</h1>
29
- <CommonMessage
30
- v-if="loginError"
31
- :success="false"
32
- class="w-full max-w-xs mx-auto"
33
- >
34
- Invalid email or password.
35
- <br />
36
- <a
37
- v-if="!globalConfigValue('secure_site_access_enabled', false)"
38
- href="/login/email"
39
- >Forgot Your Password?</a
40
- >
41
- <a
42
- v-if="globalConfigValue('secure_site_access_enabled', false)"
43
- class="cursor-pointer"
44
- @click="showReset"
45
- >Forgot Your Password?</a
46
- >
47
- </CommonMessage>
48
-
49
- <div class="max-w-xs mx-auto" @keyup.enter="handleLogin()">
50
- <input
51
- v-model="email"
52
- type="email"
53
- placeholder="Email"
54
- class="form-input contrast-border mb-2"
55
- />
56
- <input
57
- v-model="password"
58
- type="password"
59
- placeholder="password"
60
- class="form-input contrast-border mb-5"
61
- />
62
- <button v-if="!tooManySessions" class="btn" @click="handleLogin()">
63
- Log In
64
- </button>
65
- <CommonMessage
66
- v-if="tooManySessions"
67
- :success="false"
68
- class="w-full max-w-xs mx-auto"
69
- >
70
- This user access is logged in on another device!
71
- </CommonMessage>
72
- <button v-if="tooManySessions" class="btn" @click="handleLogin(true)">
73
- Sign out other Device
74
- </button>
75
- </div>
76
- </div>
77
- </div>
78
- </template>
1
+ <script lang="ts" setup>
2
+ import { toRefs } from "vue";
3
+ import { storeToRefs } from "pinia";
4
+ import { Conference } from "../../models/conference";
5
+ import { useLogin } from "../../composables/useLogin";
6
+ import { useTemplateConfigsStore } from "../../store";
7
+
8
+ interface Props {
9
+ conference?: Conference | null;
10
+ }
11
+
12
+ const props = withDefaults(defineProps<Props>(), {
13
+ conference: null,
14
+ });
15
+
16
+ const { conference } = toRefs<Props>(props);
17
+
18
+ const { globalConfigValue } = storeToRefs(useTemplateConfigsStore());
19
+
20
+ // Methods
21
+ const { loginError, handleLogin, email, password, tooManySessions, showReset } =
22
+ useLogin(conference);
23
+ </script>
24
+
25
+ <template>
26
+ <div class="px-2">
27
+ <div class="flex flex-1 flex-col text-center pt-8">
28
+ <h1 class="mb-3 heading-color-3">Log In</h1>
29
+ <CommonMessage
30
+ v-if="loginError"
31
+ :success="false"
32
+ class="w-full max-w-xs mx-auto"
33
+ >
34
+ Invalid email or password.
35
+ <br />
36
+ <a
37
+ v-if="!globalConfigValue('secure_site_access_enabled', false)"
38
+ href="/login/email"
39
+ >Forgot Your Password?</a
40
+ >
41
+ <a
42
+ v-if="globalConfigValue('secure_site_access_enabled', false)"
43
+ class="cursor-pointer"
44
+ @click="showReset"
45
+ >Forgot Your Password?</a
46
+ >
47
+ </CommonMessage>
48
+
49
+ <div class="max-w-xs mx-auto" @keyup.enter="handleLogin()">
50
+ <input
51
+ v-model="email"
52
+ type="email"
53
+ placeholder="Email"
54
+ class="form-input contrast-border mb-2"
55
+ />
56
+ <input
57
+ v-model="password"
58
+ type="password"
59
+ placeholder="password"
60
+ class="form-input contrast-border mb-5"
61
+ />
62
+ <button v-if="!tooManySessions" class="btn" @click="handleLogin()">
63
+ Log In
64
+ </button>
65
+ <CommonMessage
66
+ v-if="tooManySessions"
67
+ :success="false"
68
+ class="w-full max-w-xs mx-auto"
69
+ >
70
+ This user access is logged in on another device!
71
+ </CommonMessage>
72
+ <button v-if="tooManySessions" class="btn" @click="handleLogin(true)">
73
+ Sign out other Device
74
+ </button>
75
+ </div>
76
+ </div>
77
+ </div>
78
+ </template>
@@ -1,60 +1,60 @@
1
- <script lang="ts" setup>
2
- import { ref, toRefs } from "vue";
3
- import { useAuthStore } from "../../store/auth";
4
-
5
- interface Props {
6
- isCentered?: boolean;
7
- }
8
-
9
- const props = withDefaults(defineProps<Props>(), {
10
- isCentered: false,
11
- });
12
-
13
- // data
14
- const { isCentered } = toRefs(props);
15
- const loading = ref<boolean>(false);
16
- const email = ref<string>("");
17
- const message = ref<null | string>(null);
18
- const errors = ref<Array<any>>([]);
19
-
20
- // methods
21
- const { passwordReset } = useAuthStore();
22
- const submitPasswordReset = () => {
23
- loading.value = true;
24
- message.value = null;
25
- errors.value = [];
26
- passwordReset(email.value)
27
- .then((response) => {
28
- message.value = response.data.message;
29
- })
30
- .catch((error) => {
31
- if (error.response.status === 422) {
32
- errors.value = error.response.data.errors;
33
- } else {
34
- errors.value = ["Error requesting password reset."];
35
- }
36
- })
37
- .finally(() => {
38
- loading.value = false;
39
- });
40
- };
41
- </script>
42
-
43
- <template>
44
- <div :class="isCentered ? 'w-full max-w-xs mx-auto' : ''">
45
- <div class="mb-4">Enter your email address to reset your password.</div>
46
- <CommonMessage v-if="message" :success="true">
47
- {{ message }}
48
- </CommonMessage>
49
- <CommonMessage v-if="errors.length > 0" :success="false">
50
- {{ errors[0] }}
51
- </CommonMessage>
52
- <div @keyup.enter="submitPasswordReset()">
53
- <CommonTextInput v-model="email" placeholder="Email" type="email" />
54
- <button class="btn my-2" @click="submitPasswordReset()">
55
- <span v-if="loading">Processing...</span>
56
- <span v-else>Send Password Reset Link</span>
57
- </button>
58
- </div>
59
- </div>
60
- </template>
1
+ <script lang="ts" setup>
2
+ import { ref, toRefs } from "vue";
3
+ import { useAuthStore } from "../../store/auth";
4
+
5
+ interface Props {
6
+ isCentered?: boolean;
7
+ }
8
+
9
+ const props = withDefaults(defineProps<Props>(), {
10
+ isCentered: false,
11
+ });
12
+
13
+ // data
14
+ const { isCentered } = toRefs(props);
15
+ const loading = ref<boolean>(false);
16
+ const email = ref<string>("");
17
+ const message = ref<null | string>(null);
18
+ const errors = ref<Array<any>>([]);
19
+
20
+ // methods
21
+ const { passwordReset } = useAuthStore();
22
+ const submitPasswordReset = () => {
23
+ loading.value = true;
24
+ message.value = null;
25
+ errors.value = [];
26
+ passwordReset(email.value)
27
+ .then((response) => {
28
+ message.value = response.data.message;
29
+ })
30
+ .catch((error) => {
31
+ if (error.response.status === 422) {
32
+ errors.value = error.response.data.errors;
33
+ } else {
34
+ errors.value = ["Error requesting password reset."];
35
+ }
36
+ })
37
+ .finally(() => {
38
+ loading.value = false;
39
+ });
40
+ };
41
+ </script>
42
+
43
+ <template>
44
+ <div :class="isCentered ? 'w-full max-w-xs mx-auto' : ''">
45
+ <div class="mb-4">Enter your email address to reset your password.</div>
46
+ <CommonMessage v-if="message" :success="true">
47
+ {{ message }}
48
+ </CommonMessage>
49
+ <CommonMessage v-if="errors.length > 0" :success="false">
50
+ {{ errors[0] }}
51
+ </CommonMessage>
52
+ <div @keyup.enter="submitPasswordReset()">
53
+ <CommonTextInput v-model="email" placeholder="Email" type="email" />
54
+ <button class="btn my-2" @click="submitPasswordReset()">
55
+ <span v-if="loading">Processing...</span>
56
+ <span v-else>Send Password Reset Link</span>
57
+ </button>
58
+ </div>
59
+ </div>
60
+ </template>
@@ -1,27 +1,27 @@
1
- <script lang="ts" setup>
2
- import { storeToRefs } from "pinia";
3
- import { useAuthStore } from "../../store/auth";
4
- import { useRegistration } from "../../composables/useRegistration";
5
-
6
- // data
7
- const { isLoggedIn } = storeToRefs(useAuthStore());
8
-
9
- // methods
10
- const { isTownhallRegistration } = useRegistration();
11
- const submitRegistration = () => {};
12
- </script>
13
-
14
- <template>
15
- <div v-if="isLoggedIn">
16
- <CommonMessage :success="false">Already logged in.</CommonMessage>
17
- </div>
18
- <div v-else class="px-2">
19
- <div class="flex flex-1 flex-col text-center pt-8">
20
- <h1 class="mb-3 heading-color-3">Log In</h1>
21
-
22
- <div class="w-full max-w-xs mx-auto pb-12">
23
- <form class="w-full" @submit.prevent="submitRegistration"></form>
24
- </div>
25
- </div>
26
- </div>
27
- </template>
1
+ <script lang="ts" setup>
2
+ import { storeToRefs } from "pinia";
3
+ import { useAuthStore } from "../../store/auth";
4
+ import { useRegistration } from "../../composables/useRegistration";
5
+
6
+ // data
7
+ const { isLoggedIn } = storeToRefs(useAuthStore());
8
+
9
+ // methods
10
+ const { isTownhallRegistration } = useRegistration();
11
+ const submitRegistration = () => {};
12
+ </script>
13
+
14
+ <template>
15
+ <div v-if="isLoggedIn">
16
+ <CommonMessage :success="false">Already logged in.</CommonMessage>
17
+ </div>
18
+ <div v-else class="px-2">
19
+ <div class="flex flex-1 flex-col text-center pt-8">
20
+ <h1 class="mb-3 heading-color-3">Log In</h1>
21
+
22
+ <div class="w-full max-w-xs mx-auto pb-12">
23
+ <form class="w-full" @submit.prevent="submitRegistration"></form>
24
+ </div>
25
+ </div>
26
+ </div>
27
+ </template>
@@ -1,124 +1,124 @@
1
- <script lang="ts" setup>
2
- import { toRefs, computed, onMounted } from "vue";
3
- import { useUcc } from "../../composables/useUcc";
4
- import { Conference } from "../../models/conference";
5
- import { useConferencesStore } from "../../store/conferences";
6
- import { uccClassObj } from "../../@types/components";
7
- import { useClassBinding } from "../../composables/useClassBinding";
8
-
9
- const { loadUccScript, loginV3 } = useUcc();
10
-
11
- interface Props {
12
- conference: Conference;
13
- eventPathPrefix?: string;
14
- classObject?: uccClassObj;
15
- }
16
-
17
- const props = withDefaults(defineProps<Props>(), {
18
- eventPathPrefix: "",
19
- classObject: () => {
20
- return {
21
- container: ""
22
- };
23
- },
24
- });
25
-
26
- const {
27
- eventPathPrefix,
28
- classObject,
29
- } = toRefs(props);
30
-
31
- const { selectedConference } = useConferencesStore();
32
- const { classBinding } = useClassBinding();
33
-
34
- // reactive data
35
- const { conference } = toRefs(props);
36
-
37
- // methods
38
- const submitLogin = () => {
39
- let email = document.getElementById('uccEmail').value;
40
- loginV3({email: email});
41
- };
42
-
43
- // computed
44
- const loginHeader = computed(() => {
45
- return (conference.value.state == "live")
46
- ? "Live Web Event Streaming Now"
47
- : (conference.value.state == "archive")
48
- ? "Enter your email address to view event recording"
49
- : "Join us for a Free Live Web Event"; // fallback (handled by UCC)
50
- });
51
-
52
- const buttonText = computed(() => {
53
- return (conference.value.state == "live")
54
- ? "Join the Livestream"
55
- : (conference.value.state == "archive")
56
- ? "View Event"
57
- : "Register"; // fallback (handled by UCC)
58
- });
59
-
60
- const buttonColorClass = computed(() => {
61
- return (conference.value.state == "live")
62
- ? "v3-ucc-btn-black"
63
- : "ucc-btn-primary";
64
- });
65
-
66
- // on mount
67
- onMounted(() => {
68
- loadUccScript(props.conference, props.eventPathPrefix);
69
- });
70
-
71
- </script>
72
-
73
- <template>
74
- <div>
75
- <!-- UCC Widget -->
76
- <div id="uccTarget"
77
- :class="
78
- classBinding(
79
- classObject,
80
- 'container',
81
- 'p-0 m-0 w-full'
82
- )
83
- "
84
- style="display:block;"
85
- >
86
- </div>
87
- <!-- V3 email login form -->
88
- <div id="uccEmailForm"
89
- class="ucc-form-container ucc-widgets-events"
90
- :class="(conference.state == 'live' || conference.state == 'archive') ? 'block' : 'hidden'"
91
- style="padding-bottom: 0px"
92
- >
93
- <div>
94
- <h1 class="scala-bold text-red-500 text-xl text-center mb-0">
95
- {{ loginHeader }}
96
- </h1>
97
- </div>
98
- <div class="text-center">
99
- <div class="ucc-form-field">
100
- <div class="ucc-form-field-descr"></div>
101
- <div class="ucc-input-wrapper required">
102
- <input id="uccEmail" name="uccEmail" class="ucc-input" type="text" placeholder="Enter Email Address" autocomplete="off" maxlength="70">
103
- </div>
104
- <div class="ucc-error"></div>
105
- </div>
106
- <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;">
107
- <a
108
- @click="submitLogin"
109
- class="ucc-btn"
110
- :class="buttonColorClass"
111
- style="margin-top: 0px;"><span class="btn-text">{{ buttonText }}</span></a>
112
- </div>
113
- </div>
114
- </div>
115
- </div>
116
- </template>
117
-
118
- <style scoped>
119
- .v3-ucc-btn-black {
120
- background-color: #000;
121
- border: 1px solid #000;
122
- color: #fff;
123
- }
124
- </style>
1
+ <script lang="ts" setup>
2
+ import { toRefs, computed, onMounted } from "vue";
3
+ import { useUcc } from "../../composables/useUcc";
4
+ import { Conference } from "../../models/conference";
5
+ import { useConferencesStore } from "../../store/conferences";
6
+ import { uccClassObj } from "../../@types/components";
7
+ import { useClassBinding } from "../../composables/useClassBinding";
8
+
9
+ const { loadUccScript, loginV3 } = useUcc();
10
+
11
+ interface Props {
12
+ conference: Conference;
13
+ eventPathPrefix?: string;
14
+ classObject?: uccClassObj;
15
+ }
16
+
17
+ const props = withDefaults(defineProps<Props>(), {
18
+ eventPathPrefix: "",
19
+ classObject: () => {
20
+ return {
21
+ container: ""
22
+ };
23
+ },
24
+ });
25
+
26
+ const {
27
+ eventPathPrefix,
28
+ classObject,
29
+ } = toRefs(props);
30
+
31
+ const { selectedConference } = useConferencesStore();
32
+ const { classBinding } = useClassBinding();
33
+
34
+ // reactive data
35
+ const { conference } = toRefs(props);
36
+
37
+ // methods
38
+ const submitLogin = () => {
39
+ let email = document.getElementById('uccEmail').value;
40
+ loginV3({email: email});
41
+ };
42
+
43
+ // computed
44
+ const loginHeader = computed(() => {
45
+ return (conference.value.state == "live")
46
+ ? "Live Web Event Streaming Now"
47
+ : (conference.value.state == "archive")
48
+ ? "Enter your email address to view event recording"
49
+ : "Join us for a Free Live Web Event"; // fallback (handled by UCC)
50
+ });
51
+
52
+ const buttonText = computed(() => {
53
+ return (conference.value.state == "live")
54
+ ? "Join the Livestream"
55
+ : (conference.value.state == "archive")
56
+ ? "View Event"
57
+ : "Register"; // fallback (handled by UCC)
58
+ });
59
+
60
+ const buttonColorClass = computed(() => {
61
+ return (conference.value.state == "live")
62
+ ? "v3-ucc-btn-black"
63
+ : "ucc-btn-primary";
64
+ });
65
+
66
+ // on mount
67
+ onMounted(() => {
68
+ loadUccScript(props.conference, props.eventPathPrefix);
69
+ });
70
+
71
+ </script>
72
+
73
+ <template>
74
+ <div>
75
+ <!-- UCC Widget -->
76
+ <div id="uccTarget"
77
+ :class="
78
+ classBinding(
79
+ classObject,
80
+ 'container',
81
+ 'p-0 m-0 w-full'
82
+ )
83
+ "
84
+ style="display:block;"
85
+ >
86
+ </div>
87
+ <!-- V3 email login form -->
88
+ <div id="uccEmailForm"
89
+ class="ucc-form-container ucc-widgets-events"
90
+ :class="(conference.state == 'live' || conference.state == 'archive') ? 'block' : 'hidden'"
91
+ style="padding-bottom: 0px"
92
+ >
93
+ <div>
94
+ <h1 class="scala-bold text-red-500 text-xl text-center mb-0">
95
+ {{ loginHeader }}
96
+ </h1>
97
+ </div>
98
+ <div class="text-center">
99
+ <div class="ucc-form-field">
100
+ <div class="ucc-form-field-descr"></div>
101
+ <div class="ucc-input-wrapper required">
102
+ <input id="uccEmail" name="uccEmail" class="ucc-input" type="text" placeholder="Enter Email Address" autocomplete="off" maxlength="70">
103
+ </div>
104
+ <div class="ucc-error"></div>
105
+ </div>
106
+ <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;">
107
+ <a
108
+ @click="submitLogin"
109
+ class="ucc-btn"
110
+ :class="buttonColorClass"
111
+ style="margin-top: 0px;"><span class="btn-text">{{ buttonText }}</span></a>
112
+ </div>
113
+ </div>
114
+ </div>
115
+ </div>
116
+ </template>
117
+
118
+ <style scoped>
119
+ .v3-ucc-btn-black {
120
+ background-color: #000;
121
+ border: 1px solid #000;
122
+ color: #fff;
123
+ }
124
+ </style>