QuickTips.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:6k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ /**
  2.  * @class Ext.QuickTips
  3.  * <p>Provides attractive and customizable tooltips for any element. The QuickTips
  4.  * singleton is used to configure and manage tooltips globally for multiple elements
  5.  * in a generic manner.  To create individual tooltips with maximum customizability,
  6.  * you should consider either {@link Ext.Tip} or {@link Ext.ToolTip}.</p>
  7.  * <p>Quicktips can be configured via tag attributes directly in markup, or by
  8.  * registering quick tips programmatically via the {@link #register} method.</p>
  9.  * <p>The singleton's instance of {@link Ext.QuickTip} is available via
  10.  * {@link #getQuickTip}, and supports all the methods, and all the all the
  11.  * configuration properties of Ext.QuickTip. These settings will apply to all
  12.  * tooltips shown by the singleton.</p>
  13.  * <p>Below is the summary of the configuration properties which can be used.
  14.  * For detailed descriptions see {@link #getQuickTip}</p>
  15.  * <p><b>QuickTips singleton configs (all are optional)</b></p>
  16.  * <div class="mdetail-params"><ul><li>dismissDelay</li>
  17.  * <li>hideDelay</li>
  18.  * <li>maxWidth</li>
  19.  * <li>minWidth</li>
  20.  * <li>showDelay</li>
  21.  * <li>trackMouse</li></ul></div>
  22.  * <p><b>Target element configs (optional unless otherwise noted)</b></p>
  23.  * <div class="mdetail-params"><ul><li>autoHide</li>
  24.  * <li>cls</li>
  25.  * <li>dismissDelay (overrides singleton value)</li>
  26.  * <li>target (required)</li>
  27.  * <li>text (required)</li>
  28.  * <li>title</li>
  29.  * <li>width</li></ul></div>
  30.  * <p>Here is an example showing how some of these config options could be used:</p>
  31.  * <pre><code>
  32. // Init the singleton.  Any tag-based quick tips will start working.
  33. Ext.QuickTips.init();
  34. // Apply a set of config properties to the singleton
  35. Ext.apply(Ext.QuickTips.getQuickTip(), {
  36.     maxWidth: 200,
  37.     minWidth: 100,
  38.     showDelay: 50,
  39.     trackMouse: true
  40. });
  41. // Manually register a quick tip for a specific element
  42. Ext.QuickTips.register({
  43.     target: 'my-div',
  44.     title: 'My Tooltip',
  45.     text: 'This tooltip was added in code',
  46.     width: 100,
  47.     dismissDelay: 20
  48. });
  49. </code></pre>
  50.  * <p>To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
  51.  * the <b>ext:</b> namespace.  The HTML element itself is automatically set as the quick tip target. Here is the summary
  52.  * of supported attributes (optional unless otherwise noted):</p>
  53.  * <ul><li><b>hide</b>: Specifying "user" is equivalent to setting autoHide = false.  Any other value will be the
  54.  * same as autoHide = true.</li>
  55.  * <li><b>qclass</b>: A CSS class to be applied to the quick tip (equivalent to the 'cls' target element config).</li>
  56.  * <li><b>qtip (required)</b>: The quick tip text (equivalent to the 'text' target element config).</li>
  57.  * <li><b>qtitle</b>: The quick tip title (equivalent to the 'title' target element config).</li>
  58.  * <li><b>qwidth</b>: The quick tip width (equivalent to the 'width' target element config).</li></ul>
  59.  * <p>Here is an example of configuring an HTML element to display a tooltip from markup:</p>
  60.  * <pre><code>
  61. // Add a quick tip to an HTML button
  62. &lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
  63.      ext:qtip="This is a quick tip from markup!">&lt;/input>
  64. </code></pre>
  65.  * @singleton
  66.  */
  67. Ext.QuickTips = function(){
  68.     var tip, locks = [];
  69.     return {
  70.         /**
  71.          * Initialize the global QuickTips instance and prepare any quick tips.
  72.          * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true) 
  73.          */
  74.         init : function(autoRender){
  75.             if(!tip){
  76.                 if(!Ext.isReady){
  77.                     Ext.onReady(function(){
  78.                         Ext.QuickTips.init(autoRender);
  79.                     });
  80.                     return;
  81.                 }
  82.                 tip = new Ext.QuickTip({elements:'header,body'});
  83.                 if(autoRender !== false){
  84.                     tip.render(Ext.getBody());
  85.                 }
  86.             }
  87.         },
  88.         /**
  89.          * Enable quick tips globally.
  90.          */
  91.         enable : function(){
  92.             if(tip){
  93.                 locks.pop();
  94.                 if(locks.length < 1){
  95.                     tip.enable();
  96.                 }
  97.             }
  98.         },
  99.         /**
  100.          * Disable quick tips globally.
  101.          */
  102.         disable : function(){
  103.             if(tip){
  104.                 tip.disable();
  105.             }
  106.             locks.push(1);
  107.         },
  108.         /**
  109.          * Returns true if quick tips are enabled, else false.
  110.          * @return {Boolean}
  111.          */
  112.         isEnabled : function(){
  113.             return tip !== undefined && !tip.disabled;
  114.         },
  115.         /**
  116.          * Gets the global QuickTips instance.
  117.          */
  118.         getQuickTip : function(){
  119.             return tip;
  120.         },
  121.         /**
  122.          * Configures a new quick tip instance and assigns it to a target element.  See
  123.          * {@link Ext.QuickTip#register} for details.
  124.          * @param {Object} config The config object
  125.          */
  126.         register : function(){
  127.             tip.register.apply(tip, arguments);
  128.         },
  129.         /**
  130.          * Removes any registered quick tip from the target element and destroys it.
  131.          * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
  132.          */
  133.         unregister : function(){
  134.             tip.unregister.apply(tip, arguments);
  135.         },
  136.         /**
  137.          * Alias of {@link #register}.
  138.          * @param {Object} config The config object
  139.          */
  140.         tips :function(){
  141.             tip.register.apply(tip, arguments);
  142.         }
  143.     }
  144. }();