Chris@0
|
1 /* redMine - project management software
|
Chris@0
|
2 Copyright (C) 2006-2008 Jean-Philippe Lang */
|
Chris@0
|
3
|
Chris@0
|
4 var observingContextMenuClick;
|
Chris@0
|
5
|
Chris@0
|
6 ContextMenu = Class.create();
|
Chris@0
|
7 ContextMenu.prototype = {
|
Chris@0
|
8 initialize: function (url) {
|
Chris@0
|
9 this.url = url;
|
Chris@0
|
10 this.createMenu();
|
Chris@0
|
11
|
Chris@0
|
12 if (!observingContextMenuClick) {
|
Chris@0
|
13 Event.observe(document, 'click', this.Click.bindAsEventListener(this));
|
Chris@0
|
14 Event.observe(document, (window.opera ? 'click' : 'contextmenu'), this.RightClick.bindAsEventListener(this));
|
Chris@0
|
15 observingContextMenuClick = true;
|
Chris@0
|
16 }
|
Chris@0
|
17
|
Chris@0
|
18 this.unselectAll();
|
Chris@0
|
19 this.lastSelected = null;
|
Chris@0
|
20 },
|
Chris@0
|
21
|
Chris@0
|
22 RightClick: function(e) {
|
Chris@0
|
23 this.hideMenu();
|
Chris@0
|
24 // do not show the context menu on links
|
Chris@0
|
25 if (Event.element(e).tagName == 'A') { return; }
|
Chris@0
|
26 // right-click simulated by Alt+Click with Opera
|
Chris@0
|
27 if (window.opera && !e.altKey) { return; }
|
Chris@0
|
28 var tr = Event.findElement(e, 'tr');
|
Chris@0
|
29 if (tr == document || tr == undefined || !tr.hasClassName('hascontextmenu')) { return; }
|
Chris@0
|
30 Event.stop(e);
|
Chris@0
|
31 if (!this.isSelected(tr)) {
|
Chris@0
|
32 this.unselectAll();
|
Chris@0
|
33 this.addSelection(tr);
|
Chris@0
|
34 this.lastSelected = tr;
|
Chris@0
|
35 }
|
Chris@0
|
36 this.showMenu(e);
|
Chris@0
|
37 },
|
Chris@0
|
38
|
Chris@0
|
39 Click: function(e) {
|
Chris@0
|
40 this.hideMenu();
|
Chris@0
|
41 if (Event.element(e).tagName == 'A') { return; }
|
Chris@0
|
42 if (window.opera && e.altKey) { return; }
|
Chris@0
|
43 if (Event.isLeftClick(e) || (navigator.appVersion.match(/\bMSIE\b/))) {
|
Chris@0
|
44 var tr = Event.findElement(e, 'tr');
|
Chris@0
|
45 if (tr!=null && tr!=document && tr.hasClassName('hascontextmenu')) {
|
Chris@0
|
46 // a row was clicked, check if the click was on checkbox
|
Chris@0
|
47 var box = Event.findElement(e, 'input');
|
Chris@0
|
48 if (box!=document && box!=undefined) {
|
Chris@0
|
49 // a checkbox may be clicked
|
Chris@0
|
50 if (box.checked) {
|
Chris@0
|
51 tr.addClassName('context-menu-selection');
|
Chris@0
|
52 } else {
|
Chris@0
|
53 tr.removeClassName('context-menu-selection');
|
Chris@0
|
54 }
|
Chris@0
|
55 } else {
|
Chris@0
|
56 if (e.ctrlKey) {
|
Chris@0
|
57 this.toggleSelection(tr);
|
Chris@0
|
58 } else if (e.shiftKey) {
|
Chris@0
|
59 if (this.lastSelected != null) {
|
Chris@0
|
60 var toggling = false;
|
Chris@0
|
61 var rows = $$('.hascontextmenu');
|
Chris@0
|
62 for (i=0; i<rows.length; i++) {
|
Chris@0
|
63 if (toggling || rows[i]==tr) {
|
Chris@0
|
64 this.addSelection(rows[i]);
|
Chris@0
|
65 }
|
Chris@0
|
66 if (rows[i]==tr || rows[i]==this.lastSelected) {
|
Chris@0
|
67 toggling = !toggling;
|
Chris@0
|
68 }
|
Chris@0
|
69 }
|
Chris@0
|
70 } else {
|
Chris@0
|
71 this.addSelection(tr);
|
Chris@0
|
72 }
|
Chris@0
|
73 } else {
|
Chris@0
|
74 this.unselectAll();
|
Chris@0
|
75 this.addSelection(tr);
|
Chris@0
|
76 }
|
Chris@0
|
77 this.lastSelected = tr;
|
Chris@0
|
78 }
|
Chris@0
|
79 } else {
|
Chris@0
|
80 // click is outside the rows
|
Chris@0
|
81 var t = Event.findElement(e, 'a');
|
Chris@0
|
82 if (t == document || t == undefined) {
|
Chris@0
|
83 this.unselectAll();
|
Chris@0
|
84 } else {
|
Chris@0
|
85 if (Element.hasClassName(t, 'disabled') || Element.hasClassName(t, 'submenu')) {
|
Chris@0
|
86 Event.stop(e);
|
Chris@0
|
87 }
|
Chris@0
|
88 }
|
Chris@0
|
89 }
|
Chris@0
|
90 }
|
Chris@0
|
91 else{
|
Chris@0
|
92 this.RightClick(e);
|
Chris@0
|
93 }
|
Chris@0
|
94 },
|
Chris@0
|
95
|
Chris@0
|
96 createMenu: function() {
|
Chris@0
|
97 if (!$('context-menu')) {
|
Chris@0
|
98 var menu = document.createElement("div");
|
Chris@0
|
99 menu.setAttribute("id", "context-menu");
|
Chris@0
|
100 menu.setAttribute("style", "display:none;");
|
Chris@0
|
101 document.getElementById("content").appendChild(menu);
|
Chris@0
|
102 }
|
Chris@0
|
103 },
|
Chris@0
|
104
|
Chris@0
|
105 showMenu: function(e) {
|
Chris@0
|
106 var mouse_x = Event.pointerX(e);
|
Chris@0
|
107 var mouse_y = Event.pointerY(e);
|
Chris@0
|
108 var render_x = mouse_x;
|
Chris@0
|
109 var render_y = mouse_y;
|
Chris@0
|
110 var dims;
|
Chris@0
|
111 var menu_width;
|
Chris@0
|
112 var menu_height;
|
Chris@0
|
113 var window_width;
|
Chris@0
|
114 var window_height;
|
Chris@0
|
115 var max_width;
|
Chris@0
|
116 var max_height;
|
Chris@0
|
117
|
Chris@0
|
118 $('context-menu').style['left'] = (render_x + 'px');
|
Chris@0
|
119 $('context-menu').style['top'] = (render_y + 'px');
|
Chris@0
|
120 Element.update('context-menu', '');
|
Chris@0
|
121
|
Chris@0
|
122 new Ajax.Updater({success:'context-menu'}, this.url,
|
Chris@0
|
123 {asynchronous:true,
|
Chris@117
|
124 method: 'get',
|
Chris@0
|
125 evalScripts:true,
|
Chris@0
|
126 parameters:Form.serialize(Event.findElement(e, 'form')),
|
Chris@0
|
127 onComplete:function(request){
|
Chris@0
|
128 dims = $('context-menu').getDimensions();
|
Chris@0
|
129 menu_width = dims.width;
|
Chris@0
|
130 menu_height = dims.height;
|
Chris@0
|
131 max_width = mouse_x + 2*menu_width;
|
Chris@0
|
132 max_height = mouse_y + menu_height;
|
Chris@0
|
133
|
Chris@0
|
134 var ws = window_size();
|
Chris@0
|
135 window_width = ws.width;
|
Chris@0
|
136 window_height = ws.height;
|
Chris@0
|
137
|
Chris@0
|
138 /* display the menu above and/or to the left of the click if needed */
|
Chris@0
|
139 if (max_width > window_width) {
|
Chris@0
|
140 render_x -= menu_width;
|
Chris@0
|
141 $('context-menu').addClassName('reverse-x');
|
Chris@0
|
142 } else {
|
Chris@0
|
143 $('context-menu').removeClassName('reverse-x');
|
Chris@0
|
144 }
|
Chris@0
|
145 if (max_height > window_height) {
|
Chris@0
|
146 render_y -= menu_height;
|
Chris@0
|
147 $('context-menu').addClassName('reverse-y');
|
Chris@0
|
148 } else {
|
Chris@0
|
149 $('context-menu').removeClassName('reverse-y');
|
Chris@0
|
150 }
|
Chris@0
|
151 if (render_x <= 0) render_x = 1;
|
Chris@0
|
152 if (render_y <= 0) render_y = 1;
|
Chris@0
|
153 $('context-menu').style['left'] = (render_x + 'px');
|
Chris@0
|
154 $('context-menu').style['top'] = (render_y + 'px');
|
Chris@0
|
155
|
Chris@0
|
156 Effect.Appear('context-menu', {duration: 0.20});
|
Chris@0
|
157 if (window.parseStylesheets) { window.parseStylesheets(); } // IE
|
Chris@0
|
158 }})
|
Chris@0
|
159 },
|
Chris@0
|
160
|
Chris@0
|
161 hideMenu: function() {
|
Chris@0
|
162 Element.hide('context-menu');
|
Chris@0
|
163 },
|
Chris@0
|
164
|
Chris@0
|
165 addSelection: function(tr) {
|
Chris@0
|
166 tr.addClassName('context-menu-selection');
|
Chris@0
|
167 this.checkSelectionBox(tr, true);
|
Chris@0
|
168 this.clearDocumentSelection();
|
Chris@0
|
169 },
|
Chris@0
|
170
|
Chris@0
|
171 toggleSelection: function(tr) {
|
Chris@0
|
172 if (this.isSelected(tr)) {
|
Chris@0
|
173 this.removeSelection(tr);
|
Chris@0
|
174 } else {
|
Chris@0
|
175 this.addSelection(tr);
|
Chris@0
|
176 }
|
Chris@0
|
177 },
|
Chris@0
|
178
|
Chris@0
|
179 removeSelection: function(tr) {
|
Chris@0
|
180 tr.removeClassName('context-menu-selection');
|
Chris@0
|
181 this.checkSelectionBox(tr, false);
|
Chris@0
|
182 },
|
Chris@0
|
183
|
Chris@0
|
184 unselectAll: function() {
|
Chris@0
|
185 var rows = $$('.hascontextmenu');
|
Chris@0
|
186 for (i=0; i<rows.length; i++) {
|
Chris@0
|
187 this.removeSelection(rows[i]);
|
Chris@0
|
188 }
|
Chris@0
|
189 },
|
Chris@0
|
190
|
Chris@0
|
191 checkSelectionBox: function(tr, checked) {
|
Chris@0
|
192 var inputs = Element.getElementsBySelector(tr, 'input');
|
Chris@0
|
193 if (inputs.length > 0) { inputs[0].checked = checked; }
|
Chris@0
|
194 },
|
Chris@0
|
195
|
Chris@0
|
196 isSelected: function(tr) {
|
Chris@0
|
197 return Element.hasClassName(tr, 'context-menu-selection');
|
Chris@0
|
198 },
|
Chris@0
|
199
|
Chris@0
|
200 clearDocumentSelection: function() {
|
Chris@0
|
201 if (document.selection) {
|
Chris@0
|
202 document.selection.clear(); // IE
|
Chris@0
|
203 } else {
|
Chris@0
|
204 window.getSelection().removeAllRanges();
|
Chris@0
|
205 }
|
Chris@0
|
206 }
|
Chris@0
|
207 }
|
Chris@0
|
208
|
Chris@0
|
209 function toggleIssuesSelection(el) {
|
Chris@0
|
210 var boxes = el.getElementsBySelector('input[type=checkbox]');
|
Chris@0
|
211 var all_checked = true;
|
Chris@0
|
212 for (i = 0; i < boxes.length; i++) { if (boxes[i].checked == false) { all_checked = false; } }
|
Chris@0
|
213 for (i = 0; i < boxes.length; i++) {
|
Chris@0
|
214 if (all_checked) {
|
Chris@0
|
215 boxes[i].checked = false;
|
Chris@0
|
216 boxes[i].up('tr').removeClassName('context-menu-selection');
|
Chris@0
|
217 } else if (boxes[i].checked == false) {
|
Chris@0
|
218 boxes[i].checked = true;
|
Chris@0
|
219 boxes[i].up('tr').addClassName('context-menu-selection');
|
Chris@0
|
220 }
|
Chris@0
|
221 }
|
Chris@0
|
222 }
|
Chris@0
|
223
|
Chris@0
|
224 function window_size() {
|
Chris@0
|
225 var w;
|
Chris@0
|
226 var h;
|
Chris@0
|
227 if (window.innerWidth) {
|
Chris@0
|
228 w = window.innerWidth;
|
Chris@0
|
229 h = window.innerHeight;
|
Chris@0
|
230 } else if (document.documentElement) {
|
Chris@0
|
231 w = document.documentElement.clientWidth;
|
Chris@0
|
232 h = document.documentElement.clientHeight;
|
Chris@0
|
233 } else {
|
Chris@0
|
234 w = document.body.clientWidth;
|
Chris@0
|
235 h = document.body.clientHeight;
|
Chris@0
|
236 }
|
Chris@0
|
237 return {width: w, height: h};
|
Chris@0
|
238 }
|