extends ../layouts/main-sidebar
block content

  include ../comment/components/comment

  article(dtp-post-id= post._id)
    .uk-margin
      div(uk-grid)
        .uk-width-expand
          h1.article-title= post.title
      .uk-text-lead= post.summary
    .uk-margin
      .uk-article-meta
        div(uk-grid).uk-grid-small.uk-flex-top
          .uk-width-expand
            div published: #{moment(post.created).format('MMM DD, YYYY - hh:mm a').toUpperCase()}
          if user && user.flags.isAdmin
            .uk-width-auto
              a(href=`/admin/post/${post._id}`)
                +renderButtonIcon('fa-pen', 'edit')
          .uk-width-auto
            +renderButtonIcon('fa-eye', displayIntegerValue(post.stats.totalViewCount))
          .uk-width-auto
            +renderButtonIcon('fa-chevron-up', displayIntegerValue(post.stats.upvoteCount))
          .uk-width-auto
            +renderButtonIcon('fa-chevron-down', displayIntegerValue(post.stats.downvoteCount))
          .uk-width-auto
            +renderButtonIcon('fa-comment', displayIntegerValue(post.stats.commentCount))
    .uk-margin
      != post.content

    if post.updated
      .uk-margin
        .uk-article-meta This post was updated on #{moment(post.updated).format('MMMM DD, YYYY, [at] hh:mm a')}.

  if user && post.flags.enableComments
    +renderSectionTitle('Add a comment')
    
    .uk-margin
      form(method="POST", action=`/post/${post._id}/comment`, onsubmit="return dtp.app.submitForm(event, 'create-comment');").uk-form
        .uk-card.uk-card-secondary.uk-card-small
          .uk-card-body
            textarea(
              id="content",
              name="content",
              rows="4",
              maxlength="3000",
              placeholder="Enter comment",
              oninput="return dtp.app.onCommentInput(event);",
            ).uk-textarea.uk-resize-vertical
            .uk-text-small
              div(uk-grid).uk-flex-between
                .uk-width-auto You are commenting as: #{user.username}
                .uk-width-auto #[span#comment-character-count 0] of 3,000
          .uk-card-footer
            div(uk-grid).uk-flex-between
              .uk-width-expand
                button(
                  type="button",
                  data-target-element="content",
                  title="Add an emoji",
                  onclick="return dtp.app.showEmojiPicker(event);",
                ).uk-button.dtp-button-default
                  span
                    i.far.fa-smile
              .uk-width-auto
                button(type="submit").uk-button.dtp-button-primary Post comment
    
    .uk-margin
      +renderSectionTitle('Comments')

    .uk-margin
      if Array.isArray(comments) && (comments.length > 0)
        ul#post-comment-list.uk-list
          each comment in comments
            +renderComment(comment)
      else
        ul#post-comment-list.uk-list
          div There are no comments at this time. Please check back later.