@foblex/flow-animator
Version:
Animation library for @foblex/flow.
28 lines • 5 kB
JavaScript
import { animate, style } from '@angular/animations';
import { CreateConnectionOverlayHandler } from '../create-connection-overlay/create-connection-overlay.handler';
import { CreateConnectionOverlayRequest } from '../create-connection-overlay/create-connection-overlay-request';
import { Observable } from 'rxjs';
export class AnimateConnectionOverlayHandler {
constructor(animationBuilder) {
this.animationBuilder = animationBuilder;
}
handle(request) {
const overlayElement = new CreateConnectionOverlayHandler().handle(new CreateConnectionOverlayRequest(request.element));
const length = overlayElement.getTotalLength();
overlayElement.style.strokeDasharray = length + ' ' + length;
overlayElement.style.strokeDashoffset = String(length);
const animation = this.animationBuilder.build([
style({ strokeDashoffset: length }),
animate(request.duration + 'ms', style({ strokeDashoffset: 0 }))
]);
const player = animation.create(overlayElement);
return new Observable((observer) => {
player.onDone(() => {
observer.next(overlayElement);
observer.complete();
});
player.play();
});
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5pbWF0ZS1jb25uZWN0aW9uLW92ZXJsYXkuaGFuZGxlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2YtZmxvdy1hbmltYXRvci9zcmMvbGliL2FuaW1hdGUtY29ubmVjdGlvbi1vdmVybGF5L2FuaW1hdGUtY29ubmVjdGlvbi1vdmVybGF5LmhhbmRsZXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFFLE9BQU8sRUFBcUMsS0FBSyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDeEYsT0FBTyxFQUFFLDhCQUE4QixFQUFFLE1BQU0sZ0VBQWdFLENBQUM7QUFDaEgsT0FBTyxFQUFFLDhCQUE4QixFQUFFLE1BQU0sZ0VBQWdFLENBQUM7QUFDaEgsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUVsQyxNQUFNLE9BQU8sK0JBQStCO0lBRTFDLFlBQ1ksZ0JBQWtDO1FBQWxDLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7SUFFOUMsQ0FBQztJQUVNLE1BQU0sQ0FBQyxPQUF3QztRQUNwRCxNQUFNLGNBQWMsR0FBRyxJQUFJLDhCQUE4QixFQUFFLENBQUMsTUFBTSxDQUM5RCxJQUFJLDhCQUE4QixDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsQ0FDdEQsQ0FBQztRQUVGLE1BQU0sTUFBTSxHQUFHLGNBQWMsQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUMvQyxjQUFjLENBQUMsS0FBSyxDQUFDLGVBQWUsR0FBRyxNQUFNLEdBQUcsR0FBRyxHQUFHLE1BQU0sQ0FBQztRQUM3RCxjQUFjLENBQUMsS0FBSyxDQUFDLGdCQUFnQixHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUV2RCxNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsS0FBSyxDQUFDO1lBQzVDLEtBQUssQ0FBQyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sRUFBRSxDQUFDO1lBQ25DLE9BQU8sQ0FBQyxPQUFPLENBQUMsUUFBUSxHQUFHLElBQUksRUFBRSxLQUFLLENBQUMsRUFBRSxnQkFBZ0IsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1NBQ2pFLENBQUMsQ0FBQztRQUVILE1BQU0sTUFBTSxHQUFvQixTQUFTLENBQUMsTUFBTSxDQUFDLGNBQWMsQ0FBQyxDQUFDO1FBRWpFLE9BQU8sSUFBSSxVQUFVLENBQUMsQ0FBQyxRQUFRLEVBQUUsRUFBRTtZQUNqQyxNQUFNLENBQUMsTUFBTSxDQUFDLEdBQUcsRUFBRTtnQkFDakIsUUFBUSxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQztnQkFDOUIsUUFBUSxDQUFDLFFBQVEsRUFBRSxDQUFDO1lBQ3RCLENBQUMsQ0FBQyxDQUFDO1lBQ0gsTUFBTSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ2hCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztDQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQW5pbWF0ZUNvbm5lY3Rpb25PdmVybGF5UmVxdWVzdCB9IGZyb20gJy4vYW5pbWF0ZS1jb25uZWN0aW9uLW92ZXJsYXktcmVxdWVzdCc7XG5pbXBvcnQgeyBhbmltYXRlLCBBbmltYXRpb25CdWlsZGVyLCBBbmltYXRpb25QbGF5ZXIsIHN0eWxlIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQgeyBDcmVhdGVDb25uZWN0aW9uT3ZlcmxheUhhbmRsZXIgfSBmcm9tICcuLi9jcmVhdGUtY29ubmVjdGlvbi1vdmVybGF5L2NyZWF0ZS1jb25uZWN0aW9uLW92ZXJsYXkuaGFuZGxlcic7XG5pbXBvcnQgeyBDcmVhdGVDb25uZWN0aW9uT3ZlcmxheVJlcXVlc3QgfSBmcm9tICcuLi9jcmVhdGUtY29ubmVjdGlvbi1vdmVybGF5L2NyZWF0ZS1jb25uZWN0aW9uLW92ZXJsYXktcmVxdWVzdCc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XG5cbmV4cG9ydCBjbGFzcyBBbmltYXRlQ29ubmVjdGlvbk92ZXJsYXlIYW5kbGVyIHtcblxuICBjb25zdHJ1Y3RvcihcbiAgICAgIHByaXZhdGUgYW5pbWF0aW9uQnVpbGRlcjogQW5pbWF0aW9uQnVpbGRlcixcbiAgKSB7XG4gIH1cblxuICBwdWJsaWMgaGFuZGxlKHJlcXVlc3Q6IEFuaW1hdGVDb25uZWN0aW9uT3ZlcmxheVJlcXVlc3QpOiBPYnNlcnZhYmxlPFNWR1BhdGhFbGVtZW50PiB7XG4gICAgY29uc3Qgb3ZlcmxheUVsZW1lbnQgPSBuZXcgQ3JlYXRlQ29ubmVjdGlvbk92ZXJsYXlIYW5kbGVyKCkuaGFuZGxlKFxuICAgICAgICBuZXcgQ3JlYXRlQ29ubmVjdGlvbk92ZXJsYXlSZXF1ZXN0KHJlcXVlc3QuZWxlbWVudClcbiAgICApO1xuXG4gICAgY29uc3QgbGVuZ3RoID0gb3ZlcmxheUVsZW1lbnQuZ2V0VG90YWxMZW5ndGgoKTtcbiAgICBvdmVybGF5RWxlbWVudC5zdHlsZS5zdHJva2VEYXNoYXJyYXkgPSBsZW5ndGggKyAnICcgKyBsZW5ndGg7XG4gICAgb3ZlcmxheUVsZW1lbnQuc3R5bGUuc3Ryb2tlRGFzaG9mZnNldCA9IFN0cmluZyhsZW5ndGgpO1xuXG4gICAgY29uc3QgYW5pbWF0aW9uID0gdGhpcy5hbmltYXRpb25CdWlsZGVyLmJ1aWxkKFtcbiAgICAgIHN0eWxlKHsgc3Ryb2tlRGFzaG9mZnNldDogbGVuZ3RoIH0pLFxuICAgICAgYW5pbWF0ZShyZXF1ZXN0LmR1cmF0aW9uICsgJ21zJywgc3R5bGUoeyBzdHJva2VEYXNob2Zmc2V0OiAwIH0pKVxuICAgIF0pO1xuXG4gICAgY29uc3QgcGxheWVyOiBBbmltYXRpb25QbGF5ZXIgPSBhbmltYXRpb24uY3JlYXRlKG92ZXJsYXlFbGVtZW50KTtcblxuICAgIHJldHVybiBuZXcgT2JzZXJ2YWJsZSgob2JzZXJ2ZXIpID0+IHtcbiAgICAgIHBsYXllci5vbkRvbmUoKCkgPT4ge1xuICAgICAgICBvYnNlcnZlci5uZXh0KG92ZXJsYXlFbGVtZW50KTtcbiAgICAgICAgb2JzZXJ2ZXIuY29tcGxldGUoKTtcbiAgICAgIH0pO1xuICAgICAgcGxheWVyLnBsYXkoKTtcbiAgICB9KTtcbiAgfVxufVxuIl19