Context menu

[Guite]

The core doesn't have a good replacement for Zikula.UI.ContextMenu yet.

One can use bootstrap dropdown menus for it, but it becomes a bit ugly (much manual code): http://stackoverflow.com/questions/18666601/use-bootstrap-3-dropdown-menu-as-context-menu

Another possibility is https://github.com/zikula/core/tree/1.4/src/javascript/plugins/jQuery-contextMenu which isn't prepared for bootstrap yet though.

[craigh]

refs #1123 (closed)

[phaidon]

What do you think about something like that:
http://sydcanem.github.io/bootstrap-contextmenu/

[Guite]

Simple but terrific :-)

[phaidon]

the style we can change in the stylesheet.

the question for me is more if we want to support something with right mouse click. this is unusable with touch devices.

[Guite]

For activating the context menu itself we are using left clicks.

The generator extends Zikula.UI.ContextMenu so that you can left-click or right-click the menu entries though. While a left click just redirects to the corresponding page (window.location = '...'), a right click opens this page in a new window (window.open).

[jusuff]

@Guite Check this one: http://medialize.github.io/jQuery-contextMenu/
There is in 1.4 branch unfinished plugin for zikula with some improvements to this plugin:
https://github.com/zikula/core/blob/1.4/src/javascript/zikula-plugins/zikula.plugins.contextmenu.js

Need to review this because there's no docs in code and I don't remember what was added to original plugin. But back then context menu from medialize was the best jQuery based context menu I found.

[Guite]

@jusuff I have two questions about http://medialize.github.io/jQuery-contextMenu/

1. would it be possible to incorporate it with bootstrap with regards to styling?
   For example icons are handled like this:

                    if (item.icon) {
                        $t.addClass("icon icon-" + item.icon);
                    }

while we would need fa fa-icon.

1. If I understood correctly the plugin at https://github.com/zikula/core/blob/1.4/src/javascript/zikula-plugins/zikula.plugins.contextmenu.js controls the script located at https://github.com/zikula/core/tree/1.4/src/javascript/plugins/jQuery-contextMenu - is this correct? Do you remember what is unfinished there?

[phaidon]

@Guite there is a context menu (dropdown) already in bootstrap.
http://getbootstrap.com/javascript/#dropdowns

• Multilevel is possible, too
• The style can be changed (it is just so big and ugly for touch - but we can make it more responsive).

[Guite]

@phaidon I would love to reuse Bootstrap dropdown menus for that instead of introducing another component. As I wrote in the initial issue text it seems not that easy though to make a context menu with it (open on left and/or right click, positioning at the mouse cursor, etc.). Please see http://stackoverflow.com/questions/18666601/use-bootstrap-3-dropdown-menu-as-context-menu with regards to this. Any idea how to handle this? Maybe a thin wrapper layer encapsulating Bootstrap dropdown would be reasonable?

[phaidon]

open on left and/or right click

the pure bootstrap dropdown supports left click on a given element. Right click is imho broken by design, but if you really need I can add it.

positioning at the mouse cursor

the pure bootstrap dropdown is placed under the calling element. Is that not good?

etc

What else do you need?

[Guite]

You are right... let me rethink this after I implemented the new tree ;-)

[Guite]

Closed since the pure bootstrap dropdown is sufficient. If usability problems occur we can still approach them in a later version of course.

[Guite]

For reference: https://github.com/sydcanem/bootstrap-contextmenu

[Guite]

For reference: https://github.com/jakiestfu/Context.js