1 Like
What does it do?!?!?
This is a table, you can possibly use HTML table tags to make it, You can see how mediawiki do this.
But I think it’s better to generate such a table from a tree-struct JSON, and we can use a javascript macro to generate the resulting HTML markup.
And a more tiddlywiki way is to use a JSON data tiddler as datasource, and use a widget like <$navbox data=“xxx” />
It is used to navigate to different tiddles.
1 Like
Will it be complicated?
@linonetwo Personally I do not think we need anything but wiki text and widgets, but I am sure to can envision a grander solution.
@pkuadt but you do need to “spell out” more what you want. In someways the current contents tab is doing the same just not formatted the way you see.
Sorry for the necropost, but I was wondering if you ever got this working, @pkuadt ? I am keen to do something like this myself, as I am trying to use TiddlyWiki to create a somewhat more traditional MediaWiki-style wiki. The suggestion from @linonetwo to use a JSON data tiddler as datasource sounds very interesting. I am not too worried about the complexity involved in the back-end of it for our wiki editors, but I’d like something that feels familiar for people browsing the wiki.
My simple method using fields and wiki table, then floating a <div> with the transcluded table tiddler.
WikiBox_tiddlers.json (5.4 KB)
That looks pretty amazing, @john.edw_gmail.com. However, as the example from @pkuadt shows, it would be great to have collapsible sections, as well as optional space for some descriptive graphics. I might see about extending what you have shared here. Thanks!
In a way its all about preparing a template, with the HTML and tiddlywiki structure you want and having the tiddlywiki script to obtain or list the content in each element.
I recommend;
- Have a field to indicate the tiddler is of a particular type eg object-type=wiki-page
- Use a body cascade to display you custom page view on tiddlers with an object-type=wiki-page. This will transclude the wiki-page template
- eg <$transclude tiddler="$:/page-templates/wiki-page"/>
- The template will be relevant to the current tiddler and show the information in the current tiddler, its tags and fields.
Is there by any chance a built-in CSS Utility Class, similar to tc-table-no-border for example, which can set a table row to be expandable, and one for it to be expanded or collapsed by default? I’m looking at Tables in WikiText CSS Utility Classes in the documentation, and hoping that something already exists to do this, without me having to write extra code for it. If not, how would I go about writing such code to do this? I need it to be reusable code, so that I don’t have to put a macro on every tiddler where this feature gets used.
Just search for tc-table-no-border or tc-table go to advanced search - Shadows tab and you will see the tiddlers it is in. $:/themes/tiddlywiki/vanilla/base
Tiddlywiki is an open book
You can of course define your own in a tiddler tagged with $:/tags/Stylesheet
I found that one, but I cannot see anything existing that looks at all like a collapsible/collapsed state, so I assume that this is not a feature of TiddlyWiki.
I have no idea how to do this myself, as I’m not overly familiar with CSS. I searched Google and found a few suggestions such as this one from *CSS-TRICKS, this one from webtips.dev, and this one from StackOverflow, but they all seem very convoluted and confusing, compared to the simplicity and elegance of the example you pointed me to in the $:/themes/tiddlywiki/vanilla/base tiddler.
There are numerous ways to make sections collapsible from a popup button and reveal widget pair to the html details or $details widget available with a search.
- Perhaps that could be handled in a new topic, or search for this separately.
Sorry, I was trying to keep this all together in the same topic as it is all related. If you see the screenshot in the opening post, the [hide] and [show] controls are for these collapsible sections of the navbox. The topic of this thread is about implementing something similar in TiddlyWiki. The suggestions received in this thread to date go a long way towards an answer to the initial question, but still leave out some crucial details, which I’m trying to fill with my further probing.
I guess what I’m ultimately looking for in TiddlyWiki is the equivalent of the MediaWiki classes mw-collapsible and mw-collapsed, which are commonly used in wikitext tables, and particularly in navboxes. Manual:Collapsible elements - MediaWiki
This adds a basic reveal widget and the image column plus table width copy pasta from shiraz stylesheet.
WikiBox with reveal tiddlers.json (6.6 KB)
Columns could use some width formatting to ensure the images are aligned.
Ah, that is definitely getting closer to what we are trying to achieve here, thanks so much @john.edw_gmail.com. I’ll see if I can tweak it from there, and then publish my results back here so that others in the future can make use of it as well, with acknowledgement to everyone in this thread for their input into the solution.
This is what we are trying to build, an equivalent to the Navbox template from MediaWiki, but built using TiddlyWiki instead. Template:Navbox - MediaWiki
This is going to take me a long time to figure out how to do! Note that, from the example I posted above of the MediaWiki meta-template, this is not a one-and-done deal and it is actually extremely complex internally, with iterative sub-groupings, various options exposed, and everything needs to be built-in as a template so that different navboxes can be run through the one meta-template and give different results depending on the parameters specified when the template is used. I think this is quite a different concept than what TiddyWiki generally calls a “template”.
1 Like
Not at all, it is a single example of what TiddlyWiki calls a template, it can be a template for many things.
From my perspective you simply create a template, which includes html to structure the components on the page, possible even only displaying an element in particular conditions. Then inside each element you use TiddlyWiki script to retrieve or generate the content. Do this relative to the currentTiddler which I explain below.
Then, using a body cascade or viewtemplate tag on tiddlers that match a condition you transclude the template. eg: object-type=wikipage, The template will be transcluded and the tiddlywiki script within it will generate the content relative to the current tiddler being displayed.
Eg in a tiddler tagged $:/tags/ViewTemplate
<$list filter="[all[current]object-type[wikipage]]" variable=nul>
<$transclude tiddler="your wikipage template tiddler"/>
</$list>