diff --git a/packages/entity/traits/animated.js b/packages/entity/traits/animated.js index 2ca8528..8b0fa3b 100644 --- a/packages/entity/traits/animated.js +++ b/packages/entity/traits/animated.js @@ -35,6 +35,7 @@ class AnimatedBase extends Trait { this.frameSize = this.params.get('frameSize'); this.image = this.params.get('image'); this.frameCaret = this.frameRate; + this.loadSpriteImageIfPossible(); } get frameRect() { @@ -47,6 +48,17 @@ class AnimatedBase extends Trait { ]; } + loadSpriteImageIfPossible() { + if (!('container' in this.entity)) { + return; + } + Image.load(this.image).then((image) => { + this.sprite = new Sprite(image); + this.entity.container.addChild(this.sprite); + this.updateFrameRect(); + }); + } + updateFrameRect() { if (this.sprite) { this.sprite.sourceRectangle = this.frameRect; @@ -76,14 +88,7 @@ class AnimatedBase extends Trait { if ('graphical' !== trait.constructor.type()) { return; } - if (!this.entity.container.isValid) { - return; - } - Image.load(this.image).then((image) => { - this.sprite = new Sprite(image); - this.updateFrameRect(); - this.entity.container.addChild(this.sprite); - }); + this.loadSpriteImageIfPossible(); }, }; } diff --git a/packages/entity/traits/graphical.js b/packages/entity/traits/graphical.js index f920e46..f083fb0 100644 --- a/packages/entity/traits/graphical.js +++ b/packages/entity/traits/graphical.js @@ -1,5 +1,5 @@ import {compose} from '@avocado/core'; -import {Container} from '@avocado/graphics'; +import {hasGraphics, Container} from '@avocado/graphics'; import {simpleState, Trait} from '../trait'; @@ -20,7 +20,9 @@ class GraphicalBase extends Trait { constructor(...args) { super(...args); - this._container = new Container(); + if (hasGraphics) { + this._container = new Container(); + } } get container() { @@ -30,17 +32,17 @@ class GraphicalBase extends Trait { listeners() { const listeners = {}; const trackPosition = this.params.get('trackPosition'); - if (trackPosition && this._container.isValid) { + if (trackPosition && hasGraphics) { listeners.traitAdded = (trait) => { if ('positioned' === trait.constructor.type()) { - this._container.position = this.entity.position; + this.entity.container.position = this.entity.position; } }; listeners.xChanged = (x) => { - this._container.x = x; + this.entity.container.x = x; }; listeners.yChanged = (y) => { - this._container.y = y; + this.entity.container.y = y; }; } return listeners; diff --git a/packages/graphics/index.js b/packages/graphics/index.js index 3837017..953cbcd 100644 --- a/packages/graphics/index.js +++ b/packages/graphics/index.js @@ -5,3 +5,6 @@ export {Primitives} from './primitives'; export {Renderable} from './renderable'; export {Renderer} from './renderer'; export {Sprite} from './sprite'; + +const hasGraphics = 'undefined' !== typeof window; +export {hasGraphics}; diff --git a/packages/graphics/renderable.js b/packages/graphics/renderable.js index c8eb4b0..6f5906f 100644 --- a/packages/graphics/renderable.js +++ b/packages/graphics/renderable.js @@ -8,10 +8,6 @@ export class Renderable { this.internal.alpha = alpha; } - get isValid() { - return !!this.internal; - } - get position() { return [this.internal.x, this.internal.y]; }