Handling title and view toolbar overflow

[AnthonyMuscio]

Folks,

With large tiddler titles or wikis that use a lot of view toolbar buttons or both the forcing of the title across multiple lines is ugly. I would like to suggest a tweak in the standard distribution ie empty to help with this since it is such a basic user interface element.

There is one or more ways to handle it

• break the buttons over two lines perhaps with a break number or according to title length.
• introduce a new toolbar below the existing one where you can place selected buttons
• shrink the titles font size to fit
• have an alternate more button as distinct from the current one, in which you can place buttons, given the existing more button can be hidden to hide the buttons there in if desired.
• some other cute UI improvement to handle more buttons without competing with the title.
• for example a button list popup or floating buttons that follow you.
• I would like tool bars that can have buttons assigned that run down or are centred in the left and right margins of tiddlers. I just can understand the layout mechanism enough to do it. Useful for top or bottom of long tiddlers. Basically we list all buttons and if you check it in anyone of the toolbars it will appear there.

I already found it easy with css to move the ratings stars from the rating plugins to appear aboive the existing tool bar in the top right of the tiddler see image, and I created a viewToolbar 2.

Another idea is to add an item in the sidebar or a floating toolbar that detects the currently focused tiddler and presents tiddler toolbar icons for that tiddler so they need not be visible on the tiddler in the story (more a plugin I think).

What are your thoughts?
Have you already done or seen something like this.

Tony/Tones

[AnthonyMuscio]

• Other possibilities shrink and grow the view toolbar on hover.
• simply reduce there size with a slider.
• Add more conditional logic to toolbar buttons so they do not display unless in context

[BurningTreeC]

Hi @AnthonyMuscio ,how about an option to show the Tiddler controls vertically on the right side?

[AnthonyMuscio]

Yes

That is a plausible option. Ideally with an alternative tool bar which I know how to do but I do not know how to place things there. I expect they should be a little smaller in size there.

[BurningTreeC]

Could you explain how that alternative bar should look like @AnthonyMuscio ?

[AnthonyMuscio]

BTC

Tiddler controls vertically on the right side?

simply put I expect it should be no different to the existing horizontal tool bar, but ideally perhaps the icons could be half or 3/4 the size (ideally configurable).

Ideally it would be tag driven (new tag) like the current one and honour the visibility setting.

Some notes

• A more sophisticated one would allow you to choose between top/bottom or centred in the vertical space for longer tiddlers, at the top may be safe. Or top and Bottom and middle.
• The best would be so they moved as one scrolled down so that they sat in the same place on the page until the bottom of tiddler. As an example this would allow the tiddler to be closed even when reviewing the bottom of a long tiddler.
• I kind if expect some buttons to remain in the standard toolbar, and some moved to the vertical one according to need rather than replace the top right with a vertical right, however moving the whole toolbar could be achieved by moving all the buttons leaving more room for the titles.
• An example of additional buttons I may especially to a left or right side toolbar would be buttons to navigate to top or bottom of the current tiddler (conditionally if the tiddler is larger than some set size (larger than the "viewport"?).
• Perhaps the addition of a new button in the position of the old toolbar with a hamburger icon drop down would help because many of us will instinctively move to the top right to find a button, out of habit (I could do this), so it would be good if they can still be found there, I think I could do this myself.
• The old TWC allowed a bit more configuration than we have today, although it was clumsy.

As I said I can do the toolbar config but not the placement part.

The key objective would be to give more button real-estate and recover space for long titles.

I have a larger project objective of creating a new-elements package (plugin) for placing content like buttons, drop downs and (tag) pills in other locations to suit each designers needs. So If I can acquire some knowledge of this placement of new elements on the page it would be great.

I will reply with an image

[AnthonyMuscio]

The following image illistrates the locations

• The red would be an additional vertical tiddler toolbar
• The green one day would be an additional floating Page control toolbar (follows you all the way to the bottom)
• The optional hamburger menu would drop down and show all the existing buttons with the viewToolbar tag and nor with visibility hidden (similar to the more)

[AnthonyMuscio]

As a result of this thread I have developed one solution to viewToolbar overflow

This is the hamburger view toolbar menu. You can choose which buttons to show in its drop down except itself and the more drop down as it does not work within the menu and is not so relevant.

There is a whole new toolbar defined in Control Panel > Appearance > Toolbars

The order is tied to the viewTool bar due to the shared tag, allowing new buttons to be selected as well.

I will try and build a template for such solutions, and one for page controls so any new tool bar that comes along can use the same mechanism. eg a floating ands/or vertical toolbar. In fact we could just float the hamburger? (not that I know how yet)

view-Hamburger-toolbar.json.txt