adding all weblabels from weblabels.fsf.org
[weblabels.fsf.org.git] / crm-dev.fsf.org / 20131203 / files / static.fsf.org / plone2012 / dropdown.js
CommitLineData
5a920362 1
2/* - dropdown.js - */
3/*
4 * This is the code for the dropdown menus. It uses the following markup:
5 *
6 * <dl class="actionMenu" id="uniqueIdForThisMenu">
7 * <dt class="actionMenuHeader">
8 * <!-- The following a-tag needs to be clicked to dropdown the menu -->
9 * <a href="some_destination">A Title</a>
10 * </dt>
11 * <dd class="actionMenuContent">
12 * <!-- Here can be any content you want -->
13 * </dd>
14 * </dl>
15 *
16 * When the menu is toggled, then the dl with the class actionMenu will get an
17 * additional class which switches between 'activated' and 'deactivated'.
18 * You can use this to style it accordingly, for example:
19 *
20 * .actionMenu.activated {
21 * display: block;
22 * }
23 *
24 * .actionMenu.deactivated {
25 * display: none;
26 * }
27 *
28 * When you click somewhere else than the menu, then all open menus will be
29 * deactivated. When you move your mouse over the a-tag of another menu, then
30 * that one will be activated and all others deactivated. When you click on a
31 * link inside the actionMenuContent element, then the menu will be closed and
32 * the link followed.
33 *
34 */
35
36/*
37 * Provides globals:
38 * actionMenuDocumentMouseDown, actionMenuMouseOver, document, hideAllMenus,
39 * initializeMenus, jQuery, toggleMenuHandler
40*/
41
42function hideAllMenus() {
43 jQuery('dl.actionMenu').removeClass('activated').addClass('deactivated');
44}
45
46function toggleMenuHandler(event) {
47 // swap between activated and deactivated
48 jQuery(this).parents('.actionMenu:first')
49 .toggleClass('deactivated')
50 .toggleClass('activated');
51 return false;
52}
53
54function actionMenuDocumentMouseDown(event) {
55 if (jQuery(event.target).parents('.actionMenu:first').length) {
56 // target is part of the menu, so just return and do the default
57 return true;
58 }
59
60 hideAllMenus();
61}
62
63function actionMenuMouseOver(event) {
64 var menu_id = jQuery(this).parents('.actionMenu:first').attr('id'),
65 switch_menu;
66 if (!menu_id) {return true;}
67
68 switch_menu = jQuery('dl.actionMenu.activated').length > 0;
69 jQuery('dl.actionMenu').removeClass('activated').addClass('deactivated');
70 if (switch_menu) {
71 jQuery('#' + menu_id).removeClass('deactivated').addClass('activated');
72 }
73}
74
75function initializeMenus() {
76 jQuery(document).mousedown(actionMenuDocumentMouseDown);
77
78 hideAllMenus();
79
80 // add toggle function to header links
81 jQuery('dl.actionMenu dt.actionMenuHeader a')
82 .click(toggleMenuHandler)
83 .mouseover(actionMenuMouseOver);
84
85 // add hide function to all links in the dropdown, so the dropdown closes
86 // when any link is clicked
87 jQuery('dl.actionMenu > dd.actionMenuContent').click(hideAllMenus);
88}
89
90jQuery(initializeMenus);
91