52 lines
1017 B
CoffeeScript
52 lines
1017 B
CoffeeScript
|
import React from 'react'
|
||
|
|
import PropTypes from 'prop-types';
|
||
|
|
|
||
|
|
import {AnimationView, Ticker} from '@avocado/timing'
|
||
|
|
class AnimationComponent extends React.Component
|
||
|
|
|
||
|
|
@defaultProps:
|
||
|
|
|
||
|
|
animation: null
|
||
|
|
image: null
|
||
|
|
|
||
|
|
isTicking: true
|
||
|
|
|
||
|
|
constructor: (props) ->
|
||
|
|
|
||
|
|
super props
|
||
|
|
|
||
|
|
@animationView = new AnimationView()
|
||
|
|
@animationView.on [
|
||
|
|
'animationChanged'
|
||
|
|
'imageChanged'
|
||
|
|
'sourceRectangleChanged'
|
||
|
|
], @tickContainer
|
||
|
|
|
||
|
|
@ticker = new Ticker.OutOfBand()
|
||
|
|
@ticker.on 'tick', (elapsed) => @props.animation?.tick elapsed
|
||
|
|
|
||
|
|
componentWillUnmount: ->
|
||
|
|
|
||
|
|
@animationView.off [
|
||
|
|
'animationChanged'
|
||
|
|
'imageChanged'
|
||
|
|
'sourceRectangleChanged'
|
||
|
|
], @tickContainer
|
||
|
|
|
||
|
|
@ticker.off 'tick'
|
||
|
|
@ticker.stop()
|
||
|
|
|
||
|
|
render: ->
|
||
|
|
|
||
|
|
# Side-effects.
|
||
|
|
@animationView.setAnimation @props.animation
|
||
|
|
@animationView.setImage @props.image
|
||
|
|
|
||
|
|
@props.setIntoContainer @animationView
|
||
|
|
|
||
|
|
return null
|
||
|
|
|
||
|
|
tickContainer: => @props.tickContainer()
|
||
|
|
|
||
|
|
export default AnimationComponent
|