-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-tip.QuickTipManager'>/**
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-tip-QuickTipManager'>/**
</span> * @class Ext.tip.QuickTipManager
*
* Provides attractive and customizable tooltips for any element. The QuickTips
*
* Here is an example showing how some of these config options could be used:
*
- * {@img Ext.tip.QuickTipManager/Ext.tip.QuickTipManager.png Ext.tip.QuickTipManager component}
- *
- * ## Code
- *
+ * @example
* // Init the singleton. Any tag-based quick tips will start working.
* Ext.tip.QuickTipManager.init();
- *
+ *
* // Apply a set of config properties to the singleton
* Ext.apply(Ext.tip.QuickTipManager.getQuickTip(), {
* maxWidth: 200,
* minWidth: 100,
* showDelay: 50 // Show 50ms after entering target
* });
- *
+ *
* // Create a small panel to add a quick tip to
* Ext.create('Ext.container.Container', {
* id: 'quickTipContainer',
* },
* renderTo: Ext.getBody()
* });
- *
- *
+ *
+ *
* // Manually register a quick tip for a specific element
* Ext.tip.QuickTipManager.register({
* target: 'quickTipContainer',
* });
*
* To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
- * the **ext** namespace. The HTML element itself is automatically set as the quick tip target. Here is the summary
+ * the **data-** namespace. The HTML element itself is automatically set as the quick tip target. Here is the summary
* of supported attributes (optional unless otherwise noted):
*
* - `hide`: Specifying "user" is equivalent to setting autoHide = false. Any other value will be the same as autoHide = true.
* - `qwidth`: The quick tip width (equivalent to the 'width' target element config).
*
* Here is an example of configuring an HTML element to display a tooltip from markup:
- *
+ *
* // Add a quick tip to an HTML button
- * &lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
- * data-qtip="This is a quick tip from markup!">&lt;/input>
+ * <input type="button" value="OK" data-qtitle="OK Button" data-qwidth="100"
+ * data-qtip="This is a quick tip from markup!"></input>
*
* @singleton
*/
requires: ['Ext.tip.QuickTip'],
singleton: true,
alternateClassName: 'Ext.QuickTips',
-<span id='Ext-tip.QuickTipManager-method-init'> /**
+
+<span id='Ext-tip-QuickTipManager-method-init'> /**
</span> * Initialize the global QuickTips instance and prepare any quick tips.
- * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true)
+ * @param {Boolean} autoRender (optional) True to render the QuickTips container immediately to
+ * preload images. (Defaults to true)
+ * @param {Object} config (optional) config object for the created QuickTip. By
+ * default, the {@link Ext.tip.QuickTip QuickTip} class is instantiated, but this can
+ * be changed by supplying an xtype property or a className property in this object.
+ * All other properties on this object are configuration for the created component.
*/
- init : function(autoRender){
+ init : function (autoRender, config) {
if (!tip) {
if (!Ext.isReady) {
Ext.onReady(function(){
});
return;
}
- tip = Ext.create('Ext.tip.QuickTip', {
- disabled: disabled,
- renderTo: autoRender !== false ? document.body : undefined
- });
+
+ var tipConfig = Ext.apply({ disabled: disabled }, config),
+ className = tipConfig.className,
+ xtype = tipConfig.xtype;
+
+ if (className) {
+ delete tipConfig.className;
+ } else if (xtype) {
+ className = 'widget.' + xtype;
+ delete tipConfig.xtype;
+ }
+
+ if (autoRender !== false) {
+ tipConfig.renderTo = document.body;
+
+ //<debug>
+ if (tipConfig.renderTo.tagName != 'BODY') { // e.g., == 'FRAMESET'
+ Ext.Error.raise({
+ sourceClass: 'Ext.tip.QuickTipManager',
+ sourceMethod: 'init',
+ msg: 'Cannot init QuickTipManager: no document body'
+ });
+ }
+ //</debug>
+ }
+
+ tip = Ext.create(className || 'Ext.tip.QuickTip', tipConfig);
}
},
-<span id='Ext-tip.QuickTipManager-method-destroy'> /**
+<span id='Ext-tip-QuickTipManager-method-destroy'> /**
</span> * Destroy the QuickTips instance.
*/
destroy: function() {
}
},
-<span id='Ext-tip.QuickTipManager-method-enable'> /**
+<span id='Ext-tip-QuickTipManager-method-enable'> /**
</span> * Enable quick tips globally.
*/
enable : function(){
disabled = false;
},
-<span id='Ext-tip.QuickTipManager-method-disable'> /**
+<span id='Ext-tip-QuickTipManager-method-disable'> /**
</span> * Disable quick tips globally.
*/
disable : function(){
disabled = true;
},
-<span id='Ext-tip.QuickTipManager-method-isEnabled'> /**
+<span id='Ext-tip-QuickTipManager-method-isEnabled'> /**
</span> * Returns true if quick tips are enabled, else false.
* @return {Boolean}
*/
return tip !== undefined && !tip.disabled;
},
-<span id='Ext-tip.QuickTipManager-method-getQuickTip'> /**
+<span id='Ext-tip-QuickTipManager-method-getQuickTip'> /**
</span> * Gets the single {@link Ext.tip.QuickTip QuickTip} instance used to show tips from all registered elements.
* @return {Ext.tip.QuickTip}
*/
return tip;
},
-<span id='Ext-tip.QuickTipManager-method-register'> /**
+<span id='Ext-tip-QuickTipManager-method-register'> /**
</span> * Configures a new quick tip instance and assigns it to a target element. See
* {@link Ext.tip.QuickTip#register} for details.
* @param {Object} config The config object
tip.register.apply(tip, arguments);
},
-<span id='Ext-tip.QuickTipManager-method-unregister'> /**
+<span id='Ext-tip-QuickTipManager-method-unregister'> /**
</span> * Removes any registered quick tip from the target element and destroys it.
- * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+ * @param {String/HTMLElement/Ext.Element} el The element from which the quick tip is to be removed or ID of the element.
*/
unregister : function(){
tip.unregister.apply(tip, arguments);
},
-<span id='Ext-tip.QuickTipManager-method-tips'> /**
+<span id='Ext-tip-QuickTipManager-method-tips'> /**
</span> * Alias of {@link #register}.
* @param {Object} config The config object
*/
tip.register.apply(tip, arguments);
}
};
-}());</pre></pre></body></html>
\ No newline at end of file
+}());</pre>
+</body>
+</html>