<!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-draw-CompositeSprite'>/**
|
</span> * A composite Sprite handles a group of sprites with common methods to a sprite
|
* such as `hide`, `show`, `setAttributes`. These methods are applied to the set of sprites
|
* added to the group.
|
*
|
* CompositeSprite extends {@link Ext.util.MixedCollection} so you can use the same methods
|
* in `MixedCollection` to iterate through sprites, add and remove elements, etc.
|
*
|
* In order to create a CompositeSprite, one has to provide a handle to the surface where it is
|
* rendered:
|
*
|
* var group = Ext.create('Ext.draw.CompositeSprite', {
|
* surface: drawComponent.surface
|
* });
|
*
|
* Then just by using `MixedCollection` methods it's possible to add {@link Ext.draw.Sprite}s:
|
*
|
* group.add(sprite1);
|
* group.add(sprite2);
|
* group.add(sprite3);
|
*
|
* And then apply common Sprite methods to them:
|
*
|
* group.setAttributes({
|
* fill: '#f00'
|
* }, true);
|
*/
|
Ext.define('Ext.draw.CompositeSprite', {
|
|
/* Begin Definitions */
|
|
extend: 'Ext.util.MixedCollection',
|
mixins: {
|
animate: 'Ext.util.Animate'
|
},
|
<span id='Ext-draw-CompositeSprite-property-autoDestroy'> autoDestroy: false,
|
</span>
|
<span id='Ext-draw-CompositeSprite-property-isCompositeSprite'> /* End Definitions */
|
</span> isCompositeSprite: true,
|
<span id='Ext-draw-CompositeSprite-method-constructor'> constructor: function(config) {
|
</span> var me = this;
|
|
config = config || {};
|
Ext.apply(me, config);
|
|
me.addEvents(
|
<span id='Ext-draw-CompositeSprite-event-mousedown'> /**
|
</span> * @event
|
* @inheritdoc Ext.draw.Sprite#mousedown
|
*/
|
'mousedown',
|
<span id='Ext-draw-CompositeSprite-event-mouseup'> /**
|
</span> * @event
|
* @inheritdoc Ext.draw.Sprite#mouseup
|
*/
|
'mouseup',
|
<span id='Ext-draw-CompositeSprite-event-mouseover'> /**
|
</span> * @event
|
* @inheritdoc Ext.draw.Sprite#mouseover
|
*/
|
'mouseover',
|
<span id='Ext-draw-CompositeSprite-event-mouseout'> /**
|
</span> * @event
|
* @inheritdoc Ext.draw.Sprite#mouseout
|
*/
|
'mouseout',
|
<span id='Ext-draw-CompositeSprite-event-click'> /**
|
</span> * @event
|
* @inheritdoc Ext.draw.Sprite#click
|
*/
|
'click'
|
);
|
me.id = Ext.id(null, 'ext-sprite-group-');
|
me.callParent();
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-onClick'> // @private
|
</span> onClick: function(e) {
|
this.fireEvent('click', e);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-onMouseUp'> // @private
|
</span> onMouseUp: function(e) {
|
this.fireEvent('mouseup', e);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-onMouseDown'> // @private
|
</span> onMouseDown: function(e) {
|
this.fireEvent('mousedown', e);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-onMouseOver'> // @private
|
</span> onMouseOver: function(e) {
|
this.fireEvent('mouseover', e);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-onMouseOut'> // @private
|
</span> onMouseOut: function(e) {
|
this.fireEvent('mouseout', e);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-attachEvents'> attachEvents: function(o) {
|
</span> var me = this;
|
|
o.on({
|
scope: me,
|
mousedown: me.onMouseDown,
|
mouseup: me.onMouseUp,
|
mouseover: me.onMouseOver,
|
mouseout: me.onMouseOut,
|
click: me.onClick
|
});
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-add'> // Inherit docs from MixedCollection
|
</span> add: function(key, o) {
|
var result = this.callParent(arguments);
|
this.attachEvents(result);
|
return result;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-insert'> insert: function(index, key, o) {
|
</span> return this.callParent(arguments);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-remove'> // Inherit docs from MixedCollection
|
</span> remove: function(o) {
|
var me = this;
|
|
o.un({
|
scope: me,
|
mousedown: me.onMouseDown,
|
mouseup: me.onMouseUp,
|
mouseover: me.onMouseOver,
|
mouseout: me.onMouseOut,
|
click: me.onClick
|
});
|
return me.callParent(arguments);
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-getBBox'> /**
|
</span> * Returns the group bounding box.
|
* Behaves like {@link Ext.draw.Sprite#getBBox} method.
|
* @return {Object} an object with x, y, width, and height properties.
|
*/
|
getBBox: function() {
|
var i = 0,
|
sprite,
|
bb,
|
items = this.items,
|
len = this.length,
|
infinity = Infinity,
|
minX = infinity,
|
maxHeight = -infinity,
|
minY = infinity,
|
maxWidth = -infinity,
|
maxWidthBBox, maxHeightBBox;
|
|
for (; i < len; i++) {
|
sprite = items[i];
|
if (sprite.el && ! sprite.bboxExcluded) {
|
bb = sprite.getBBox();
|
minX = Math.min(minX, bb.x);
|
minY = Math.min(minY, bb.y);
|
maxHeight = Math.max(maxHeight, bb.height + bb.y);
|
maxWidth = Math.max(maxWidth, bb.width + bb.x);
|
}
|
}
|
|
return {
|
x: minX,
|
y: minY,
|
height: maxHeight - minY,
|
width: maxWidth - minX
|
};
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-setAttributes'> /**
|
</span> * Iterates through all sprites calling `setAttributes` on each one. For more information {@link Ext.draw.Sprite}
|
* provides a description of the attributes that can be set with this method.
|
* @param {Object} attrs Attributes to be changed on the sprite.
|
* @param {Boolean} redraw Flag to immediately draw the change.
|
* @return {Ext.draw.CompositeSprite} this
|
*/
|
setAttributes: function(attrs, redraw) {
|
var i = 0,
|
items = this.items,
|
len = this.length;
|
|
for (; i < len; i++) {
|
items[i].setAttributes(attrs, redraw);
|
}
|
return this;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-hide'> /**
|
</span> * Hides all sprites. If `true` is passed then a redraw will be forced for each sprite.
|
* @param {Boolean} redraw Flag to immediately draw the change.
|
* @return {Ext.draw.CompositeSprite} this
|
*/
|
hide: function(redraw) {
|
var i = 0,
|
items = this.items,
|
len = this.length;
|
|
for (; i < len; i++) {
|
items[i].hide(redraw);
|
}
|
return this;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-show'> /**
|
</span> * Shows all sprites. If `true` is passed then a redraw will be forced for each sprite.
|
* @param {Boolean} redraw Flag to immediately draw the change.
|
* @return {Ext.draw.CompositeSprite} this
|
*/
|
show: function(redraw) {
|
var i = 0,
|
items = this.items,
|
len = this.length;
|
|
for (; i < len; i++) {
|
items[i].show(redraw);
|
}
|
return this;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-redraw'> /**
|
</span> * Force redraw of all sprites.
|
*/
|
redraw: function() {
|
var me = this,
|
i = 0,
|
items = me.items,
|
surface = me.getSurface(),
|
len = me.length;
|
|
if (surface) {
|
for (; i < len; i++) {
|
surface.renderItem(items[i]);
|
}
|
}
|
return me;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-setStyle'> /**
|
</span> * Sets style for all sprites.
|
* @param {String} style CSS Style definition.
|
*/
|
setStyle: function(obj) {
|
var i = 0,
|
items = this.items,
|
len = this.length,
|
item, el;
|
|
for (; i < len; i++) {
|
item = items[i];
|
el = item.el;
|
if (el) {
|
el.setStyle(obj);
|
}
|
}
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-addCls'> /**
|
</span> * Adds class to all sprites.
|
* @param {String} cls CSS class name
|
*/
|
addCls: function(obj) {
|
var i = 0,
|
items = this.items,
|
surface = this.getSurface(),
|
len = this.length;
|
|
if (surface) {
|
for (; i < len; i++) {
|
surface.addCls(items[i], obj);
|
}
|
}
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-removeCls'> /**
|
</span> * Removes class from all sprites.
|
* @param {String} cls CSS class name
|
*/
|
removeCls: function(obj) {
|
var i = 0,
|
items = this.items,
|
surface = this.getSurface(),
|
len = this.length;
|
|
if (surface) {
|
for (; i < len; i++) {
|
surface.removeCls(items[i], obj);
|
}
|
}
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-getSurface'> /**
|
</span> * Grab the surface from the items
|
* @private
|
* @return {Ext.draw.Surface} The surface, null if not found
|
*/
|
getSurface: function(){
|
var first = this.first();
|
if (first) {
|
return first.surface;
|
}
|
return null;
|
},
|
|
<span id='Ext-draw-CompositeSprite-method-destroy'> /**
|
</span> * Destroys this CompositeSprite.
|
*/
|
destroy: function(){
|
var me = this,
|
surface = me.getSurface(),
|
destroySprites = me.autoDestroy,
|
item;
|
|
if (surface) {
|
while (me.getCount() > 0) {
|
item = me.first();
|
me.remove(item);
|
surface.remove(item, destroySprites);
|
}
|
}
|
me.clearListeners();
|
}
|
});
|
</pre>
|
</body>
|
</html>
|
