From d610ea663f3ad257090af47d44b3f8152a194d7d Mon Sep 17 00:00:00 2001
From: Toby Zerner <toby.zerner@gmail.com>
Date: Tue, 22 Sep 2015 17:05:14 +0930
Subject: [PATCH] Keep post actions visible when controls dropdown is open

Also show without hover on touch devices
---
 js/forum/src/components/Post.js   | 14 ++++++++++++--
 js/forum/src/initializers/boot.js |  6 +++++-
 js/lib/components/Dropdown.js     |  8 +++++++-
 less/forum/Post.less              |  9 +++++++--
 4 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/js/forum/src/components/Post.js b/js/forum/src/components/Post.js
index 8a14ab12b..b12ec4253 100644
--- a/js/forum/src/components/Post.js
+++ b/js/forum/src/components/Post.js
@@ -31,7 +31,8 @@ export default class Post extends Component {
       () => {
         const user = this.props.post.user();
         return user && user.freshness;
-      }
+      },
+      () => this.controlsOpen
     );
   }
 
@@ -56,7 +57,9 @@ export default class Post extends Component {
                       className="Post-controls"
                       buttonClassName="Button Button--icon Button--flat"
                       menuClassName="Dropdown-menu--right"
-                      icon="ellipsis-h">
+                      icon="ellipsis-h"
+                      onshow={() => this.$('.Post-actions').addClass('open')}
+                      onhide={() => this.$('.Post-actions').removeClass('open')}>
                       {controls}
                     </Dropdown>
                   </li> : ''}
@@ -70,6 +73,13 @@ export default class Post extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    const $actions = this.$('.Post-actions');
+    const $controls = this.$('.Post-controls');
+
+    $actions.toggleClass('open', $controls.hasClass('open'));
+  }
+
   /**
    * Get attributes for the post element.
    *
diff --git a/js/forum/src/initializers/boot.js b/js/forum/src/initializers/boot.js
index ada9b0965..1aa78203a 100644
--- a/js/forum/src/initializers/boot.js
+++ b/js/forum/src/initializers/boot.js
@@ -77,7 +77,11 @@ export default function boot(app) {
 
   // Initialize FastClick, which makes links and buttons much more responsive on
   // touch devices.
-  $(() => FastClick.attach(document.body));
+  $(() => {
+    FastClick.attach(document.body)
+
+    $('body').addClass('ontouchstart' in window ? 'touch' : 'no-touch');
+  });
 
   app.booted = true;
 }
diff --git a/js/lib/components/Dropdown.js b/js/lib/components/Dropdown.js
index 2320190a3..fcc6cb537 100644
--- a/js/lib/components/Dropdown.js
+++ b/js/lib/components/Dropdown.js
@@ -14,6 +14,7 @@ import listItems from 'flarum/helpers/listItems';
  * - `caretIcon` The name of an icon to show on the right of the button.
  * - `label` The label of the dropdown toggle button. Defaults to 'Controls'.
  * - `onhide`
+ * - `onshow`
  *
  * The children will be displayed as a list inside of the dropdown menu.
  */
@@ -52,9 +53,14 @@ export default class Dropdown extends Component {
         'Dropdown-menu--top',
         $menu.offset().top + $menu.height() > $(window).scrollTop() + $(window).height()
       );
+
+      if (this.props.onshow) {
+        this.props.onshow();
+        m.redraw();
+      }
     });
 
-    this.$().on('hide.bs.dropdown', () => {
+    this.$().on('hidden.bs.dropdown', () => {
       if (this.props.onhide) {
         this.props.onhide();
         m.redraw();
diff --git a/less/forum/Post.less b/less/forum/Post.less
index d941a3764..b21ad773a 100644
--- a/less/forum/Post.less
+++ b/less/forum/Post.less
@@ -259,7 +259,9 @@
   }
 
   @media @tablet-up {
-    opacity: 0;
+    .no-touch & {
+      opacity: 0;
+    }
   }
 
   > ul {
@@ -270,9 +272,12 @@
       vertical-align: top;
     }
   }
-  .Post:hover & {
+  .Post:hover &, &.open {
     opacity: 1;
   }
+  &.open {
+    z-index: 2;
+  }
 }
 
 .PostPreview {