blob: 96b57fb953d9a3e2922d549d5250d3389780a180 (
plain)
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
|
<?php
/**
* Elgg profile image Javascript
*
* @package ElggProfile
*
* @uses $vars['entity'] The user entity
*/
// header("Content-type: text/javascript");
// header("Pragma: public");
// header("Cache-Control: public");
?>
var submenuLayer = 1000;
function setup_avatar_menu(parent) {
if (!parent) {
parent = document;
}
// avatar image menu link
$(parent).find("div.usericon img").mouseover(function() {
// find nested avatar_menu_button and show
$(this.parentNode.parentNode).children(".avatar_menu_button").show();
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow");
//$(this.parentNode.parentNode).css("z-index", submenuLayer);
})
.mouseout(function() {
if($(this).parent().parent().find("div.sub_menu").css('display')!="block") {
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_on");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(this.parentNode.parentNode).children(".avatar_menu_button").hide();
}
else {
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_on");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(this.parentNode.parentNode).children(".avatar_menu_button").show();
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow");
}
});
// avatar contextual menu
$(".avatar_menu_button img").click(function(e) {
var submenu = $(this).parent().parent().find("div.sub_menu");
// close submenu if arrow is clicked & menu already open
if(submenu.css('display') == "block") {
//submenu.hide();
}
else {
// get avatar dimensions
var avatar = $(this).parent().parent().parent().find("div.usericon");
//alert( "avatarWidth: " + avatar.width() + ", avatarHeight: " + avatar.height() );
// move submenu position so it aligns with arrow graphic
if (e.pageX < 840) { // popup menu to left of arrow if we're at edge of page
submenu.css("top",(avatar.height()) + "px")
.css("left",(avatar.width()-15) + "px")
.fadeIn('normal');
}
else {
submenu.css("top",(avatar.height()) + "px")
.css("left",(avatar.width()-166) + "px")
.fadeIn('normal');
}
// force z-index - workaround for IE z-index bug
avatar.css("z-index", submenuLayer);
avatar.find("a.icon img").css("z-index", submenuLayer);
submenu.css("z-index", submenuLayer+1);
submenuLayer++;
// change arrow to 'on' state
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow_on");
}
// hide any other open submenus and reset arrows
$("div.sub_menu:visible").not(submenu).hide();
$(".avatar_menu_button").removeClass("avatar_menu_arrow");
$(".avatar_menu_button").removeClass("avatar_menu_arrow_on");
$(".avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(".avatar_menu_button").hide();
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow_on");
$(this.parentNode.parentNode).children("div.avatar_menu_button").show();
//alert("submenuLayer = " +submenu.css("z-index"));
})
// hover arrow each time mouseover enters arrow graphic (eg. when menu is already shown)
.mouseover(function() {
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_on");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow_hover");
})
// if menu not shown revert arrow, else show 'menu open' arrow
.mouseout(function() {
if($(this).parent().parent().find("div.sub_menu").css('display')!="block"){
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow");
}
else {
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(this.parentNode.parentNode).children("div.avatar_menu_button").removeClass("avatar_menu_arrow");
$(this.parentNode.parentNode).children("div.avatar_menu_button").addClass("avatar_menu_arrow_on");
}
});
// hide avatar menu if click occurs outside of menu
// and hide arrow button
$(document).click(function(event) {
var target = $(event.target);
if (target.parents(".usericon").length == 0) {
$(".usericon div.sub_menu").fadeOut();
$(".avatar_menu_button").removeClass("avatar_menu_arrow");
$(".avatar_menu_button").removeClass("avatar_menu_arrow_on");
$(".avatar_menu_button").removeClass("avatar_menu_arrow_hover");
$(".avatar_menu_button").hide();
}
});
}
$(document).ready(function() {
setup_avatar_menu();
});
|
