{include "layout.html"}

{block "content"}
<div class="thread-title mb-05">
	<h2>{thread.Title}</h2>
	<div>
		<a href="/forum"><button class="btn">Back</button></a>
		<a href="#reply"><button class="btn btn-primary">Reply</button></a>
	</div>
</div>

<!-- Original Thread Post -->
<div class="forum-post original-post">
	<div class="left">
		<div class="timestamp">
			<b>OP</b> - {thread.PostedTime().Format("Jan 2, 2006 3:04 PM")}
		</div>
		<div>
			{md(thread.Content)}
		</div>
	</div>
	<div class="right">
		<div>{thread.AuthorUsername}</div>
		<div class="user-class">Level {thread.AuthorLevel} {thread.AuthorClass}</div>
	</div>
</div>

<!-- Replies -->
{if #replies > 0}
{for reply in replies}
<div class="forum-post">
	<div class="left">
		<div class="timestamp">
			{reply.PostedTime().Format("Jan 2, 2006 3:04 PM")}
		</div>
		<div>
			{md(reply.Content)}
		</div>
	</div>
	<div class="right">
		<div>{reply.AuthorUsername}</div>
		<div class="user-class">Level {reply.AuthorLevel} {reply.AuthorClass}</div>
	</div>
</div>
{/for}
{/if}

<!-- Pagination -->
{if totalPages > 1}
<div class="mt-1">
	{if hasPrev}
		<a href="/forum/{thread.ID}?page={currentPage - 1}"><button class="btn">Previous</button></a>
	{/if}

	<span>Page {currentPage} of {totalPages}</span>

	{if hasNext}
		<a href="/forum/{thread.ID}?page={currentPage + 1}"><button class="btn">Next</button></a>
	{/if}
</div>
{/if}

<!-- Reply Form at Bottom -->
<div id="reply" class="bottom-reply">
	<form action="/forum/{thread.ID}/reply" method="post" class="standard">
		{csrf}

		<div class="mb-1">
			<textarea class="text w-full" placeholder="Type your reply here!" name="content"></textarea>
		</div>

		<div>
			<button type="submit" class="btn btn-primary">Reply</button>
		</div>
	</form>
</div>
{/block}