Hide Tiddler Body

Folks - see my recent solution The quickest and easiest ever todolist in tiddlywiki ? Requires 5.2.0 - #2 by TW_Tones for an example of why we could use a way to programaticaly hide the body, in this example I provide a fold button as the work around.

Also @Mohammad see inside quicklist for a method I employed to simply parse the lines similar to Section Editor - Prototype it may prove of use in the future.

Section-Editor respects the core tiddler folding state using the below viewtemplate


<$list filter="[all[current]has:field[se-type]!field:hide-body[yes]]">

<$reveal tag="div" class="xtc-tiddler-body" type="nomatch" stateTitle=<<folded-state>> text="hide" retain="yes" animate="yes">

<$list filter="[all[current]!has[plugin-type]!field:hide-body[yes]]" variable=NULL>

<$vars hn={{{ [[$:/plugins/kookma/section/configs-hn]get[text]else[2]] }}} > <!-- default number of headings 2 -->
<$macrocall $name=section-editor source=<<currentTiddler>> pattern=<<pattern>> />
</$vars>

</$list>

</$reveal>
1 Like

@Mohammad I was looking at how you are hiding the core/ViewTemplate/Body and display the sections viewtemplate. I want to similarly display a table with editor in one column and preview in the other column like shown below.

This table is in a tiddler called Alternate editor

I created a config tiddler called $:/config/ViewTemplateBodyFilters/Alternate editor with tag $:/tags/ViewTemplateBodyFilter and its content as

[has:field[ae-type]!field:hide-body[yes]then[$:/plugins/arsheth/editor/viewtemplates/alternate editor]]

Now I created a tiddler called $:/plugins/arsheth/editor/viewtemplates/alternate editor
How should I modify your code in the the tiddler $:/plugins/kookma/section/viewtemplates/sections so that my table in the tiddler Alternate editor is shown in tiddler with field ae-type instead of the tiddler body.

\import $:/plugins/kookma/section/macros/main
\define filterpattern() ^\[.*\]$

<$list filter="[all[current]has:field[se-type]]"> 
<$reveal tag="div" class="se-tc-tiddler-body" type="nomatch" stateTitle=<<folded-state>> text="hide" retain="yes" animate="yes">
<$list filter="[all[current]] :filter[<currentTiddler>get[se-type]regexp<filterpattern>]" variable=patchworkTid
       emptyMessage="""<$macrocall $name=sectionizeSingleTiddler sourceTiddler=<<currentTiddler>> /> """ >
  <$macrocall $name=sectionizePatchworkTiddler sourceTiddler=<<patchworkTid>> />
</$list>
</$reveal>
</$list>

<!-- generate sections only by heading levels (h1, h2, h3, ...)

Note: this view template works with cascade new filter operator and uses $:/config/ViewTemplateBodyFilters/Sections
-->

I tried adding a list filter and transclude the Alternate editor tiddler with table in it , but that was not working. Any suggestions ?

I plan to create a button to add the field ae-type to tiddlers as I need (Similar to the JanJo section editor viewtoolbar button)

Theoretically, what you put in $:/plugins/arsheth/editor/viewtemplates/alternate editor will be displayed.

This code is little out of date, there is no need to check again if the tiddler has se-type field as the cascade already has done this!

This is to honor the fold state!

This is what it display instead of body

Is it needed in my case?

Can I just transclude the table tiddler here instead of the macrocall

No, it uses two states, you have one!

Sure, you can!

I use these four tiddlers, still nothing happens on adding the field ae-type to a tiddler by clicking the viewtoolbar button. @Mohammad Can you take at look this when free ?

<$list filter="[all[current]has:field[ae-type]]"> 
{{Alternate toggle editor}}
</$list>


[has:field[ae-type]!field:hide-body[yes]then[$:/plugins/arsheth/editor/viewtemplates/alternateeditor]]

This is the alternate editor table -

Here is a demo wiki - https://demowiki.tiddlyhost.com/

I have put all relevant tiddlers in the home page.

@arunnbabu81
As I understand, you like to show a tiddler as a table using viewtemplates (here cascades) and hide its content, am I right?

You are right. That table has editor on left side and preview on right side

Okay then lets first go through cascades

  1. you need to have a conditional viewtemplate, I see you have one My TiddlyWiki — a non-linear personal web notebook

add a list-before to it with value $:/config/ViewTemplateBodyFilters/default

I have added the list-before field now with value $:/config/ViewTemplateBodyFilters/default- My TiddlyWiki — a non-linear personal web notebook

Now the alternate editor viewtemplate is getting activated once I add the ae-type field using the viewtoolbar button. But I need to modify my filters somewhere I guess beacuse on all tiddlers the same alternate editor table is being seen. I have to go for work now. I will revisit once I am back home.

Okay. now it works, you can start with adding gradually the style and content you want. This will help you to debug the current code!

After a lot of tinkering, finally I was able to make it work.
Now there are three editor modes which are activated by viewtoolbar buttons.

  1. Alternative editor without preview - This is a simple editor created using edit text widget.

  1. Alternative editor selective - This is an editor with three modes - simple editor, preview, editor with preview modes which can be selected using radio buttons.

  1. Alternative editor selective for modals - Same as the second one except that the editor is loaded in a modal.

Click on these three viewtoolbar buttons to see the editors working. image

Check out the editors in this link - My TiddlyWiki — a non-linear personal web notebook

Given below is a link of ensemble tiddler showing ensembles for each editor modes and their related tiddlers.
https://demowiki.tiddlyhost.com/#%24%3A%2Fplugins%2FBTC%2Ftiddlywiki-multi-columns%2Fui%2FSideBarTabs%2FEnsemble

Thank you @Mohammad for the helps.

2 Likes

Great work!
Thank you for sharing!

Sidenote: TW Icons is a comprehensive collections of icons, you can find good icons there with same size and line thickness ( stroke-width) as TW core icons!

I took it from this wiki TW Icons v1.10 — A large collection of icons for TiddlyWiki
Will check for more compatible icons when I get time.

@Mohammad

I have a small problem- check this tiddler

This is how it looks normally.

But in the preview mode of my editor, the wikitext formatting is lost.

This is the Editor tiddler and given below is the code that deals with the preview part.

<td style="width:50%;height:90vh;vertical-align:top;max-height: unset;overflow: auto;">
{{!!text}}
</td>
</$list>

</td>

I even tried the code given below instaed of {{!!text}}. BUt its not working.

 <$transclude tiddler={{!!text}} mode="block"/>

Is there any workarounds?

Perhaps somewhere you need to add an extra blank line! by the way for mode block I prefer

<$transclude tiddler={{!!text}} mode="block"/>

over

{{!!text}}

That worked :+1:

Is there any particular reason for that ?

At least you can control the mode! also $transclude can accept variables as attributes value, …

For detailed discussion see:

Question for clarification transclude widget vs shorthand transcludes - Discussion - Talk TW (tiddlywiki.org)