-<!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-Shadow-method-constructor'><span id='Ext-Shadow'>/**
-</span></span> * @class Ext.Shadow
+<!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-Shadow'>/**
+</span> * @class Ext.Shadow
* Simple class that can provide a shadow effect for any element. Note that the element MUST be absolutely positioned,
* and the shadow does not provide any shimming. This should be used only in simple cases -- for more advanced
* functionality that can also provide the same shadow effect, see the {@link Ext.Layer} class.
- * @constructor
- * Create a new Shadow
- * @param {Object} config The config object
*/
Ext.define('Ext.Shadow', {
requires: ['Ext.ShadowPool'],
+<span id='Ext-Shadow-method-constructor'> /**
+</span> * Creates new Shadow.
+ * @param {Object} config (optional) Config object.
+ */
constructor: function(config) {
- Ext.apply(this, config);
- if (typeof this.mode != "string") {
- this.mode = this.defaultMode;
- }
- var offset = this.offset,
+ var me = this,
adjusts = {
h: 0
},
- rad = Math.floor(this.offset / 2);
-
- switch (this.mode.toLowerCase()) {
+ offset,
+ rad;
+
+ Ext.apply(me, config);
+ if (!Ext.isString(me.mode)) {
+ me.mode = me.defaultMode;
+ }
+ offset = me.offset;
+ rad = Math.floor(offset / 2);
+ me.opacity = 50;
+ switch (me.mode.toLowerCase()) {
// all this hideous nonsense calculates the various offsets for shadows
case "drop":
if (Ext.supports.CSS3BoxShadow) {
break;
}
}
- this.adjusts = adjusts;
+ me.adjusts = adjusts;
},
<span id='Ext-Shadow-cfg-mode'> /**
* </ul></div>
*/
<span id='Ext-Shadow-cfg-offset'> /**
-</span> * @cfg {String} offset
- * The number of pixels to offset the shadow from the element (defaults to <tt>4</tt>)
+</span> * @cfg {Number} offset
+ * The number of pixels to offset the shadow from the element
*/
offset: 4,
<span id='Ext-Shadow-method-show'> /**
</span> * Displays the shadow under the target element
- * @param {Mixed} targetEl The id or element under which the shadow should display
+ * @param {String/HTMLElement/Ext.Element} targetEl The id or element under which the shadow should display
*/
show: function(target) {
+ var me = this,
+ index;
+
target = Ext.get(target);
- if (!this.el) {
- this.el = Ext.ShadowPool.pull();
- if (this.el.dom.nextSibling != target.dom) {
- this.el.insertBefore(target);
+ if (!me.el) {
+ me.el = Ext.ShadowPool.pull();
+ if (me.el.dom.nextSibling != target.dom) {
+ me.el.insertBefore(target);
}
}
- this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10) - 1);
+ index = (parseInt(target.getStyle("z-index"), 10) - 1) || 0;
+ me.el.setStyle("z-index", me.zIndex || index);
if (Ext.isIE && !Ext.supports.CSS3BoxShadow) {
- this.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (this.offset) + ")";
+ me.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=" + me.opacity + ") progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (me.offset) + ")";
}
- this.realign(
+ me.realign(
target.getLeft(true),
target.getTop(true),
- target.getWidth(),
- target.getHeight()
+ target.dom.offsetWidth,
+ target.dom.offsetHeight
);
- this.el.dom.style.display = "block";
+ me.el.dom.style.display = "block";
},
<span id='Ext-Shadow-method-isVisible'> /**
</span> * Hides this shadow
*/
hide: function() {
- if (this.el) {
- this.el.dom.style.display = "none";
- Ext.ShadowPool.push(this.el);
- delete this.el;
+ var me = this;
+
+ if (me.el) {
+ me.el.dom.style.display = "none";
+ Ext.ShadowPool.push(me.el);
+ delete me.el;
}
},
if (this.el) {
this.el.setStyle("z-index", z);
}
+ },
+
+<span id='Ext-Shadow-method-setOpacity'> /**
+</span> * Sets the opacity of the shadow
+ * @param {Number} opacity The opacity
+ */
+ setOpacity: function(opacity){
+ if (this.el) {
+ if (Ext.isIE && !Ext.supports.CSS3BoxShadow) {
+ opacity = Math.floor(opacity * 100 / 2) / 100;
+ }
+ this.opacity = opacity;
+ this.el.setOpacity(opacity);
+ }
}
-});</pre></pre></body></html>
\ No newline at end of file
+});</pre>
+</body>
+</html>