<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Comment - ${content.title}</title>
    <meta name="keywords" content="<#list getKeywords(content.title) as a>${a}<#sep>,</#list>"/>
    <meta name="description" content="${content.description!}"/>
    <style type="text/css">
        .right{float:right;}
        .gray{color:gray;}
        .border{border:1px solid gray;}
        .underline{border-bottom:1px dashed gray;}
        .pagination{list-style:none;}
        .pagination:after{content:"";display:block;clear:both;}
        .pagination .page-item{padding:0 0.3rem;float:left;}
        .pagination .page-item .page-link{margin-left:0;border-radius:0.2rem;padding:0.375rem 0.875rem;color:#999;border-color:#eee;}
        .page-item.active .page-link{background-color:#4C81E7;border-color:#eee;color:#FFF;}
    </style>
</head>
<body>
    <header data-diy="page">
        <h1>${(site.name)!}</h1>
    </header>
    <nav data-diy="category">
        <a href="${site.useStatic?then(site.sitePath,site.dynamicPath)}">Home</a>
<@cms.categoryList>
    <#list page.list as category>
        <a href="${category.url!}" target="_blank" data-diy-item="${category.id}">${category.name}</a>
    </#list>
</@cms.categoryList>
    </nav>
    <main>
        <h1 data-diy="content" data-diy-id="${(content.id)!}"><a href="${content.url!}">${content.title}</a></h1>
        <p>${content.description!}</p>
<#if user?has_content>
    <@cms.commentList advanced=true userId=user.id contentId=content.id status=2>
        <#if page.totalCount gt 0>
            <h3>My Comments</h3>
            <ul data-diy="comment">
            <#list page.list as a>
                <li class="underline" data-diy-item="${a.id}">
                    <p>${user.nickname} <span class="gray">under review</span><span class="right">${a.createDate}</span></p>
                    <p>${a.text!}<span class="right"><a href="comment.html?contentId=${content.id}&id=${a.id}">Edit</a></span></p>
                </li>
            </#list>
            </ul>
        </#if>
    </@cms.commentList>
        <form method="post" action="${site.dynamicPath}comment/save">
            <@cms.comment id=id>
                <input type="hidden" name="id" value="${object.id}"/>
                <#assign text=object.text!/>
            </@cms.comment>
            <input type="hidden" name="replyId" value="${replyId!}"/>
            <input type="hidden" name="_csrf" value="<@tools.csrfToken/>"/>
            <input type="hidden" name="contentId" value="${content.id}"/>
            <input name="returnUrl" type="hidden" value="${content.url!}"/>
            <p><label>Comment:</label></p>
            <p><textarea name="text" cols="100" rows="4" maxlength="1000">${text!}</textarea></p>
            <@sys.configData code="safe">
                <#if object.captcha?has_content && object.captcha?split(",")?seq_contains("comment")>
            <p>
                <input name="captcha" type="text" autocomplete="off" placeholder="Captcha" title="Captcha"/>
                <img src="${site.dynamicPath}getCaptchaImage?${.now?long}" alt="captcha" onclick="this.src=this.src+'&'+new Date().getTime()"/>
            </p>
                </#if>
            </@sys.configData>
            <p><input type="submit" value="Submit"/></p>
        </form>
<#else>
        <a href="login.html?returnUrl=${(site.dynamicPath+'comment.html?contentId='+content.id)?url}">Login</a>
        <a href="register.html?returnUrl=${(site.dynamicPath+'comment.html?contentId='+content.id)?url}">Register</a>
</#if>
<#macro merge name value><#if !.vars[name]??><@"<#assign ${name}=''>"?interpret /></#if><#if value?has_content><@"<#assign ${name}=${name}+'${value},'>"?interpret /></#if></#macro>
<@cms.commentList contentId=content.id pageIndex=pageIndex>
    <#list page.list as a>
        <@merge 'userIds' a.userId!/>
        <@merge 'userIds' a.replyUserId!/>
    </#list>
    <@sys.user ids=userIds!><#assign userMap=map!/></@sys.user>
    <h3>Comments</h3>
    <ul>
    <#list page.list as a>
        <li class="underline">
            <p>${userMap[a.userId?string].nickname}<span class="right">${a.createDate}</span></p>
            <#if a.replyId?has_content>
                <@cms.comment id=a.replyId>
                    <p class="border gray">${userMap[a.replyUserId?string].nickname} : ${object.text!}</p>
                </@cms.comment>
            </#if>
            <p>${a.text!}<span class="right"><a href="comment.html?contentId=${content.id!}&replyId=${a.id}">Reply</a></span></p>
        </li>
    </#list>
    </ul>
    <ul class="pagination">
        <#assign
            start=1
            end=page.totalPage
        />
        <#if (page.pageIndex-5) gt start>
            <#assign start=page.pageIndex-4/>
        </#if>
        <#if (page.pageIndex+5) lt end>
            <#assign end=page.pageIndex+4/>
        </#if>
        <li class="page-item"><a class="page-link" href="${getPage('comment.html?id=${content.id}',page.prePage,'pageIndex')}">Previous page</a></li>
        <#if start gt 1>
            <li class="page-item"><a class="page-link" href="${'comment.html?id=${content.id}'}">1</a></li>
            <li class="page-item"><span class="page-link">...</span></li>
        </#if>
        <#list start..end as n>
            <li class="page-item<#if n=page.pageIndex> active</#if>"><a class="page-link" href="${getPage('comment.html?id=${content.id}',n,'pageIndex')}">${n}</a></li>
        </#list>
        <#if end lt page.totalPage>
            <li class="page-item"><span class="page-link">...</span></li>
            <li class="page-item"><a class="page-link" href="${getPage('comment.html?id=${content.id}',page.totalPage,'pageIndex')}">${page.totalPage}</a></li>
        </#if>
        <li class="page-item"><a class="page-link" href="${getPage('comment.html?id=${content.id}',page.nextPage,'pageIndex')}">Next page</a></li>
    </ul>
</@cms.commentList>
    </main>
    <footer>
        Copyright &copy; ${.now?string('yyyy')}
    </footer>
    <script>
    var itemString="itemType=content&itemId=${content.id}";
    var templatePath='${.current_template_name?keep_after('/')}';
    </script>

    <script src="${site.dynamicPath}resource/js/cms.support.js"></script>
    <script>
        var ca = cmsAnalytics();
        var url='${site.dynamicPath}api/visit/record';
        if("string" ==typeof itemString){
            url=url+"?"+itemString;
        }
        ca.setDomain('${site.sitePath?keep_after('//')?keep_before('/')?keep_before(':')}');
        ca.setPath('/');
        ca.report(url);
    </script>
</body>
</html>