@(issue: model.Issue, comments: List[model.IssueComment], repository: service.RepositoryService.RepositoryInfo)(implicit context: app.Context)
@import context._
@import view.helpers._
@html.main("%s - Issue #%d - %s/%s".format(issue.title, issue.issueId, repository.owner, repository.name)){
  @html.header("issues", repository)
  @issuestab("issues", repository)
  <ul class="nav nav-tabs">
    <li class="pull-left"><a href="@path/@repository.owner/@repository.name/issues"><i class="icon-arrow-left"></i> Back to issue list</a></li>
    <li class="pull-right">Issue #@issue.issueId</li>
  </ul>
  <div class="row-fluid">
    <div class="span10">
      <div class="box">
        <div class="box-content">
          <div class="small"><a href="#">@issue.openedUserName</a> opened this issue @datetime(issue.registeredDate)</div>
          <h4>@issue.title</h4>
        </div>
        <div class="box-content" style="background-color: #f5f5f5;">
          @markdown(issue.content getOrElse "No description given.", repository, false, true, true)
        </div>
      </div>
      <span id="comment-area">
      @comments.map { comment =>
        <div class="box">
          <div class="box-header-small">
            <a href="@path/@comment.commentedUserName">@comment.commentedUserName</a> commented
            <span class="pull-right">@datetime(comment.registeredDate)</span>
          </div>
          <div class="box-content" style="background-color: #f5f5f5;">
            @markdown(comment.content, repository, false, true, true)
          </div>
        </div>
      }
      </span>
      <div class="box">
        <div class="box-content">
          @html.preview(repository, "", false, true, true, "width: 730px; height: 100px;")
        </div>
      </div>
      <input type="button" class="btn btn-success" value="Comment" id="comment"/>
    </div>
    <div class="span2">
      @if(issue.closed) {
        <a class="btn btn-large btn-danger disabled">Closed</a>
      } else {
        <a class="btn btn-large btn-success disabled">Open</a>
      }
      <div class="small">@comments.size comments</div>
      <hr/>
      <strong>Labels</strong>
    </div>
  </div>
}
<script>
$(function(){
  $('#comment').click(function(){
    $.post('@path/@repository.owner/@repository.name/issue_comments',
    {
      issueId : @issue.issueId,
      content : $('#content').val()
    },
    function(data){
      var div = $('<div>').addClass('box')
          .append($('<div>').addClass('box-header-small')
              .append($('<a>').attr('href', '@path/@repository.owner').text(data.commentedUserName))
              .append(' commented')
              .append($('<span>').addClass('pull-right').text(data.registeredDate)))
          .append($('<div>').addClass('box-content').attr('style', 'background-color: #f5f5f5;').html(data.content));
      $('#comment-area').append(div);
      $('#content').val('');
    });
  });
});
</script>