Merge pull request #179 from os2ulf/feature/OS2UOL-970

OS2UOL-970: Pretix fix on local routing
os2ulf · Nov 13, 2024 · 63b6936 · 63b6936
2 parents 3618b9d + d19c1a4
commit 63b6936
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 1 deletion.
diff --git a/components/globals/GlobalScriptInjections.vue b/components/globals/GlobalScriptInjections.vue
@@ -21,6 +21,7 @@ const injectScript = (scriptString: string, scriptType: string) => {
   const matches = scriptString.match(scriptTagRegex);
   if (!matches) {
     console.error('GlobalInjections.vue: Invalid script string');
+    // console.log(scriptString);
     return;
   }
 

diff --git a/components/view-components/RegistrationSection.vue b/components/view-components/RegistrationSection.vue
@@ -30,7 +30,13 @@ const formatDeadlineString = computed(() => {
   }
 });
 
-onMounted(() => {
+const pretixRef = ref(null);
+const observer = ref<IntersectionObserver | null>(null);
+const invokePretix = () => {
+  window.PretixWidget.buildWidgets();
+};
+
+onBeforeMount(() => {
   if (props.data?.event_shop_url && props.data?.field_pretix_widget_type) {
     // Inject a script dynamically if needed.
     const script = document.createElement('script');
@@ -45,6 +51,29 @@ onMounted(() => {
     document.head.appendChild(link);
   }
 });
+
+onMounted(() => {
+  if (typeof window !== 'undefined') {
+    observer.value = new IntersectionObserver((entries) => {
+      if (entries[0].isIntersecting) {
+        invokePretix();
+        observer.value?.disconnect();
+      }
+    });
+
+    if (pretixRef.value) {
+      observer.value.observe(pretixRef.value);
+    }
+
+    return () => {
+      observer.value?.disconnect();
+    };
+  }
+});
+
+onBeforeUnmount(() => {
+  observer.value?.disconnect();
+});
 </script>
 
 <template>
@@ -97,6 +126,7 @@ onMounted(() => {
     <div
       v-if="props.data.event_shop_url && props.data.field_pretix_widget_type"
       class="course__registration__pretix"
+      ref="pretixRef"
     >
       <ClientOnly>
         <pretix-widget