diff --git a/opentech/apply/activity/templates/activity/include/listing_base.html b/opentech/apply/activity/templates/activity/include/listing_base.html index f999f30d48506338aea55ecea8cafb49b56a566a..c5c1cd67af7f313e8f22081a827d78d7d2408d8e 100644 --- a/opentech/apply/activity/templates/activity/include/listing_base.html +++ b/opentech/apply/activity/templates/activity/include/listing_base.html @@ -3,10 +3,16 @@ <div class="feed__pre-content"> <p class="feed__label feed__label--{{ activity.type }}">{{ activity.type|capfirst }}</p> </div> - <div class="feed__content"> - <div class="feed__meta"> + <div class="feed__content js-feed-content"> + <div class="feed__meta js-feed-meta"> <p class="feed__label feed__label--{{ activity.type }} feed__label--mobile">{{ activity.type|capfirst }}</p> <p class="feed__meta-item"><span>{{ activity|display_author:request.user }}</span> – {{ activity.timestamp|date:"Y-m-d H:i" }}</p> + <p class="feed__meta-item"> + <a class="link link--edit-submission is-active js-edit-comment" href="{% url 'funds:submissions:edit' object.id %}"> + Edit + <svg class="icon icon--pen"><use xlink:href="#pen"></use></svg> + </a> + </p> {% if activity.private %} <p class="feed__meta-item feed__meta-item--right"> <svg class="icon icon--eye"><use xlink:href="#eye"></use></svg> @@ -19,7 +25,11 @@ updated <a href="{{ activity.submission.get_absolute_url }}">{{ activity.submission.title }}</a> {% endif %} - {{ activity|display_for:request.user|submission_links|markdown|bleach }} + <div class="feed__comment js-comment" data-comment="{{activity.message}}"> + {{ activity|display_for:request.user|submission_links|markdown|bleach }} + </div> + + <div class="js-edit-form"></div> {% if not submission_title and activity|user_can_see_related:request.user %} {% with url=activity.related_object.get_absolute_url %} diff --git a/opentech/apply/funds/templates/funds/applicationsubmission_admin_detail.html b/opentech/apply/funds/templates/funds/applicationsubmission_admin_detail.html index 3087dda20779544542b8e1bf01b0763a006c0668..65245f86c555f17db65810e15a4ab156a504fa15 100644 --- a/opentech/apply/funds/templates/funds/applicationsubmission_admin_detail.html +++ b/opentech/apply/funds/templates/funds/applicationsubmission_admin_detail.html @@ -53,4 +53,5 @@ <script src="{% static 'js/apply/toggle-reviewers.js' %}"></script> <script src="{% static 'js/apply/toggle-sidebar.js' %}"></script> <script src="{% static 'js/apply/submission-text-cleanup.js' %}"></script> + <script src="{% static 'js/apply/edit-comment.js' %}"></script> {% endblock %} diff --git a/opentech/static_src/src/javascript/apply/edit-comment.js b/opentech/static_src/src/javascript/apply/edit-comment.js new file mode 100644 index 0000000000000000000000000000000000000000..113e6a1e699ce282471e9e1e5038914b33793897 --- /dev/null +++ b/opentech/static_src/src/javascript/apply/edit-comment.js @@ -0,0 +1,43 @@ +(function ($) { + + 'use strict'; + + $('.js-edit-comment').click(function (e) { + e.preventDefault(); + const editFormWrapper = $(this).closest('.js-feed-content').children('.js-edit-form'); + const commentWrapper = $(this).closest('.js-feed-content').children('.js-comment'); + const commentContents = $(this).closest('.js-feed-content').children('.js-comment').data('comment'); + + // hide the edit link and original comment + $(this).hide(); + $(commentWrapper).hide(); + + const markup = ` + <div class="js-pagedown form"> + <div id="wmd-button-bar-edit-comment" class="wmd-button-bar"></div> + <textarea id="wmd-input-edit-comment" class="wmd-input" rows="10">${commentContents}</textarea> + <div id="wmd-preview-edit-comment" class="wmd-preview"></div> + <div class="wrapper--top-outer-space-small"> + <button class="button button--primary" type="submit">Update</button> + <button class="button button--white js-cancel-edit">Cancel</button> + </div> + </div> + `; + + // add the comment to the editor + $(editFormWrapper).append(markup); + + // run the editor + const converterOne = Markdown.getSanitizingConverter(); + const commentEditor = new Markdown.Editor(converterOne, '-edit-comment'); + commentEditor.run(); + }); + + $(document).on('click', '.js-cancel-edit', function () { + // show the comment, edit button and remove the editor + $(this).closest('.js-edit-form').prev('.js-comment').show(); + $(this).closest('.js-edit-form').siblings('.js-feed-meta').find('.js-edit-comment').show(); + $(this).closest('.js-pagedown').remove(); + }); + +})(jQuery);