diff --git a/plugins/comment_paragraph/public/comment_paragraph_macro.js~ b/plugins/comment_paragraph/public/comment_paragraph_macro.js~ new file mode 100644 index 0000000..7d41fca --- /dev/null +++ b/plugins/comment_paragraph/public/comment_paragraph_macro.js~ @@ -0,0 +1,257 @@ +var comment_paragraph_anchor; +var lastParagraph = []; +var lastSelectedArea = []; +var sideCommentForm=null; +var firstTimeOpenParagraph = Array(); +var commentParagraphIds = Array(); + +function getIdCommentParagraph(paragraphId){ + var idx = paragraphId.lastIndexOf('_'); + return paragraphId.substring(idx+1, paragraphId.length); +} + +jQuery(document).ready(function($) { + $('.display-comment-form').unbind(); + $('.display-comment-form').click(function(){ + var $button = $(this); + showBox($button.parents('.post_comment_box')); + $($button).hide(); + $button.closest('.page-comment-form').find('input').first().focus(); + return false; + }); + + $('#cancel-comment').die(); + $('#cancel-comment').live("click", function(){ + var $button = $(this); + showBox($button.parents('.post_comment_box')); + show_display_comment_button(); + var page_comment_form = $button.parents('.page-comment-form'); + page_comment_form.find('.errorExplanation').remove(); + $(this).closest("textarea[name^='comment'").text(""); + $(this).closest("div[class^='side-comment']").hide(); + return false; + }); + + function showBox(div){ + if(div.hasClass('closed')) { + div.removeClass('closed'); + div.addClass('opened'); + } + } + + //Hides old style ballons + $("img[alt|=Comments]").hide(); + rangy.init(); + cssApplier = rangy.createCssClassApplier("commented-area", {normalize: false}); + //Add marked text bubble + $("body").append('\ + \ +
Comentar
+
\ + '); + + //Creates a side bubble for each paragraph with the amount of comments + //putSideComments(); + + $('.comment_paragraph').mouseover(function(){ + var paragraphId = getIdCommentParagraph($(this)[0].id); + $('#side_comment_counter_' + paragraphId).show(); + }); + + $('.comment_paragraph').mouseleave(function(){ + var paragraphId = getIdCommentParagraph($(this)[0].id); +// if($('#side_comment_counter_' + paragraphId).text() == '+'){ +// $('#side_comment_counter_' + paragraphId).hide(); +// } + }); + + $('.side-comments-counter').click(function(){ + hideAllComments(); + var paragraphId = $(this).data('paragraph') + $('#side_comment_' + paragraphId).show(); + $('#comments_list_toggle_paragraph_' + paragraphId).show(); + console.log(paragraphId); + //Loads the comments + var url = $('#link_to_ajax_comments_' + paragraphId).data('url'); + firstTimeOpenParagraph[paragraphId]=false; + $.ajax({ + dataType: "script", + url: url + }).done(function() { + var button = $('#page-comment-form-' + paragraphId + ' a').get(0); + button.click(); + alignSideComments(paragraphId); + }); + }); + + + $('#comment-bubble').click(function(event){ + $(this).hide(); + hideAllComments(); + $("#comment-bubble").css({top: 0, left: 0, position:'absolute'}); + var url = $("#comment-bubble").data('url'); + var paragraphId = $("#comment-bubble").data("paragraphId"); + $('#side_comment_' + paragraphId).show(); + $.ajax({ + dataType: "script", + url: url + }).done(function() { + var button = $('#page-comment-form-' + paragraphId + ' a').get(0); + button.click(); + alignSideComments(paragraphId); + }); + }); + + function alignSideComments(paragraphId){ + $('.comments_list_toggle_paragraph_' + paragraphId).css('background','#FFFFFF'); + $('label[for|=comment_title]').hide(); + $('label[for|=comment_body]').css({top: -30, left: +20, position:'relative'}); + $('.comment_form p').hide(); + $('.comments_list_toggle_paragraph_' + paragraphId).width('350px'); + $('.required-field').removeClass("required-field"); + } + + function hideAllComments(){ + $(".side-comment").hide(); + } + + $("#comment-bubble").hide(); + //Undo previous highlight from the paragraph + $('.comment_paragraph').mousedown(function(){ + //var paragraphId = getIdCommentParagraph($(this)[0].id); + var paragraphId = $(this).data('paragraph'); + $(this).find('.commented-area').replaceWith(function() { + return $(this).html(); + }); + var rootElement = $(this).get(0); + if(lastParagraph[paragraphId]){ + rootElement.innerHTML = lastParagraph[paragraphId]; + } + }); + + //highlight area from the paragraph + $('.comment_paragraph').mouseup(function(event){ + deselectAll(); + var paragraphId = $(this).data('paragraph'); + var currentMousePos = { x: -1, y: -1 }; + currentMousePos.x = event.pageX; + currentMousePos.y = event.pageY; + $("#comment-bubble").css({top: event.pageY-100, left: event.pageX-70, position:'absolute'}); + //Relates a bubble to the mouse up paragraph + $("#comment-bubble").data("paragraphId", paragraphId) + //Prepare to open the div + var url = $('#link_to_ajax_comments_' + paragraphId).data('url'); + $("#comment-bubble").data("url", url) + $("#comment-bubble").show(); + var rootElement = $(this).get(0); + //Stores the lastParagraph of paragraph for some reason + lastParagraph[paragraphId] = rootElement.innerHTML; + //Maybe it is needed to handle exceptions here + try{ + var selObj = rangy.getSelection(); + var selected_area = rangy.serializeSelection(selObj, true,rootElement); + cssApplier.toggleSelection(); + }catch(e){ + console.log(e); + //$.flash("A sele"); + return; + } + //Register the area the has been selected at input.selected_area + lastSelectedArea[paragraphId] = selected_area; + form = $('#page-comment-form-' + paragraphId).find('form'); + if (form.find('input.selected_area').length === 0){ + jQuery('').attr({ + class: 'selected_area', + type: 'hidden', + name: 'comment[comment_paragraph_selected_area]', + value: selected_area + }).appendTo(form) + }else{ + form.find('input.selected_area').val(selected_area) + } + rootElement.focus(); + }); + + function deselectAll(){ + $(".commented-area").contents().unwrap(); + } + + +// $('.article-body').mousedown(function(event){ +// deselectAll(); +// }); + + function processAnchor(){ + var anchor = window.location.hash; + if(anchor.length==0) return; + + var val = anchor.split('-'); //anchor format = #comment-\d+ + if(val.length!=2 || val[0]!='#comment') return; + if($('div[data-macro=comment_paragraph_plugin\\/allow_comment]').length==0) return; //comment_paragraph_plugin/allow_comment div must exists + var comment_id = val[1]; + if(!/^\d+$/.test(comment_id)) return; //test for integer + + comment_paragraph_anchor = anchor; + var url = '/plugin/comment_paragraph/public/comment_paragraph/'+comment_id; + $.ajax({ + dataType: "script", + url: url + }).done(function() { + var button = $('#page-comment-form-' + comment_id + ' a').get(0) + button.click(); + //alignSideComments(paragraphId); + }); + } + + processAnchor(); + + $(document).on('mouseover', 'li.article-comment', function(){ + var selected_area = $(this).find('input.paragraph_comment_area').val(); + var paragraph_id = $(this).find('input.paragraph_id').val(); + var rootElement = $('#comment_paragraph_'+ paragraph_id).get(0); + + if(lastParagraph[paragraph_id] == null || lastParagraph[paragraph_id] == 'undefined'){ + lastParagraph[paragraph_id] = rootElement.innerHTML; + } + else { + rootElement.innerHTML = lastParagraph[paragraph_id] ; + } + if(selected_area != ""){ + rangy.deserializeSelection(selected_area, rootElement); + cssApplier.toggleSelection(); + } + }); + + $(document).on('mouseout', 'li.article-comment', function(){ + deselectAll(); + var paragraph_id = $(this).find('input.paragraph_id').val(); + var rootElement = $('#comment_paragraph_'+ paragraph_id).get(0); + + if(lastSelectedArea[paragraph_id] != null && lastSelectedArea[paragraph_id] != 'undefined' ){ + rootElement = $('#comment_paragraph_'+ paragraph_id).get(0); + rootElement.innerHTML = lastParagraph[paragraph_id]; + rangy.deserializeSelection(lastSelectedArea[paragraph_id], rootElement); + cssApplier.toggleSelection(); + } else { + cssApplier.toggleSelection(); + var sel = rangy.getSelection(); + sel.removeAllRanges(); + } + }); +}); // End of jQuery(document).ready(function($) + +function toggleParagraph(paragraph) { + var div = jQuery('div.comments_list_toggle_paragraph_'+paragraph); + var visible = div.is(':visible'); + if(!visible) + jQuery('div.comment-paragraph-loading-' + paragraph).addClass('comment-button-loading'); + div.toggle('fast'); + return visible; +} + +function loadCompleted(paragraph) { + jQuery('div.comment-paragraph-loading-'+paragraph).removeClass('comment-button-loading') + if(comment_paragraph_anchor) { + jQuery.scrollTo(jQuery(comment_paragraph_anchor)); + comment_paragraph_anchor = null; + } +} \ No newline at end of file diff --git a/plugins/comment_paragraph/public/style.css b/plugins/comment_paragraph/public/style.css index 75a460b..328b448 100644 --- a/plugins/comment_paragraph/public/style.css +++ b/plugins/comment_paragraph/public/style.css @@ -119,6 +119,13 @@ div[class^='comment-paragraph-loading-'] { z-index: 199; } +.side-comments-counter { + border: 1px solid #57ad68; + padding: 3px; + border-radius: 3px; + color: #666; +} + #comments_list{ display: none; } diff --git a/plugins/comment_paragraph/public/style.css~ b/plugins/comment_paragraph/public/style.css~ new file mode 100644 index 0000000..0f28880 --- /dev/null +++ b/plugins/comment_paragraph/public/style.css~ @@ -0,0 +1,149 @@ + +#article .article-comments-list, +#article .article-comments-list ul, +#article .article-comments-list li { + margin: 10px 0 10px 0; +} + +div.article-comments-list-more{ + width: 100%; + height: 30px; + text-align: center; + font-size: 20px; + margin-bottom: 5px; +} + +.popBox_comment_paragraph { + position: absolute; + z-index: 2; + background: #cccccc; + width: 60px; + padding: 0.3em; + position: absolute;border: 1px solid gray; +} + +.span_comment_paragraph { + color: red; + font-weight: bold; +} + +.commented-area { + background-color: lightseagreen; +} + +.comment_paragraph ::selection { + background: lightseagreen; /* WebKit/Blink Browsers */ +} + +.comment_paragraph ::-moz-selection { + background: lightseagreen; /* Gecko Browsers */ +} + +.comment_paragraph{ + padding: 0px; +} + +.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; +} + +.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; +} + +.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; +} + +.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%;} +.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; +} + +div[class^='comments_list_toggle_paragraph_'] { + 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; +} + +#content .comment-balloon div[class^='comment-wrapper-']{ + background: none; +} + +.side-comment{ + z-index: 199; +} + +.side-comments-counter { + border: 1px solid #57ad68; + padding: 3px; + border-radius: 3px; + color: #ccc; +} + +#comments_list{ + display: none; +} + +.article-comment-inner {border-bottom: 1px solid #ddd;} + +/*label[for="comment_title"]{ + display: none; +}*/ + +#article .comment-replies .article-comment{background: white; border: 0px; border-top: 1px solid #ddd;} + +.comment-replies .comment-from-owner.comment-content {background: none;} + +.article-comment .comment-details {margin-bottom: 10px;} + +#content .comment-actions .menu-submenu ul { + right: 100%; + position: absolute; +} + diff --git a/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb b/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb index 01ec114..fac0425 100644 --- a/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb +++ b/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb @@ -7,7 +7,7 @@ -
+
<%= count %> @@ -44,4 +44,4 @@
- \ No newline at end of file + diff --git a/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb~ b/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb~ new file mode 100644 index 0000000..191de8d --- /dev/null +++ b/plugins/comment_paragraph/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb~ @@ -0,0 +1,47 @@ +
+ + + + + + +
+
+ <%= inner_html %> +
+ 		+
" class='comment-count'> + <%= count %> + +
+ 		+
+ <%= + url = { :profile => profile_identifier, :controller => 'comment_paragraph_plugin_profile', :action => 'view_comments', :paragraph_id => paragraph_id, :article_id => article_id} + link_to_remote( + image_tag("/plugins/comment_paragraph/images/comments.gif"), + { + :url => url, + :method => :post, + :condition => "!toggleParagraph(#{paragraph_id})", + :complete => "loadCompleted(#{paragraph_id})" + }, + { + :id => "link_to_ajax_comments_#{paragraph_id}", + :'data-url' => url_for(url) + } + )%> +
+ +
-- libgit2 0.21.2