5 files changed, 86 insertions, 0 deletions

diff --git a/src/views/comment.pug b/src/views/comment.pug
new file mode 100644
index 0000000..24e1a9b
--- /dev/null
+++ b/src/views/comment.pug
@@ -0,0 +1,18 @@
+include utils
+mixin comment(com, isfirst)
+  - var data = com.data
+  - var kind = com.kind
+  if kind == "more"
+    div.more #{data.count} more comments
+  else
+    div(class=`comment ${isfirst?'first':''}`)
+      div.comment-body !{data.body}
+      div.info-container
+        div.info-item by u/#{data.author}
+        div.info-item ↑ #{fmtnum(data.ups)}
+      div.replies
+      if data.replies
+        if data.replies.data
+          if data.replies.data.children
+            each reply in data.replies.data.children
+              +comment(reply,false)
diff --git a/src/views/comments.pug b/src/views/comments.pug
new file mode 100644
index 0000000..f7964a3
--- /dev/null
+++ b/src/views/comments.pug
@@ -0,0 +1,25 @@
+doctype html
+html
+  head
+    meta(charset='UTF-8')
+    title reddit
+    link(rel='stylesheet', href='/styles.css')
+  body
+    main#content
+      div.header
+        a(href=`/r/${post.subreddit}`)
+          h4 ← r/#{post.subreddit}
+        h2 #{post.title}
+        if post.post_hint == 'image'
+          img(src=post.url).post-media
+        else if post.post_hint == 'hosted:video'
+          video(src=post.url).post-media
+        p.self-text !{post.selftext}
+        hr
+
+      div.comments-container
+        each child in comments
+          include comment
+          +comment(child, true)
+
+    script(src='https://unpkg.com/[email protected]')
diff --git a/src/views/index.pug b/src/views/index.pug
new file mode 100644
index 0000000..d017570
--- /dev/null
+++ b/src/views/index.pug
@@ -0,0 +1,19 @@
+doctype html
+html
+  head
+    meta(charset='UTF-8')
+    title reddit
+    link(rel='stylesheet', href='/styles.css')
+  body
+    main#content
+      div.header
+        a(href=`/r/#{subreddit}`)
+          h1 r/#{subreddit}
+        if about
+          p #{about.public_description}
+
+      each child in posts.posts
+        include post
+        +post(child.data)
+
+    script(src='https://unpkg.com/[email protected]')
diff --git a/src/views/post.pug b/src/views/post.pug
new file mode 100644
index 0000000..77ef3f5
--- /dev/null
+++ b/src/views/post.pug
@@ -0,0 +1,21 @@
+include utils
+mixin post(p)
+  article.post
+    div.post-container
+      div.post-text
+        div.title-container !{p.title} 
+        div.info-container 
+          div.info-item by u/#{p.author}
+          div.info-item ↑ #{fmtnum(p.ups)}
+          div.info-item #{p.domain}
+          div.info-item 
+            a(href=`/r/${p.subreddit}`) r/#{p.subreddit}
+          div.info-item 
+            a(href=`/comments/${p.id}`) #{fmtnum (p.num_comments)} #{fmttxt(p.num_comments, 'comment')} 
+      div.media-preview
+        if p.post_hint == "image" || p.post_hint == "link"
+          if p.thumbnail && p.thumbnail != "self" || p.thumbnail != "default"
+            a(href=p.url)
+              img(src=p.thumbnail width='100px') 
+        else if p.post_hint == "hosted:video"
+          video(src=p.secure_media.reddit_video.scrubber_media_url width='100px') 
diff --git a/src/views/utils.pug b/src/views/utils.pug
new file mode 100644
index 0000000..f3f61bb
--- /dev/null
+++ b/src/views/utils.pug
@@ -0,0 +1,3 @@
+- var fmtnum = (n)=>n>=1000?(n/1000).toFixed(1)+'k':n;
+- var fmttxt = (n,t)=>`${t}${n==1?'':'s'}`
+