[whatwg] Thoughts on Context and Popup Menus for Web Applications 1.0

[Matthew Raymond]

    I have a few suggestions for menus outside the context of a menu 
bar. The first is a suggestion for context menus (menus that, in 
Windows, show up when you right-click on something). The second is for 
popup menus (menus that appear when you click on or activate a control, 
et cetera).

CONTEXT MENUS:

    I love examples, in case you haven't guessed already. I'm a very 
visual person:

| <context>
|  <menu id="clipboard">
|   <command label="Cut" onclick="cbcut()"/>
|   <command label="Copy" onclick="cbcopy()"/>
|   <command label="Paste" onclick="cbpaste()"/>
|   <command label="Clear" onclick="cbclear()"/>
|  </menu>
| </context>

    This is pretty simple to follow. As you may know, <menu> is a type 
of list outside the context of a modifying parent element like 
<menubar>. The <context> element converts the menu declaration into a 
template for context menus. Once you declare your context menu inside 
<context>, you can simply use an attribute of the same name to create an 
instance of it:

| <input type="text" name="text1" context="clipboard">

    Note that the <menulabel> is not included in the first example. In 
theory, one could be included in case the UA wants to do something with 
it, but I don't think this should be a requirement for webmasters.

POPUP MENUS:

    For popup menus, we can use a similar approach to the one we used 
for context menus:

| <popup>
|  <menu id="zoomfactor">
|   <command label="25%" onclick="zoom(0.25)"/>
|   <command label="50%" onclick="zoom(0.50)"/>
|   <command label="100%" onclick="zoom(0.100)"/>
|   <command label="Custom" onclick="zoomcustom()"/>
|  </menu>
| </popup>

    Once again, we use an attribute of the same name:

| <button type="button" popup="zoomfactor">Zoom</button>

DIFFERENCES FROM XUL:

    In XUL, you can use a single element to create a generic menu that 
can be used for all menu types. Here's an example of an XUL menu used as 
both a popup menu and a context menu:

| <popupset>
|   <popup id="clipmenu">
|     <menuitem label="Cut"/>
|     <menuitem label="Copy"/>
|     <menuitem label="Paste"/>
|   </popup>
| </popupset>
|
| <box context="clipmenu">
|   <description value="Context click for menu"/>
| </box>
|
| <button label="Pop Me Up" popup="clipmenu"/>

    (Note that tooltips are not included in the above example, since 
HTML already supports them through the |title| attribute.)

    Personally, I don't see any utility in the ability to declare 
different types of menus generically as above. Although using a single 
element to do both would introduce less markup, it would make it more 
difficult to determine how the menus are being used, since you'd have to 
hunt down the element that actually calls a menu to determine a menu's use.

REMOVING SECTION 2.3.3 FROM THE SPECIFICATION:

    I believe we should remove section 2.3.3 ("Menu links") from the Web 
Applications 1.0 specification. Having a hyperlink call up a menu via an 
|id| attribute makes about as much sense and having a hyperlink open a 
drop-down list. What happens when you try to open the hyperlink in 
another window or tab? What happens if a hyperlink points to the anchor 
for a menu in another HTML file?

    The deal breaker for me, though, is that you can't tell what the 
hyperlink does just by looking at it. For instance, what does the 
following do?...

| <a href="#guess">Does this point to a menu?</a>

    Now, figure out what this does:

| <button popup="obvious">This displays a popup menu.</button>

    That's all for now. Let me know what you think.