New plugins for TiddlyWiki navigation menus

[Saq Imtiaz]

I've just posted two new plugins to make creating navigation menus in TiddlyWiki a whole lot easier.
The DropDownMenuPlugin allows you to create dropdown 'suckerfish' style menus, while the AccordionMenuPlugin provides an alternative to sliders for having an accordion style menu.

Details here: http://lewcid.org/2007/11/06/creating-tiddlywiki-navigation-menus-the-easy-way/

Cheers,
Saq

--
Tiddly Learning ( http://lewcid.org ) : TiddlyWiki news, plugins, themes and educational usage

[wolfgang]

Hi Saq,

thanks for completing these, by me curiously awaited new releases of:

1.) AccordionMenuPlugin (finally the answer; asked already a couple of
times unsuccessfully here on GoogleGroups - how to get this work where
it would make most sense? i.e. the MainMenu), and

2.) DropdownMenuPlugin

Naturally, I find AccordionMenuPlugin already much more matured of the
two. It's really effective, leaving aside any unnecessary animation
effects. The design is straight forward, and it wasn't much trouble at
all to adjust the size or color for a CSS illiterate like me by mere
trial. By now - especially for TW beginners - for sure the most
easiest and quickest way to organize the MainMenu with sliding sub
menus.

For understanding its pro and cons I would compare it with the similar
AccordionEffect (CSS) by Ocat, which uses Slider2Plugin by BramChen
for an equal accordion effect in the MainMenu - and taken CSS and JS
of each together - AccordionEffect is also only about 1kb larger.

Here AccordionEffect for me still has the lead for a really pretty
animation effect. Next, that any tiddler or kind of menu can be
included through the tiddler macro (similarly to the PopupMacro).
However, at this point it also struggles as soon as animation gets
disabled - with other than nicely listed links in the submenus.

So I would give AccordionMacro certainly the preference for its
effectiveness in an otherwise already bloated TW. That it leaves the
last opened slider open I find very useful too.

In cases where design and complexity - and not effectiveness with size
plays a role - I guess AccordionEffect still the better choice.

As already said, DropdownMenuPlugin - in my eyes - would need some
further refinement. The biggest disappointment was that in this
release, the five !!! possible levels of submenus were reduced to only
one. Taking away the possibility of creating more complex menus - I
was looking so forward to. However, its equal style to AccordionMacro
still makes it a really nice horizontal menu below the header as
addition to a vertical AccordionMacro in the main.

However, here I encountered also a bug, and I'm interested if anyone
experienced the same: The beautiful lightly blue colored dropdown
menus on the left side of the screen disappear behind the Accordion
menu! (by using some of MPTW's style for the additional top menu)

So, till I'll find what's causing this trouble - and also till more
sublevels for more complex menus are possible - there still remains
good old PopupMacro. And the more comparable in size: PopuptipsPlugin
(BramChen again) as a serious alternative with much more possibly
complex content in it.

All in all - a really good work and direction of development - and a
straightforward and practical addition to what's already there.

Many thanks for your efforts,

W.

PS: just for the record: with the much used and configurable
NestedSlidersPlugin an accordion effect, of course, is just as
possible. But such a comparison wouldn't do justice to the ease of use
on one - and possible complexity and size - on the other side.

On 6 Nov., 07:03, "Saq Imtiaz" <lew...@gmail.com> wrote:
> I've just posted two new plugins to make creating navigation menus in
> TiddlyWiki a whole lot easier.
> The DropDownMenuPlugin allows you to create dropdown 'suckerfish' style
> menus, while the AccordionMenuPlugin provides an alternative to sliders for
> having an accordion style menu.
>

> Details here:http://lewcid.org/2007/11/06/creating-tiddlywiki-navigation-menus-the...
>
> Cheers,
> Saq
>
> --
> Tiddly Learning (http://lewcid.org) : TiddlyWiki news, plugins, themes and
> educational usage

[Saq Imtiaz]

Hi Wolfgang,

Many thanks for the detailed feedback, I really appreciate it. I'll try to respond to your comments and suggestions while offering an insight into my thinking behind these plugins:

AccordionMenuPlugin:
The reason to write this plugin had nothing to do with sizes etc of comparable plugins. I have simply never been satisfied with the syntax required to set up sliders or an accordion in a menu, with any of the pre-existing plugins. For me the main appeal of the AccordionMenuPlugin is that it works of an unordered list which is very easy to write and provides a very obvious hierarchical structure when one looks at it.

* Section 1
** link
** link
* Section 2
** link
** link

 It is specifically tailored for navigation menu's, hence the name AccordionMenuPlugin and not AccordionPlugin. So I guess what I am saying is that it was never meant to serve as a general purpose Accordion plugin!

With regards to animations, they are a pet peeve. I don't like them. Actually, I strongly dislike them! Hence the decision to leave them out. However, as strange as it sounds, I am actually working on an animations library for TiddlyWiki by pure chance... so once I get that completed I might add some animation effects. Optionally!

DropDownMenuPlugin:
The problem here is that any predominantly CSS based solution is hard to style, especially for end users if they want to change the appearance. The multiple level submenus were left out for three reasons in this release:
a) I think they are a usability nightmare and I wanted to see if there was any actual demand for them
b) I had the multiple sublevels working perfectly and nicely styled, but it would have been very hard to tweak the CSS for the end user wanting to change the appearance.
c) and this ties in with b), I am waiting on some newer Popup code to be approved for the TW core code, which will make this much easier to do without the CSS intricacies. I could just include that Popup code in the plugin, but well..... thats not my style. It feels like too much bloat that way.

Once again the main appeal to me of this plugin was the very easy syntax require to write a dropdown menu.

About the problem with the dropdown's hiding behind the accordion, there might be a very easy CSS solution. Any chance I can get a look at that?

Feedback like this is invaluable, as it helps me determine how my plugins are being used and what the needs of the community are, so thank you!

Cheers,
Saq

>
> Cheers,
> Saq
>
> --
> Tiddly Learning ( http://lewcid.org) : TiddlyWiki news, plugins, themes and
> educational usage

--
Tiddly Learning ( http://lewcid.org ) : TiddlyWiki news, plugins, themes and educational usage

[FND]

> I think [multiple level submenus] are a usability nightmare

So do countless usability experts.
Even if it might seem like it at first, multi-level dropdowns are not at
all user-friendly.
(Of course, generalizations are always false, so there might be a few
instances where multi-level sub-menus are acceptable - e.g. in a
personal TW that's only used by yourself.)

> I am actually working on an animations library for TiddlyWiki by
> pure chance... so once I get that completed I might add some
> animation effects. Optionally!

I think this is the right way to go; an optional animations library that
doesn't bloat the code of the actual plugin(s).
This ties in nicely with the upcoming modularization of the TiddlyWiki
core; stripping non-essential functionality out of the core and moving
it into plugins/modules.

-- F.

[wolfgang]

> About the problem with the dropdown's hiding behind the accordion, there
> might be a very easy CSS solution. Any chance I can get a look at that?

Thanks for the detailed response. Just send you the zipped TW. Also -
I was mistaken about MPTW style possibly being involved with the
disappearing dropdown. Because that I only needed for the
PopupTipsMenu, wich I used to have a comparison with. (otherwise there
would have a gap remaining between the horizontal top menu and the
header - which I wasn't able to remove with my 'on-good-luck trial and
fail' CSS adapting method.)

While DropdownMenuPlugin doesn't need such an addition.

W.

[Saq Imtiaz]

Two issues right away:

ul.suckerfish li:hover ul, ul.suckerfish li.sfhover ul { left: auto; z-index:999;}

In StyleSheetDropDownMenuPlugin, find the above line. The z-index part is new.

The other problem is that your MainMenu is overlapping with TopMenu and needs some margin-top.

Try #mainMenu {margin-top:2em;}

I'll look at it in more detail tomorrow.
Cheers,
Saq

[wolfgang]

Thanks for solving the first issue,

about the second though - I wanted the MainMenu to be separated from
the TopMenu by only one pixel (as the separate menus buttons of
accordion and dropdowns are), and before moving it up so close - the
issue wasn't different either.

But for now - a good nights rest,

W.

On 7 Nov., 22:23, "Saq Imtiaz" <lew...@gmail.com> wrote:
> Two issues right away:
>
> ul.suckerfish li:hover ul, ul.suckerfish li.sfhover ul { left: auto;
> z-index:999;}
>
> In StyleSheetDropDownMenuPlugin, find the above line. The z-index part is
> new.
>
> The other problem is that your MainMenu is overlapping with TopMenu and
> needs some margin-top.
>
> Try #mainMenu {margin-top:2em;}
>
> I'll look at it in more detail tomorrow.
> Cheers,
> Saq
>

> Tiddly Learning (http://lewcid.org) : TiddlyWiki news, plugins, themes and
> educational usage

[olosvk]

Hi Saq

> a) I think they are a usability nightmare and I wanted to see if there was
> any actual demand for them

I don't think that it is a nightmare, because who would use >10
levels ? :))
The average would be between 1-3 I guess and yes, there is demand for
it,
I'm an example. I remember mentioning you this plugin many months ago,
reading your first post in this thread with excitement, but ending a
bit disappointed.

> b) I had the multiple sublevels working perfectly and nicely styled, but it
> would have been very hard to tweak the CSS for the end user wanting to
> change the appearance.

Really ? Is this version of your plugin available ? ;)
Maybe it would be hard, but styling (css customization) TW is still
pain in the a...
I mean, it is easy to change one thing (typing in edit mode), but
after entering
many css lines lucidity is lost and few moths later, thinking...what
did I do ?
So it makes no difference.

> c) and this ties in with b), I am waiting on some newer Popup code to be
> approved for the TW core code, which will make this much easier to do
> without the CSS intricacies. I could just include that Popup code in the
> plugin, but well..... thats not my style. It feels like too much bloat that
> way.

Will you add the multilevels then ? Actually I would appreciate
multilevels
in TaggerPlugin too :).

[wolfgang]

> Will you add the multilevels then ? Actually I would appreciate
> multilevels
> in TaggerPlugin too :).

Hi Olovsk,

your request made me think it might be indeed a very good option, if
Saq would publish a DropDownMenu"Plus"Plugin version. Like it seems to
be planned with the new CollapsingListsPlugin (see http://tw.lewcid.org/svn/plugins/).

That way the user could decide himself - if he would prefer easy
adaptable style - or 'perfectly working multiple sublevels'. And I
guess, since TW will always be used more often as a personal notebook
than for presenting a webpage - the latter would be chosen more often
right away.

In the end it's the user defining something a 'nightmare' or 'a dream
come true' - after experiencing endless sleepless nights, without
success in trying to get an intuitive menu going (which, on top of it,
is as easy to create as a list ;-).

Saq, I think this would be a much better solution, without having to
take the 'either this'/'or that' approach.

Regards,

W.

[wolfgang]

> I'll look at it in more detail tomorrow.
> Cheers,
> Saq

So it seems to be bid difficult to have the dropdowns of the
DropDownMenuPlugin not to disappear behind the Accordion in the
MainMenu?

One more question: how is it possible to have the search Bar in the
horizontal top menu? - without the search button, which otherwise
pushes the search bar itself down?

Placing: config.macros.search.label=""; into a systemConfig tiddler
usually make the search button disappear. But beside dropdown buttons
within the top menu - it remains as a fragment and pushes the search
bar down still for 3-4 pixels.

Regards,

W.

On 8 Nov., 07:14, wolfgang <wolfgangl...@gmail.com> wrote:
> > Will you add the multilevels then ? Actually I would appreciate
> > multilevels
> > in TaggerPlugin too :).
>
> Hi Olovsk,
>
> your request made me think it might be indeed a very good option, if
> Saq would publish a DropDownMenu"Plus"Plugin version. Like it seems to

> be planned with the new CollapsingListsPlugin (seehttp://tw.lewcid.org/svn/plugins/).