Merge pull request #678 from ZogStriP/improve-quote-reply-selection

improve quote reply selection

app/assets/javascripts/discourse/controllers/quote_button_controller.js

@@ -36,17 +36,13 @@ Discourse.QuoteButtonController = Discourse.Controller.extend({
     if (!this.get('controllers.topic.content.can_create_post')) return;
 
     // retrieve the selected range
-    var range = window.getSelection().getRangeAt(0);
-    var cloned = range.cloneRange();
+    var range = window.getSelection().getRangeAt(0),
+        cloned = range.cloneRange(),
+        $ancestor = $(range.commonAncestorContainer);
 
     // don't display the "quote reply" button if you select text spanning two posts
-    // this basically look for the first "DIV" container...
-    var commonDivAncestorContainer = range.commonAncestorContainer;
-    while (commonDivAncestorContainer.nodeName !== 'DIV') {
-      commonDivAncestorContainer = commonDivAncestorContainer.parentNode;
-    }
-    // ... and check it has the 'cooked' class (which indicates we're in a post)
-    if (commonDivAncestorContainer.className.indexOf('cooked') === -1) return;
+    // note: the ".contents" is here to prevent selection of the topic summary
+    if ($ancestor.closest('.topic-body > .contents').length === 0) return;
 
     var selectedText = Discourse.Utilities.selectedText();
     if (this.get('buffer') === selectedText) return;

app/assets/javascripts/discourse/views/post_view.js

@@ -53,7 +53,7 @@ Discourse.PostView = Discourse.View.extend({
     }
 
     if (!Discourse.get('currentUser.enable_quoting')) return;
-    if ($(e.target).closest('.cooked').length === 0) return;
+    if ($(e.target).closest('.topic-body').length === 0) return;
 
     var qbc = this.get('controller.controllers.quoteButton');
     if (qbc) {

app/assets/stylesheets/application/topic-post.css.scss

@@ -89,11 +89,6 @@
   pre code {
     max-height: 690px;
   }
-  .post-menu-area {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-  }
   @include hover {
     .gutter {
       .reply-new,
@@ -104,6 +99,7 @@
   }
 
   .gutter {
+    @include unselectable;
     .reply-new{
       .discourse-no-touch & {
         opacity: 0;
@@ -248,11 +244,13 @@
   }
 
   section.post-menu-area {
+    @include unselectable;
     background-color: $post_footer;
     border-top: 1px solid $inner_border;
     overflow: hidden;
     @include box-shadow(inset 0 -4px 4px -4px rgba($black, 0.14));
     nav.post-controls {
+      @include unselectable;
       float: right;
       padding: 0px;
       button {
@@ -390,9 +388,6 @@
     @include hover {
       background-color: mix($gray, $light_gray, 5%);
     }
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
   }
   .embedded-posts.bottom {
     @include border-radius-bottom(4px);
@@ -749,6 +744,7 @@
     }
   }
   .buttons {
+    @include unselectable;
     float: right;
     .btn {
       border: 0;

app/assets/stylesheets/foundation/mixins.scss

@@ -159,4 +159,15 @@
 @mixin glow($color) {
       border: 1px solid $color;
   box-shadow: 0 0 5px $color;
-}
+}
+
+//
+// --------------------------------------------------
+
+// Unselectable
+
+@mixin unselectable {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+}