zwischenstand

frontend/src/lib/components/CookieSet.svelte

@@ -0,0 +1,60 @@
+<script lang="ts">
+    export let cookieName: string
+    export let backgroundUrl = ""
+    export let textPosition = "center"
+    export let background = ""
+    let contentShown = false
+    const positions = {
+        oben: "flex-start",
+        mitte: "center",
+        unten: "flex-end",
+    }
+
+    window.addEventListener("ccAccept", (e) => {
+        if ((e as CustomEvent).detail[1] == cookieName) contentShown = true
+    })
+    //isCookieSet isnt really precise
+    function checkCookie(cookieName: string) {
+        // Get all cookies
+        var allCookies = decodeURIComponent(document.cookie)
+        // Split into individual cookies
+        var cookies = allCookies.split(";")
+        var ccTagCookies: string[] = []
+        cookies.forEach((e) => {
+            e.includes("ccTags") ? (ccTagCookies = e.split(",")) : void 0
+        })
+        for (var i = 0; i < ccTagCookies.length; i++) {
+            var c = ccTagCookies[i]
+            // Trim whitespace
+            while (c.charAt(0) == " ") c = c.substring(1)
+            // If the cookie's name matches the given name
+            if (c == cookieName) return true
+        }
+        return false
+    }
+
+    // Verwendung
+    if (checkCookie(cookieName)) contentShown = true
+</script>
+
+{#if contentShown}
+    <slot />
+{:else}
+    <div
+        style="display: flex; 
+         justify-content: center; 
+         align-items: {positions[textPosition]};
+         background-image: url({backgroundUrl});
+         background-size: cover; 
+         width: 100%;
+         align-self: stretch;
+         flex-grow: 1;
+         "
+    >
+        <div style="background-color: rgba(255,255,255,0.7); padding: 20px; background: {background}; width: 100%;">
+            <p>Cookie ist nicht aktiviert. Bitte aktivieren Sie ihn.</p>
+        </div>
+    </div>
+{/if}
+
+<style lang="less"></style>