const JC = require('jcc2d');
const stage = new JC.Stage({
  dom: 'canvas-stage',
});
const coinImg = 'https://jasonchen1982.github.io/jcc2d/examples/demo_animation_keyFrames2/images/img_3.png';

const coin = new JC.Sprite({
  texture: new JC.Texture(coinImg),
});
const timeline = coin.runners({
  runners: [
    { to: { x: 100, y: 200, rotation: 0, alpha: 0 }, ease: 'elasticIn' },
    { to: { x: -210, y: 300, rotation: 360, alpha: 1 }, ease: 'linear' },
    { to: { x: 99, y: -200, rotation: 200, }, ease: 'backIn' },
    { to: { x: 70, y: 140, rotation: -30, }, ease: 'linear' },
    { to: { x: 300, y: -10, rotation: 120, }, ease: 'bounceOut' },
    { to: { x: 150, y: -102, rotation:310, }, ease: 'elasticIn' },
    { to: { x: 70, y: 80, rotation: 700, }, ease: 'backIn' },
    { to: { x: 134, y: 12, rotation: 100, }, ease: 'bounceOut' },
    { to: { x: 210, y: 155, rotation: 0, alpha: 0 }, ease: 'backOut' },
  ],
  wait: 800,
});
stage.adds(coin);
stage.startEngine();
                

const data = require('./animation/data.json');
const JC = require('jcc2d');
const stage = new JC.Stage({
  dom: 'canvas-stage',
});
var ani = new JC.ParserAnimation({
  keyframes: data,
  // fr: 30,
  // infinite: true,
  // alternate: true,
});
stage.adds(ani.doc);
stage.startEngine();