<div class=“page-content”>

<div class="content" id="post-content">
  <p>{{ content }}</p>

  <div class="licenses">
    <hr>
    <p>本作品采用<a rel="license"
      href="http://creativecommons.org/licenses/by-nc-nd/4.0/"
      target="_blank">知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议</a>进行许可。</p>
  </div>

  {% if site.reward and site.reward == true %}
  {% unless page.reward != null and page.reward == false %}
  <div class="reward">
    <hr>
    <div class="reward-qr-code" style="display: none">
      {% assign image_files = site.static_files | where: "image", true %}
      {% for image in image_files %}
        {% if image.basename == 'alipay' or image.basename == 'wechat' %}
        <div class="{{ image.basename }}">
          <img src="{{ image.path }}" alt="{{ image.basename }} reward qr code">
          {% case image.basename %}
          {% when 'alipay' %}
          <span>支付宝打赏</span>
          {% when 'wechat' %}
          <span>微信打赏</span>
          {% endcase %}
        </div>
        {% endif %}
      {% endfor %}
    </div>

    {% if site.reward_description %}
    <p>{{ site.reward_description }}</p>
    {% endif %}
    <div id="btn-show-reward">
      <div onclick="showReward()">赏</div>
    </div>
  </div>
  {% endunless %}
  {% endif %}

  {% if site.comment and site.comment == true %}
  {% unless page.comment != null and page.comment == false %}

    {% if site.gitment_client_id and site.gitment_secret %}
    <hr>
    <div id="btn-show-comment">
      <div onclick="showComment()">显示评论</div>
    </div>
    <div id="comment" style="display: none">
      <!-- gitment 代码 -->
      <div id="container"></div>
      <link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
      <script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
      <script>
        const myTheme = {
          render(state, instance) {
            const container = document.createElement('div')
            container.lang = "en-US"
            container.className = 'gitment-container gitment-root-container'
            container.appendChild(instance.renderHeader(state, instance))
            container.appendChild(instance.renderEditor(state, instance))
            container.appendChild(instance.renderComments(state, instance))
            container.appendChild(instance.renderFooter(state, instance))
            return container
          },
        }

        const gitment = new Gitment({
          id: '{{ page.date }}',
          owner: '{{ site.gitment_owner }}',
          repo: '{{ site.gitment_repo }}',
          oauth: {
            client_id: '{{ site.gitment_client_id }}',
            client_secret: '{{ site.gitment_secret }}',
          },
          theme: myTheme,
        })

        gitment.render('container')
      </script>
      <!-- gitment 代码 -->
    </div>
    {% endif %}

    {% if site.livere_uid %}
    <hr>
    <div id="btn-show-comment">
      <div onclick="showComment()">显示评论</div>
    </div>
    <div id="comment" style="display: none">
      <!-- 来必力 City 版安装代码 -->
      <div id="lv-container" data-id="city" data-uid="{{ site.livere_uid }}">
        <script type="text/javascript">
          (function(d, s) {
            var j, e = d.getElementsByTagName(s)[0];

            if (typeof LivereTower === 'function') { return; }

            j = d.createElement(s);
            j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
            j.async = true;

            e.parentNode.insertBefore(j, e);
          })(document, 'script');
        </script>
        <noscript>为正常使用来必力评论功能请激活 JavaScript</noscript>
      </div>
      <!-- City 版安装代码已完成 -->
    </div>
    {% endif %}
  {% endunless %}
  {% endif %}

  <script>
    function showComment() {
      if(document.getElementById("comment").style.display=="none") {
        document.getElementById("comment").style.display="block";
        document.getElementById("btn-show-comment").style.display="none";
      }
    }

    function showReward() {
      if (document.getElementsByClassName("reward-qr-code")[0].style.display=="none" ) {
        document.getElementsByClassName("reward-qr-code")[0].style.display="block";
      } else {
        document.getElementsByClassName("reward-qr-code")[0].style.display="none";
      }
    }
  </script>
</div>

</div>