<script lang="ts">
  import { browser } from '$app/environment';

  export let type: string;
  export let title: string;
  export let image: string;
  export let description: string;
  export let createjs: boolean | undefined = false;
  export let recaptcha: boolean | undefined = false;

  let location = '';

  if (browser) {
    location = window.location.href;
  }
</script>

<svelte:head>
  <title>{title}</title>
  <meta name="description" content={description} />

  <meta property="og:type" content={type} />
  <meta property="og:url" content={location} />
  <meta property="og:title" content={title} />
  <meta property="og:description" content={description} />
  <meta property="og:image" content={image} />
  <meta property="og:site_name" content="Quadcode" />
  <meta property="og:locale" content="en" />

  <meta property="twitter:card" content="summary" />
  <meta property="twitter:url" content={location} />
  <meta property="twitter:title" content={title} />
  <meta property="twitter:description" content={description} />
  <meta property="twitter:image" content={image} />

  {#if createjs}
    <script src="./libs/createjs.min.js"></script>
  {/if}

  {#if recaptcha}
    <script src="https://www.google.com/recaptcha/api.js?hl=en&render=explicit" async defer></script>
  {/if}
</svelte:head>