You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

186 lines
4.7 KiB

  1. /*!
  2. * jquery.fancytree.menu.js
  3. *
  4. * Enable jQuery UI Menu as context menu for tree nodes.
  5. * (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
  6. *
  7. * @see http://api.jqueryui.com/menu/
  8. *
  9. * Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
  10. *
  11. * Released under the MIT license
  12. * https://github.com/mar10/fancytree/wiki/LicenseInfo
  13. *
  14. * @version 2.38.3
  15. * @date 2023-02-01T20:52:50Z
  16. */
  17. (function (factory) {
  18. if (typeof define === "function" && define.amd) {
  19. // AMD. Register as an anonymous module.
  20. define(["jquery", "./jquery.fancytree"], factory);
  21. } else if (typeof module === "object" && module.exports) {
  22. // Node/CommonJS
  23. require("./jquery.fancytree");
  24. module.exports = factory(require("jquery"));
  25. } else {
  26. // Browser globals
  27. factory(jQuery);
  28. }
  29. })(function ($) {
  30. "use strict";
  31. $.ui.fancytree.registerExtension({
  32. name: "menu",
  33. version: "2.38.3",
  34. // Default options for this extension.
  35. options: {
  36. enable: true,
  37. selector: null, //
  38. position: {}, //
  39. // Events:
  40. create: $.noop, //
  41. beforeOpen: $.noop, //
  42. open: $.noop, //
  43. focus: $.noop, //
  44. select: $.noop, //
  45. close: $.noop, //
  46. },
  47. // Override virtual methods for this extension.
  48. // `this` : is this extension object
  49. // `this._base` : the Fancytree instance
  50. // `this._super`: the virtual function that was overridden (member of prev. extension or Fancytree)
  51. treeInit: function (ctx) {
  52. var opts = ctx.options,
  53. tree = ctx.tree;
  54. this._superApply(arguments);
  55. // Prepare an object that will be passed with menu events
  56. tree.ext.menu.data = {
  57. tree: tree,
  58. node: null,
  59. $menu: null,
  60. menuId: null,
  61. };
  62. // tree.$container[0].oncontextmenu = function() {return false;};
  63. // Replace the standard browser context menu with out own
  64. tree.$container.on(
  65. "contextmenu",
  66. "span.fancytree-node",
  67. function (event) {
  68. var node = $.ui.fancytree.getNode(event),
  69. ctx = {
  70. node: node,
  71. tree: node.tree,
  72. originalEvent: event,
  73. options: tree.options,
  74. };
  75. tree.ext.menu._openMenu(ctx);
  76. return false;
  77. }
  78. );
  79. // Use jquery.ui.menu
  80. $(opts.menu.selector)
  81. .menu({
  82. create: function (event, ui) {
  83. tree.ext.menu.data.$menu = $(this).menu("widget");
  84. var data = $.extend({}, tree.ext.menu.data);
  85. opts.menu.create.call(tree, event, data);
  86. },
  87. focus: function (event, ui) {
  88. var data = $.extend({}, tree.ext.menu.data, {
  89. menuItem: ui.item,
  90. menuId: ui.item.find(">a").attr("href"),
  91. });
  92. opts.menu.focus.call(tree, event, data);
  93. },
  94. select: function (event, ui) {
  95. var data = $.extend({}, tree.ext.menu.data, {
  96. menuItem: ui.item,
  97. menuId: ui.item.find(">a").attr("href"),
  98. });
  99. if (
  100. opts.menu.select.call(tree, event, data) !== false
  101. ) {
  102. tree.ext.menu._closeMenu(ctx);
  103. }
  104. },
  105. })
  106. .hide();
  107. },
  108. treeDestroy: function (ctx) {
  109. this._superApply(arguments);
  110. },
  111. _openMenu: function (ctx) {
  112. var data,
  113. tree = ctx.tree,
  114. opts = ctx.options,
  115. $menu = $(opts.menu.selector);
  116. tree.ext.menu.data.node = ctx.node;
  117. data = $.extend({}, tree.ext.menu.data);
  118. if (
  119. opts.menu.beforeOpen.call(tree, ctx.originalEvent, data) ===
  120. false
  121. ) {
  122. return;
  123. }
  124. $(document)
  125. .on("keydown.fancytree", function (event) {
  126. if (event.which === $.ui.keyCode.ESCAPE) {
  127. tree.ext.menu._closeMenu(ctx);
  128. }
  129. })
  130. .on("mousedown.fancytree", function (event) {
  131. // Close menu when clicked outside menu
  132. if ($(event.target).closest(".ui-menu-item").length === 0) {
  133. tree.ext.menu._closeMenu(ctx);
  134. }
  135. });
  136. // $menu.position($.extend({my: "left top", at: "left bottom", of: event}, opts.menu.position));
  137. $menu
  138. .css("position", "absolute")
  139. .show()
  140. .position({
  141. my: "left top",
  142. at: "right top",
  143. of: ctx.originalEvent,
  144. collision: "fit",
  145. })
  146. .focus();
  147. opts.menu.open.call(tree, ctx.originalEvent, data);
  148. },
  149. _closeMenu: function (ctx) {
  150. var $menu,
  151. tree = ctx.tree,
  152. opts = ctx.options,
  153. data = $.extend({}, tree.ext.menu.data);
  154. if (opts.menu.close.call(tree, ctx.originalEvent, data) === false) {
  155. return;
  156. }
  157. $menu = $(opts.menu.selector);
  158. $(document).off("keydown.fancytree, mousedown.fancytree");
  159. $menu.hide();
  160. tree.ext.menu.data.node = null;
  161. },
  162. // ,
  163. // nodeClick: function(ctx) {
  164. // var event = ctx.originalEvent;
  165. // if(event.which === 2 || (event.which === 1 && event.ctrlKey)){
  166. // event.preventDefault();
  167. // ctx.tree.ext.menu._openMenu(ctx);
  168. // return false;
  169. // }
  170. // this._superApply(arguments);
  171. // }
  172. });
  173. // Value returned by `require('jquery.fancytree..')`
  174. return $.ui.fancytree;
  175. }); // End of closure