1 files changed, 31 insertions, 15 deletions

diff --git a/client/js/views/post_main_view.js b/client/js/views/post_main_view.js
index 5ef7f61..c6b312b 100644
--- a/client/js/views/post_main_view.js
+++ b/client/js/views/post_main_view.js
@@ -32,15 +32,10 @@ class PostMainView {
             postContainerNode,
             ctx.post,
             () => {
-                const margin = sidebarNode.getBoundingClientRect().left;
-
                 return [
-                    window.innerWidth -
-                        postContainerNode.getBoundingClientRect().left -
-                        margin,
+                    postContainerNode.getBoundingClientRect().width,
                     iosCorrectedInnerHeight() -
-                        topNavigationNode.getBoundingClientRect().height -
-                        margin * 2,
+                        postContainerNode.getBoundingClientRect().top,
                 ];
             }
         );
@@ -55,7 +50,8 @@ class PostMainView {
         }
 
         this._installSidebar(ctx);
-        this._installCommentForm();
+        const commentForm = this._installCommentForm();
+        this._installAddCommentButton(commentForm);
         this._installComments(ctx.post.comments);
 
         const showPreviousImage = () => {
@@ -86,6 +82,12 @@ class PostMainView {
             }
         };
 
+        const showRandomImage = () => {
+            if (ctx.randomPostId) {
+                router.show(ctx.getPostUrl(ctx.randomPostId, ctx.parameters));
+            }
+        };
+
         keyboard.bind("e", () => {
             if (ctx.editMode) {
                 router.show(uri.formatClientLink("post", ctx.post.id));
@@ -95,6 +97,7 @@ class PostMainView {
         });
         keyboard.bind(["a", "left"], showPreviousImage);
         keyboard.bind(["d", "right"], showNextImage);
+        keyboard.bind("r", showRandomImage);
         keyboard.bind("del", (e) => {
             if (ctx.editMode) {
                 this.sidebarControl._evtDeleteClick(e);
@@ -105,14 +108,16 @@ class PostMainView {
             postContainerNode,
             () => {
                 if (!ctx.editMode) {
-                    showPreviousImage();
+                    showNextImage();
                 }
             },
             () => {
                 if (!ctx.editMode) {
-                    showNextImage();
+                    showPreviousImage();
                 }
-            }
+            },
+            () => {},
+            () => {}
         );
     }
 
@@ -124,14 +129,14 @@ class PostMainView {
         if (ctx.editMode) {
             this.sidebarControl = new PostEditSidebarControl(
                 sidebarContainerNode,
-                ctx.post,
+                ctx,
                 this._postContentControl,
                 this._postNotesOverlayControl
             );
         } else {
             this.sidebarControl = new PostReadonlySidebarControl(
                 sidebarContainerNode,
-                ctx.post,
+                ctx,
                 this._postContentControl
             );
         }
@@ -142,14 +147,25 @@ class PostMainView {
             "#content-holder .comment-form-container"
         );
         if (!commentFormContainer) {
-            return;
+            return null;
         }
-
         this.commentControl = new CommentControl(
             commentFormContainer,
             null,
             true
         );
+        return commentFormContainer;
+    }
+
+    _installAddCommentButton(commentForm) {
+        const addCommentButton = document.querySelector("#add-comment-button");
+        if (!addCommentButton || !commentForm) {
+            return;
+        }
+        commentForm.hidden = true; // collapse by default
+        addCommentButton.addEventListener("click", () => {
+            commentForm.hidden = !commentForm.hidden
+        });
     }
 
     _installComments(comments) {