123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350 |
- <!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'
- },
- autoDestroy: false,
-
- /* End Definitions */
- isCompositeSprite: true,
- constructor: function(config) {
- 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();
- },
- // @private
- onClick: function(e) {
- this.fireEvent('click', e);
- },
- // @private
- onMouseUp: function(e) {
- this.fireEvent('mouseup', e);
- },
- // @private
- onMouseDown: function(e) {
- this.fireEvent('mousedown', e);
- },
- // @private
- onMouseOver: function(e) {
- this.fireEvent('mouseover', e);
- },
- // @private
- onMouseOut: function(e) {
- this.fireEvent('mouseout', e);
- },
- attachEvents: function(o) {
- var me = this;
-
- o.on({
- scope: me,
- mousedown: me.onMouseDown,
- mouseup: me.onMouseUp,
- mouseover: me.onMouseOver,
- mouseout: me.onMouseOut,
- click: me.onClick
- });
- },
- // Inherit docs from MixedCollection
- add: function(key, o) {
- var result = this.callParent(arguments);
- this.attachEvents(result);
- return result;
- },
- insert: function(index, key, o) {
- return this.callParent(arguments);
- },
- // Inherit docs from MixedCollection
- 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>
|