Commit 4522d102b3586f7c6906521c84e411b2e923b6bd

Authored by Victor Costa
1 parent 1f1e5210

comment_paragraph: improve range selection

plugins/comment_paragraph/public/comment_paragraph_macro.js
1   -var comment_paragraph_anchor;
2   -
3 1 jQuery(document).ready(function($) {
4 2 //Quit if does not detect a comment for that plugin
5 3 if($('.comment_paragraph').size() < 1)
... ... @@ -31,6 +29,8 @@ jQuery(document).ready(function($) {
31 29 $('body').click(function(event){
32 30 if ($(event.target).closest('.comment-paragraph-plugin, #comment-bubble').length === 0) {
33 31 hideCommentBox();
  32 + $('#comment-bubble').removeClass('visible');
  33 + hideAllSelectedAreasExcept();
34 34 }
35 35 });
36 36  
... ... @@ -60,14 +60,14 @@ jQuery(document).ready(function($) {
60 60 var paragraphId = container.data('paragraph');
61 61 hideAllSelectedAreasExcept(paragraphId);
62 62 hideCommentBox();
  63 + $('#comment-bubble').removeClass('visible');
63 64 container.addClass('comment-paragraph-slide-left selected');
64 65 container.find('.side-comment').show();
65   - $('#comment-bubble').removeClass('visible');
66 66 //Loads the comments
67 67 var url = container.find('.side-comment').data('comment_paragraph_url');
68 68 $.ajax(url).done(function(data) {
69 69 container.find('.article-comments-list').html(data);
70   - if(container.find('.article-comment').length==0) {
  70 + if(container.find('.article-comment').length==0 || container.find('.selected_area').length) {
71 71 container.find('.post_comment_box a.display-comment-form').click();
72 72 } else {
73 73 container.find('.post_comment_box').removeClass('opened');
... ... @@ -75,6 +75,13 @@ jQuery(document).ready(function($) {
75 75 container.find('.display-comment-form').show();
76 76 }
77 77 });
  78 +
  79 + //set a one time handler to prevent multiple selections
  80 + var fn = function() {
  81 + hideAllSelectedAreasExcept();
  82 + $('.comment-paragraph-plugin').off('mousedown', '.comment_paragraph', fn);
  83 + }
  84 + $('.comment-paragraph-plugin').on('mousedown', '.comment_paragraph', fn);
78 85 });
79 86  
80 87  
... ... @@ -153,7 +160,6 @@ jQuery(document).ready(function($) {
153 160 }
154 161 //Register the content being selected at input.comment_paragraph_selected_content
155 162 var selected_content = getSelectionText();
156   - if(selected_content.length > 0)
157 163 if (form.find('input.selected_content').length === 0){
158 164 $('<input>').attr({
159 165 class: 'selected_content',
... ... @@ -165,6 +171,7 @@ jQuery(document).ready(function($) {
165 171 form.find('input.selected_content').val(selected_content)
166 172 }
167 173 rootElement.focus();
  174 + cssApplier.toggleSelection();
168 175 });
169 176  
170 177 function processAnchor(){
... ... @@ -175,7 +182,6 @@ jQuery(document).ready(function($) {
175 182 if($('.comment-paragraph-plugin').length==0) return;
176 183 var comment_id = val[1];
177 184 if(!/^\d+$/.test(comment_id)) return; //test for integer
178   - comment_paragraph_anchor = anchor;
179 185  
180 186 var url = '/plugin/comment_paragraph/public/comment_paragraph/'+comment_id;
181 187 $.ajax(url).done(function(data) {
... ...
plugins/comment_paragraph/public/style.css
... ... @@ -54,15 +54,15 @@ div.article-comments-list-more{
54 54 padding:15px;
55 55 margin:1em 0 3em;
56 56 color:#fff;
57   - background:#075698; /* default background for browsers without gradient support */
  57 + background:#717171; /* default background for browsers without gradient support */
58 58 /* css3 */
59   - background:-webkit-gradient(linear, 0 0, 0 100%, from(#ababab), to(#424242));
60   - background:-moz-linear-gradient(#ABABAB, #424242);
61   - background:-o-linear-gradient(#ABABAB, #424242);
62   - background: linear-gradient(#ABABAB, #424242);
63   - -webkit-border-radius:10px;
64   - -moz-border-radius:10px;
65   - border-radius:10px;
  59 + background:-webkit-gradient(linear, 0 0, 0 100%, from(#717171), to(#1F1F1F));
  60 + background:-moz-linear-gradient(#717171, #1F1F1F);
  61 + background:-o-linear-gradient(#717171, #1F1F1F);
  62 + background: linear-gradient(#717171, #1F1F1F);
  63 + -webkit-border-radius:8px;
  64 + -moz-border-radius:8px;
  65 + border-radius:8px;
66 66 font-weight: bold;
67 67 }
68 68  
... ... @@ -73,7 +73,7 @@ div.article-comments-list-more{
73 73 left: 50px;
74 74 border-width: 20px 0 0 20px;
75 75 border-style: solid;
76   - border-color: #424242 transparent;
  76 + border-color: #1F1F1F transparent;
77 77 display: block;
78 78 width: 0;
79 79 }
... ...