Tooltip.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. define("dojox/mobile/Tooltip", [
  2. "dojo/_base/array", // array.forEach
  3. "dijit/registry",
  4. "dojo/_base/declare",
  5. "dojo/_base/lang",
  6. "dojo/dom-class",
  7. "dojo/dom-construct",
  8. "dojo/dom-geometry",
  9. "dojo/dom-style",
  10. "dijit/place",
  11. "dijit/_WidgetBase"
  12. ], function(array, registry, declare, lang, domClass, domConstruct, domGeometry, domStyle, place, WidgetBase){
  13. /*=====
  14. WidgetBase = dijit._WidgetBase;
  15. =====*/
  16. return declare("dojox.mobile.Tooltip", WidgetBase, {
  17. // summary:
  18. // A non-templated popup bubble widget
  19. //
  20. baseClass: "mblTooltip mblTooltipHidden",
  21. buildRendering: function(){
  22. // create the helper nodes here in case the user overwrote domNode.innerHTML
  23. this.inherited(arguments);
  24. this.anchor = domConstruct.create("div", {"class":"mblTooltipAnchor"}, this.domNode, "first");
  25. this.arrow = domConstruct.create("div", {"class":"mblTooltipArrow"}, this.anchor);
  26. this.innerArrow = domConstruct.create("div", {"class":"mblTooltipInnerArrow"}, this.anchor);
  27. },
  28. show: function(/*DomNode*/ aroundNode, positions){
  29. // summary:
  30. // Pop up the tooltip and point to aroundNode using the best position
  31. // positions:
  32. // Ordered list of positions to try matching up.
  33. // * before: places drop down before the aroundNode
  34. // * after: places drop down after the aroundNode
  35. // * above-centered: drop down goes above aroundNode
  36. // * below-centered: drop down goes below aroundNode
  37. var domNode = this.domNode;
  38. var connectorClasses = {
  39. "MRM": "mblTooltipAfter",
  40. "MLM": "mblTooltipBefore",
  41. "BMT": "mblTooltipBelow",
  42. "TMB": "mblTooltipAbove",
  43. "BLT": "mblTooltipBelow",
  44. "TLB": "mblTooltipAbove",
  45. "BRT": "mblTooltipBelow",
  46. "TRB": "mblTooltipAbove",
  47. "TLT": "mblTooltipBefore",
  48. "TRT": "mblTooltipAfter",
  49. "BRB": "mblTooltipAfter",
  50. "BLB": "mblTooltipBefore"
  51. };
  52. domClass.remove(domNode, ["mblTooltipAfter","mblTooltipBefore","mblTooltipBelow","mblTooltipAbove"]);
  53. array.forEach(registry.findWidgets(domNode), function(widget){
  54. if(widget.height == "auto" && typeof widget.resize == "function"){
  55. if(!widget.fixedFooterHeight){
  56. widget.fixedFooterHeight = domGeometry.getPadBorderExtents(domNode).b;
  57. }
  58. widget.resize();
  59. }
  60. });
  61. var best = place.around(domNode, aroundNode, positions || ['below-centered', 'above-centered', 'after', 'before'], this.isLeftToRight());
  62. var connectorClass = connectorClasses[best.corner + best.aroundCorner.charAt(0)] || '';
  63. domClass.add(domNode, connectorClass);
  64. var pos = domGeometry.position(aroundNode, true);
  65. domStyle.set(this.anchor, (connectorClass == "mblTooltipAbove" || connectorClass == "mblTooltipBelow")
  66. ? { top: "", left: Math.max(0, pos.x - best.x + (pos.w >> 1) - (this.arrow.offsetWidth >> 1)) + "px" }
  67. : { left: "", top: Math.max(0, pos.y - best.y + (pos.h >> 1) - (this.arrow.offsetHeight >> 1)) + "px" }
  68. );
  69. domClass.replace(domNode, "mblTooltipVisible", "mblTooltipHidden");
  70. this.resize = lang.hitch(this, "show", aroundNode, positions); // orientation changes
  71. return best;
  72. },
  73. hide: function(){
  74. // summary:
  75. // Pop down the tooltip
  76. this.resize = undefined;
  77. domClass.replace(this.domNode, "mblTooltipHidden", "mblTooltipVisible");
  78. },
  79. onBlur: function(/*Event*/e){
  80. return true; // touching outside the overlay area does call hide() by default
  81. },
  82. destroy: function(){
  83. if(this.anchor){
  84. this.anchor.removeChild(this.innerArrow);
  85. this.anchor.removeChild(this.arrow);
  86. this.domNode.removeChild(this.anchor);
  87. this.anchor = this.arrow = this.innerArrow = undefined;
  88. }
  89. this.inherited(arguments);
  90. }
  91. });
  92. });