Corrigido: Quando clico em qualquer porção do texto, mesmo sem seleção, mostra o…

… balão para comentar, isso é estranho, não indica se estou comentando no paragrafo todo ou apenas naquele ponto do texto, etc... Corrigido: O número de comentários ao lado deve ser um link, ou seja, ao passar o mouse o cursor deve mudar Corrigido: Em que momento irá ser desfeita Seria interessante ser possível desfazer uma seleção de um trecho, quando eu seleciono não consigo desfazer a seleção até que eu faça uma seleção nova

Corrigido: Quando clico em qualquer porção do texto, mesmo sem seleção, mostra o…
… balão para comentar, isso é estranho, não indica se estou comentando no paragrafo todo ou apenas naquele ponto do texto, etc... Corrigido: O número de comentários ao lado deve ser um link, ou seja, ao passar o mouse o cursor deve mudar Corrigido: Em que momento irá ser desfeita Seria interessante ser possível desfazer uma seleção de um trecho, quando eu seleciono não consigo desfazer a seleção até que eu faça uma seleção nova
Evandro Jr
1 parent b54cf5a0
Showing 2 changed files with 70 additions and 56 deletions Show diff stats
plugins/comment_paragraph/public/comment_paragraph_macro.js
plugins/comment_paragraph/public/style.css
@@ -111,6 +111,7 @@ jQuery(document).ready(function($) {
   $("#comment-bubble").hide();
   //Undo previous highlight from the paragraph
   $('.comment_paragraph').mousedown(function(){
+    $("#comment-bubble").hide();
     var paragraphId = $(this).data('paragraph');
     $(this).find('.commented-area').replaceWith(function() {
       return $(this).html();
@@ -120,10 +121,23 @@ jQuery(document).ready(function($) {
       rootElement.innerHTML = lastParagraph[paragraphId];
     }
   });
+  
+  function getSelectionText() {
+    var text = "";
+    if (window.getSelection) {
+        text = window.getSelection().toString();
+    } else if (document.selection && document.selection.type != "Control") {
+        text = document.selection.createRange().text;
+    }
+    return text;
+  }
    //highlight area from the paragraph
   $('.comment_paragraph').mouseup(function(event){
     deselectAll();
+    //Don't do anything if there is no selected text
+    if(getSelectionText().length == 0)
+      return;
     var paragraphId = $(this).data('paragraph');
     var currentMousePos = { x: -1, y: -1 };
     currentMousePos.x = event.pageX;
@@ -250,6 +264,6 @@ jQuery(document).keyup(function(e) {
   // on press ESC key...
   if (e.which == 27) {
     // closing side comment box
-    side_comment_box_opened = jQuery("div.side-comment").filter("div[style!='display: block;']").css('display', 'none');
+    side_comment_box_opened = jQuery("div.side-comment").hide();
   }
 });
-
 #article .article-comments-list, 
 #article .article-comments-list ul, 
 #article .article-comments-list li {
-	margin: 10px 0 10px 0;
+  margin: 10px 0 10px 0;
 }
 div.article-comments-list-more{
@@ -41,7 +40,6 @@ div.article-comments-list-more{
 .comment_paragraph{
   padding: 0px;
- 
 }
 .article-body{
@@ -51,90 +49,92 @@ div.article-comments-list-more{
 }
 .triangle-right {
-   position:relative;
-   padding:15px;
-   margin:1em 0 3em;
-   color:#fff;
-   background:#075698; /* default background for browsers without gradient support */
-   /* css3 */
-   background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
-   background:-moz-linear-gradient(#2e88c4, #075698);
-   background:-o-linear-gradient(#2e88c4, #075698);
-   background:linear-gradient(#2e88c4, #075698);
-   -webkit-border-radius:10px;
-   -moz-border-radius:10px;
-   border-radius:10px;
+  position:relative;
+  padding:15px;
+  margin:1em 0 3em;
+  color:#fff;
+  background:#075698; /* default background for browsers without gradient support */
+  /* css3 */
+  background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
+  background:-moz-linear-gradient(#2e88c4, #075698);
+  background:-o-linear-gradient(#2e88c4, #075698);
+  background:linear-gradient(#2e88c4, #075698);
+  -webkit-border-radius:10px;
+  -moz-border-radius:10px;
+  border-radius:10px;
 }
 .triangle-right:after {
-    content: "";
-    position: absolute;
-    bottom: -20px;
-    left: 50px;
-    border-width: 20px 0 0 20px;
-    border-style: solid;
-    border-color: #075698 transparent;
-    display: block;
-    width: 0;
+  content: "";
+  position: absolute;
+  bottom: -20px;
+  left: 50px;
+  border-width: 20px 0 0 20px;
+  border-style: solid;
+  border-color: #075698 transparent;
+  display: block;
+  width: 0;
 }
 .triangle-border {
-    position: relative;
-    padding: 15px;
-    margin: 1em 0 3em;
-    border: 5px solid #5a8f00;
-    color: #333;
-    background: #fff;
-    -webkit-border-radius: 10px;
-    -moz-border-radius: 10px;
-    border-radius: 10px;
+  position: relative;
+  padding: 15px;
+  margin: 1em 0 3em;
+  border: 5px solid #5a8f00;
+  color: #333;
+  background: #fff;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
 }
 .comment-picture {width: 50px;}
 .comment-text {display: inline-block;}
 .comment-replies .comment-text {display: inline-block;}
 .comment-from-owner .comment-created-at {
-	display: block;
-	width: 100%;}
+  display: block;
+  width: 100%;
+}
 .comment-replies .comment-text {display: block;}
 #article .article-comment .comment-details h4 {display: none;}
 #article .article-comments-list .comment-replies {padding-left: 20px;}
 #comment_title{
-   display: none;
+ display: none;
 }
 div[class^='comments_list_toggle_paragraph_'] {
-   border-style: solid;
-   border-width: 1px;
-   border-color: #ccc;
-   padding: 5px;
-   background-color: whitesmoke;
-   width: 250px;
+ border-style: solid;
+ border-width: 1px;
+ border-color: #ccc;
+ padding: 5px;
+ background-color: whitesmoke;
+ width: 250px;
 }
 div[class^='comment-paragraph-loading-'] {
-   background-color: whitesmoke;
-   z-index: 99;
-   right: -230px;
+ background-color: whitesmoke;
+ z-index: 99;
+ right: -230px;
 }
 #content .comment-balloon div[class^='comment-wrapper-']{
-	background: none;
+    background: none;
 }
 .side-comment{
-    z-index: 199;
+  z-index: 199;
 }
 .side-comments-counter {
-	border: 1px solid #57ad68;
-	padding: 3px;
-	border-radius: 3px;
-	color: #666;
+  border: 1px solid #57ad68;
+  padding: 3px;
+  border-radius: 3px;
+  color: #666;
+  cursor: pointer;
 }
 #comments_list{
-   display: none;    
+  display: none;    
 }
 .article-comment-inner {border-bottom: 1px solid #ddd;}
@@ -150,7 +150,7 @@ div[class^=&#39;comment-paragraph-loading-&#39;] {
 .article-comment .comment-details {margin-bottom: 10px;}
 #content .comment-actions .menu-submenu ul {
-    right: 100%;
-    position: absolute;
+  right: 100%;
+  position: absolute;
 }