{% load wagtailcore_tags wagtailimages_tags compress static wagtailuserbar core_tags molo_commenting_tags %}
{% load wagtailsettings_tags %}

{% get_settings %}
<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="{{request.LANGUAGE_CODE}}"> <!--<![endif]-->
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Zathu |
      {% block title %}
        {% if self.seo_title %}
          {% if self.seo_title == "Main" %}Home{% else %}
            {{ self.seo_title }}
          {% endif %}
        {% elif self.title %}
          {% if self.title == "Main" %}Home{% else %}
            {{ self.title }}
          {% endif %}
        {% else %}Welcome{% endif %}
      {% endblock %}
    </title>
    <meta name="keywords" content="{% if self.specific.metadata_tags %}{{self.specific.metadata_tags.all|join:','}}{% endif %}" />
    <meta name="twitter:card" content="summary_large_image"/>
    {% if self.social_media_image %}
      {% image self.social_media_image fill-450x200 as tmp_photo %}
    {% endif %}
    {% if self.get_effective_image %}
      {% image self.get_effective_image fill-450x200 as article_photo %}
    {% endif %}
    {% if settings.core.SiteSettings.google_search_console %}
     <meta name="google-site-verification" content="{{settings.core.SiteSettings.google_search_console}}" />
    {% endif %}
    <meta property="og:title" content= "{% if self.social_media_title %}{{ self.social_media_title }}{% elif self.seo_title %}{{ self.seo_title }}{% else %}{{ self.title }}{% endif %}" />
    {% if self.search_description %}
      <meta name="description" content="{{self.search_description}}" />
      <meta property="og:description" content="{{self.search_description}}"/>
    {% elif self.social_media_description %}
      <meta name="description" content="{{self.social_media_description}}" />
      <meta property="og:description" content="{{self.social_media_description}}"/>
    {% elif self.title and self.subtitle %}
      <meta name="description" content="{{self.title}} - {{self.subtitle}}" />
      <meta property="og:description" content="{{self.title}} - {{self.subtitle}}"/>
    {% else %}
      <meta name="description" lang="en" content="Our Stories. Our Music. Our Lives." />
      <meta property="og:description" lang="en" content="Our Stories. Our Music. Our Lives."/>
    {% endif %}
    <meta property="og:url" content="{{ request.build_absolute_uri }}" />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="{% if self.social_media_image %}{{ tmp_photo.url }}{% elif article_photo.url %}{{ article_photo.url }}{% else %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/zathu-fb-share_1200X630.png' %}{% endif %}"/>
    <meta property="og:image:type" content="" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="icon" type="image/x-icon" href="{% static 'img/zathu-favicon.ico' %}" />
    {% compress css %}
      <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/{{ ENV }}/base_style.css">
      <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/{{ ENV }}/malawi.css">
    {% endcompress %}
    {% if request.LANGUAGE_CODE|language_bidi == True %}
      {% compress css %}
        <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/{{ ENV }}/base_style-rtl.css">
      {% endcompress %}
    {% endif %}
    <!-- Google Tag Manager -->
    {% if settings.core.SiteSettings.ga_tag_manager %}
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','{{settings.core.SiteSettings.ga_tag_manager}}');</script>
    {% endif %}
    <!-- End Google Tag Manager -->

    <!--Global Google Tag Manager -->
    {% if settings.core.SiteSettings.global_ga_tag_manager %}
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','{{settings.core.SiteSettings.global_ga_tag_manager}}');</script>
    {% endif %}
    <!-- End Global Google Tag Manager -->

    {% if settings.core.SiteSettings.local_ga_tracking_code %}
      <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
        ga('create', '{{settings.core.SiteSettings.local_ga_tracking_code}}', 'auto');
      </script>
    {% endif %}
  </head>
  <body class="{% block body_class %}{% endblock %}" {% if request.LANGUAGE_CODE|language_bidi == True %}dir="rtl"{% endif %}>
    <img alt="Zathu" src="{% if self.social_media_image %}{{ tmp_photo.url }}{% elif article_photo.url %}{{ article_photo.url }}{% else %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/zathu-fb-share_1200X630.png' %}{% endif %}" id="image__identity" style="display:none; visibility:hidden;" />

    <!-- Google Tag Manager (noscript) -->
    {% if settings.core.SiteSettings.ga_tag_manager %}
    <noscript>
      <iframe src="//www.googletagmanager.com/ns.html?id={{settings.core.SiteSettings.ga_tag_manager}}&client_session_id={{request.session.MOLO_GA_SESSION_FOR_NOSCRIPT}}&page_title={% if self.seo_title %}{{ self.seo_title|urlencode }}{% else %}{{ self.title|urlencode }}{% endif %}{%if request.META.HTTP_X_IORG_FBS_UIP %}&freebasics_uip={{request.META.HTTP_X_IORG_FBS_UIP}}{%endif%}"
      height="0" width="0" style="display:none;visibility:hidden"></iframe>
    </noscript>
    {% endif %}
    <!-- End Google Tag Manager (noscript) -->

    <!-- Global Google Tag Manager (noscript) -->
    {% if settings.core.SiteSettings.global_ga_tag_manager %}
    <noscript>
      <iframe src="//www.googletagmanager.com/ns.html?id={{settings.core.SiteSettings.global_ga_tag_manager}}&client_session_id={{request.session.MOLO_GA_SESSION_FOR_NOSCRIPT}}"
      height="0" width="0" style="display:none;visibility:hidden"></iframe>
    </noscript>
    {% endif %}
    <!-- End Global Google Tag Manager (noscript) -->

    {% if languages|length > 1 %}
      <div class="language-container">
         {% get_current_language as LANGUAGE_LOCALE %}
          {% for language in languages %}
            <a href="{% url 'locale_set' language.locale %}?next={{request.path}}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}" {% if LANGUAGE_LOCALE == language.locale %} class="active" {% endif %}>{{language.locale | language_name_local}}</a>
          {% endfor %}
      </div>
      {% endif %}

      <div id="gem-header">
          <a id="logo" href="/">
            <img src="{% static 'img/logos/zathu.png' %}" width="120" alt="Zathu" />
          </a>
          <a href="#feature-menu">{% trans "Menu" %}</a>
          {% if not user.is_authenticated %}
            <a class="profile-menu-item" href={{REGISTRATION_URL}}>{% trans "Sign up" %}</a>
          {% else %}
          <a class="profile-menu-item" href="{{VIEW_PROFILE_URL}}">{% trans "Profile" %}</a>
          {% endif %}
          <a class="search-icon" href="#search-form">
            <img src="{% static 'img/icons/search/search_purple.png' %}" width="100%" alt="Search" />
          </a>
      </div>

      {% if 'ninyampinga.com' in request.get_host %}
        <div class="banner__birthday">
          <img class="banner" src="{% static 'img/logos/turamurika.png' %}" alt="GEM" />
        </div>
      {% endif %}

      {% display_unread_notifications %}
      {% block content %}
      {% endblock %}

      <div class="back-to-top">
        <a href="#gem-header">{% trans "Back to Top" %}</a>
      </div>
      <div class="teal-ribbon"></div>
      <div id="gem-footer">
      {% block footer %}
        {% block search %}
          {% include "search/search_block.html" %}
          {% social_media_footer %}
        {% endblock %}

          <ul id="feature-menu" class="sections footer-menu-list">
            <li class="footer-menu-list__item"><a href="/" class="footer-menu-list__anchor
              footer-menu-list__anchor--main">{% trans "Home" %}</a></li>
            {% load_sections as sections %}
              {% for section in sections %}
                <li class="{{section.get_effective_extra_style_hints}} footer-menu-list__item">
                  <a href="{% pageurl section.specific %}" class="footer-menu-list__sub-anchor footer-menu-list__anchor--main">
                      {{section.title}}
                  </a>
                </li>
              {% endfor %}
            {% footer_page %}
            {% if not user.is_authenticated %}
              <li class="footer-menu-list__item">
                <a href="{{ LOGIN_URL }}" class="footer-menu-list__anchor">
                  {% trans "Log in / Sign up" %}
                </a>
              </li>

            {% else %}
            <li class="footer-menu-list__item">
              <a href="{{VIEW_PROFILE_URL}}" class="footer-menu-list__anchor">
                {% trans "Profile" %}
              </a>
            </li>

            <li class="footer-menu-list__item">
              <form method="post" action="{{ LOGOUT_URL }}">
                {% csrf_token %}
                <input class="footer-menu-list__anchor" value="{% trans "Log out" %}" type="submit">
              </form>
            </li>
            {% endif %}
          </ul>
        {% endblock %}
        {% if is_via_kaios %}
          <div class="softkey">
            <div id="softkey-left" class="softkey-link">Back</div>
            <div id="softkey-center" class="softkey-link">SELECT</div>
            <div id="softkey-right" class="softkey-link">Options</div>
          </div>
        {% endif %}

        {% include "base/core/language_block.html" %}
        <div id="footer-bar">
            <p>&copy;{% now "Y" %} Zathu. {% trans "All Rights Reserved." %}</p>
            {% if settings.gem.GemSettings.show_partner_credit %}
              <a href="{{settings.gem.GemSettings.partner_credit_link}}">{{settings.gem.GemSettings.partner_credit_description}}</a>
            {% endif %}
        </div>
      </div>
      {% wagtailuserbar %}
      {% block facebook_analytics %}
        {% include "core/facebook_analytics.html" %}
      {% endblock %}
      {% if not is_via_freebasics %}
        {% compress js inline %}
          <script src="{% static 'js/dest/main-min.js' %}"></script>
          <script>
          !function(a){var b=/iPhone/i,c=/iPod/i,d=/iPad/i,e=/(?=.*\bAndroid\b)(?=.*\bMobile\b)/i,f=/Android/i,g=/(?=.*\bAndroid\b)(?=.*\bSD4930UR\b)/i,h=/(?=.*\bAndroid\b)(?=.*\b(?:KFOT|KFTT|KFJWI|KFJWA|KFSOWI|KFTHWI|KFTHWA|KFAPWI|KFAPWA|KFARWI|KFASWI|KFSAWI|KFSAWA)\b)/i,i=/IEMobile/i,j=/(?=.*\bWindows\b)(?=.*\bARM\b)/i,k=/BlackBerry/i,l=/BB10/i,m=/Opera Mini/i,n=/(CriOS|Chrome)(?=.*\bMobile\b)/i,o=/(?=.*\bFirefox\b)(?=.*\bMobile\b)/i,p=new RegExp("(?:Nexus 7|BNTV250|Kindle Fire|Silk|GT-P1000)","i"),q=function(a,b){return a.test(b)},r=function(a){var r=a||navigator.userAgent,s=r.split("[FBAN");return"undefined"!=typeof s[1]&&(r=s[0]),s=r.split("Twitter"),"undefined"!=typeof s[1]&&(r=s[0]),this.apple={phone:q(b,r),ipod:q(c,r),tablet:!q(b,r)&&q(d,r),device:q(b,r)||q(c,r)||q(d,r)},this.amazon={phone:q(g,r),tablet:!q(g,r)&&q(h,r),device:q(g,r)||q(h,r)},this.android={phone:q(g,r)||q(e,r),tablet:!q(g,r)&&!q(e,r)&&(q(h,r)||q(f,r)),device:q(g,r)||q(h,r)||q(e,r)||q(f,r)},this.windows={phone:q(i,r),tablet:q(j,r),device:q(i,r)||q(j,r)},this.other={blackberry:q(k,r),blackberry10:q(l,r),opera:q(m,r),firefox:q(o,r),chrome:q(n,r),device:q(k,r)||q(l,r)||q(m,r)||q(o,r)||q(n,r)},this.seven_inch=q(p,r),this.any=this.apple.device||this.android.device||this.windows.device||this.other.device||this.seven_inch,this.phone=this.apple.phone||this.android.phone||this.windows.phone,this.tablet=this.apple.tablet||this.android.tablet||this.windows.tablet,"undefined"==typeof window?this:void 0},s=function(){var a=new r;return a.Class=r,a};"undefined"!=typeof module&&module.exports&&"undefined"==typeof window?module.exports=r:"undefined"!=typeof module&&module.exports&&"undefined"!=typeof window?module.exports=s():"function"==typeof define&&define.amd?define("isMobile",[],a.isMobile=s()):a.isMobile=s()}(this);
          var cutsTheMustard = 'querySelector' in document && 'localStorage' in window && 'addEventListener' in window;
          var raf = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
          var smartDevice = (isMobile.apple.device || isMobile.android.device || isMobile.windows.device || !isMobile.other.opera || !isMobile.other.device);

            if (cutsTheMustard === true) {
              if (smartDevice && raf) {
                var jsScripts = [
                   "{% static 'js/dest/kaios-min.js' %}"
                 ];
                for (var i = 0; i < jsScripts.length; i++) {
                  var script = document.createElement('script');
                  script.src = jsScripts[i];
                  script.async = false;
                  document.querySelector('script').parentNode.appendChild(script);
                }
              }
            }
          </script>
        {% endcompress %}
    {% endif %}
  </body>
</html>
