Bug 42263 - Use hamburger menu for UMC + move various functions to there
Use hamburger menu for UMC + move various functions to there
Status: CLOSED FIXED
Product: UCS
Classification: Unclassified
Component: UMC (Generic)
UCS 4.2
Other Linux
: P5 normal (vote)
: UCS 4.2
Assigned To: Alexander Kläser
Johannes Keiser
: interim-2
: 42269 (view as bug list)
Depends on:
Blocks: 42173
  Show dependency treegraph
 
Reported: 2016-09-05 17:16 CEST by Alexander Kläser
Modified: 2017-04-04 18:28 CEST (History)
3 users (show)

See Also:
What kind of report is it?: Development Internal
What type of bug is this?: ---
Who will be affected by this bug?: ---
How will those affected feel about the bug?: ---
User Pain:
Enterprise Customer affected?:
School Customer affected?:
ISV affected?:
Waiting Support:
Ticket number:
Bug group (optional):
Max CVSS v3 score:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Alexander Kläser univentionstaff 2016-09-05 17:16:35 CEST
For UCS 4.2, we will use a hamburger menu (cf., the mobile version of UMC) and move some functionality into the menu (all menu dialogs, change password, switch to a different server etc.).

The screenshots can be found at:
https://mail.univention.de/appsuite/#!&app=io.ox/files&folder=1206&id=1206/1396
Comment 1 Alexander Kläser univentionstaff 2017-02-21 09:30:16 CET
I guess the stylings of the close button in the menu (on the right) are broken (it is not visible).
Comment 2 Alexander Kläser univentionstaff 2017-02-22 13:32:21 CET
I added the possibility to define JavaScript module hooks. These can be registered via the UCR variable umc/web/hooks/<packageName>=<javaScriptModule> (the module path is relative to /univention/js/umc/hooks/). There is a proxy interface for adding menu items via umc/menu. This allows to just add menu items at any point in time, regardless of whether the menu has yet been created or not. The Menu class itself has been moved to umc/widgets/Menu.

changelog-4.2-0.xml:
r76974 | Bug #42263: added changelog entry

univention-self-service (2.0.4-2):
r76973 | Bug #42263: add option to define JS hook modules+add umc/menu interface

univention-web (1.0.28-1):
r76973 | Bug #42263: add option to define JS hook modules+add umc/menu interface

univention-management-console (9.0.37-3):
r76973 | Bug #42263: add option to define JS hook modules+add umc/menu interface

univention-portal (1.0.6-4):
r76973 | Bug #42263: add option to define JS hook modules+add umc/menu interface

univention-saml (4.0.6-3):
r76973 | Bug #42263: add option to define JS hook modules+add umc/menu interface
Comment 3 Alexander Kläser univentionstaff 2017-02-23 03:53:57 CET
In order to debug, I needed to refactor umc/widgets/Menu. I moved some generic menu entries into univention-web-js and cleaned up the usage of the menu entries in other packages.

univention-management-console (9.0.39-5):
r77020 | Bug #42263: move generic menu entries to univention-web+remove old parts

univention-web (1.0.28-5):
r77023 | Bug #42263: add generic menu entries
r77019 | Bug #42263: refactor and cleanup umc/widgets/Menu

univention-self-service (2.0.4-9):
r77021 | Bug #42263: cleanup menu entries

univention-management-console-module-reboot (6.0.0-3):
r77022 | Bug #42263: cleanup menu entries

univention-management-console-module-udm (7.0.5-3):
r77024 | Bug #42263: clean up menu entries
Comment 4 Alexander Kläser univentionstaff 2017-02-23 13:06:30 CET
There had been some errors building the package. This has been fixed. Also the config.js is now more flexible such that it allows to define umcConfig/dojoConfig before including config.js. Custom values will then be mixed in. Also umcConfig allows now define dependencies which are passed over to the callback function (via property deps). Loading of module hooks and the menu can be switchted off.

univention-web (1.0.28-8):
r77040 | Bug #42263: fix Makefile + adjust config.js + add UCR variable for hooks
r77035 | Bug #42263: fix fuzzy entry + allow to turn off hooks/menu in config.js
r77032 | Bug #42263: fix fuzzy
r77031 | Bug #42263: fix build error
Comment 5 Alexander Kläser univentionstaff 2017-02-23 17:25:31 CET
I needed to add functionality to make the menu entries behave more dynamically. menu.addEntry() (and the others) now returns a deferred which resolved to a MenuEntry which can be manipulated (show/hide). SubMenuItems observe their items and will hide/show automatically depending on the number of visible items. In turn, this allows to topic.subscribe() to '/umc/authenticated' in order to be notified when a user has logged in.

univention-web (1.0.28-10):
r77071 | Bug #42263: make menu entries dependent on login state
Comment 6 Florian Best univentionstaff 2017-02-24 10:29:01 CET
My base commits were:
r76662 | Bug #42263: implement generic UMC config and use UMC menu everywhere
r76660 | Bug #42263: rename umcMenuUsername into umcMenuMain, umcMenuSettings into umcMenuUserSettings
r76657 | Bug #42263: add a generic umc/Menu

I added a new flavor license-import to UDM which is used to control the visibility of the License menu.

univention-management-console-module-udm (7.0.6-2):
r77092 | Bug #42263: show license menu only if permissions exists for it
r77090 | Bug #42263: show license menu only if permissions exists for it
Comment 7 Alexander Kläser univentionstaff 2017-02-27 12:11:06 CET
I adjusted the changelog entry.

changelog-4.2-0.xml:
r77121 | Bug #42263: adjusted changelog entry


AFAIS, this bug can be closed for now.
Comment 8 Alexander Kläser univentionstaff 2017-02-27 12:17:25 CET
*** Bug 42269 has been marked as a duplicate of this bug. ***
Comment 9 Alexander Kläser univentionstaff 2017-02-27 17:22:35 CET
(In reply to Alexander Kläser from comment #1)
> I guess the stylings of the close button in the menu (on the right) are
> broken (it is not visible).

There is a problem in the current structure. umc/widgets/Menu is a widget class for the button which opens the side menu. However, the button needs to be present twice, one time in the site header for opening the menu and one time in the Menu itself. The button widget actually just sets particular classes on the body to trigger the menu sliding in. Therefore, it does not need to create a menu instances itself. Instead we need two widget classes (umc/widgets/Menu + umc/widgets/MenuButton) which will be called a index.html separately.

→ REOPEN
Comment 10 Jürn Brodersen univentionstaff 2017-03-03 15:39:14 CET
The login state is not correctly reported on the portal. Clicking on login once changes the state without asking for a password (if logged in at the umc)
Comment 11 Alexander Kläser univentionstaff 2017-03-06 18:37:52 CET
univention-web (1.0.29-25):
r77385 | Bug #42263: include meta data by default + check login status in hook
Comment 12 Alexander Kläser univentionstaff 2017-03-06 18:39:16 CET
(In reply to Alexander Kläser from comment #11)
> univention-web (1.0.29-25):
> r77385 | Bug #42263: include meta data by default + check login status in
> hook

This fixes the two points mentioned at Bug 43595, comment 5:
> > * the menu contains only a '@' instead of the hostname
> > * the menu contains a login link which does nothing but immediately toggles
> >   the button to a logout link.
Comment 13 Florian Best univentionstaff 2017-03-07 14:47:02 CET
Current traceback when opening UMC:
dojo.js:6456 TypeError: loginEntry.hide is not a function(…) "TypeError: loginEntry.hide is not a function
    at setupMenus (https://xen3.school.local/univention/js/umc/hooks/default_menu_entries.js:126:15)
Comment 14 Alexander Kläser univentionstaff 2017-03-07 16:07:43 CET
(In reply to Alexander Kläser from comment #9)
> (In reply to Alexander Kläser from comment #1)
> > I guess the stylings of the close button in the menu (on the right) are
> > broken (it is not visible).
> 
> There is a problem in the current structure. umc/widgets/Menu is a widget
> class for the button which opens the side menu. However, the button needs to
> be present twice, one time in the site header for opening the menu and one
> time in the Menu itself. The button widget actually just sets particular
> classes on the body to trigger the menu sliding in. Therefore, it does not
> need to create a menu instances itself. Instead we need two widget classes
> (umc/widgets/Menu + umc/widgets/MenuButton) which will be called a
> index.html separately.
> 
> → REOPEN

All menu related widgets reside now bellow umc/menu. A close button has been added to the menu. Related packages need to include umc/menu/Button (instead of umc/widgets/Menu).

univention-web (1.0.31-3):
r77430 | Bug #42263: Correct menu structure + add close button to menu

univention-management-console (9.0.49-2):
r77431 | Bug #42263: Adjust menu structure

univention-portal (1.0.7-2):
r77432 | Bug #42263: Adjust menu structure

univention-self-service (2.0.6-2):
r77433 | Bug #42263: Adjust menu structure

univention-server-overview (0.0.1-6):
r77434 | Bug #42263: Adjust menu structure

univention-saml (4.0.7-2):
r77435 | Bug #42263: Adjust menu structure
Comment 15 Alexander Kläser univentionstaff 2017-03-07 16:09:32 CET
(In reply to Florian Best from comment #13)
> Current traceback when opening UMC:
> dojo.js:6456 TypeError: loginEntry.hide is not a function(…) "TypeError:
> loginEntry.hide is not a function
>     at setupMenus
> (https://xen3.school.local/univention/js/umc/hooks/default_menu_entries.js:
> 126:15)

Oops, thanks. Fixed!

univention-web (1.0.31-4):
r77436 | Bug #42263: Adjust typo in hooks/default_menu_entries.js
Comment 16 Johannes Keiser univentionstaff 2017-03-10 17:36:36 CET
The Menu works, but one thing i noticed is that you can add menu entries to a parent menu that does not yet exist.

menu.addEntry({ label: 'newEntry', onClick: function() {}, parentMenuId: 'notYetCreated' })
menu.addSubMenu({ id: 'notYetCreated' })

but that does not work with sub menus.

menu.addSubmenu({ label: 'newSubMenu', parentMenuId: 'notYetCreated' })
throws an error: "Cannot read property 'addMenuItem' of undefined"

Nesting of sub menus is only possible if the parent menu already exists

menu.addSubMenu({ label: 'outer', id: 'outer' })
menu.addSubMenu({ parentMenuId: 'outer', label: 'inner' })

It would be good if the mechanism that lets you add menu entries to non-existing parent menu would also work for sub menus.
Comment 17 Alexander Kläser univentionstaff 2017-03-13 11:57:50 CET
(In reply to Johannes Keiser from comment #16)
> The Menu works, but one thing i noticed is that you can add menu entries to
> a parent menu that does not yet exist.
> 
> menu.addEntry({ label: 'newEntry', onClick: function() {}, parentMenuId:
> 'notYetCreated' })
> menu.addSubMenu({ id: 'notYetCreated' })
> 
> but that does not work with sub menus.
> 
> menu.addSubmenu({ label: 'newSubMenu', parentMenuId: 'notYetCreated' })
> throws an error: "Cannot read property 'addMenuItem' of undefined"
> 
> Nesting of sub menus is only possible if the parent menu already exists
> 
> menu.addSubMenu({ label: 'outer', id: 'outer' })
> menu.addSubMenu({ parentMenuId: 'outer', label: 'inner' })
> 
> It would be good if the mechanism that lets you add menu entries to
> non-existing parent menu would also work for sub menus.

True. Fixed:

---------- 8< ----------
var menu1 = menu.addSubMenu({
  label: 'Menu1',
  id: 'menu1'
});
var menu2 = menu.addSubMenu({
  label: 'Menu2',
  id: 'menu2',
  parentMenuId: 'menu1'
});
var entry1 = menu.addEntry({
  label: 'Entry1',
  parentMenuId: 'menu2'
});
menu.hideEntry(entry1);
menu.showEntry(entry1);
---------- 8< ----------

univention-web (1.0.36-6):
r77630 | Bug #42263: Allow submenus to be added if parent menu does not exist
Comment 18 Alexander Kläser univentionstaff 2017-03-14 18:57:08 CET
We added a fix for the test case (1) which used to throw an exception when opening the sub menu:

---------- 8< ----------
var menu = require('umc/menu');

# test case (1)
menu.addSubMenu({
    label: 'inner',
    parentMenuId: 'outer',
    id: 'inner'
})
menu.addSubMenu({
    label: 'outer',
    id: 'outer'
})
menu.addEntry({
    label: 'entry',
    parentMenuId: 'inner',
    onClick: function(){}
}) 

# test case (2)
menu.addSubMenu({
    label: 'inner',
    parentMenuId: 'outer',
    id: 'inner'
})
menu.addEntry({
    label: 'entry',
    parentMenuId: 'inner',
    onClick: function(){}
})
menu.addSubMenu({
    label: 'outer',
    id: 'outer'
})

# test case (3)
menu.addEntry({
    label: 'entry',
    parentMenuId: 'inner',
    onClick: function(){}
})
menu.addSubMenu({
    label: 'inner',
    parentMenuId: 'outer',
    id: 'inner'
})
menu.addSubMenu({
    label: 'outer',
    id: 'outer'
})

# test case (4)
menu.addEntry({
    label: 'entry',
    parentMenuId: 'inner',
    onClick: function(){}
})
menu.addSubMenu({
    label: 'outer',
    id: 'outer'
})
menu.addSubMenu({
    label: 'inner',
    parentMenuId: 'outer',
    id: 'inner'
})

---------- 8< ----------

univention-web (1.0.36-13):
r77707 | Bug #42263: Fix missing reference to parent menu slide for sub menus

As discussed, this bug can now be set to VERIFIED.
Comment 19 Stefan Gohmann univentionstaff 2017-04-04 18:28:58 CEST
UCS 4.2 has been released:
 https://docs.software-univention.de/release-notes-4.2-0-en.html
 https://docs.software-univention.de/release-notes-4.2-0-de.html

If this error occurs again, please use "Clone This Bug".