{% import "macros/macros.html" as post_macros %}

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    {% if page.extra.meta %}
         <!-- the meta data config goes here  -->
         {% for data in page.extra.meta %}
             <meta
                 {% for key, value in data%}
                     {% if key == "property" and value == "og:title"%}
                         {% set_global page_has_og_title = true -%}
                     {% endif %}
                     {% if key == "property" and value == "og:description"%}
                         {% set_global page_has_og_description = true -%}
                     {% endif %}
                     {% if key == "name" and value == "description"%}
                         {% set_global page_has_description = true -%}
                     {% endif %}
                     {{ key }}="{{ value }}"
                {% endfor %}
            />
        {% endfor %}
    {% endif %}

    {# Site title #}
    {% set current_path = current_path | default(value="/") %}
    {% if current_path == "/" %}
    <title>
        {{ config.title | default(value="Home") }}
    </title>
    {% if not page_has_og_title %}
        <meta property="og:title" content="{{ config.title | default(value="Home") }}" />
    {% endif %}

    {% else %}
    <title>
        {% if page.title %} {{ page.title }}
        {% elif section.title %} {{ section.title }}
        {% elif config.title %} {{ config.title }}
        {% else %} Post {% endif %}
    </title>

        {% if not page_has_og_title %}
            <meta property="og:title" content="{% if page.title -%}{{ page.title }}{% elif config.title -%}{{ config.title }}{% else -%}Post{% endif -%}" />
        {% endif %}
     {% endif %}

     {% if not page_has_og_description %}
         {% if page.description %}
             <meta property="og:description" content="{{ page.description }}" />
         {% elif config.description %}
             <meta property="og:description" content="{{ config.description }}" />
         {% endif %}
     {% endif %}

     {% if not page_has_description %}
         {% if page.description %}
             <meta name="description" content="{{ page.description }}" />
         {% elif config.description %}
             <meta name="description" content="{{ config.description }}" />
         {% endif %}
    {% endif %}

    {# Favicon #}
    {% if config.extra.favicon %}
        <link rel="icon" type="image/png" href={{ config.extra.favicon }} />
    {% endif %}

    {# Font from cdn or disk #}
    {% if config.extra.use_cdn | default(value=false) %}
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jetbrains-mono@1.0.6/css/jetbrains-mono.min.css">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fontsource/space-grotesk@4.5.8/index.min.css">
    {% else %}
        <link href={{ get_url(path="fonts.css") }} rel="stylesheet" />
    {% endif %}

    {# Analytics #}
    {% if config.extra.analytics.enabled %}
        {% if config.extra.analytics.umami.website_id %}
            {% set website_id = config.extra.analytics.umami.website_id %}
            {% set host_url = config.extra.analytics.umami.host_url | default(value="https://analytics.eu.umami.is") %}

            <script>
                (function () {
                  var el = document.createElement('script');
                  el.setAttribute('src', '/js/imamu.js');
                  el.setAttribute('data-website-id', '{{ website_id }}');
                  el.setAttribute('data-host-url', '{{ host_url }}');
                  document.body.appendChild(el);
                })();
              </script>
            <script async src="/js/imamu.js" data-website-id="{{ website_id }}" data-host-url="{{ host_url }}"></script>
        {% endif %}

        {% if config.extra.analytics.goatcounter.user %}
            {% set user = config.extra.analytics.goatcounter.user %}
            {% set host = config.extra.analytics.goatcounter.host | default(value="goatcounter.com") %}

            <script data-goatcounter="https://{{ user }}.{{ host }}/count" async src="{{ get_url(path="js/count.js") }}"></script>
            <noscript>
                {# EasyList blocks '.com/count?', so we have to use '.com//count' #}
                <img src="https://{{ user }}.{{ host }}//count?p={{ current_path }}&t={{ page.title | default(value=config.title) }}">
            </noscript>
        {% endif %}
    {% endif %}

    {# Fancy Codeblock #}
    {% if config.extra.fancy_code %}
        <script src={{ get_url(path="js/codeblock.js") }}></script>
    {% endif %}

    {# Table of contents #}
    {% if config.extra.toc | default(value=false) %}
        <script src={{ get_url(path="js/toc.js") }}></script>
    {% endif %}
    
    {# Dynamic Note #}
    {% if config.extra.dynamic_note | default(value=false) %}
        <script src={{ get_url(path="js/note.js") }}></script>
    {% endif %}

    {% if config.extra.mathjax | default(value=false) %}
        {% if config.extra.mathjax_dollar_inline_enable | default(value=false) %}
            <script>
            MathJax = {
              tex: {
                inlineMath: [['$', '$'], ['\\(', '\\)']]
              }
            };
            </script>
        {% endif %}
        <script type="text/javascript" id="MathJax-script" async
          src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
        </script>
    {% endif %}

    {# RSS #}
    <link rel="alternate" type="application/atom+xml" title="{{ config.title }}" href="{{ get_url(path="atom.xml", trailing_slash=false) }}">


    {% set theme = config.extra.theme | default(value="toggle") %}
    {% if theme == "dark" %}
        <link rel="stylesheet" type="text/css" href="{{ get_url(path='theme/dark.css') }}" />
    {% elif theme == "light" %}
        <link rel="stylesheet" type="text/css" href={{ get_url(path="theme/light.css") }} />
    {% elif theme == "auto" %}
        <link rel="stylesheet" type="text/css" href={{ get_url(path="theme/light.css") }} />
        <link rel="stylesheet" type="text/css" href="{{ get_url(path='theme/dark.css') }}" media="(prefers-color-scheme: dark)" />
    {% elif theme == "toggle" %}
        <link rel="stylesheet" type="text/css" href={{ get_url(path="theme/light.css") }} />
        <link id="darkModeStyle" rel="stylesheet" type="text/css" href="{{ get_url(path='theme/dark.css') }}" />
    {% endif %}

    <!-- Set the correct theme in the script -->
    <script src={{ get_url(path="js/themetoggle.js") }}></script>
    {% if theme == "dark" %}
        <script>setTheme("dark");</script>
    {% elif theme == "light" %}
        <script>setTheme("light");</script>
    {% elif theme == "auto" %}
        <script>
            if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
                setTheme("dark");
            } else {
                setTheme("light");
            }
        </script>
    {% else %}
        <script>setTheme(getSavedTheme());</script>
    {% endif %}

    <link rel="stylesheet" type="text/css" media="screen" href={{ get_url(path="main.css") }} />

    {% if config.extra.stylesheets %}
        {% for stylesheet in config.extra.stylesheets %}
            <link rel="stylesheet" href="{{ get_url(path=stylesheet) }}">
        {% endfor %}
    {% endif %}
</head>