nimforum/redesign/replybox.nim
2018-05-12 14:08:08 +01:00

65 lines
No EOL
2.1 KiB
Nim

when defined(js):
import strformat, options
from dom import getElementById, scrollIntoView, setTimeout
include karax/prelude
import karax / [vstyles, kajax, kdom]
import karaxutils, threadlist, post
type
ReplyBox* = ref object
shown: bool
preview: bool
proc newReplyBox*(): ReplyBox =
ReplyBox()
proc performScroll() =
let replyBox = dom.document.getElementById("reply-box")
replyBox.scrollIntoView(false)
proc show*(state: ReplyBox) =
# Scroll to the reply box.
if not state.shown:
# TODO: It would be nice for Karax to give us an event when it renders
# things. That way we can remove this crappy hack.
discard dom.window.setTimeout(performScroll, 50)
else:
performScroll()
state.shown = true
proc render*(state: ReplyBox, thread: Thread, post: Option[Post]): VNode =
if not state.shown:
return buildHtml(tdiv(id="reply-box"))
result = buildHtml():
tdiv(class="information no-border", id="reply-box"):
tdiv(class="information-icon"):
italic(class="fas fa-reply")
tdiv(class="information-main", style=style(StyleAttr.width, "100%")):
tdiv(class="information-title"):
if post.isNone:
text fmt("Replying to \"{thread.topic}\"")
else:
text "Replying to "
renderUserMention(post.get().author)
tdiv(class="information-content"):
tdiv(class="panel"):
tdiv(class="panel-nav"):
ul(class="tab tab-block"):
li(class=class({"active": not state.preview}, "tab-item")):
a(href="#"):
text "Message"
li(class=class({"active": state.preview}, "tab-item")):
a(href="#"):
text "Preview"
tdiv(class="panel-body"):
textarea(class="form-input", rows="5")
tdiv(class="panel-footer"):
button(class="btn btn-primary float-right"):
text "Reply"
button(class="btn btn-link float-right"):
text "Cancel"