Main and sub menus - alternate dropdown display feature

This is actually something that Paul Walker and I worked on over the Mahara UK 2011 Conference yesterday. :)

We've made the required changes to add the option to the site configuration and have styled all the packaged themes so that it displays in all (in line with their existing schemes; so some prettier than others in this format).

To add styling to custom themes it should only necessary to add a few lines to the styles.css file in relation to the sub-menu part. The main menu should be able to retain the standard navigation styles.

Once we've done a bit more browser testing and some tidy up we'll add it to reviews.mahara.org. I've attached a screenshot of the 'default' theme using this feature.

Hi Stacey,

Great idea to decrease the number of horizontal navigation bars. I posted it on http://mahara.org/interaction/forum/topic.php?id=3719 where there has been a drop-down menu discussion.

Cheers
Kristina

Oh, of course! Bad Stacey for not looking for forums to update as well :)

Thanks for doing that. Hopefully we have a patch to submit for review within the next few days.

Hey, no worries, Stacey. I can't remember all forum topics either. I just knew about this one. :-)

Once you add it for review, you can assign me to look at it as well because then I'll get a notification and check the functionality for sure.

Done :)

https://reviews.mahara.org/#change,382

Just small styling issue on default template I noticed. Though it might even look better now :) See images below.

Hi Ruslan,

That was an intentional design decision by our designer. :)

We um-ed and ah-ed between having it like it is now and retaining the grey bar below the green. Open to suggestions/votes of course.

Thanks,
Stacey

I see Stacey. I definitely do not like keeping empty grey bar under the menu (like on Admin Home) in standard Mahara navigation as well. But when there is a grey bar prolongs the green menu, that even looks better IMO, probably we should change that for non-dropdown style as well.

Hi Ruslan,

Not sure I understand completely. Would you like the grey bar to appear the same for the standard tabbed navigation as we have it for the dropdown display? Hiding behind the green bar.

Stace

Yep, that is what I meant. But now thinking more about it, it is probably not a good idea since when submenu will be displayed, there will be a thick grey area on the right.

The User settings 'Institution Membership' navigation item gets lost in this new dropdown view as it isn't related to a main navigation item.

Suggested fix to this is to add it to the 'Groups' item. Any objections/other suggestions?

Groups isn't limited just to groups as it is anyway as the Friends related pages are in there already so this isn't too much of a leap hopefully :)

In fact there's a discussion about the naming of the group tab here:

  http://mahara.org/interaction/forum/topic.php?id=3798

I've pushed a patch to reviews.mahara.org to move 'Institution Membership' to 'Groups' - though not renaming the parent navigation title as the interaction topic suggests.

With dropdown navigation set when you click on the 'Settings' tab you are still losing the 'Notifications' page now so I am working at re-jigging that so it remains. Am tentatively thinking about putting it in an enclosed box like the 'Profile' items under 'Content' so I'll just do this and submit and we can throw the change away and try something else if it doesn't suit :)

Stacey, I'm just curious, is there a reason why you can't click on the top-level menu items when drop-down mode is on?

I'd like to be able to do that, for example when I want to go quickly to My Views, I can't just click 'Portfolio', I have to hover over Portfolio first, and then move the mouse down the dropdown to 'Pages'.

I noticed this in the template:

<a href="{if $INSTITUTIONALADMIN}{$WWWROOT}{$item.url}{else}#{/if}"...

Is there any reason we can't remove that {if...} bit altogether and just always put {$item.url} in instead of "#"?

Hi Richard,

Paul says this is just a matter of personal preference design wise - 50/50.

Stacey

Hi Stacey,

I agree with Richard. It would be nice if the top level navigation item could be clicked. Though it doesn't have a separate page, it still gets you to to the first page in the list, what you are used to from the current behavior. It's just a tiny fraction quicker than having to actively click on the first item in the drop-down list.

Cheers
Kristina

Hi Kristina, Richard,

I have submitted a patch to reviews.mahara.org to make the top level menu clickable to the main page in each section.

Stacey

Reviewed: https://reviews.mahara.org/557
Committed: http://gitorious.org/mahara/mahara/commit/3102d2eb8043977be12ef891f1de61a20bdfa728
Submitter: Richard Mansfield (<email address hidden>)
Branch: master

commit 3102d2eb8043977be12ef891f1de61a20bdfa728
Author: Stacey Walker <email address hidden>
Date: Tue Aug 2 14:46:10 2011 +0100

    move 'Institution Membership' tab to 'Groups' tab (bug #801081)

    Change-Id: I79da24132558efb3a26927d1b3370255a3d8610d
    Signed-off-by: Stacey Walker <email address hidden>

Reviewed: https://reviews.mahara.org/598
Committed: http://gitorious.org/mahara/mahara/commit/ef57e6b177bb33d1fcc7048d6e4bdeb00c1b2b2e
Submitter: Richard Mansfield (<email address hidden>)
Branch: master

commit ef57e6b177bb33d1fcc7048d6e4bdeb00c1b2b2e
Author: Stacey Walker <email address hidden>
Date: Mon Aug 15 11:37:16 2011 +0100

    dropdown main navigation clicks to first page in section (bug 801081)

    Change-Id: I8f0c4793c629875d36eb28e33a8dadd665cb4957
    Signed-off-by: Stacey Walker <email address hidden>

Hi - as part of a plugin that I'm writing I wanted to be able to add a menu item under settings via a call to menu_items() from nav_right(). This works in the standard layout if the patch https://reviews.mahara.org/#change,614 (in relation to enhancement https://bugs.launchpad.net/mahara/+bug/834171) is applied.

Is the plan to still build the navigation in 'Settings' from right_nav(), or will there be some other way of hooking in to add things from a plugin?

Cheers,
Piers Harding.

It sounds like we will need a submenu under settings anyway, to manage Piers' tokens. If we can't find a way to show the settings submenu in dropdown nav, another alternative would be to rewrite the settings area to use the 3rd level tabs that appear in the group pages, edit profile & resume areas.

Reviewed: https://reviews.mahara.org/874
Committed: http://gitorious.org/mahara/mahara/commit/12bc059b45900bdd2c0638e0ad25c825777d2864
Submitter: Richard Mansfield (<email address hidden>)
Branch: master

commit 12bc059b45900bdd2c0638e0ad25c825777d2864
Author: Richard Mansfield <email address hidden>
Date: Mon Nov 21 15:51:46 2011 +1300

    Bring back the settings sub-menu for drop-down navigation (bug #801081)

    The submenu under settings in not usable with drop-down navigation,
    because there's no top-level item for it to hang from. This patch
    changes it to group-style tabs within the page when drop-down
    navigation is configured. Just creating a link from the inbox to
    the notification prefs is not sufficient because plugins can now
    hook into the right menu (see bug #834171).

    Change-Id: I7cd6009ed77d5795a9a6880e64d90f8742e47f92
    Signed-off-by: Richard Mansfield <email address hidden>

-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1

status fixreleased
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.11 (GNU/Linux)
Comment: Using GnuPG with Mozilla - http://enigmail.mozdev.org/

iQEcBAEBAgAGBQJPjqdlAAoJECXBtiziiXdcxeoH/iQi1ljFCaDUrA07cq6IAZga
p3Tw7VRtZBy6Cl5NwOFg1b4/DsqFIM9fQPb+WpJqUAcTVP6B44QElOCtb0ldeZCw
cgWlkkSj1jk/gpCdKhCZ2MMHkRjMao5ZpUyF4vSO26tIiYcvPIhRoF6uWu0Z40xe
1wee4ZKGEEvO13bujMyuu4nEQSd9TK5VWPn+PbIKFEyJgCY19Zw62fWBXoanPbWj
LDuO9AnaQOPyVEx2qtoH8M5LFra2zq+dZ9Ac7oAiLffcWJAB9MqL8o2zbQHpOuVi
Ynrh6BIyUYaqdt1BhALrJ6/MQ0h7mDKGy8CVg0z4e2VHyxecYwc84kwzrItH7I0=
=mdeb
-----END PGP SIGNATURE-----

-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1

 status fixreleased
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.11 (GNU/Linux)
Comment: Using GnuPG with Mozilla - http://enigmail.mozdev.org/

iQEcBAEBAgAGBQJPjrXHAAoJECXBtiziiXdcU94IALII/v8XTSOgD0jBkOXYzDms
uLkrvC+Z5YqYhQVjIR5cVYg7X3SJPUjuaorS2uVVfIkGlz+38KdZdczOYV+JaNQV
S8aVo/Rqrsx8h6fKtVAgTl8bd1CCMos1YnrOTNvqoYSOV2iGSSX/paQf6R9BjDbz
hx6GM7pkUp/gOa3Zqo+E6NfUrMWASanjbh9kbHdm09L7/10f7a5Q9w2Cf5o1yjC7
xqM9hEbPe32C9tBBcXDGPzQDFpJ6b6Rys2dzt6NTNkv2FCyzKS4RLwGDUDRNBEEZ
iYxQ5wJJaxW+/RO8k4lGYSo7Mtt99aIxhkQX7DKxcEoOSNMdPUi9ptwjolgG4iI=
=AeF+
-----END PGP SIGNATURE-----