TooltipDialog.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. require({cache:{
  2. 'url:dijit/templates/TooltipDialog.html':"<div role=\"presentation\" tabIndex=\"-1\">\n\t<div class=\"dijitTooltipContainer\" role=\"presentation\">\n\t\t<div class =\"dijitTooltipContents dijitTooltipFocusNode\" data-dojo-attach-point=\"containerNode\" role=\"dialog\"></div>\n\t</div>\n\t<div class=\"dijitTooltipConnector\" role=\"presentation\"></div>\n</div>\n"}});
  3. define("dijit/TooltipDialog", [
  4. "dojo/_base/declare", // declare
  5. "dojo/dom-class", // domClass.replace
  6. "dojo/_base/event", // event.stop
  7. "dojo/keys", // keys
  8. "dojo/_base/lang", // lang.hitch
  9. "./focus",
  10. "./layout/ContentPane",
  11. "./_DialogMixin",
  12. "./form/_FormMixin",
  13. "./_TemplatedMixin",
  14. "dojo/text!./templates/TooltipDialog.html",
  15. "." // exports methods to dijit global
  16. ], function(declare, domClass, event, keys, lang,
  17. focus, ContentPane, _DialogMixin, _FormMixin, _TemplatedMixin, template, dijit){
  18. /*=====
  19. var ContentPane = dijit.layout.ContentPane;
  20. var _DialogMixin = dijit._DialogMixin;
  21. var _FormMixin = dijit.form._FormMixin;
  22. var _TemplatedMixin = dijit._TemplatedMixin;
  23. =====*/
  24. // module:
  25. // dijit/TooltipDialog
  26. // summary:
  27. // Pops up a dialog that appears like a Tooltip
  28. return declare("dijit.TooltipDialog",
  29. [ContentPane, _TemplatedMixin, _FormMixin, _DialogMixin], {
  30. // summary:
  31. // Pops up a dialog that appears like a Tooltip
  32. // title: String
  33. // Description of tooltip dialog (required for a11y)
  34. title: "",
  35. // doLayout: [protected] Boolean
  36. // Don't change this parameter from the default value.
  37. // This ContentPane parameter doesn't make sense for TooltipDialog, since TooltipDialog
  38. // is never a child of a layout container, nor can you specify the size of
  39. // TooltipDialog in order to control the size of an inner widget.
  40. doLayout: false,
  41. // autofocus: Boolean
  42. // A Toggle to modify the default focus behavior of a Dialog, which
  43. // is to focus on the first dialog element after opening the dialog.
  44. // False will disable autofocusing. Default: true
  45. autofocus: true,
  46. // baseClass: [protected] String
  47. // The root className to use for the various states of this widget
  48. baseClass: "dijitTooltipDialog",
  49. // _firstFocusItem: [private] [readonly] DomNode
  50. // The pointer to the first focusable node in the dialog.
  51. // Set by `dijit._DialogMixin._getFocusItems`.
  52. _firstFocusItem: null,
  53. // _lastFocusItem: [private] [readonly] DomNode
  54. // The pointer to which node has focus prior to our dialog.
  55. // Set by `dijit._DialogMixin._getFocusItems`.
  56. _lastFocusItem: null,
  57. templateString: template,
  58. _setTitleAttr: function(/*String*/ title){
  59. this.containerNode.title = title;
  60. this._set("title", title)
  61. },
  62. postCreate: function(){
  63. this.inherited(arguments);
  64. this.connect(this.containerNode, "onkeypress", "_onKey");
  65. },
  66. orient: function(/*DomNode*/ node, /*String*/ aroundCorner, /*String*/ corner){
  67. // summary:
  68. // Configure widget to be displayed in given position relative to the button.
  69. // This is called from the dijit.popup code, and should not be called
  70. // directly.
  71. // tags:
  72. // protected
  73. var newC = "dijitTooltipAB" + (corner.charAt(1) == 'L' ? "Left" : "Right")
  74. + " dijitTooltip"
  75. + (corner.charAt(0) == 'T' ? "Below" : "Above");
  76. domClass.replace(this.domNode, newC, this._currentOrientClass || "");
  77. this._currentOrientClass = newC;
  78. },
  79. focus: function(){
  80. // summary:
  81. // Focus on first field
  82. this._getFocusItems(this.containerNode);
  83. focus.focus(this._firstFocusItem);
  84. },
  85. onOpen: function(/*Object*/ pos){
  86. // summary:
  87. // Called when dialog is displayed.
  88. // This is called from the dijit.popup code, and should not be called directly.
  89. // tags:
  90. // protected
  91. this.orient(this.domNode,pos.aroundCorner, pos.corner);
  92. this._onShow(); // lazy load trigger
  93. },
  94. onClose: function(){
  95. // summary:
  96. // Called when dialog is hidden.
  97. // This is called from the dijit.popup code, and should not be called directly.
  98. // tags:
  99. // protected
  100. this.onHide();
  101. },
  102. _onKey: function(/*Event*/ evt){
  103. // summary:
  104. // Handler for keyboard events
  105. // description:
  106. // Keep keyboard focus in dialog; close dialog on escape key
  107. // tags:
  108. // private
  109. var node = evt.target;
  110. if(evt.charOrCode === keys.TAB){
  111. this._getFocusItems(this.containerNode);
  112. }
  113. var singleFocusItem = (this._firstFocusItem == this._lastFocusItem);
  114. if(evt.charOrCode == keys.ESCAPE){
  115. // Use setTimeout to avoid crash on IE, see #10396.
  116. setTimeout(lang.hitch(this, "onCancel"), 0);
  117. event.stop(evt);
  118. }else if(node == this._firstFocusItem && evt.shiftKey && evt.charOrCode === keys.TAB){
  119. if(!singleFocusItem){
  120. focus.focus(this._lastFocusItem); // send focus to last item in dialog
  121. }
  122. event.stop(evt);
  123. }else if(node == this._lastFocusItem && evt.charOrCode === keys.TAB && !evt.shiftKey){
  124. if(!singleFocusItem){
  125. focus.focus(this._firstFocusItem); // send focus to first item in dialog
  126. }
  127. event.stop(evt);
  128. }else if(evt.charOrCode === keys.TAB){
  129. // we want the browser's default tab handling to move focus
  130. // but we don't want the tab to propagate upwards
  131. evt.stopPropagation();
  132. }
  133. }
  134. });
  135. });