产品原型
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.

188 lines
8.2 KiB

4 years ago
  1. // This is actually for BOTH trees and menus
  2. $axure.internal(function($ax) {
  3. var _tree = $ax.tree = {};
  4. var _menu = $ax.menu = {};
  5. $ax.menu.InitializeSubmenu = function(subMenuId, cellId) {
  6. var $submenudiv = $('#' + subMenuId);
  7. //mouseenter and leave for parent table cell
  8. $('#' + cellId).mouseenter(function(e) {
  9. //show current submenu
  10. // var submenuElement = document.getElementById(subMenuId);
  11. // if($ax.visibility.IsVisible(submenuElement) && submenuElement.style.display !== 'none') return;
  12. $ax.visibility.SetIdVisible(subMenuId, true);
  13. $ax.legacy.BringToFront(subMenuId);
  14. //$submenudiv.find('.menu_item').each(function() {
  15. // $ax.style.updateTextAlignmentForVisibility($ax.GetTextPanelId($(this).attr('id')));
  16. //});
  17. _fireEventForSubmenu(subMenuId, "onShow");
  18. }).mouseleave(function (e) {
  19. var offset = $submenudiv.offset();
  20. var subcontwidth = $submenudiv.width();
  21. var subcontheight = $submenudiv.height();
  22. //If mouse is not within the submenu (added 3 pixel margin to top and left calculations), then close the submenu...
  23. if(e.pageX + 3 < offset.left || e.pageX > offset.left + subcontwidth || e.pageY + 3 < offset.top || e.pageY > offset.top + subcontheight) {
  24. $submenudiv.find('.sub_menu').addBack().each(function () {
  25. // if(!$ax.visibility.IsVisible(this)) return;
  26. $ax.visibility.SetVisible(this, false);
  27. _fireEventForSubmenu(subMenuId, "onHide");
  28. });
  29. $ax.style.SetWidgetHover(cellId, false);
  30. }
  31. });
  32. $submenudiv.css('display', 'none');
  33. //mouseleave for submenu
  34. $submenudiv.mouseleave(function(e) {
  35. //close this menu and all menus below it
  36. $(this).find('.sub_menu').addBack().css({ 'visibility': 'hidden', 'display': 'none' }).each(function () {
  37. // if(!$ax.visibility.IsVisible(this)) return;
  38. _fireEventForSubmenu(this.id, "onHide");
  39. });
  40. $ax.style.SetWidgetHover(cellId, false);
  41. });
  42. };
  43. var _fireEventForSubmenu = function(targetId, eventName) {
  44. var diagramObject = $ax.getObjectFromElementId(targetId);
  45. var event = diagramObject.interactionMap && diagramObject.interactionMap[eventName];
  46. if(event) {
  47. var eventInfo = $ax.getEventInfoFromEvent($ax.getjBrowserEvent(), false, targetId);
  48. $ax.event.handleEvent(targetId, eventInfo, event, false, true);
  49. }
  50. }
  51. function IsNodeVisible(nodeId) {
  52. var current = window.document.getElementById(nodeId);
  53. var parent = current.parentNode;
  54. //move all the parent's children that are below the node and their annotations
  55. while(!$(current).hasClass("treeroot")) {
  56. if(!$ax.visibility.IsVisible(parent)) return false;
  57. current = parent;
  58. parent = parent.parentNode;
  59. }
  60. return true;
  61. }
  62. $ax.tree.ExpandNode = function(nodeId, childContainerId, plusMinusId) {
  63. var container = window.document.getElementById(childContainerId);
  64. if(!container || $ax.visibility.IsVisible(container)) return;
  65. $ax.visibility.SetVisible(container, true);
  66. if(plusMinusId != '') $ax.style.SetWidgetSelected(plusMinusId, true);
  67. var delta = _getExpandCollapseDelta(nodeId, childContainerId);
  68. var isVisible = IsNodeVisible(nodeId);
  69. var current = window.document.getElementById(nodeId);
  70. var parent = current.parentNode;
  71. //move all the parent's children that are below the node and their annotations
  72. while(!$(current).hasClass("treeroot")) {
  73. var after = false;
  74. var i = 0;
  75. for(i = 0; i < parent.childNodes.length; i++) {
  76. var child = parent.childNodes[i];
  77. if(after && child.id && $(child).hasClass("treenode")) {
  78. var elementId = child.id;
  79. child.style.top = $ax.getNumFromPx($(child).css('top')) + delta + 'px';
  80. var ann = window.document.getElementById(elementId + "_ann");
  81. if (ann) ann.style.top = $ax.getNumFromPx($(ann).css('top')) + delta + 'px';
  82. }
  83. if(child == current) after = true;
  84. }
  85. current = parent;
  86. parent = parent.parentNode;
  87. if(!isVisible && $ax.visibility.IsVisible(parent)) break;
  88. }
  89. };
  90. $ax.tree.CollapseNode = function(nodeId, childContainerId, plusMinusId) {
  91. var container = window.document.getElementById(childContainerId);
  92. if(!container || !$ax.visibility.IsVisible(container)) return;
  93. if(plusMinusId != '') $ax.style.SetWidgetSelected(plusMinusId, false);
  94. var delta = _getExpandCollapseDelta(nodeId, childContainerId);
  95. //hide it after getting the delta, otherwise the delta can't be calculated (offsetParent is null)
  96. $ax.visibility.SetVisible(container, false);
  97. var isVisible = IsNodeVisible(nodeId);
  98. var current = window.document.getElementById(nodeId);
  99. var parent = current.parentNode;
  100. //move all the parent's children that are below the node and their annotations
  101. while(!$(current).hasClass("treeroot")) {
  102. var after = false;
  103. var i = 0;
  104. for(i = 0; i < parent.childNodes.length; i++) {
  105. var child = parent.childNodes[i];
  106. if(after && child.id && $(child).hasClass("treenode")) {
  107. var elementId = child.id;
  108. child.style.top = $ax.getNumFromPx($(child).css('top')) - delta + 'px';
  109. var ann = window.document.getElementById(elementId + "_ann");
  110. if (ann) ann.style.top = $ax.getNumFromPx($(ann).css('top')) - delta + 'px';
  111. }
  112. if(child == current) after = true;
  113. }
  114. current = parent;
  115. parent = current.parentNode;
  116. if(!isVisible && $ax.visibility.IsVisible(parent)) break;
  117. }
  118. };
  119. var _getExpandCollapseDelta = function(nodeId, childContainerId) {
  120. return _getChildContainerHeightHelper(childContainerId);
  121. };
  122. var _getChildContainerHeightHelper = function(childContainerId) {
  123. var height = 0;
  124. $('#' + childContainerId).children().each(function() {
  125. if($(this).hasClass("treenode")) {
  126. height += $(this).height();
  127. var subContainer = window.document.getElementById(this.id + '_children');
  128. if(subContainer && $ax.visibility.IsVisible(subContainer)) {
  129. height += _getChildContainerHeightHelper(subContainer.id);
  130. }
  131. }
  132. });
  133. return height;
  134. };
  135. $ax.tree.InitializeTreeNode = function(nodeId, plusminusid, childContainerId, selectText) {
  136. var childContainer = window.document.getElementById(childContainerId);
  137. if(childContainer) {
  138. //relying on the html generator to put this inline so we know to collapse by default
  139. var isCollapsed = childContainer.style.visibility == "hidden";
  140. if(isCollapsed) $ax.visibility.SetVisible(childContainer, false);
  141. if(!isCollapsed && plusminusid != '') $ax.style.SetWidgetSelected(plusminusid, true);
  142. }
  143. if(plusminusid != '') {
  144. $jobj(plusminusid).click(function() {
  145. var visibleSet = $ax.visibility.IsIdVisible(childContainerId);
  146. if(visibleSet) $ax.tree.CollapseNode(nodeId, childContainerId, plusminusid);
  147. else $ax.tree.ExpandNode(nodeId, childContainerId, plusminusid);
  148. $ax.tree.SelectTreeNode(nodeId, true);
  149. return false;
  150. }).css('cursor', 'default');
  151. }
  152. };
  153. var _getButtonShapeId = function(id) {
  154. var obj = $obj(id);
  155. return $ax.public.fn.IsTreeNodeObject(obj.type) ? $ax.getElementIdFromPath([obj.buttonShapeId], { relativeTo: id }) : id;
  156. };
  157. $ax.tree.SelectTreeNode = function(id, selected) {
  158. $ax.style.SetWidgetSelected(_getButtonShapeId(id), selected);
  159. };
  160. });