From 424dcad245a471657438a0a4aca1a2dc64d0adbf Mon Sep 17 00:00:00 2001 From: walidmujahid Date: Wed, 19 Feb 2020 16:41:12 -0500 Subject: [PATCH] feat: enable editing townsquare comments Comments can be edited. Editing can be cancled via Cancel button or 'Escape`. This is part of the townsquare improvements: https://github.com/gitcoinco/web/issues/6003 fixes https://github.com/gitcoinco/web/issues/6010 --- app/assets/v2/js/activity.js | 203 +++++++++++++++--- .../migrations/0086_merge_20200306_1527.py | 14 ++ .../migrations/0090_auto_20200312_0008.py | 42 ---- .../migrations/0090_auto_20200313_1425.py | 19 -- .../migrations/0090_merge_20200401_2017.py | 14 ++ .../migrations/0091_auto_20200401_2018.py | 105 +++++++++ .../migrations/0091_merge_20200316_2209.py | 14 -- .../migrations/0092_auto_20200316_2228.py | 61 ------ .../migrations/0093_auto_20200323_1304.py | 18 -- .../migrations/0094_auto_20200324_2138.py | 18 -- .../migrations/0095_hackathonevent_visible.py | 18 -- .../migrations/0011_comment_is_edited.py | 18 ++ .../migrations/0013_merge_20200224_1243.py | 14 ++ .../migrations/0014_merge_20200304_0529.py | 14 ++ .../migrations/0015_merge_20200401_2017.py | 14 ++ .../migrations/0015_offer_comments_admin.py | 18 -- ...favorite.py => 0016_auto_20200401_2018.py} | 11 +- app/townsquare/models.py | 1 + app/townsquare/views.py | 24 +++ 19 files changed, 395 insertions(+), 245 deletions(-) create mode 100644 app/dashboard/migrations/0086_merge_20200306_1527.py delete mode 100644 app/dashboard/migrations/0090_auto_20200312_0008.py delete mode 100644 app/dashboard/migrations/0090_auto_20200313_1425.py create mode 100644 app/dashboard/migrations/0090_merge_20200401_2017.py create mode 100644 app/dashboard/migrations/0091_auto_20200401_2018.py delete mode 100644 app/dashboard/migrations/0091_merge_20200316_2209.py delete mode 100644 app/dashboard/migrations/0092_auto_20200316_2228.py delete mode 100644 app/dashboard/migrations/0093_auto_20200323_1304.py delete mode 100644 app/dashboard/migrations/0094_auto_20200324_2138.py delete mode 100644 app/dashboard/migrations/0095_hackathonevent_visible.py create mode 100644 app/townsquare/migrations/0011_comment_is_edited.py create mode 100644 app/townsquare/migrations/0013_merge_20200224_1243.py create mode 100644 app/townsquare/migrations/0014_merge_20200304_0529.py create mode 100644 app/townsquare/migrations/0015_merge_20200401_2017.py delete mode 100644 app/townsquare/migrations/0015_offer_comments_admin.py rename app/townsquare/migrations/{0016_favorite.py => 0016_auto_20200401_2018.py} (77%) diff --git a/app/assets/v2/js/activity.js b/app/assets/v2/js/activity.js index c1d5a9f2028..5200853830c 100644 --- a/app/assets/v2/js/activity.js +++ b/app/assets/v2/js/activity.js @@ -535,45 +535,91 @@ $(document).ready(function() { return; } - // user input - var comment = $parent.parents('.box').find('.comment_container textarea').val().trim(); + if ($('.editableComment')[0]) { + // edited content + const comment = $parent.parents('.box').find('.editableComment').val(); - // validation - if (!comment) { - return; - } + $('.editableComment').prop('disabled', true); - $parent.parents('.box').find('.comment_container textarea').prop('disabled', true); - $('.post_comment').prop('disabled', true); + // validation + if (!comment) { + $('.editableComment').prop('disabled', false); + return; + } - $parent.parents('.activity.box').find('.loading').removeClass('hidden'); - var has_hidden_comments = $parent.parents('.activity.box').find('.row.comment_row.hidden').length; - // increment number - var num = $parent.find('span.num').html(); + $parent.parents('.activity.box').find('.loading').removeClass('hidden'); - num = parseInt(num) + 1; - $parent.find('span.num').html(num); + const has_hidden_comments = $parent.parents('.activity.box').find('.row.comment_row.hidden').length; + const num = $parent.find('span.num').html(); + const comment_id = $('.editableComment').parent().closest('.comment_row').data('id'); + const url = '/api/v0.1/comment/' + comment_id; + const params = { + 'method': 'EDIT', + 'comment': comment, + 'csrfmiddlewaretoken': $('input[name=csrfmiddlewaretoken]').val() + }; - // remote post - var params = { - 'method': 'comment', - 'comment': comment, - 'csrfmiddlewaretoken': $('input[name=csrfmiddlewaretoken]').val() - }; - var url = '/api/v0.1/activity/' + $parent.data('pk'); + $.post(url, params, function(response) { + const success_callback = function($parent) { + $.noop(); // do nothing + }; - $.post(url, params, function(response) { - var success_callback = function($parent) { - $parent.parents('.box').find('.comment_container textarea').val(''); - $parent.find('textarea').focus(); + view_comments($parent, allow_close_comment_container, success_callback); + }).always(function() { + $parent.parents('.activity.box').find('.loading').addClass('hidden'); + $parent.parents('.box').find('.comment_container textarea').prop('disabled', false); + $('.editableComment').prop('disabled', false); + $(`.comment_row[data-id="${comment_id}"] .comment_options`).prop('disabled', false).removeClass('hidden'); + $(`.comment_row[data-id="${comment_id}"]`).parent().closest('.box') + .find('#container-post_comment') + .find('*').prop('disabled', false).removeClass('hidden'); + // TODO: automatically cancel editing when another edit_comment button is clicked + $('.edit_comment').prop('disabled', false); + }); + } else { + // user input + const comment = $parent.parents('.box').find('.comment_container textarea').val().trim(); + + $parent.parents('.box').find('.comment_container textarea').prop('disabled', true); + $('.post_comment').prop('disabled', true); + + // validation + if (!comment) { + $parent.parents('.box').find('.comment_container textarea').prop('disabled', false); + $('.post_comment').prop('disabled', false); + return; + } + + + $parent.parents('.activity.box').find('.loading').removeClass('hidden'); + const has_hidden_comments = $parent.parents('.activity.box').find('.row.comment_row.hidden').length; + + // increment number + let num = $parent.find('span.num').html(); + num = parseInt(num) + 1; + $parent.find('span.num').html(num); + + // remote post + const params = { + 'method': 'comment', + 'comment': comment, + 'csrfmiddlewaretoken': $('input[name=csrfmiddlewaretoken]').val() }; - var override_hide_comments = !has_hidden_comments; + const url = '/api/v0.1/activity/' + $parent.data('pk'); - view_comments($parent, allow_close_comment_container, success_callback, override_hide_comments); - }).done(function() { - // pass - }) + $.post(url, params, function(response) { + const success_callback = function($parent) { + $parent.parents('.box').find('.comment_container textarea').val(''); + $parent.find('textarea').focus(); + + }; + const override_hide_comments = !has_hidden_comments; + + view_comments($parent, allow_close_comment_container, success_callback, override_hide_comments); + }).done(function() { + // pass + }) .fail(function() { $parent.parents('.activity.box').find('.error').removeClass('hidden'); }) @@ -582,6 +628,7 @@ $(document).ready(function() { $parent.parents('.box').find('.comment_container textarea').prop('disabled', false); $('.post_comment').prop('disabled', false); }); + } }; // converts an object to a dict @@ -637,6 +684,7 @@ $(document).ready(function() { const timeAgo = timedifferenceCvrt(new Date(comment['created_on'])); const show_tip = true; const is_comment_owner = document.contxt.github_handle == comment['profile_handle']; + const is_edited = typeof comment['is_edited'] !== 'undefined' ? comment['is_edited'] : false; var sorted_match_curve_html = ''; if (comment['sorted_match_curve']) { @@ -646,6 +694,7 @@ $(document).ready(function() { for (let j = 0; j < match_curve.length; j++) { let ele = match_curve[j]; + sorted_match_curve_html += '
  • '; sorted_match_curve_html += `Your contribution of ${ele.name} could yield $${Math.round(ele.value * 1000) / 1000} in matching.`; sorted_match_curve_html += '
  • '; @@ -707,11 +756,14 @@ $(document).ready(function() { - ${timeAgo} + ${timeAgo} ${is_edited ? '(edited)' : ''} - + ${is_comment_owner ? `| ` + : ''} + ${is_comment_owner ? + `| ` : ''} ${show_tip ? `