| @@ -93,14 +93,55 ContextMenu.prototype = { | |||||
| 93 | }, |
|
93 | }, | |
| 94 |
|
94 | |||
| 95 | showMenu: function(e) { |
|
95 | showMenu: function(e) { | |
| 96 | $('context-menu').style['left'] = (Event.pointerX(e) + 'px'); |
|
96 | var mouse_x = Event.pointerX(e); | |
| 97 | $('context-menu').style['top'] = (Event.pointerY(e) + 'px'); |
|
97 | var mouse_y = Event.pointerY(e); | |
| 98 | Element.update('context-menu', ''); |
|
98 | var render_x = mouse_x; | |
| 99 | new Ajax.Updater({success:'context-menu'}, this.url, |
|
99 | var render_y = mouse_y; | |
|
|
100 | var dims; | |||
|
|
101 | var menu_width; | |||
|
|
102 | var menu_height; | |||
|
|
103 | var window_width; | |||
|
|
104 | var window_height; | |||
|
|
105 | var max_width; | |||
|
|
106 | var max_height; | |||
|
|
107 | ||||
|
|
108 | $('context-menu').style['left'] = (render_x + 'px'); | |||
|
|
109 | $('context-menu').style['top'] = (render_y + 'px'); | |||
|
|
110 | Element.update('context-menu', ''); | |||
|
|
111 | ||||
|
|
112 | new Ajax.Updater({success:'context-menu'}, this.url, | |||
| 100 | {asynchronous:true, |
|
113 | {asynchronous:true, | |
| 101 | evalScripts:true, |
|
114 | evalScripts:true, | |
| 102 | parameters:Form.serialize(Event.findElement(e, 'form')), |
|
115 | parameters:Form.serialize(Event.findElement(e, 'form')), | |
| 103 | onComplete:function(request){ |
|
116 | onComplete:function(request){ | |
|
|
117 | dims = $('context-menu').getDimensions(); | |||
|
|
118 | menu_width = dims.width; | |||
|
|
119 | menu_height = dims.height; | |||
|
|
120 | max_width = mouse_x + 2*menu_width; | |||
|
|
121 | max_height = mouse_y + menu_height; | |||
|
|
122 | ||||
|
|
123 | var ws = window_size(); | |||
|
|
124 | window_width = ws.width; | |||
|
|
125 | window_height = ws.height; | |||
|
|
126 | ||||
|
|
127 | /* display the menu above and/or to the left of the click if needed */ | |||
|
|
128 | if (max_width > window_width) { | |||
|
|
129 | render_x -= menu_width; | |||
|
|
130 | $('context-menu').addClassName('reverse-x'); | |||
|
|
131 | } else { | |||
|
|
132 | $('context-menu').removeClassName('reverse-x'); | |||
|
|
133 | } | |||
|
|
134 | if (max_height > window_height) { | |||
|
|
135 | render_y -= menu_height; | |||
|
|
136 | $('context-menu').addClassName('reverse-y'); | |||
|
|
137 | } else { | |||
|
|
138 | $('context-menu').removeClassName('reverse-y'); | |||
|
|
139 | } | |||
|
|
140 | if (render_x <= 0) render_x = 1; | |||
|
|
141 | if (render_y <= 0) render_y = 1; | |||
|
|
142 | $('context-menu').style['left'] = (render_x + 'px'); | |||
|
|
143 | $('context-menu').style['top'] = (render_y + 'px'); | |||
|
|
144 | ||||
| 104 | Effect.Appear('context-menu', {duration: 0.20}); |
|
145 | Effect.Appear('context-menu', {duration: 0.20}); | |
| 105 | if (window.parseStylesheets) { window.parseStylesheets(); } // IE |
|
146 | if (window.parseStylesheets) { window.parseStylesheets(); } // IE | |
| 106 | }}) |
|
147 | }}) | |
| @@ -159,3 +200,19 function toggleIssuesSelection(el) { | |||||
| 159 | } |
|
200 | } | |
| 160 | } |
|
201 | } | |
| 161 | } |
|
202 | } | |
|
|
203 | ||||
|
|
204 | function window_size() { | |||
|
|
205 | var w; | |||
|
|
206 | var h; | |||
|
|
207 | if (window.innerWidth) { | |||
|
|
208 | w = window.innerWidth; | |||
|
|
209 | h = window.innerHeight; | |||
|
|
210 | } else if (document.documentElement) { | |||
|
|
211 | w = document.documentElement.clientWidth; | |||
|
|
212 | h = document.documentElement.clientHeight; | |||
|
|
213 | } else { | |||
|
|
214 | w = document.body.clientWidth; | |||
|
|
215 | h = document.body.clientHeight; | |||
|
|
216 | } | |||
|
|
217 | return {width: w, height: h}; | |||
|
|
218 | } | |||
| @@ -22,13 +22,13 | |||||
| 22 | padding:1px; |
|
22 | padding:1px; | |
| 23 | z-index:9; |
|
23 | z-index:9; | |
| 24 | } |
|
24 | } | |
| 25 | #context-menu li.folder ul { |
|
25 | #context-menu li.folder ul { position:absolute; left:168px; /* IE6 */ top:-2px; } | |
| 26 | position:absolute; |
|
|||
| 27 | left:168px; /* IE6 */ |
|
|||
| 28 | top:-2px; |
|
|||
| 29 | } |
|
|||
| 30 | #context-menu li.folder>ul { left:148px; } |
|
26 | #context-menu li.folder>ul { left:148px; } | |
| 31 |
|
27 | |||
|
|
28 | #context-menu.reverse-y li.folder>ul { top:auto; bottom:0; } | |||
|
|
29 | #context-menu.reverse-x li.folder ul { left:auto; right:168px; /* IE6 */ } | |||
|
|
30 | #context-menu.reverse-x li.folder>ul { right:148px; } | |||
|
|
31 | ||||
| 32 | #context-menu a { |
|
32 | #context-menu a { | |
| 33 | border:1px solid white; |
|
33 | border:1px solid white; | |
| 34 | text-decoration:none; |
|
34 | text-decoration:none; | |
General Comments 0
You need to be logged in to leave comments.
Login now