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
|
// Dropdown menu control
function Dropdown(activatorId, dropdownId, containerId) {
// store activator and dropdown elements
this.activator = document.getElementById(activatorId);
this.dropdown = document.getElementById(dropdownId);
this.container = document.getElementById(containerId);
this.activatorImage = document.getElementById(activatorId + "Image");
// wire up show/hide events
registerEventHandler(this.activator,'mouseover', getInstanceDelegate(this, "show"));
registerEventHandler(this.activator,'mouseout', getInstanceDelegate(this, "requestHide"));
registerEventHandler(this.dropdown,'mouseover', getInstanceDelegate(this, "show"));
registerEventHandler(this.dropdown,'mouseout', getInstanceDelegate(this, "requestHide"));
// fix visibility and position
this.dropdown.style.visibility = 'hidden';
this.dropdown.style.position = 'absolute';
this.reposition(null);
// wire up repositioning event
registerEventHandler(window, 'resize', getInstanceDelegate(this, "reposition"));
}
Dropdown.prototype.show = function(e) {
clearTimeout(this.timer);
this.dropdown.style.visibility = 'visible';
if (this.activatorImage != null)
this.activatorImage.src = dropDownHoverImage.src;
if (this.activator != null)
this.activator.className = "filterOnHover";
}
Dropdown.prototype.hide = function(e) {
this.dropdown.style.visibility = 'hidden';
if (this.activatorImage != null)
this.activatorImage.src = dropDownImage.src;
if (this.activator != null)
this.activator.className = "filter";
}
Dropdown.prototype.requestHide = function(e) {
this.timer = setTimeout( getInstanceDelegate(this, "hide"), 250);
}
Dropdown.prototype.reposition = function(e) {
// get position of activator
var offsetLeft = 0;
var offsetTop = 0;
var offsetElement = this.activator;
while (offsetElement && offsetElement != this.container) {
offsetLeft += offsetElement.offsetLeft;
offsetTop += offsetElement.offsetTop;
offsetElement = offsetElement.offsetParent;
}
// set position of dropdown relative to it
this.dropdown.style.left = offsetLeft;
this.dropdown.style.top = offsetTop + this.activator.offsetHeight;
}
Dropdown.prototype.SetActivatorLabel = function(labelId)
{
// get the children of the activator node, which includes the label nodes
var labelNodes = this.activator.childNodes;
for(var labelCount=0; labelCount < labelNodes.length; labelCount++)
{
if(labelNodes[labelCount].tagName == 'LABEL')
{
var labelNodeId = labelNodes[labelCount].getAttribute('id');
if (labelNodeId == labelId)
{
labelNodes[labelCount].style.display = "inline";
}
else
{
labelNodes[labelCount].style.display = "none";
}
}
}
}
|
