@icvdeveloper/common-module 0.0.127 → 0.0.129

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 (92) hide show
  1. package/README.md +6 -6
  2. package/dist/module.json +1 -1
  3. package/dist/runtime/assets/svg/answer.svg +14 -14
  4. package/dist/runtime/assets/svg/avatar.svg +1 -1
  5. package/dist/runtime/assets/svg/bell-icon.svg +3 -3
  6. package/dist/runtime/assets/svg/checkmark-icon.svg +1 -1
  7. package/dist/runtime/assets/svg/close-icon.svg +1 -1
  8. package/dist/runtime/assets/svg/icon-avatar.svg +1 -1
  9. package/dist/runtime/assets/svg/icon-chevron.svg +4 -4
  10. package/dist/runtime/assets/svg/icon-circle-plus.svg +1 -1
  11. package/dist/runtime/assets/svg/icon-close.svg +1 -1
  12. package/dist/runtime/assets/svg/icon-info.svg +2 -2
  13. package/dist/runtime/assets/svg/icon-new-window.svg +11 -11
  14. package/dist/runtime/assets/svg/icon-offline.svg +3 -3
  15. package/dist/runtime/assets/svg/icon-online.svg +3 -3
  16. package/dist/runtime/assets/svg/icon-person.svg +2 -2
  17. package/dist/runtime/assets/svg/icon-play.svg +2 -2
  18. package/dist/runtime/assets/svg/icon-star-filled.svg +29 -29
  19. package/dist/runtime/assets/svg/icon-star.svg +24 -24
  20. package/dist/runtime/assets/svg/icon-video-chat.svg +14 -14
  21. package/dist/runtime/assets/svg/icon-website.svg +2 -2
  22. package/dist/runtime/assets/svg/icon-zoom.svg +10 -10
  23. package/dist/runtime/assets/svg/notification-icon.svg +32 -32
  24. package/dist/runtime/assets/svg/offline-icon.svg +1 -1
  25. package/dist/runtime/assets/svg/online-icon.svg +3 -3
  26. package/dist/runtime/assets/svg/peer2peer.svg +3 -3
  27. package/dist/runtime/assets/svg/phone.svg +1 -1
  28. package/dist/runtime/assets/svg/plus-icon.svg +1 -1
  29. package/dist/runtime/assets/svg/red-icon.svg +3 -3
  30. package/dist/runtime/assets/svg/reject.svg +14 -14
  31. package/dist/runtime/assets/svg/search-icon.svg +3 -3
  32. package/dist/runtime/components/affiliates/AffiliatePage.vue +329 -329
  33. package/dist/runtime/components/agenda/AgendaList.vue +259 -259
  34. package/dist/runtime/components/agenda/AgendaTabbed.vue +305 -305
  35. package/dist/runtime/components/agenda/components/AgendaListAccordion.vue +67 -67
  36. package/dist/runtime/components/agenda/components/Calendar.vue +67 -67
  37. package/dist/runtime/components/agenda/components/InfoLink.vue +56 -56
  38. package/dist/runtime/components/agenda/components/PlayIcon.vue +49 -49
  39. package/dist/runtime/components/agenda/components/PresentationLink.vue +137 -137
  40. package/dist/runtime/components/agenda/components/Sponsor.vue +132 -132
  41. package/dist/runtime/components/auth/LoginFullWidth.vue +78 -78
  42. package/dist/runtime/components/auth/PasswordReset.vue +60 -60
  43. package/dist/runtime/components/auth/Registration.vue +27 -27
  44. package/dist/runtime/components/auth/Ucc.vue +129 -129
  45. package/dist/runtime/components/core/Accordion.vue +97 -97
  46. package/dist/runtime/components/core/CountdownTimer.vue +336 -336
  47. package/dist/runtime/components/core/DynamicHtml.vue +1 -1
  48. package/dist/runtime/components/core/Modal.vue +111 -111
  49. package/dist/runtime/components/core/Navbar.vue +154 -154
  50. package/dist/runtime/components/core/SvgIcon.vue +157 -157
  51. package/dist/runtime/components/core/ZoomModal.vue +37 -37
  52. package/dist/runtime/components/events/EventHeader.vue +133 -133
  53. package/dist/runtime/components/events/ListEvents.vue +554 -554
  54. package/dist/runtime/components/forms/AlertBox.vue +21 -21
  55. package/dist/runtime/components/forms/ErrorField.vue +17 -17
  56. package/dist/runtime/components/forms/Message.vue +27 -27
  57. package/dist/runtime/components/forms/SearchInput.vue +38 -38
  58. package/dist/runtime/components/forms/SupportForm.vue +112 -112
  59. package/dist/runtime/components/forms/SwitchInput.vue +42 -42
  60. package/dist/runtime/components/forms/TextArea.vue +26 -26
  61. package/dist/runtime/components/forms/TextInput.vue +28 -28
  62. package/dist/runtime/components/layouts/Accordion.vue +78 -78
  63. package/dist/runtime/components/media/ArchivePlayerAndContentContainer.vue +160 -160
  64. package/dist/runtime/components/media/ArchiveVideoPlayer.vue +186 -186
  65. package/dist/runtime/components/media/PlayerAndContentContainer.vue +183 -183
  66. package/dist/runtime/components/media/WebcastVideoPlayer.vue +140 -140
  67. package/dist/runtime/components/media/components/AgendaPanel.vue +43 -43
  68. package/dist/runtime/components/media/components/ArchiveMediaContainer.vue +91 -91
  69. package/dist/runtime/components/media/components/CeCreditNotification.vue +95 -95
  70. package/dist/runtime/components/media/components/ContentAccordion.vue +63 -63
  71. package/dist/runtime/components/media/components/ContentArea.vue +158 -158
  72. package/dist/runtime/components/media/components/ContentTabs.vue +231 -231
  73. package/dist/runtime/components/media/components/DocumentsPanel.vue +31 -31
  74. package/dist/runtime/components/media/components/JsonApi.vue +31 -31
  75. package/dist/runtime/components/media/components/MediaContainer.vue +63 -63
  76. package/dist/runtime/components/media/components/OverviewPanel.vue +52 -52
  77. package/dist/runtime/components/media/components/PresentersPanel.vue +52 -52
  78. package/dist/runtime/components/media/components/SessionReporting.vue +107 -102
  79. package/dist/runtime/components/media/components/SponsorsPanel.vue +71 -71
  80. package/dist/runtime/components/media/components/WindowContent.vue +92 -92
  81. package/dist/runtime/components/media/components/WindowSlide.vue +72 -72
  82. package/dist/runtime/components/presenters/PresenterListing.vue +164 -164
  83. package/dist/runtime/components/presenters/PresenterModal.vue +223 -223
  84. package/dist/runtime/components/profile/Profile.vue +149 -149
  85. package/dist/runtime/components/profile/components/Sidebar.vue +27 -27
  86. package/dist/runtime/components/profile/components/SidebarNavItem.vue +39 -39
  87. package/dist/runtime/components/profile/tabs/Favorites.vue +21 -21
  88. package/dist/runtime/components/profile/tabs/GeneralInformation.vue +122 -122
  89. package/dist/runtime/components/profile/tabs/ProfileImage.vue +75 -75
  90. package/dist/runtime/components/support/FAQAccordion.vue +140 -140
  91. package/dist/runtime/composables/useApi.mjs +3 -1
  92. package/package.json +1 -1
@@ -1,157 +1,157 @@
1
- <script lang="ts" setup>
2
- import { find, get } from "lodash-es";
3
- import { toRefs, computed, defineAsyncComponent } from "vue";
4
- import { Icon, Icons } from "../../models/icons";
5
- import { svgIconClassObj } from "../../@types/components";
6
- import { useClassBinding } from "../../composables/useClassBinding";
7
-
8
- /**
9
- * Delay importing only the icon file that we need
10
- */
11
- const icons: Icons = {
12
- person: {
13
- color: "#333",
14
- component: defineAsyncComponent(
15
- () => import("../../assets/svg/icon-person.svg")
16
- ),
17
- },
18
- info: {
19
- color: "#4286f4",
20
- component: defineAsyncComponent(
21
- () => import("../../assets/svg/icon-info.svg")
22
- ),
23
- },
24
- twitter: {
25
- color: "#1CB7EB",
26
- component: defineAsyncComponent(
27
- () => import("../../assets/svg/icon-twitter.svg")
28
- ),
29
- },
30
- facebook: {
31
- color: "#4E71A8",
32
- component: defineAsyncComponent(
33
- () => import("../../assets/svg/icon-facebook.svg")
34
- ),
35
- },
36
- linkedin: {
37
- color: "#4E71A8",
38
- component: defineAsyncComponent(
39
- () => import("../../assets/svg/icon-linkedin.svg")
40
- ),
41
- },
42
- youtube: {
43
- color: "#CA3737",
44
- component: defineAsyncComponent(
45
- () => import("../../assets/svg/icon-youtube.svg")
46
- ),
47
- },
48
- website: {
49
- color: "#4286f4",
50
- component: defineAsyncComponent(
51
- () => import("../../assets/svg/icon-website.svg")
52
- ),
53
- },
54
- newwindow: {
55
- color: "#333",
56
- component: defineAsyncComponent(
57
- () => import("../../assets/svg/icon-new-window.svg")
58
- ),
59
- },
60
- playarrow: {
61
- color: "#CA3737",
62
- component: defineAsyncComponent(
63
- () => import("../../assets/svg/icon-play.svg")
64
- ),
65
- },
66
- zoom: {
67
- color: "#333",
68
- component: defineAsyncComponent(
69
- () => import("../../assets/svg/icon-zoom.svg")
70
- ),
71
- },
72
- downarrow: {
73
- color: "#333",
74
- component: defineAsyncComponent(
75
- () => import("../../assets/svg/icon-down-arrow.svg")
76
- ),
77
- },
78
- close: {
79
- color: "#000",
80
- component: defineAsyncComponent(
81
- () => import("../../assets/svg/icon-close.svg")
82
- ),
83
- },
84
- chevron: {
85
- color: "#000",
86
- component: defineAsyncComponent(
87
- () => import("../../assets/svg/icon-chevron.svg")
88
- ),
89
- },
90
- circlePlus: {
91
- color: "",
92
- component: defineAsyncComponent(
93
- () => import("../../assets/svg/icon-circle-plus.svg")
94
- ),
95
- },
96
- circleMinus: {
97
- color: "",
98
- component: defineAsyncComponent(
99
- () => import("../../assets/svg/icon-circle-minus.svg")
100
- ),
101
- },
102
- };
103
-
104
- type Props = {
105
- icon?: keyof Icons;
106
- grayScale?: boolean;
107
- width?: string;
108
- classObject?: svgIconClassObj;
109
- };
110
-
111
- const props = withDefaults(defineProps<Props>(), {
112
- icon: "info",
113
- grayScale: false,
114
- width: "20px",
115
- classObject: () => {
116
- return {
117
- container: "",
118
- svgElement: "",
119
- };
120
- },
121
- });
122
-
123
- const { icon, grayScale, width } = toRefs(props);
124
- const { classBinding } = useClassBinding();
125
-
126
- // computed
127
- const iconDims = computed(() => ({
128
- minWidth: width.value,
129
- minHeight: width.value,
130
- }));
131
-
132
- const iconStyle = computed(() => {
133
- if (!grayScale.value) {
134
- return {
135
- fill: icons[icon.value].color,
136
- };
137
- }
138
-
139
- return {
140
- fill: "#666",
141
- };
142
- });
143
-
144
- const iconComponent = computed(() => {
145
- return icons[icon.value].component;
146
- });
147
- </script>
148
-
149
- <template>
150
- <div :style="iconDims">
151
- <component
152
- :is="iconComponent"
153
- :style="iconStyle"
154
- :class="classBinding(classObject, 'svgElement', '')"
155
- />
156
- </div>
157
- </template>
1
+ <script lang="ts" setup>
2
+ import { find, get } from "lodash-es";
3
+ import { toRefs, computed, defineAsyncComponent } from "vue";
4
+ import { Icon, Icons } from "../../models/icons";
5
+ import { svgIconClassObj } from "../../@types/components";
6
+ import { useClassBinding } from "../../composables/useClassBinding";
7
+
8
+ /**
9
+ * Delay importing only the icon file that we need
10
+ */
11
+ const icons: Icons = {
12
+ person: {
13
+ color: "#333",
14
+ component: defineAsyncComponent(
15
+ () => import("../../assets/svg/icon-person.svg")
16
+ ),
17
+ },
18
+ info: {
19
+ color: "#4286f4",
20
+ component: defineAsyncComponent(
21
+ () => import("../../assets/svg/icon-info.svg")
22
+ ),
23
+ },
24
+ twitter: {
25
+ color: "#1CB7EB",
26
+ component: defineAsyncComponent(
27
+ () => import("../../assets/svg/icon-twitter.svg")
28
+ ),
29
+ },
30
+ facebook: {
31
+ color: "#4E71A8",
32
+ component: defineAsyncComponent(
33
+ () => import("../../assets/svg/icon-facebook.svg")
34
+ ),
35
+ },
36
+ linkedin: {
37
+ color: "#4E71A8",
38
+ component: defineAsyncComponent(
39
+ () => import("../../assets/svg/icon-linkedin.svg")
40
+ ),
41
+ },
42
+ youtube: {
43
+ color: "#CA3737",
44
+ component: defineAsyncComponent(
45
+ () => import("../../assets/svg/icon-youtube.svg")
46
+ ),
47
+ },
48
+ website: {
49
+ color: "#4286f4",
50
+ component: defineAsyncComponent(
51
+ () => import("../../assets/svg/icon-website.svg")
52
+ ),
53
+ },
54
+ newwindow: {
55
+ color: "#333",
56
+ component: defineAsyncComponent(
57
+ () => import("../../assets/svg/icon-new-window.svg")
58
+ ),
59
+ },
60
+ playarrow: {
61
+ color: "#CA3737",
62
+ component: defineAsyncComponent(
63
+ () => import("../../assets/svg/icon-play.svg")
64
+ ),
65
+ },
66
+ zoom: {
67
+ color: "#333",
68
+ component: defineAsyncComponent(
69
+ () => import("../../assets/svg/icon-zoom.svg")
70
+ ),
71
+ },
72
+ downarrow: {
73
+ color: "#333",
74
+ component: defineAsyncComponent(
75
+ () => import("../../assets/svg/icon-down-arrow.svg")
76
+ ),
77
+ },
78
+ close: {
79
+ color: "#000",
80
+ component: defineAsyncComponent(
81
+ () => import("../../assets/svg/icon-close.svg")
82
+ ),
83
+ },
84
+ chevron: {
85
+ color: "#000",
86
+ component: defineAsyncComponent(
87
+ () => import("../../assets/svg/icon-chevron.svg")
88
+ ),
89
+ },
90
+ circlePlus: {
91
+ color: "",
92
+ component: defineAsyncComponent(
93
+ () => import("../../assets/svg/icon-circle-plus.svg")
94
+ ),
95
+ },
96
+ circleMinus: {
97
+ color: "",
98
+ component: defineAsyncComponent(
99
+ () => import("../../assets/svg/icon-circle-minus.svg")
100
+ ),
101
+ },
102
+ };
103
+
104
+ type Props = {
105
+ icon?: keyof Icons;
106
+ grayScale?: boolean;
107
+ width?: string;
108
+ classObject?: svgIconClassObj;
109
+ };
110
+
111
+ const props = withDefaults(defineProps<Props>(), {
112
+ icon: "info",
113
+ grayScale: false,
114
+ width: "20px",
115
+ classObject: () => {
116
+ return {
117
+ container: "",
118
+ svgElement: "",
119
+ };
120
+ },
121
+ });
122
+
123
+ const { icon, grayScale, width } = toRefs(props);
124
+ const { classBinding } = useClassBinding();
125
+
126
+ // computed
127
+ const iconDims = computed(() => ({
128
+ minWidth: width.value,
129
+ minHeight: width.value,
130
+ }));
131
+
132
+ const iconStyle = computed(() => {
133
+ if (!grayScale.value) {
134
+ return {
135
+ fill: icons[icon.value].color,
136
+ };
137
+ }
138
+
139
+ return {
140
+ fill: "#666",
141
+ };
142
+ });
143
+
144
+ const iconComponent = computed(() => {
145
+ return icons[icon.value].component;
146
+ });
147
+ </script>
148
+
149
+ <template>
150
+ <div :style="iconDims">
151
+ <component
152
+ :is="iconComponent"
153
+ :style="iconStyle"
154
+ :class="classBinding(classObject, 'svgElement', '')"
155
+ />
156
+ </div>
157
+ </template>
@@ -1,37 +1,37 @@
1
- <script lang="ts" setup>
2
- import { ref, toRefs, computed } from "vue";
3
-
4
- interface Props {
5
- presentationId: number | string;
6
- modalSize?: string;
7
- }
8
-
9
- const props = withDefaults(defineProps<Props>(), {
10
- modalSize: "full",
11
- });
12
-
13
- const { modalSize, presentationId } = toRefs(props);
14
-
15
- const showModal = ref<boolean>(false);
16
-
17
- const zoomUrl = computed(() => {
18
- return `/zoom/${presentationId.value}/meeting`;
19
- });
20
- </script>
21
-
22
- <template>
23
- <span>
24
- <CommonModal
25
- :visible="showModal"
26
- :modal-size="modalSize"
27
- @trigger="showModal = false"
28
- >
29
- <template #modal-body>
30
- <iframe :src="zoomUrl" class="w-full h-full"></iframe>
31
- </template>
32
- </CommonModal>
33
- <a class="no-underline" href="javascript:null" @click="showModal = true">
34
- <slot name="modal-link"></slot>
35
- </a>
36
- </span>
37
- </template>
1
+ <script lang="ts" setup>
2
+ import { ref, toRefs, computed } from "vue";
3
+
4
+ interface Props {
5
+ presentationId: number | string;
6
+ modalSize?: string;
7
+ }
8
+
9
+ const props = withDefaults(defineProps<Props>(), {
10
+ modalSize: "full",
11
+ });
12
+
13
+ const { modalSize, presentationId } = toRefs(props);
14
+
15
+ const showModal = ref<boolean>(false);
16
+
17
+ const zoomUrl = computed(() => {
18
+ return `/zoom/${presentationId.value}/meeting`;
19
+ });
20
+ </script>
21
+
22
+ <template>
23
+ <span>
24
+ <CommonModal
25
+ :visible="showModal"
26
+ :modal-size="modalSize"
27
+ @trigger="showModal = false"
28
+ >
29
+ <template #modal-body>
30
+ <iframe :src="zoomUrl" class="w-full h-full"></iframe>
31
+ </template>
32
+ </CommonModal>
33
+ <a class="no-underline" href="javascript:null" @click="showModal = true">
34
+ <slot name="modal-link"></slot>
35
+ </a>
36
+ </span>
37
+ </template>
@@ -1,133 +1,133 @@
1
- <script lang="ts" setup>
2
- import { toRefs, computed } from "vue";
3
- import { Conference } from "../../models/conference";
4
- import { useTemplateConfigsStore } from "../../store/templateConfigs";
5
- import { useConferencesStore } from "../../store/conferences";
6
- import { useConferenceHelpers } from "../../composables/useConferenceHelpers";
7
-
8
- interface Props {
9
- conference?: Conference | null;
10
- useEventText?: boolean;
11
- }
12
-
13
- // Component Props
14
- const props = withDefaults(defineProps<Props>(), {
15
- useEventText: () =>
16
- useTemplateConfigsStore().pagesConfigValue("main.use_event_text"),
17
- conference: () => useConferencesStore().currentConference,
18
- });
19
-
20
- // stores
21
- const conferenceStore = useConferencesStore();
22
- const { globalConfigValue, pagesConfigValue } = useTemplateConfigsStore();
23
-
24
- // reactive data
25
- const { useEventText, conference } = toRefs(props);
26
-
27
- // helper functions
28
- const {
29
- getConferenceDisplayDate,
30
- showConferenceWebcastButton,
31
- getConferenceWebcastUrl,
32
- getConferenceWebcastButtonText,
33
- showViewArchiveButton,
34
- getViewArchiveUrl,
35
- getViewArchiveButtonText,
36
- showConferenceRegButton,
37
- getConferenceRegUrl,
38
- getConferenceRegText,
39
- } = useConferenceHelpers(conference);
40
-
41
- // computed properties
42
- const mainStyles = computed(() => {
43
- if (useEventText.value) {
44
- return {
45
- "background-image": `url(${conference.value.photo_large})`,
46
- "background-repeat": "no-repeat",
47
- "background-size": "cover",
48
- "background-position": "center",
49
- };
50
- } else {
51
- return {};
52
- }
53
- });
54
-
55
- const mutedHeaderStyle = computed(() => {
56
- const muted = globalConfigValue("muted_photo_headers");
57
- if (muted === "lighten") return "background-color: rgb(255, 255, 255, .4)";
58
- if (muted === "darken") return "background-color: rgb(0, 0, 0, .4)";
59
- return "";
60
- });
61
-
62
- const hasOtherButton = computed(() => {
63
- return showViewArchiveButton() || showConferenceWebcastButton();
64
- });
65
-
66
- const mainBodyImage = computed(() => {
67
- return conference.value.photo_large;
68
- });
69
- </script>
70
-
71
- <template>
72
- <div :style="mainStyles" class="flex bg-color-2">
73
- <div
74
- v-if="useEventText"
75
- class="text-center flex flex-1 flex-col items-center justify-center h-auto p-12"
76
- :style="mutedHeaderStyle"
77
- >
78
- <h1
79
- class="text-shadow font-bold heading-color-1 mt-4 mb-4 text-2xl sm:text-2xl md:text-3xl lg:text-4xl xl:text-5xl"
80
- >
81
- {{ conference.name }}
82
- </h1>
83
- <h1
84
- v-if="conference.location"
85
- class="text-shadow font-light heading-color-2 mb-2 text-2xl sm:text-l md:text-xl lg:text-2xl xl:text-3xl"
86
- >
87
- {{ conference.location }}
88
- </h1>
89
- <h3
90
- v-if="pagesConfigValue('main.use_event_text_date')"
91
- class="text-shadow font-light heading-color-2 mb-2 text-l sm:text-l md:text-xl lg:text-2xl xl:text-3xl"
92
- >
93
- {{ getConferenceDisplayDate() }}
94
- </h3>
95
-
96
- <div class="flex-row mt-6">
97
- <!-- view test stream or webcast -->
98
- <a
99
- v-if="showConferenceWebcastButton()"
100
- :href="getConferenceWebcastUrl()"
101
- :target="/^http/.test(getConferenceWebcastUrl()) ? '_blank' : '_self'"
102
- >
103
- <button class="btn">
104
- {{ getConferenceWebcastButtonText() }}
105
- </button>
106
- </a>
107
-
108
- <!-- view archive -->
109
- <a
110
- v-if="showViewArchiveButton()"
111
- :href="getViewArchiveUrl()"
112
- :target="/^http/.test(getViewArchiveUrl()) ? '_blank' : '_self'"
113
- >
114
- <button class="btn">
115
- {{ getViewArchiveButtonText() }}
116
- </button>
117
- </a>
118
-
119
- <!-- register -->
120
- <a
121
- v-if="showConferenceRegButton()"
122
- :href="getConferenceRegUrl()"
123
- :target="/^http/.test(getConferenceRegUrl()) ? '_blank' : '_self'"
124
- >
125
- <button class="btn" :class="hasOtherButton ? 'md:ml-4' : ''">
126
- {{ getConferenceRegText() }}
127
- </button>
128
- </a>
129
- </div>
130
- </div>
131
- <img v-else :src="mainBodyImage" class="w-full h-auto" />
132
- </div>
133
- </template>
1
+ <script lang="ts" setup>
2
+ import { toRefs, computed } from "vue";
3
+ import { Conference } from "../../models/conference";
4
+ import { useTemplateConfigsStore } from "../../store/templateConfigs";
5
+ import { useConferencesStore } from "../../store/conferences";
6
+ import { useConferenceHelpers } from "../../composables/useConferenceHelpers";
7
+
8
+ interface Props {
9
+ conference?: Conference | null;
10
+ useEventText?: boolean;
11
+ }
12
+
13
+ // Component Props
14
+ const props = withDefaults(defineProps<Props>(), {
15
+ useEventText: () =>
16
+ useTemplateConfigsStore().pagesConfigValue("main.use_event_text"),
17
+ conference: () => useConferencesStore().currentConference,
18
+ });
19
+
20
+ // stores
21
+ const conferenceStore = useConferencesStore();
22
+ const { globalConfigValue, pagesConfigValue } = useTemplateConfigsStore();
23
+
24
+ // reactive data
25
+ const { useEventText, conference } = toRefs(props);
26
+
27
+ // helper functions
28
+ const {
29
+ getConferenceDisplayDate,
30
+ showConferenceWebcastButton,
31
+ getConferenceWebcastUrl,
32
+ getConferenceWebcastButtonText,
33
+ showViewArchiveButton,
34
+ getViewArchiveUrl,
35
+ getViewArchiveButtonText,
36
+ showConferenceRegButton,
37
+ getConferenceRegUrl,
38
+ getConferenceRegText,
39
+ } = useConferenceHelpers(conference);
40
+
41
+ // computed properties
42
+ const mainStyles = computed(() => {
43
+ if (useEventText.value) {
44
+ return {
45
+ "background-image": `url(${conference.value.photo_large})`,
46
+ "background-repeat": "no-repeat",
47
+ "background-size": "cover",
48
+ "background-position": "center",
49
+ };
50
+ } else {
51
+ return {};
52
+ }
53
+ });
54
+
55
+ const mutedHeaderStyle = computed(() => {
56
+ const muted = globalConfigValue("muted_photo_headers");
57
+ if (muted === "lighten") return "background-color: rgb(255, 255, 255, .4)";
58
+ if (muted === "darken") return "background-color: rgb(0, 0, 0, .4)";
59
+ return "";
60
+ });
61
+
62
+ const hasOtherButton = computed(() => {
63
+ return showViewArchiveButton() || showConferenceWebcastButton();
64
+ });
65
+
66
+ const mainBodyImage = computed(() => {
67
+ return conference.value.photo_large;
68
+ });
69
+ </script>
70
+
71
+ <template>
72
+ <div :style="mainStyles" class="flex bg-color-2">
73
+ <div
74
+ v-if="useEventText"
75
+ class="text-center flex flex-1 flex-col items-center justify-center h-auto p-12"
76
+ :style="mutedHeaderStyle"
77
+ >
78
+ <h1
79
+ class="text-shadow font-bold heading-color-1 mt-4 mb-4 text-2xl sm:text-2xl md:text-3xl lg:text-4xl xl:text-5xl"
80
+ >
81
+ {{ conference.name }}
82
+ </h1>
83
+ <h1
84
+ v-if="conference.location"
85
+ class="text-shadow font-light heading-color-2 mb-2 text-2xl sm:text-l md:text-xl lg:text-2xl xl:text-3xl"
86
+ >
87
+ {{ conference.location }}
88
+ </h1>
89
+ <h3
90
+ v-if="pagesConfigValue('main.use_event_text_date')"
91
+ class="text-shadow font-light heading-color-2 mb-2 text-l sm:text-l md:text-xl lg:text-2xl xl:text-3xl"
92
+ >
93
+ {{ getConferenceDisplayDate() }}
94
+ </h3>
95
+
96
+ <div class="flex-row mt-6">
97
+ <!-- view test stream or webcast -->
98
+ <a
99
+ v-if="showConferenceWebcastButton()"
100
+ :href="getConferenceWebcastUrl()"
101
+ :target="/^http/.test(getConferenceWebcastUrl()) ? '_blank' : '_self'"
102
+ >
103
+ <button class="btn">
104
+ {{ getConferenceWebcastButtonText() }}
105
+ </button>
106
+ </a>
107
+
108
+ <!-- view archive -->
109
+ <a
110
+ v-if="showViewArchiveButton()"
111
+ :href="getViewArchiveUrl()"
112
+ :target="/^http/.test(getViewArchiveUrl()) ? '_blank' : '_self'"
113
+ >
114
+ <button class="btn">
115
+ {{ getViewArchiveButtonText() }}
116
+ </button>
117
+ </a>
118
+
119
+ <!-- register -->
120
+ <a
121
+ v-if="showConferenceRegButton()"
122
+ :href="getConferenceRegUrl()"
123
+ :target="/^http/.test(getConferenceRegUrl()) ? '_blank' : '_self'"
124
+ >
125
+ <button class="btn" :class="hasOtherButton ? 'md:ml-4' : ''">
126
+ {{ getConferenceRegText() }}
127
+ </button>
128
+ </a>
129
+ </div>
130
+ </div>
131
+ <img v-else :src="mainBodyImage" class="w-full h-auto" />
132
+ </div>
133
+ </template>