SimpleDropdownButtons_wev8.js
4.93 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
/*
Copyright (c) 2004-2005, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
/* TODO:
* - make the dropdowns "smart" so they can't get cutoff on bottom of page, sides of page, etc.
* - unify menus with the MenuItem and Menu classes so we can add stuff to all menus at once
* - allow buttons to be enabled/disabled at runtime
* - this probably means creating all menus upfront and then triggering a disable action
* for disabled buttons in the constructor loop. we'll need a disable and enable action anyway
* - should each button with menu be a widget object of it's own?
*/
dojo.provide("dojo.widget.SimpleDropdownButtons");
dojo.provide("dojo.widget.HtmlSimpleDropdownButtons");
dojo.require("dojo.event.*");
dojo.require("dojo.widget.*");
dojo.require("dojo.uri.Uri");
dojo.require("dojo.dom");
dojo.require("dojo.style");
dojo.require("dojo.html");
dojo.widget.tags.addParseTreeHandler("dojo:simpledropdownbuttons");
dojo.widget.HtmlSimpleDropdownButtons = function() {
dojo.widget.HtmlWidget.call(this);
this.widgetType = "SimpleDropdownButtons";
this.templateCssPath = dojo.uri.dojoUri("src/widget/templates/HtmlSimpleDropdownButtons_wev8.css");
this.menuTriggerClass = "dojoSimpleDropdownButtons";
this.menuClass = "dojoSimpleDropdownButtonsMenu";
// overwrite buildRendering so we don't clobber our list
this.buildRendering = function(args, frag) {
if(this.templateCssPath) {
dojo.style.insertCssFile(this.templateCssPath, null, true);
}
this.domNode = frag["dojo:"+this.widgetType.toLowerCase()]["nodeRef"];
var menu = this.domNode;
if( !dojo.html.hasClass(menu, this.menuTriggerClass) ) {
dojo.html.addClass(menu, this.menuTriggerClass);
}
var li = dojo.dom.getFirstChildElement(menu);
var menuIDs = [];
var arrowIDs = [];
while(li) {
if(li.getElementsByTagName("ul").length > 0) {
var a = dojo.dom.getFirstChildElement(li);
var arrow = document.createElement("a");
arrow.href = "javascript:;";
arrow.innerHTML = " ";
dojo.html.setClass(arrow, "downArrow");
if(!arrow.id) {
arrow.id = dojo.dom.getUniqueId();
}
arrowIDs.push(arrow.id);
var submenu = dojo.dom.getNextSiblingElement(a);
if(!submenu.id) {
submenu.id = dojo.dom.getUniqueId();
}
menuIDs.push(submenu.id);
if( dojo.html.hasClass(a, "disabled") ) {
dojo.html.addClass(arrow, "disabled");
dojo.html.disableSelection(li);
arrow.onfocus = function(){ this.blur(); }
} else {
dojo.html.addClass(submenu, this.menuClass);
dojo.html.body().appendChild(submenu);
dojo.event.connect(arrow, "onmousedown", (function() {
var ar = arrow;
return function(e) {
dojo.html.addClass(ar, "pressed");
}
})());
dojo.event.connect(arrow, "onclick", (function() {
var aa = a;
var ar = arrow;
var sm = submenu;
var setWidth = false;
return function(e) {
hideAll(sm, ar);
sm.style.left = (dojo.html.getScrollLeft()
+ e.clientX - e.layerX + aa.offsetLeft) + "px";
sm.style.top = (dojo.html.getScrollTop() + e.clientY
- e.layerY + aa.offsetTop + aa.offsetHeight) + "px";
sm.style.display = sm.style.display == "block" ? "none" : "block";
if(sm.style.display == "none") {
dojo.html.removeClass(ar, "pressed");
e.target.blur()
}
if(!setWidth && sm.style.display == "block"
&& sm.offsetWidth < aa.offsetWidth + ar.offsetWidth) {
sm.style.width = aa.offsetWidth + ar.offsetWidth + "px";
setWidth = true;
}
e.preventDefault();
}
})());
}
dojo.event.connect(a, "onclick", function(e) {
if(e && e.target && e.target.blur) {
e.target.blur();
}
});
if(a.nextSibling) {
li.insertBefore(arrow, a.nextSibling);
} else {
li.appendChild(arrow);
}
}
li = dojo.dom.getNextSiblingElement(li);
}
function hideAll(excludeMenu, excludeArrow) {
// hide menus
for(var i = 0; i < menuIDs.length; i++) {
var m = document.getElementById(menuIDs[i]);
if(!excludeMenu || m != excludeMenu) {
document.getElementById(menuIDs[i]).style.display = "none";
}
}
// restore arrows to non-pressed state
for(var i = 0; i < arrowIDs.length; i++) {
var m = document.getElementById(arrowIDs[i]);
if(!excludeArrow || m != excludeArrow) {
dojo.html.removeClass(m, "pressed");
}
}
}
dojo.event.connect(document.documentElement, "onmousedown", function(e) {
if( dojo.html.hasClass(e.target, "downArrow") ) { return };
for(var i = 0; i < menuIDs.length; i++) {
if( dojo.dom.isDescendantOf(e.target, document.getElementById(menuIDs[i])) ) {
return;
}
}
hideAll();
});
}
}
dojo.inherits(dojo.widget.HtmlSimpleDropdownButtons, dojo.widget.HtmlWidget);