This repository has been archived by the owner on Apr 5, 2022. It is now read-only.
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Staticman nested comments support from Huginn (#69)
* Staticman nested comments support from Huginn which is in turn a port from halogenical/beautifulhugo#222. Introduced true nested comments with reply functionality. 1. Reply target anchors to easily jump between replies. 2. Interactive reply target display with Gravatar and name. 3. Improved input type for "website" field. 4. Implemented FR #63 to construct POST URL in JS. 5. Clearer instructions for Google reCAPTCHA v2. 6. Introduced some SCSS variables for layout control 7. Fixed missing "id" attribute in each comment. 8. Fixed missing translation UI text for Staticman forms. 9. Changed default API endpoint to the one serving @staticmanlab due to eduardoboucas/staticman#307. * Added image alt text in response to the review bot Gravatar alt text wasn't there in the original code, but I agree with the bot. * Fixed clearForm() to clear fields after submit * Set opacity to 0.5 when submitted * Regenerated resources * Fixed clearForm() again to empt textarea * Corrected Eng submission msg
- Loading branch information
1 parent
7db7cad
commit 118943a
Showing
18 changed files
with
671 additions
and
82 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,105 @@ | ||
| // Static comments | ||
| // from: https://github.com/eduardoboucas/popcorn/blob/gh-pages/js/main.js | ||
| $(document).ready(function() { | ||
| $('.post-new-comment').submit(function () { | ||
| var form = this; | ||
|
|
||
| $(form).addClass('loading'); | ||
| $('input[type="submit"]:enabled').addClass('hidden'); // hide "submit" | ||
| $('input[type="submit"]:disabled').removeClass('hidden'); // show "submitted" | ||
|
|
||
| // Construct form action URL form JS to avoid spam | ||
| var api = '{{ .api | default "staticman3.herokuapp.com" }}'; | ||
| var gitProvider = '{{ .gitprovider }}'; | ||
| var username = '{{ .username }}'; | ||
| var repo = '{{ .repo }}'; | ||
| var branch = '{{ .branch }}'; | ||
|
|
||
| $.ajax({ | ||
| type: $(this).attr('method'), | ||
| url: ['https:/', api, 'v3/entry', gitProvider, username, repo, branch, 'comments'].join('/'), | ||
| data: $(this).serialize(), | ||
| contentType: 'application/x-www-form-urlencoded', | ||
| success: function (data) { | ||
| showAlert('success'); | ||
| setTimeout(function(){ clearForm() }, 3000); // display success message for 3s | ||
| $(form).removeClass('loading'); | ||
| }, | ||
| error: function (err) { | ||
| console.log(err); | ||
| showAlert('failed'); | ||
| $(form).removeClass('loading'); | ||
| } | ||
| }); | ||
|
|
||
| return false; | ||
| }); | ||
|
|
||
| function showAlert(msg) { | ||
| if (msg == 'success') { | ||
| $('.post-new-comment .submit-success').removeClass('hidden'); // show submit success message | ||
| $('.post-new-comment .submit-failed').addClass('hidden'); // hide submit failed message | ||
| } else { | ||
| $('.post-new-comment .submit-success').addClass('hidden'); // hide submit success message | ||
| $('.post-new-comment .submit-failed').removeClass('hidden'); // show submit failed message | ||
| } | ||
| $('input[type="submit"]:enabled').removeClass('hidden'); // show "submit" | ||
| $('input[type="submit"]:disabled').addClass('hidden'); // hide "submitted" | ||
| } | ||
|
|
||
| function clearForm() { | ||
| resetReplyTarget(); | ||
| $('.post-new-comment input') | ||
| .filter(function() { | ||
| return this.name.match(/^fields\[.*\]$/); | ||
| }) | ||
| .val(''); // empty all text & hidden fields but not options | ||
| $('.post-new-comment textarea').val(''); // empty text area | ||
| $('.post-new-comment .submit-success').addClass('hidden'); // hide submission status | ||
| $('.post-new-comment .submit-failed').addClass('hidden'); // hide submission status | ||
| } | ||
|
|
||
| function resetReplyTarget() { | ||
| $('.post-new-comment .post-reply-notice .post-reply-name').text(''); | ||
| $('.post-new-comment .post-reply-notice .post-comment-avatar').remove(); | ||
| $('.post-new-comment .post-reply-notice .post-reply-close-btn').remove(); | ||
| $('.post-new-comment .post-reply-notice').addClass('hidden'); // hide reply target display | ||
| $('.post-new-comment input[type="hidden"]') | ||
| .filter(function() { | ||
| return this.name.match(/^fields\[reply[a-zA-Z]*\]$/); | ||
| }) | ||
| .val(''); // empty all hidden fields whose name starts from "reply" | ||
| } | ||
|
|
||
| // record reply target when "reply to this comment" is pressed | ||
| $('.post-comment').on('click', '.post-comment-reply-btn', function (evt){ | ||
| resetReplyTarget(); | ||
| var cmt = $(evt.delegateTarget); | ||
| var replyThread = cmt.find('.post-comment-threadID').text(); | ||
| $('.post-new-comment input[name="fields[replyThread]"]').val(replyThread); | ||
| $('.post-new-comment input[name="fields[replyID]"]').val(cmt.attr("id")); | ||
| authorTag = cmt.find('.post-comment-author'); | ||
| replyName = authorTag.text(); | ||
| $('.post-new-comment input[name="fields[replyName]"]').val(replyName); | ||
|
|
||
| // display reply target avatar and name | ||
| $('.post-new-comment .post-reply-notice').removeClass('hidden'); | ||
| $('.post-new-comment .post-reply-name').text(replyName); | ||
| avatarTag = cmt.find('.post-comment-avatar'); | ||
| // use clone to avoid removal of avatar in comments by resetReplyTarget() | ||
| $('.post-new-comment .post-reply-arrow').after(avatarTag.clone()); | ||
| // add button for removing reply target (static method would give error msg) | ||
| closeBtn = $("<a class='post-reply-close-btn button'></a>"); | ||
| $('.post-new-comment .post-reply-notice').append(closeBtn); | ||
| }); | ||
|
|
||
| // handle removal of reply target when '×' is pressed | ||
| $('.post-new-comment .post-reply-notice').on('click', '.post-reply-close-btn', function(){ | ||
| resetReplyTarget(); | ||
| }); | ||
|
|
||
| // clear form when reset button is clicked | ||
| $('.post-new-comment input[type="reset"]').click(function (){ | ||
| clearForm(); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.