custommenu.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. /*
  2. This file is part of CPEE.
  3. CPEE is free software: you can redistribute it and/or modify it under the terms
  4. of the GNU General Public License as published by the Free Software Foundation,
  5. either version 3 of the License, or (at your option) any later version.
  6. CPEE is distributed in the hope that it will be useful, but WITHOUT ANY
  7. WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
  8. PARTICULAR PURPOSE. See the GNU General Public License for more details.
  9. You should have received a copy of the GNU General Public License along with
  10. CPEE (file COPYING in the main directory). If not, see
  11. <http://www.gnu.org/licenses/>.
  12. */
  13. function CustomMenu(e) {
  14. var target = $(e.target);
  15. var x = e.pageX;
  16. var y = e.pageY;
  17. var remove = function(event) {};
  18. this.remove = remove;
  19. e.stopPropagation();
  20. this.contextmenu = function(items) {
  21. remove = function(event) {
  22. if (!event) {
  23. $('.contextmenu:first').remove();
  24. $('body', document).unbind('mousedown',remove);
  25. return;
  26. }
  27. if($(event.target).parent('tr.contextmenuitem') && (event.button == 0)) { $(event.target).click(); }
  28. $('.contextmenu:first').remove();
  29. $('body', document).unbind('mousedown',remove);
  30. }
  31. $('body', document).bind('mousedown',remove);
  32. if($('div.contextmenu').length > 0) remove();
  33. var div = $('<div class="contextmenu"><table class="contextmenu"/></div>');
  34. for(head in items) {
  35. div.children(':first').append('<tr class="contextmenuheader"><td colspan="2">' + head + '</td></tr>');
  36. for(item in items[head]) {
  37. var icon = null;
  38. if(items[head][item].menu_icon) {
  39. icon = $X('<svg xmlns="http://www.w3.org/2000/svg" version="1.1">' +
  40. '<g transform="translate(1,1) scale(0.5, 0.5)"/>' +
  41. '</svg>');
  42. icon.children('g').append(items[head][item].menu_icon.clone().children());
  43. icon = icon.serializeXML();
  44. }
  45. var row = $('<tr class="contextmenuitem"><td class="contextmenuicon"><div>' + (icon == null ? '' : icon) + '</div></td><td>' + items[head][item].label + '</td></tr>');
  46. div.children(':first').append(row);
  47. row.bind('click', items[head][item], function(event){
  48. event.data.function_call.apply(null, event.data.params);
  49. });
  50. }
  51. }
  52. div.css({'left':x+5,'top':y+5, 'display':'block'});
  53. $('body', document).append(div);
  54. if(($(window).height() < (y + div.height()))) { // contextmenu is position
  55. div.css({'top':$(window).height()-div.height()-5});
  56. }
  57. if((document.body.clientWidth < (x + div.width())) && (x-div.width()-5 >= 0)) { // contextmenu is position
  58. div.css({'left':x-div.width()-5});
  59. }
  60. }
  61. this.menu = function(menu,call) {
  62. remove = function(event) {
  63. if ($(event.target).parent('div.menu') && (event.button == 0)) { $(event.target).click(); }
  64. menu.hide();
  65. $('body', document).unbind('mousedown',remove);
  66. $("div.menuitem",$(menu)).each(function(ind,ele){
  67. $(ele).unbind('click',mitemclick);
  68. });
  69. }
  70. menu.show();
  71. var mitemclick = function(ele){
  72. $("div.menuitem[data-selected=selected]",$(menu)).each(function(ind,rem){ $(rem).removeAttr('data-selected'); });
  73. $(ele.target).attr('data-selected','selected');
  74. call(ele.target);
  75. };
  76. $('body', document).bind('mousedown',remove);
  77. $("div.menuitem",$(menu)).each(function(ind,ele){
  78. $(ele).bind('click',mitemclick);
  79. });
  80. var off = target.offset();
  81. menu.css({'left':off.left,'top':off.top+target.outerHeight() + 1,'min-width': target.width()});
  82. if(($(window).height() < (y + menu.height()))) {
  83. menu.css({'top':$(window).height()-menu.height()-5});
  84. }
  85. if((document.body.clientWidth < (x + menu.width())) && (x-menu.width()-5 >= 0)) {
  86. menu.css({'left':x-menu.width()-5});
  87. }
  88. }
  89. }