[MCL] Let's do it

I did write on Twitter …

“MultiColumn Layout” (MCL) is a recent innovation in #TiddlyWiki that deserves serious attention: MultiColumn Layout — a non-linear personal web notebook

So. What do you think?
TT

2 Likes

I agree @TiddlyTweeter this is a serious innovation and look forward to building tiddlywikis based on it soon. @BurningTreeC must be congratulated not only on his solution but the rigor to the way he has developed it, and addressed (almost all) the matters that arise from a multi-column/story view as well.

Key values I see include;

  • Used on mobile you can swipe left/right between columns providing a much better interface to long scrolls but each column can be as feature rich as the regular tiddlywiki story.
  • On desktops the ability to enter and leave panorama mode is a quick way to give a particular column your focus or see them all on one page or make use of full screen, but you can change back to the standard layout as well.
  • On desktop you can make full use of your big screen real estate, sweet.
  • Its Ensemble tools allow you to quickly reconfigure your setup in some ways providing an unlimited set of additional multi-column layouts, I need to play more with this.
  • A lot can be done with Keyboard shortcut keys including quick navigation that is missing in the standard tiddlywiki, top bottom, reorder in each column etc…
  • You can customise the left side bar as you wish, I think I prefer to use the right sidebar as I do out of multi-column mode and make use the left side bar for a current reference or guidence tiddler.
  • This looks like we get native access to tiddlers a bit like a Kanban board, but the current release does not seem to have documentation on dealing with headers to each column yet, which is needed for a good Kanban.

Good design features

  • It is a plugin not an edition so can be added to most wikis, even retrofitted
  • You can use the layout switch to return to the default layout if you need to
  • I have tested a pile of my customisations to regular tiddlywiki and for MCL and most work out of the box, sooo cool

Temporary cautions

  • It runs on the prerelease 5.2.3 so I would be cautions building too much on an important MCL wiki just yet, it will be a great day when the new version of tiddlywiki is released
  • I have noticed some things that work in the sidebar, such that navigate to a tiddler become column dependant, I will need to see how I can handle this, ideally in a way that does not demand a different operation to the standard layout.
  • I Expect a lot of users may want to add a little customisation to handle title sizes and button when using more than 2 or three columns.

Your title implies some sort of action should be taken. Not sure what that is.

What are your use-cases for this tool?

Lol! I was merely trying to get it a bit more attention as I think what it does very interesting!

  • a DJ CONSOLE - quick access to mp3s. Using columns for “music type”. Using the Ensemble feature to quickly switch in a new “playlist” (Jazz, Punk, Funk).

  • for MESSING ABOUT - one of the great things is that each column is a semi-independent river. This enables you to load the same Tiddler multiple times over columns. This is fantastically useful for design work. For instance: Load an SVG 7 times and in each of the 7 columns apply different styling to the SVG since each column / river can be styled independently. So: I do think it may become an assistive tool for wiki development. You get the idea?

  • a SUPER TRACKER - one thing I’m seriously looking at is to use MCL to “track” events in several ways. For instance: “My Day” could have columns for ‘Food’, ‘Meds’, ‘Work’ etc. The point is that having multiple story rivers VISUALLY massively expands what we can do easily in TW. And looking around the web I don’t see anything close to this visual flex.

Best TT

Right. It is just a matter of “getting it”.

@BurningTreeC opted to call it “MultiColumn” but it is also “MultiRiver”, meaning that sidebar things like the “Open” tab only list the Tiddlers in the currently “focused” river. It is easy once you “get it”, but it does need documenting. I’m trying to do that to try give back to @BurningTreeC a little.

TT

2 Likes

There’s a modifier key to control column sizes. But it doesn’t say what it modifies. I’ve tried the arrow keys, greater/lesser keys, and plus/minus. I’m sure it something obvious, but I’m not finding it at the moment.

Is there a way to make all tiddlers the same height in display mode? I could see a use case for a grid-like construction.

There’s an option for turning off scrollbars, which could be useful if you wanted to freeze the current page for study. The problem is, you first have to roll the configuration into view, which means one of your columns is used for configuration rather than display.

Just some observations.

Yes, probably through a global stylesheet under the class “btc-column-container”??

TT

1 Like

That is something that interests me too.

Whether we can “freeze” / put in “lockdown” columns such that the columns / rivers no longer scroll (just removing scrollbars doesn’t stop scrolling).

There may be good uses for that. But on that I don’t know enough to know how to do it.
Maybe @BurningTreeC may have thoughts on it?

TT

On mine it certainly prevented scrolling. Be sure you haven’t accidentally left the focus on the configuration option. If you have, then your first attempts to scroll will restore the scrollbars.

1 Like

I think this interesting. No scrollbars exist when I set …

Screenshot 2022-06-23 213242

But scrolling still happens on my Chrome & FF, merely no show of scrollbars.

TT

I assume by the color that you’re using your own set-up. Possibly there’s an interaction with other options. Try setting the option on BTC’s page. When I set the option, the scrollbars disappear, and I can’t scroll using arrow keys or (what other way would there be to scroll?).

No it is one of the palettes @BurningTreeC adapted for MCL: DesertSand.

TT

It is strange. In my case switching off scrollbars is just visual. TOUCH
scroll is still working as is mouse. Dunno why you and I differ!

All I can say is my environment here is a Windows tablet and “scroll without scrollers” works on both FF & Chrome.

TT

1 Like

Ok, mouse scroll works. I was using an older mouse with no scroll today. It’s as primitive as can be.

1 Like

It’s amazing stuff. Works on on Firefox/linux. On the a11y side, I wish the visual effects to know what column and what tiddler is active when you operate by keys be more obvious. That’s only CSS, something in the range of sharper color contrast and increased width for borders.

1 Like

Right.

To explain a bit. First on COLUMN select/focus.
@BurningTreeC adapted, God bless him, some colour palettes to enable highlight of selected/focused columns. He adapted Vanilla, CupertinoDark, DesertSand, GruvboxDark & Nord

FYI, in MCL CSS a selected/focused column has the CSS class .btc-river-active

You can use that, if you understand CSS cascades in TW, to override the default with something bolder.

I did a little test to illustrate the point … CSS …

/* RIVER OVERRIDES - via column class .btc-river-active */
  .btc-river-active {
   background: red;
  }

Result …

Best, TT

Right.

Changing the look of FOCUSED TIDDLERS I think should be possible. But I couldn’t find any public saying of what CSS class is needed.

Please visit this discussion and comment, where I say my piece, if you have the time and interest. I am sure @BurningTreeC would be receptive.

Best, TT

On a single column wiki I built a focused tiddler solution buy adding a viewToolbar button that tests if current tiddler is the same as $:/HistoryList!!current-tiddler, if so its green, if not its red. This could be moved into CSS in someway, like the CSS data tags for named tiddlers referring to the $:/HistoryList!!current-tiddleror equivalent for each column. @TiddlyTweeter

Quick footnote. The defaults, I believe, are …

I assume the default “modifier key” is Ctrl.

Screenshot 2022-06-26 155425

UPDATE: ctrl, shift, alt are the given options.

NB: Column widening & narrowing is only visible in “vertical” mode (Screenshot 2022-06-26 152045).

Does this help?
TT

Where are you finding this shortcut list? The only shortcuts I could find don’t mention narrowing columns. It seems like it needs to be configurable to work in smaller increments.

Thanks!