Spotlight.js
上传用户:dawnssy
上传日期:2022-08-06
资源大小:9345k
文件大小:4k
源码类别:

JavaScript

开发平台:

JavaScript

  1. /*!  * Ext JS Library 3.1.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ Ext.ux.Spotlight = function(config){
  2.     Ext.apply(this, config);
  3. }
  4. Ext.ux.Spotlight.prototype = {
  5.     active : false,
  6.     animate : true,
  7.     duration: .25,
  8.     easing:'easeNone',
  9.     // private
  10.     animated : false,
  11.     createElements : function(){
  12.         var bd = Ext.getBody();
  13.         this.right = bd.createChild({cls:'x-spotlight'});
  14.         this.left = bd.createChild({cls:'x-spotlight'});
  15.         this.top = bd.createChild({cls:'x-spotlight'});
  16.         this.bottom = bd.createChild({cls:'x-spotlight'});
  17.         this.all = new Ext.CompositeElement([this.right, this.left, this.top, this.bottom]);
  18.     },
  19.     show : function(el, callback, scope){
  20.         if(this.animated){
  21.             this.show.defer(50, this, [el, callback, scope]);
  22.             return;
  23.         }
  24.         this.el = Ext.get(el);
  25.         if(!this.right){
  26.             this.createElements();
  27.         }
  28.         if(!this.active){
  29.             this.all.setDisplayed('');
  30.             this.applyBounds(true, false);
  31.             this.active = true;
  32.             Ext.EventManager.onWindowResize(this.syncSize, this);
  33.             this.applyBounds(false, this.animate, false, callback, scope);
  34.         }else{
  35.             this.applyBounds(false, false, false, callback, scope); // all these booleans look hideous
  36.         }
  37.     },
  38.     hide : function(callback, scope){
  39.         if(this.animated){
  40.             this.hide.defer(50, this, [callback, scope]);
  41.             return;
  42.         }
  43.         Ext.EventManager.removeResizeListener(this.syncSize, this);
  44.         this.applyBounds(true, this.animate, true, callback, scope);
  45.     },
  46.     doHide : function(){
  47.         this.active = false;
  48.         this.all.setDisplayed(false);
  49.     },
  50.     syncSize : function(){
  51.         this.applyBounds(false, false);
  52.     },
  53.     applyBounds : function(basePts, anim, doHide, callback, scope){
  54.         var rg = this.el.getRegion();
  55.         var dw = Ext.lib.Dom.getViewWidth(true);
  56.         var dh = Ext.lib.Dom.getViewHeight(true);
  57.         var c = 0, cb = false;
  58.         if(anim){
  59.             cb = {
  60.                 callback: function(){
  61.                     c++;
  62.                     if(c == 4){
  63.                         this.animated = false;
  64.                         if(doHide){
  65.                             this.doHide();
  66.                         }
  67.                         Ext.callback(callback, scope, [this]);
  68.                     }
  69.                 },
  70.                 scope: this,
  71.                 duration: this.duration,
  72.                 easing: this.easing
  73.             };
  74.             this.animated = true;
  75.         }
  76.         this.right.setBounds(
  77.                 rg.right,
  78.                 basePts ? dh : rg.top,
  79.                 dw - rg.right,
  80.                 basePts ? 0 : (dh - rg.top),
  81.                 cb);
  82.         this.left.setBounds(
  83.                 0,
  84.                 0,
  85.                 rg.left,
  86.                 basePts ? 0 : rg.bottom,
  87.                 cb);
  88.         this.top.setBounds(
  89.                 basePts ? dw : rg.left,
  90.                 0,
  91.                 basePts ? 0 : dw - rg.left,
  92.                 rg.top,
  93.                 cb);
  94.         this.bottom.setBounds(
  95.                 0,
  96.                 rg.bottom,
  97.                 basePts ? 0 : rg.right,
  98.                 dh - rg.bottom,
  99.                 cb);
  100.         if(!anim){
  101.             if(doHide){
  102.                 this.doHide();
  103.             }
  104.             if(callback){
  105.                 Ext.callback(callback, scope, [this]);
  106.             }
  107.         }
  108.     },
  109.     destroy : function(){
  110.         this.doHide();
  111.         Ext.destroy(
  112.             this.right,
  113.             this.left,
  114.             this.top,
  115.             this.bottom);
  116.         delete this.el;
  117.         delete this.all;
  118.     }
  119. };
  120. //backwards compat
  121. Ext.Spotlight = Ext.ux.Spotlight;