lib/dijit/TooltipDialog.js.uncompressed.js

   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\" data-dojo-attach-point=\"connectorNode\"></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         "./main"                // exports methods to dijit global
  16 ], function(declare, domClass, event, keys, lang,
  17                         focus, ContentPane, _DialogMixin, _FormMixin, _TemplatedMixin, template, dijit){
  18
  19         // module:
  20         //              dijit/TooltipDialog
  21
  22
  23         return declare("dijit.TooltipDialog",
  24                 [ContentPane, _TemplatedMixin, _FormMixin, _DialogMixin], {
  25                 // summary:
  26                 //              Pops up a dialog that appears like a Tooltip
  27
  28                 // title: String
  29                 //              Description of tooltip dialog (required for a11y)
  30                 title: "",
  31
  32                 // doLayout: [protected] Boolean
  33                 //              Don't change this parameter from the default value.
  34                 //              This ContentPane parameter doesn't make sense for TooltipDialog, since TooltipDialog
  35                 //              is never a child of a layout container, nor can you specify the size of
  36                 //              TooltipDialog in order to control the size of an inner widget.
  37                 doLayout: false,
  38
  39                 // autofocus: Boolean
  40                 //              A Toggle to modify the default focus behavior of a Dialog, which
  41                 //              is to focus on the first dialog element after opening the dialog.
  42                 //              False will disable autofocusing.  Default: true.
  43                 autofocus: true,
  44
  45                 // baseClass: [protected] String
  46                 //              The root className to use for the various states of this widget
  47                 baseClass: "dijitTooltipDialog",
  48
  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
  54                 // _lastFocusItem: [private readonly] DomNode
  55                 //              The pointer to which node has focus prior to our dialog.
  56                 //              Set by `dijit/_DialogMixin._getFocusItems()`.
  57                 _lastFocusItem: null,
  58
  59                 templateString: template,
  60
  61                 _setTitleAttr: function(/*String*/ title){
  62                         this.containerNode.title = title;
  63                         this._set("title", title);
  64                 },
  65
  66                 postCreate: function(){
  67                         this.inherited(arguments);
  68                         this.connect(this.containerNode, "onkeypress", "_onKey");
  69                 },
  70
  71                 orient: function(/*DomNode*/ node, /*String*/ aroundCorner, /*String*/ tooltipCorner){
  72                         // summary:
  73                         //              Configure widget to be displayed in given position relative to the button.
  74                         //              This is called from the dijit.popup code, and should not be called
  75                         //              directly.
  76                         // tags:
  77                         //              protected
  78
  79                         // Note: intentionally not using dijitTooltip class since that sets position:absolute, which
  80                         // confuses dijit/popup trying to get the size of the tooltip.
  81                         var newC = {
  82                                 "MR-ML": "dijitTooltipRight",
  83                                 "ML-MR": "dijitTooltipLeft",
  84                                 "TM-BM": "dijitTooltipAbove",
  85                                 "BM-TM": "dijitTooltipBelow",
  86                                 "BL-TL": "dijitTooltipBelow dijitTooltipABLeft",
  87                                 "TL-BL": "dijitTooltipAbove dijitTooltipABLeft",
  88                                 "BR-TR": "dijitTooltipBelow dijitTooltipABRight",
  89                                 "TR-BR": "dijitTooltipAbove dijitTooltipABRight",
  90                                 "BR-BL": "dijitTooltipRight",
  91                                 "BL-BR": "dijitTooltipLeft"
  92                         }[aroundCorner + "-" + tooltipCorner];
  93
  94                         domClass.replace(this.domNode, newC, this._currentOrientClass || "");
  95                         this._currentOrientClass = newC;
  96
  97                         // Tooltip.orient() has code to reposition connector for when Tooltip is before/after anchor.
  98                         // Not putting here to avoid code bloat, and since TooltipDialogs are generally above/below.
  99                         // Should combine code from Tooltip and TooltipDialog.
 100                 },
 101
 102                 focus: function(){
 103                         // summary:
 104                         //              Focus on first field
 105                         this._getFocusItems(this.containerNode);
 106                         focus.focus(this._firstFocusItem);
 107                 },
 108
 109                 onOpen: function(/*Object*/ pos){
 110                         // summary:
 111                         //              Called when dialog is displayed.
 112                         //              This is called from the dijit.popup code, and should not be called directly.
 113                         // tags:
 114                         //              protected
 115
 116                         this.orient(this.domNode,pos.aroundCorner, pos.corner);
 117
 118                         // Position the tooltip connector for middle alignment.
 119                         // This could not have been done in orient() since the tooltip wasn't positioned at that time.
 120                         var aroundNodeCoords = pos.aroundNodePos;
 121                         if(pos.corner.charAt(0) == 'M' && pos.aroundCorner.charAt(0) == 'M'){
 122                                 this.connectorNode.style.top = aroundNodeCoords.y + ((aroundNodeCoords.h - this.connectorNode.offsetHeight) >> 1) - pos.y + "px";
 123                                 this.connectorNode.style.left = "";
 124                         }else if(pos.corner.charAt(1) == 'M' && pos.aroundCorner.charAt(1) == 'M'){
 125                                 this.connectorNode.style.left = aroundNodeCoords.x + ((aroundNodeCoords.w - this.connectorNode.offsetWidth) >> 1) - pos.x + "px";
 126                         }
 127
 128                         this._onShow(); // lazy load trigger  (TODO: shouldn't we load before positioning?)
 129                 },
 130
 131                 onClose: function(){
 132                         // summary:
 133                         //              Called when dialog is hidden.
 134                         //              This is called from the dijit.popup code, and should not be called directly.
 135                         // tags:
 136                         //              protected
 137                         this.onHide();
 138                 },
 139
 140                 _onKey: function(/*Event*/ evt){
 141                         // summary:
 142                         //              Handler for keyboard events
 143                         // description:
 144                         //              Keep keyboard focus in dialog; close dialog on escape key
 145                         // tags:
 146                         //              private
 147
 148                         var node = evt.target;
 149                         if(evt.charOrCode === keys.TAB){
 150                                 this._getFocusItems(this.containerNode);
 151                         }
 152                         var singleFocusItem = (this._firstFocusItem == this._lastFocusItem);
 153                         if(evt.charOrCode == keys.ESCAPE){
 154                                 // Use defer to avoid crash on IE, see #10396.
 155                                 this.defer("onCancel");
 156                                 event.stop(evt);
 157                         }else if(node == this._firstFocusItem && evt.shiftKey && evt.charOrCode === keys.TAB){
 158                                 if(!singleFocusItem){
 159                                         focus.focus(this._lastFocusItem); // send focus to last item in dialog
 160                                 }
 161                                 event.stop(evt);
 162                         }else if(node == this._lastFocusItem && evt.charOrCode === keys.TAB && !evt.shiftKey){
 163                                 if(!singleFocusItem){
 164                                         focus.focus(this._firstFocusItem); // send focus to first item in dialog
 165                                 }
 166                                 event.stop(evt);
 167                         }else if(evt.charOrCode === keys.TAB){
 168                                 // we want the browser's default tab handling to move focus
 169                                 // but we don't want the tab to propagate upwards
 170                                 evt.stopPropagation();
 171                         }
 172                 }
 173         });
 174 });