annotate public/javascripts/context_menu.js @ 904:0a8317a50fa0 redmine-1.1

Close obsolete branch redmine-1.1
author Chris Cannam
date Fri, 14 Jan 2011 12:53:21 +0000
parents af80e5618e9b
children 051f544170fe
rev   line source
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 }