<!-- 文章内容详情 -->
<div id="artDetail">
    <div class="card">
        <div class="card-content article-info">
            <div class="row tag-cate">
                <div class="col s7">
                    <% if (page.tags && page.tags.length) { %>
                        <div class="article-tag">
                            <% page.tags.forEach(function(tag) { %>
                                <a href="<%- url_for(tag.path) %>">
                                    <span class="chip bg-color"><%= tag.name %></span>
                                </a>
                            <% }); %>
                        </div>
                    <% } else { %>
                        <div class="article-tag">
                            <span class="chip bg-color"><%- __("notag") %></span>
                        </div>
                    <% } %>
                </div>
                <div class="col s5 right-align">
                    <% if (page.categories && page.categories.length > 0) { %>
                        <div class="post-cate">
                            <i class="fas fa-bookmark fa-fw icon-category"></i>
                            <% page.categories.forEach(category => { %>
                                <a href="<%- url_for(category.path) %>" class="post-category">
                                    <%- category.name %>
                                </a>
                            <% }); %>
                        </div>
                    <% } %>
                </div>
            </div>

            <div class="post-info">
                <% if (theme.postInfo.date) { %>
                    <div class="post-date info-break-policy">
                        <i class="far fa-calendar-minus fa-fw"></i><%- __('publishDate') %>:&nbsp;&nbsp;
                        <%- date(page.date, 'YYYY-MM-DD') %>
                    </div>
                <% } %>

                <% if (theme.postInfo.update) { %>
                    <div class="post-date info-break-policy">
                        <i class="far fa-calendar-check fa-fw"></i><%- __('updateDate') %>:&nbsp;&nbsp;
                        <%- date(page.updated, 'YYYY-MM-DD') %>
                    </div>
                <% } %>

                <!--  添加作者信息 -->
                <!-- <div class="info-break-policy">-->
                <!--<% if (page.author && page.author.length > 0) { %>-->
                <!--    <i class="fa fa-pencil"></i> 作者: <%- page.author %>-->
                <!--<% } else { %>-->
                <!--    <i class="fa fa-pencil"></i> 作者: <%- config.author %>-->
                <!--<% } %>-->
                <!-- </div>-->

                <% if (theme.postInfo.wordCount) { %>
                    <div class="info-break-policy">
                        <i class="far fa-file-word fa-fw"></i><%- __('wordCount') %>:&nbsp;&nbsp;
                        <%= wordcount(page.content) %>
                    </div>
                <% } %>

                <% if (theme.postInfo.min2read) { %>
                    <div class="info-break-policy">
                        <i class="far fa-clock fa-fw"></i><%- __('readTimes') %>:&nbsp;&nbsp;
                        <%= min2read(page.content) %> <%= __('Minutes') %>
                    </div>
                <% } %>

                <% if (theme.postInfo.readCount && theme.busuanziStatistics && theme.busuanziStatistics.enable) { %>
                    <div id="busuanzi_container_page_pv" class="info-break-policy">
                        <i class="far fa-eye fa-fw"></i><%- __('readCount') %>:&nbsp;&nbsp;
                        <span id="busuanzi_value_page_pv"></span>
                    </div>
                <% } %>
            </div>
        </div>
        <hr class="clearfix">
        <div class="card-content article-card-content">
            <div id="articleContent">
                <%- page.content %>
            </div>
            <hr/>

            <%- partial('_partial/reprint-statement') %>

            <div class="tag_share" style="display: block;">
                <div class="post-meta__tag-list" style="display: inline-block;">
                    <% if (page.tags && page.tags.length) { %>
                        <div class="article-tag">
                            <% page.tags.forEach(function(tag) { %>
                                <a href="<%- url_for(tag.path) %>">
                                    <span class="chip bg-color"><%= tag.name %></span>
                                </a>
                            <% }); %>
                        </div>
                    <% } else { %>
                        <div class="article-tag">
                            <span class="chip bg-color"><%- __("notag") %></span>
                        </div>
                    <% } %>
                </div>
                <div class="post_share"
                     style="zoom: 80%; width: fit-content; display: inline-block; float: right; margin: -0.15rem 0;">
                    <%- partial('_partial/share') %>
                </div>
            </div>
            <% if (theme.reward && theme.reward.enable) { %>
                <%- partial('_partial/reward') %>
            <% } %>
        </div>
    </div>

    <% if (theme.gitalk && theme.gitalk.enable) { %>
        <%- partial('_partial/gitalk') %>
    <% } %>

    <% if (theme.gitment.enable) { %>
        <%- partial('_partial/gitment') %>
    <% } %>

    <% if (theme.disqus.enable) { %>
        <%- partial('_partial/disqus') %>
    <% } %>

    <% if (theme.livere && theme.livere.enable) { %>
        <%- partial('_partial/livere') %>
    <% } %>

    <% if (theme.valine && theme.valine.enable) { %>
        <%- partial('_partial/valine') %>
    <% } %>

    <%- partial('_partial/prev-next') %>
</div>

<% if (theme.copyright.enable) { %>
    <script>
        $('#articleContent').on('copy', function (e) {
            // IE8 or earlier browser is 'undefined'
            if (typeof window.getSelection === 'undefined') return;

            var selection = window.getSelection();
            // if the selection is short let's not annoy our users.
            if (('' + selection).length < Number.parseInt('<%- theme.copyright.minCharNumber %>')) {
                return;
            }

            // create a div outside of the visible area and fill it with the selected text.
            var bodyElement = document.getElementsByTagName('body')[0];
            var newdiv = document.createElement('div');
            newdiv.style.position = 'absolute';
            newdiv.style.left = '-99999px';
            bodyElement.appendChild(newdiv);
            newdiv.appendChild(selection.getRangeAt(0).cloneContents());

            // we need a <pre> tag workaround.
            // otherwise the text inside "pre" loses all the line breaks!
            if (selection.getRangeAt(0).commonAncestorContainer.nodeName === 'PRE') {
                newdiv.innerHTML = "<pre>" + newdiv.innerHTML + "</pre>";
            }

            var url = document.location.href;
            newdiv.innerHTML += '<br />'
                + '<%- __("from") %>: <%- config.title %><br />'
                + '<%- __("author") %>: <%- config.author %><br />'
                + '<%- __("link") %>: <a href="' + url + '">' + url + '</a><br />'
                + '<%- theme.copyright.description %>';

            selection.selectAllChildren(newdiv);
            window.setTimeout(function () {
                bodyElement.removeChild(newdiv);
            }, 200);
        });
    </script>
<% } %>

<!-- 代码块功能依赖 -->
<script type="text/javascript" src="/libs/codeBlock/codeBlockFuction.js"></script>

<!-- 代码语言 -->
<% if (theme.code.lang) { %>
    <script type="text/javascript" src="/libs/codeBlock/codeLang.js"></script>
<% } %>

<!-- 代码块复制 -->
<% if (theme.code.copy) { %>
    <script type="text/javascript" src="/libs/codeBlock/codeCopy.js"></script>
<% } %>

<!-- 代码块收缩 -->
<% if (theme.code.shrink) { %>
    <script type="text/javascript" src="/libs/codeBlock/codeShrink.js"></script>
<% } %>

<!-- 代码块折行 -->
<% if (!theme.code.break) { %>
    <style type="text/css">
        code[class*="language-"], pre[class*="language-"] {
            white-space: pre !important;
        }
    </style>
<% } %>