source: trunk/web/addons/job_monarch/lib/extjs/source/widgets/Shadow.js @ 619

Last change on this file since 619 was 619, checked in by ramonb, 15 years ago

lib/:

  • added new AJAX dependancies: ExtJS, pChart, Lightbox2
File size: 6.2 KB
Line 
1/*
2 * Ext JS Library 2.2.1
3 * Copyright(c) 2006-2009, Ext JS, LLC.
4 * licensing@extjs.com
5 *
6 * http://extjs.com/license
7 */
8
9/**
10 * @class Ext.Shadow
11 * Simple class that can provide a shadow effect for any element.  Note that the element MUST be absolutely positioned,
12 * and the shadow does not provide any shimming.  This should be used only in simple cases -- for more advanced
13 * functionality that can also provide the same shadow effect, see the {@link Ext.Layer} class.
14 * @constructor
15 * Create a new Shadow
16 * @param {Object} config The config object
17 */
18Ext.Shadow = function(config){
19    Ext.apply(this, config);
20    if(typeof this.mode != "string"){
21        this.mode = this.defaultMode;
22    }
23    var o = this.offset, a = {h: 0};
24    var rad = Math.floor(this.offset/2);
25    switch(this.mode.toLowerCase()){ // all this hideous nonsense calculates the various offsets for shadows
26        case "drop":
27            a.w = 0;
28            a.l = a.t = o;
29            a.t -= 1;
30            if(Ext.isIE){
31                a.l -= this.offset + rad;
32                a.t -= this.offset + rad;
33                a.w -= rad;
34                a.h -= rad;
35                a.t += 1;
36            }
37        break;
38        case "sides":
39            a.w = (o*2);
40            a.l = -o;
41            a.t = o-1;
42            if(Ext.isIE){
43                a.l -= (this.offset - rad);
44                a.t -= this.offset + rad;
45                a.l += 1;
46                a.w -= (this.offset - rad)*2;
47                a.w -= rad + 1;
48                a.h -= 1;
49            }
50        break;
51        case "frame":
52            a.w = a.h = (o*2);
53            a.l = a.t = -o;
54            a.t += 1;
55            a.h -= 2;
56            if(Ext.isIE){
57                a.l -= (this.offset - rad);
58                a.t -= (this.offset - rad);
59                a.l += 1;
60                a.w -= (this.offset + rad + 1);
61                a.h -= (this.offset + rad);
62                a.h += 1;
63            }
64        break;
65    };
66
67    this.adjusts = a;
68};
69
70Ext.Shadow.prototype = {
71    /**
72     * @cfg {String} mode
73     * The shadow display mode.  Supports the following options:<br />
74     * sides: Shadow displays on both sides and bottom only<br />
75     * frame: Shadow displays equally on all four sides<br />
76     * drop: Traditional bottom-right drop shadow (default)
77     */
78    /**
79     * @cfg {String} offset
80     * The number of pixels to offset the shadow from the element (defaults to 4)
81     */
82    offset: 4,
83
84    // private
85    defaultMode: "drop",
86
87    /**
88     * Displays the shadow under the target element
89     * @param {Mixed} targetEl The id or element under which the shadow should display
90     */
91    show : function(target){
92        target = Ext.get(target);
93        if(!this.el){
94            this.el = Ext.Shadow.Pool.pull();
95            if(this.el.dom.nextSibling != target.dom){
96                this.el.insertBefore(target);
97            }
98        }
99        this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10)-1);
100        if(Ext.isIE){
101            this.el.dom.style.filter="progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius="+(this.offset)+")";
102        }
103        this.realign(
104            target.getLeft(true),
105            target.getTop(true),
106            target.getWidth(),
107            target.getHeight()
108        );
109        this.el.dom.style.display = "block";
110    },
111
112    /**
113     * Returns true if the shadow is visible, else false
114     */
115    isVisible : function(){
116        return this.el ? true : false; 
117    },
118
119    /**
120     * Direct alignment when values are already available. Show must be called at least once before
121     * calling this method to ensure it is initialized.
122     * @param {Number} left The target element left position
123     * @param {Number} top The target element top position
124     * @param {Number} width The target element width
125     * @param {Number} height The target element height
126     */
127    realign : function(l, t, w, h){
128        if(!this.el){
129            return;
130        }
131        var a = this.adjusts, d = this.el.dom, s = d.style;
132        var iea = 0;
133        s.left = (l+a.l)+"px";
134        s.top = (t+a.t)+"px";
135        var sw = (w+a.w), sh = (h+a.h), sws = sw +"px", shs = sh + "px";
136        if(s.width != sws || s.height != shs){
137            s.width = sws;
138            s.height = shs;
139            if(!Ext.isIE){
140                var cn = d.childNodes;
141                var sww = Math.max(0, (sw-12))+"px";
142                cn[0].childNodes[1].style.width = sww;
143                cn[1].childNodes[1].style.width = sww;
144                cn[2].childNodes[1].style.width = sww;
145                cn[1].style.height = Math.max(0, (sh-12))+"px";
146            }
147        }
148    },
149
150    /**
151     * Hides this shadow
152     */
153    hide : function(){
154        if(this.el){
155            this.el.dom.style.display = "none";
156            Ext.Shadow.Pool.push(this.el);
157            delete this.el;
158        }
159    },
160
161    /**
162     * Adjust the z-index of this shadow
163     * @param {Number} zindex The new z-index
164     */
165    setZIndex : function(z){
166        this.zIndex = z;
167        if(this.el){
168            this.el.setStyle("z-index", z);
169        }
170    }
171};
172
173// Private utility class that manages the internal Shadow cache
174Ext.Shadow.Pool = function(){
175    var p = [];
176    var markup = Ext.isIE ?
177                 '<div class="x-ie-shadow"></div>' :
178                 '<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';
179    return {
180        pull : function(){
181            var sh = p.shift();
182            if(!sh){
183                sh = Ext.get(Ext.DomHelper.insertHtml("beforeBegin", document.body.firstChild, markup));
184                sh.autoBoxAdjust = false;
185            }
186            return sh;
187        },
188
189        push : function(sh){
190            p.push(sh);
191        }
192    };
193}();
Note: See TracBrowser for help on using the repository browser.