-
Notifications
You must be signed in to change notification settings - Fork 611
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Feature] Staticman Comment Reply #222
base: master
Are you sure you want to change the base?
Conversation
Parent ≠ main post (post which is *not* a reply of other posts)
- [X]: Fix logic error - [ ]: Verify reply once more - [ ]: Basic CSS for replies - [ ]: Better anchor to reply target
Changed UI text from "Reply to {{ .user }}" to "Reply to this message" to simplify template code. In western European languages, the original UI text reads "{{ i18n replyToMsg }} {{ .user }}", but this order is reversed in some languages (e.g. German). Languages that I know: Chinese, English, French Sources for other translations: - Norwegian Bokmål `nb`: Tenker du på deg selv som en bruker nå som du er på internett, eller noe helt annet? https://nrkbeta.no/2018/10/18/tenker-du-pa-deg-selv-som-en-bruker-na-som-du-er-pa-internett-eller-noe-helt-annet/ Scroll to bottom to the comments section to find the f - Japanese `ja`: WordPress コメント機能の基本的な使い方 – 承認・返信・拒否・削除 https://ring-of-life-netbiz.com/wordpress-comment https://i2.wp.com/ring-of-life-netbiz.com/wp-content/uploads/2016/12/wordpress-comment6.png?resize=591%2C386&ssl=1 - The translation for all other languages are copied from the key "$ReplyToThisComment" in shikhadongre/chamilo.classic@e2c90e9
Loading of renderMathInElement(document.body) in jQuery caused error, blocking the load of custom KaTeX macros in per site /static/js/. With this line removed, the custom KaTeX macros have managed to run again.
Update: Towards a more static nested comments support Before fe547af, the anchor in each comment reply is too complicated. It finds the beautifulhugo/static/js/staticman.js Lines 57 to 61 in 8f3b0c3
Get the whole picture from two separate files are hard, so as the difficulty to maintaint them. The recent commits attempt to directly compute the right anchor links by Hugo (as a staticman site generaor). i.e. The anchor The new way makes use of Hugo's
Removed JavaScript smooth scroll to keep things simple. diff --git a/static/js/staticman.js b/static/js/staticman.js
index b874723..1e6b027 100644
--- a/static/js/staticman.js
+++ b/static/js/staticman.js
@@ -52,11 +52,4 @@
$('input[name="fields[replyName]"]').val("");
$('.js-form fieldset button.button').text('Submit');
});
-
-
- $('.comment-reply-target a[href^="#"]').click(function (){
- targetPostID = $(this).attr('href');
- targetID = "#" + $(targetPostID).parents('.static-comment').attr('id');
- $('html, body').animate({ scrollTop: $(targetID).offset().top-$('nav').height() }, 500);
- });
})(jQuery); |
Accidentally removed in previous merge with upstream. Needed for reply button.
1. Comment author, reply target author and time are at the same line. 2. Improved comment button appearance. 3. Show reply target name and avatar on top of the comment form. 4. Copied notice about email addr & req'd field from Minimal Mistakes. 5. Replaced modal with notice under the comment form like MM. 6. Disable the comment form during form submission like MM. 7. Clear comment preview after clicking "reset".
Careless mistake during diff patch
1. More visible close button in reply target display 2. Unified button text color to solarized $base03 3. Enlarged reply target avatar by 1rem 4. Removed "small" class in MM's commentFormInfo for consistency
Confused code with other themes. The comment id "comment-XrY" human-readable, while the replyID field value is generated.
Hey @VincentTam, Thank you so much for all your hard work! I'd love to merge this. Github is complaining about an unresolvable conflict, and I think it's just upset that you moved the .css and .js from static/* to assets/*. Can you tell me why they moved? Thank you! |
The motivation for such refactoring is the same as daattali/beautiful-jekyll@19c9d06: to avoid spam comments by moving the form action URL to JS, so that a static HTML scan performed by search bots won't find the URL. To do that, we need some Hugo code in the asset JS file to read the custom Staticman API from the site config file. Issues to be fixed:
|
Hi all, and thank you @VincentTam to work on this feature The demo you refer to is not working anymore : https://vincenttam.gitlab.io/post/2018-09-27-custom-katex-macros/ Cheers |
Can we have the ability to:
|
@sirinath yes but git is not made for huge data storage like SQL. stars accompanied by a written comment can be treated as numbered field, but I worry that FB-like likes/thumb ups would generate too much interactions, which are then transformed into an illusory "code source change", that your Git hosting site isn't made for. An SQL database is a more sensible solution. looking back, i've put too much things into one PR. i shld hav broken it into several, but i dun hav the time to do so. my tweaked theme on GitLab at https://gitlab.com/VincentTam/beautifulhugo works well for my blog https://vincenttam.gitlab.io, so i won't bother to maintain it. as can be seen from users in the official Staticman repo, there's a strong demand for a working Staticman example. i believe leaving it untouched here might help other courageous testers, especially the sample config files |
Demo site
https://vincenttam.gitlab.io/bhdemo
New features
Bug fixes and modifications
$...$
to KaTeX's defaultdelimiters
.Backward compatibility
I tested this for another existing Beautiful Hugo site. Despite some missing fields (c.f.
staticman.yml
) in existing YML comment data, this works fine.Quick guide to test this pull request
If you're using a theme as a Git submodule (as recommended in Hugo's official tutorial), you may create a new (local/GitLab/etc) (private) repo for this theme and run these commands to get this PR merged against a testing branch
pr222
in the private repo. I denote the URL of this repo as theupstream
.Remarks rooms for improvement
I'm not a developer. I wrote this based on my basic knowledge in web markup and scripting languages, @dancwilliams's great example, some Google search results and trial-and-error. This commit history is far from clean: I've changed some important field names and file structure a few times.
<article id="comment-1">
inlayouts/partials/staticman-comments.html
, so I store the comment_id
in a "reply to XYZ" link button.id="comment-1r1"
. Though I call them "nested comments", a reply comment is not an HTMLchildren()
of any.static-comment
.{{ if not .parent }}
inlayouts/partials/staticman-comments.html
(introduced at d68cf2e by @badele) to{{ if not .replyThread }}
becauseoptions[parent]
is for subscription entries. It's clear (to me, at least) that @badele intends to loop over all "main comment" (as in Nested comments with Reply to support. eduardoboucas/staticman#35) first.replyThread
instead ofthreadID
because a "main comment" starts a thread, so it belongs to a thread, thus it would look a bit strange without athreadID
.offset
instatic/js/staticman.js
so that the anchor target won't get covered by thenavbar
. Maybe there's a pure CSS solution.<a>
instead of<button>
for reply button. After hours of trial-and-error, I've to introduce either a delay or ananimation
(the way I prefered) so that I can jump to a different element (the top of the post) by feeding anotherhref
(id
of the "reply to" button)See also