Hi there. For an upcoming season of a near future sci-fi narrative project, we want to try and rewrite the dates in all posts in certain categories on our Discourse to specific day/month/years. I’m it sounds strange, but it makes sense in our case because our community uses it for in-universe role play, and seeing the actual year undoes a bit of the suspension of disbelief. I’ve tried searching around for existing plug-ins or other solutions without much luck. Best that I can figure out is that I would need to write one myself and use plug-in outlets to alter the dates. Anyone have ideas or existing stuff we could use?
Oooo, sounds fun! There likely isn’t any existing solutions for this, and I can’t really imagine a legitimate reason to create one that would actually change the actual timestamp. What you can do instead is create a custom Theme Component that would insert a fake timestamp per post.
You can add a generic [wrap] bbcode, which will let you use any arbitrary [wrap=] bbcode in the posts you want to change.
Set something up like [wrap=timechange time='Apr 1'][/wrap] and you’ll get <span class="d-wrap" data-time="Apr 1" data-wrap="timechange"></span> in the post itself. Then you can use decorateCookedElement() to search for [data-wrap="timechange"] in each post to decide if it the timestamp should be changed.
I don’t think there’s a plugin outlet at the timestamp, but you can always just insert a new element in the post-date anchor element and use some CSS to hide the old.
Here’s what the current post-date looks like.
<div class="post-info post-date">
<a class="widget-link post-date" href="..." title="Post date">
<span title="..." data-time="..." data-format="tiny" class="relative-date">...</span>
</a>
</div>
You’ll want to probably target .post-info a.post-date and add a new element there as a span or something of the like. Some CSS .post-info a.post-date span:first-child { display: none; } will hide the real timestamp. Targeting the anchor tag and preserving it will let your users be able to continue to use it normally (it has share functionality).
Connecting it to the decorateCookedElement(), the function gives you the root element of the cooked post, so you can do a quick search up the DOM from there with element.closest() and .querySelector() to reach the correct .post-info.
Using bbcode would let you (and anyone else) change the the visual of any post, regardless of category. You can also limit where it actually gets displayed with some clever CSS. The body should have the class .category-* that will have the category name of the topic. So you can limit your CSS to those categories.
3 Likes
That’s some great info to start with. We’re specifically wanting to have it be automatic, rather than something each post would have to opt into so I’m not sure if bbcode specifically will be necessary but I suppose if we had a thing that automatically generated it when rendering posts, that could work. I’ll definitely look into your suggestions. Thanks!
To give you a bit more context, it’s for Neurocracy, and our Discourse is at talk.omnipedia.app where you can see the Speculation category that has sub-categories for each in-universe date. Our community naturally fell into roleplaying as users of our future wiki debating the various twists and turns.