<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>${metadata.alias!}</title>
    <style>
        nav a.selected{border-bottom:1px solid #f099f0;}
    </style>
</head>
<body>
    <header data-diy="page">
        <h1>${(site.name)!}</h1>
        <#if base??>
            <a href="?locale=en">English</a>
            <a href="?locale=zh_CN">中文</a>
            <a href="?locale=ja">日本語</a>
        </#if>
    </header>
    <nav data-diy="category">
        <a href="${site.useStatic?then(site.sitePath,site.dynamicPath)}" data-id="home">Home</a>
<@cms.categoryList>
    <#list page.list as category>
        <a href="${category.url!}" target="_blank" data-id="${category.id}" data-diy-item="${category.id}">${category.name}</a>
    </#list>
</@cms.categoryList>
    </nav>
    <main>
        <h2>Latest content</h2>
        <div class="content">
<@cms.contentList onlyUrl=false pageSize=10>
    <#list page.list as content>
        <article data-diy-item="${content.id}">
            <h3><a href="${content.url!}" target="_blank">${content.title}</a></h3>
            <p>
                <#if content.cover?has_content><img src="${content.cover}" alt="${content.title}"/></#if>
                ${content.description!}
            </p>
        </article>
    </#list>
</@cms.contentList>
        </div>
        <aside data-diy="content">
            <h3>Popular content</h3>
            <ul>
        <@cms.contentList orderField='clicks' pageSize=10>
            <#list page.list as content>
                <li data-diy-item="${content.id}"><a href="<#if content.onlyUrl>${site.dynamicPath}content/redirect?id=${content.id}<#else>${content.url!}</#if>" target="_blank">${content.title}</a><span>${content.clicks}</span></li>
            </#list>
        </@cms.contentList>
            </ul>
        </aside>
    </main>
    <script>
    var templatePath='${.current_template_name?keep_after('/')}';
    </script>
    <#-- footer -->
    <footer>
        Copyright &copy; ${.now?string('yyyy')}
        <@sys.record code="visit"><#assign history=object.data?eval_json/><p><@visit.dayList pageSize=1><#list page.list as a><#if a?is_first>There were ${a.uv} visits before ${.now?string('HH:mm')} today<#else>${a.uv} visits yesterday</#if>, </#list></@visit.dayList>a cumulative ${history.uv}, and a maximum of ${history.maxUv} on ${history.maxUvDate?number_to_date}</p></@sys.record>
    </footer>
    <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>
    <#-- end footer -->
    <script>
    var nav = document.querySelector('nav a[data-id="home"]');
    if(nav){
        nav.className="selected";
    }
    </script>
</body>
</html>