How to use the ember-animated.Tween function in ember-animated

To help you get started, we’ve selected a few ember-animated examples, based on popular ways it is used in public projects.

github ember-animation / ember-animated / addon / motions / adjust-css.js View on Github external
*animate() {
    let { value: finalValue, unit } = this._splitUnit(this.sprite.finalComputedStyle[this.propertyName]);
    if (this.prior) {

      this.tween = new Tween(
        0,
        finalValue - this.prior.tween.finalValue,
        this.duration,
        this.opts.easing
      ).plus(this.prior.tween);
    } else {
      this.tween = new Tween(
        this._splitUnit(this.sprite.initialComputedStyle[this.propertyName]).value,
        finalValue,
        this.duration,
        this.opts.easing
      );
    }
    while (!this.tween.done) {
      this.sprite.applyStyles({
        [this.propertyName]: `${this.tween.currentValue}${unit}`
github ember-animation / ember-animated / addon / motions / adjust-css.js View on Github external
*animate() {
    let { value: finalValue, unit } = this._splitUnit(this.sprite.finalComputedStyle[this.propertyName]);
    if (this.prior) {

      this.tween = new Tween(
        0,
        finalValue - this.prior.tween.finalValue,
        this.duration,
        this.opts.easing
      ).plus(this.prior.tween);
    } else {
      this.tween = new Tween(
        this._splitUnit(this.sprite.initialComputedStyle[this.propertyName]).value,
        finalValue,
        this.duration,
        this.opts.easing
      );
    }
    while (!this.tween.done) {
      this.sprite.applyStyles({
        [this.propertyName]: `${this.tween.currentValue}${unit}`
      });
      yield rAF();
    }
  }
github ember-animation / ember-animated / addon / motions / move-svg.js View on Github external
*animate() {
    if (this.prior) {
      this.tween = new Tween(
        0,
        this.sprite.getFinalDimension(this.dimension) - this.prior.tween.finalValue,
        this.duration,
        this.opts.easing
      ).plus(this.prior.tween);
    } else {
      this.tween = new Tween(
        this.sprite.getInitialDimension(this.dimension),
        this.sprite.getFinalDimension(this.dimension),
        this.duration,
        this.opts.easing
      );
    }
    while (!this.tween.done) {
      this.sprite.element[this.dimension].baseVal.value = this.tween.currentValue;
      yield rAF();
github ember-animation / ember-animated / addon / motions / move-svg.js View on Github external
*animate() {
    if (this.prior) {
      this.tween = new Tween(
        0,
        this.sprite.getFinalDimension(this.dimension) - this.prior.tween.finalValue,
        this.duration,
        this.opts.easing
      ).plus(this.prior.tween);
    } else {
      this.tween = new Tween(
        this.sprite.getInitialDimension(this.dimension),
        this.sprite.getFinalDimension(this.dimension),
        this.duration,
        this.opts.easing
      );
    }
    while (!this.tween.done) {
      this.sprite.element[this.dimension].baseVal.value = this.tween.currentValue;
      yield rAF();
    }
  }
}