From 89eed21029554a38526263fa38ee95acbec73987 Mon Sep 17 00:00:00 2001 From: Evandro Jr Date: Mon, 1 Sep 2014 17:07:17 -0300 Subject: [PATCH] major changes in progress --- public/comment_paragraph_macro.js | 242 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------------------------------------------------------------------------------------------------------------------------------------------------- public/style.css | 52 ++++++++++++++++++++++++++++++++++++++++++++++------ views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb | 83 ++++++++++++++++++++++++++++++++++++++++++++++------------------------------------- 3 files changed, 187 insertions(+), 190 deletions(-) diff --git a/public/comment_paragraph_macro.js b/public/comment_paragraph_macro.js index 397a403..fff6bd6 100644 --- a/public/comment_paragraph_macro.js +++ b/public/comment_paragraph_macro.js @@ -10,93 +10,48 @@ function getIdCommentParagraph(paragraphId){ return paragraphId.substring(idx+1, paragraphId.length); } -function teleportToBody(element){ - var $ = jQuery; - element.detach(); - $('body').append(element); -} - -function moveCommentsToTheSide(paragraphId, mouseX, mouseY){ - var $ = jQuery; - //var element = sideCommentForm; - //element.detach(); - //if ( $('body #side_comment_form').size === 0){ -// $('body').append(element); -// } - //element.css({top: 0, border-right: 20, position:'absolute'}); -} +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; + }); -//function buildSideCommentBlock(){ -// var $ = jQuery; -// $("body").append('\ -//
\n\ -// [side comments collumn]
\n\ -// [side comments collumn]
\n\ -//
\n\ -// '); -// //Detects if there is any comment paragraph -// -// // var button = jQuery('#page-comment-form-' + paragraphId + ' a')[0]; -//} + $('#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 buildSideCommentBox(id, commentCount ){ - var $ = jQuery; - //Search to top of the respective paragraph - var top = $('#comment_paragraph_' + id).offset().top; - var right = $('#comment_paragraph_' + id).offset().left + $('#comment_paragraph_' + id).width() + 20; + function showBox(div){ + if(div.hasClass('closed')) { + div.removeClass('closed'); + div.addClass('opened'); + } + } + - var boxComments="\n\ -
+
\n\ - "; - //
"; - return boxComments; -} - -function putSideComments(){ - var $ = jQuery; - - $(".comment-count").each(function(index){ - //Include all comments except the last - var idElement = $(this).attr('id'); - if(idElement != undefined ){ - var n = idElement.lastIndexOf('-'); - var id_number = idElement.substr(n + 1, idElement.length - n +1); - firstTimeOpenParagraph[id_number] = true; - commentParagraphIds.push(id_number); - var commentCount = $(this).text().trim(); - commentCount = parseInt(commentCount); - var box = buildSideCommentBox(id_number, commentCount); - $('body').append(box); - if(commentCount > 0){ - $('#side_comment_counter_' + id_number).text(commentCount); -// $('#side_comment_counter_' + id_number).show(); - } - $('#side_comment_counter_' + id_number).show(); - } - }); -} - - - -jQuery(document).ready(function($) { //Hides old style ballons $("img[alt|=Comments]").hide(); - //Hides old style counter - $(".comment-count").hide(); - rangy.init(); cssApplier = rangy.createCssClassApplier("commented-area", {normalize: false}); - //Add marked text bubble $("body").append('\ - \ + \
Comentar
+
\
'); - //buildSideCommentBlock(); - // + //Creates a side bubble for each paragraph with the amount of comments - putSideComments(); + //putSideComments(); $('.comment_paragraph').mouseover(function(){ var paragraphId = getIdCommentParagraph($(this)[0].id); @@ -112,43 +67,61 @@ jQuery(document).ready(function($) { $('.side-comments-counter').click(function(){ hideAllComments(); - var paragraphId = getIdCommentParagraph($(this).attr('id')); - $('#side_comment_box_' + paragraphId).toggle(); + 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'); - $('.comments_list_toggle_paragraph_' + paragraphId).show(); - if(firstTimeOpenParagraph[paragraphId]===true ){ - firstTimeOpenParagraph[paragraphId]=false; - $.ajax({ - dataType: "script", - url: url - }).done(function() { - var button = $('#page-comment-form-' + paragraphId + ' a').get(0); - button.click(); - //teleportToBody($('.comments_list_toggle_paragraph_' + paragraphId)); - var top = $('#comment_paragraph_' + paragraphId).offset().top; - var right = $('#comment_paragraph_' + paragraphId).offset().left + $('#comment_paragraph_' + paragraphId).width(); - top += -120; - right+= -500; - $('.comments_list_toggle_paragraph_' + paragraphId).css('position','absolute'); - $('.comments_list_toggle_paragraph_' + paragraphId).css('top',top); - $('.comments_list_toggle_paragraph_' + paragraphId).css('left',right); - $('.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('250px'); - }); - } + 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){ +// var top = $('#comment_paragraph_' + paragraphId).offset().top; +// var right = $('#comment_paragraph_' + paragraphId).offset().left + $('#comment_paragraph_' + paragraphId).width(); +// top += -120; +// right+= -500; +// $('.comments_list_toggle_paragraph_' + paragraphId).css('position','absolute'); +// $('.comments_list_toggle_paragraph_' + paragraphId).css('display','inline'); +// $('.comments_list_toggle_paragraph_' + paragraphId).css('top',top); +// $('.comments_list_toggle_paragraph_' + paragraphId).css('left',right); + $('.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('250px'); + $('.required-field').removeClass("required-field"); + } function hideAllComments(){ - for (index = 0; index < commentParagraphIds.length; ++index) { - $('.comments_list_toggle_paragraph_' + commentParagraphIds[index]).hide(); - } + $(".side-comment").hide(); } - $("#comment-bubble").hide(); //Undo previous highlight from the paragraph @@ -162,13 +135,7 @@ jQuery(document).ready(function($) { rootElement.innerHTML = lastParagraph[paragraphId]; } }); - - -// $('#comment-bubble').mouseleave(function(){ -// this.hide(); -// $("#comment-bubble").css({top: 0, left: 0, position:'absolute'}); -// }); - + //highlight area from the paragraph $('.comment_paragraph').mouseup(function(event){ var paragraphId = getIdCommentParagraph($(this)[0].id); @@ -200,31 +167,9 @@ jQuery(document).ready(function($) { rootElement.focus(); }); - -// $('#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"); -// -// $('.comments_list_toggle_paragraph_' + paragraphId).show(); -// $.ajax({ -// dataType: "script", -// url: url -// }).done(function() { -// var button = $('#page-comment-form-' + paragraphId + ' a').get(0) -// button.click(); -// window.location="#page-comment-form-" + paragraphId; -//// //Move comments -//// sideCommentForm = $('#side_comment_form'); -//// sideCommentForm.hide(); -//// sideCommentForm = $('.comment_form').first(); -//// sideCommentForm.attr("id",'side_comment_form'); -//// moveCommentsToTheSide(paragraphId, event.pageX, event.pageY); -// }); -// }); - + $('.article-body').mousedown(function(event){ + $( ".commented-area" ).contents().unwrap(); + }); function processAnchor(){ var anchor = window.location.hash; @@ -244,19 +189,15 @@ jQuery(document).ready(function($) { }).done(function() { var button = $('#page-comment-form-' + comment_id + ' a').get(0) button.click(); -//// window.location="#page-comment-form-" + paragraphId; -// //Move comments -// sideCommentForm = $('#side_comment_form'); -// sideCommentForm.hide(); -// sideCommentForm = $('.comment_form').first(); -// sideCommentForm.attr("id",'side_comment_form'); -// moveCommentsToTheSide(paragraphId, event.pageX, event.pageY); + //alignSideComments(paragraphId); }); } processAnchor(); $(document).on('mouseover', 'li.article-comment', function(){ + console.log("mouseover"); + 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); @@ -274,6 +215,7 @@ jQuery(document).ready(function($) { }); $(document).on('mouseout', 'li.article-comment', function(){ + console.log("mouseout"); var paragraph_id = $(this).find('input.paragraph_id').val(); var rootElement = $('#comment_paragraph_'+ paragraph_id).get(0); @@ -288,7 +230,13 @@ jQuery(document).ready(function($) { sel.removeAllRanges(); } }); -}); + +// $('.icon-cancel').unbind('click').click(function(e){ +// e.preventDefault(); +// $(this).closest("textarea[name^='comment'").text(""); +// $(this).closest("div[class^='comments_list_toggle_paragraph_']").hide(); +// }); +}); // End of jQuery(document).ready(function($) function toggleParagraph(paragraph) { var div = jQuery('div.comments_list_toggle_paragraph_'+paragraph); @@ -305,4 +253,4 @@ function loadCompleted(paragraph) { jQuery.scrollTo(jQuery(comment_paragraph_anchor)); comment_paragraph_anchor = null; } -} +} \ No newline at end of file diff --git a/public/style.css b/public/style.css index e11c793..a86f5b7 100644 --- a/public/style.css +++ b/public/style.css @@ -21,15 +21,15 @@ div.article-comments-list-more{ } .commented-area { - background-color: #FFFF66; + background-color: lightseagreen; } .comment_paragraph ::selection { - background: #FFFF66; /* WebKit/Blink Browsers */ + background: lightseagreen; /* WebKit/Blink Browsers */ } .comment_paragraph ::-moz-selection { - background: #FFFF66; /* Gecko Browsers */ + background: lightseagreen; /* Gecko Browsers */ } .comment_paragraph{ @@ -64,9 +64,20 @@ div.article-comments-list-more{ 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; +} + -.side-comments-counter{ - width: 20px; +/*.side-comments-counter{ top: 10px; border-style: solid; border-width: 1px; @@ -77,7 +88,20 @@ div.article-comments-list-more{ color: #FFFFFF; display: none; padding: 5px; -} +}*/ + +/*.side-comments-counter:before { +content: ""; +position: absolute; +bottom: -20px; +left: 40px; +border-width: 20px 20px 0; +border-style: solid; +border-color: #5a8f00 transparent; +display: block; +width: 0; +}*/ + #comment_title{ display: none; @@ -90,6 +114,22 @@ div[class^='comments_list_toggle_paragraph_'] { padding: 5px; } +label[for="comment_title"]{ + display: none; +} + +#comments_list{ + display: none; +} + +/* Hides old style counter*/ +/*.comment-count{ + display: none; +}*/ + + + + /*.comment-details{ diff --git a/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb b/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb index 9ed3740..89d321a 100644 --- a/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb +++ b/views/comment_paragraph_plugin_profile/_comment_paragraph.html.erb @@ -1,38 +1,47 @@
-
- <%= inner_html %> -
-
- <%= - 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) - } - )%> - -
- - <%= count %> - -
-
-
- -
\ No newline at end of file + + + + + + +
+
+ <%= inner_html %> +
+
+
+ + <%= 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) + } + )%> +
+ +
\ No newline at end of file -- libgit2 0.21.2