<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="Content-Security-Policy" content="{{mobiusConfig.[meta-csp]}}">
  {{!-- 渲染 favicon --}}
  {{#each mobiusConfig.manifest.icons as |icon|}}
  <link rel="{{icon.rel}}" type="{{icon.type}}" sizes="{{icon.sizes}}" href="{{icon.src}}">
  {{/each}}
  {{!-- 渲染额外引入的字体资源 --}}
  {{!-- @see https://developer.mozilla.org/zh-CN/docs/Web/HTML/Preloading_content --}}
  {{#each mobiusConfig.fonts as |extra-font|}}
  <link rel='preload' as="font" href="{{extra-font}}" type="font/woff2" crossorigin="anonymous" />
  {{/each}}

  <title>{{mobiusConfig.title}}</title>

  <script>
    Function.prototype.whisperToStrangers = function () {
      let l = new String(this)
      l = l.substring(l.indexOf("/*") + 3, l.lastIndexOf("*/"))
      return l
    }

    let words = function () {
      /*
           __  __      ____      ____      _____     _    _      _____
          |  \/  |    / __ \    |  _ \    |_   _|   | |  | |    / ____|
          | \  / |   | |  | |   | |_) |     | |     | |  | |   | (___
          | |\/| |   | |  | |   |  _ <      | |     | |  | |    \___ \
          | |  | |   | |__| |   | |_) |    _| |_    | |__| |    ____) |
          |_|  |_|    \____/    |____/    |_____|    \____/    |_____/
       */
    }
    console.log(words.whisperToStrangers());
    console.log("        %c🧿  {{mobiusConfig.whisper}}", "color:hsla(264,100%,50%,100%);line-height: 2;")
    console.log("        %c             (☞ﾟヮﾟ)☞  Have a nice day  ☜(ﾟヮﾟ☜)", "color:red;")
    console.log(`        %c                       Copyright (c) ${new Date().getFullYear()}`, "color:hsla(96,100%,50%,100%)")
  </script>

  {{!-- 渲染单独定义的 异步加载 外部样式表 --}}
  {{#each mobiusConfig.asyncCss as |outer-async-css|}}
  <link rel="stylesheet" href="{{outer-async-css}}" media="print" onload="this.media='all'; this.onload=null;" />
  {{/each}}
  {{!-- 渲染单独定义的 同步加载 外部样式表 --}}
  {{#each mobiusConfig.css as |outer-css|}}
  <link rel='stylesheet' href="{{outer-css}}" />
  {{/each}}
  {{!-- 渲染 webpack 打包完成的 CSS --}}
  {{#each htmlWebpackPlugin.css as |inner-css|}}
  <link rel="stylesheet" href="{{inner-css}}">
  {{/each}}
  {{!-- 渲染单独定义的脚本文件 --}}
  {{#each mobiusConfig.scripts as |outer-js|}}
  <link rel='preload' as='script' herf="{{outer-js}}" />
  {{/each}}
  {{!-- 渲染 webpack 打包完成的 JavaScript --}}
  {{#each htmlWebpackPlugin.js as |inner-js|}}
  <script defer src="{{inner-js}}"></script>
  {{/each}}

  {{!-- 渲染额外的 head 标签 --}}
  {{{mobiusConfig.headHtmlSnippet}}}
</head>

<body>
  {{!-- 渲染额外的 body 内容 --}}
  {{{mobiusConfig.bodyHtmlSnippet}}}

  {{!-- 渲染百度统计代码 --}}
  {{#if mobiusConfig.baiduAnalytics.trackingId}}
  <script>
    var _hmt = _hmt || [];
    (function () {
      var hm = document.createElement("script");
      hm.src = "https://hm.baidu.com/hm.js?{{ mobiusConfig.baiduAnalytics.trackingId }}";
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
    })();
  </script>
  {{/if}}

  {{!-- 渲染 Google Analytics 代码 --}}
  {{#if mobiusConfig.googleAnalytics.trackingId}}
  <script async src="https://www.googletagmanager.com/gtag/js?id={{mobiusConfig.googleAnalytics.trackingId}}"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { dataLayer.push(arguments); }
    gtag('js', new Date());
    gtag('config', '{{ mobiusConfig.googleAnalytics.trackingId }}');
  </script>
  {{/if}}
</body>

</html>
