etro 0.10.1 → 0.12.0

package/dist/etro-iife.js

@@ -668,9 +668,11 @@ var etro = (function () {
                 _this._sourceStartTime = options.sourceStartTime || 0;
                 applyOptions(options, _this);
                 var load = function () {
-                    // TODO:              && ?
-                    if ((options.duration || (_this.source.duration - _this.sourceStartTime)) < 0) {
-                        throw new Error('Invalid options.duration or options.sourceStartTime');
+                    if (options.duration < 0) {
+                        throw new Error('Invalid options.duration. It must be a non-negative value.');
+                    }
+                    if (_this.sourceStartTime > _this.source.duration) {
+                        throw new Error('options.sourceStartTime cannot exceed options.source.duration');
                     }
                     _this._unstretchedDuration = options.duration || (_this.source.duration - _this.sourceStartTime);
                     _this.duration = _this._unstretchedDuration / (_this.playbackRate);
@@ -716,32 +718,15 @@ var etro = (function () {
                 _super.prototype.attach.call(this, movie);
                 // TODO: on unattach?
                 subscribe(movie, 'audiodestinationupdate', function (event) {
-                    // Connect to new destination if immediately connected to the existing
-                    // destination.
-                    if (_this._connectedToDestination) {
-                        _this.audioNode.disconnect(movie.actx.destination);
-                        _this.audioNode.connect(event.destination);
-                    }
+                    _this.audioNode.disconnect(_this._lastAudioDestination);
+                    _this.audioNode.connect(event.destination);
+                    _this._lastAudioDestination = event.destination;
                 });
                 // connect to audiocontext
                 this._audioNode = this.audioNode || movie.actx.createMediaElementSource(this.source);
-                // Spy on connect and disconnect to remember if it connected to
-                // actx.destination (for Movie#record).
-                var oldConnect = this._audioNode.connect.bind(this.audioNode);
-                this._audioNode.connect = function (destination, outputIndex, inputIndex) {
-                    _this._connectedToDestination = destination === movie.actx.destination;
-                    return oldConnect(destination, outputIndex, inputIndex);
-                };
-                var oldDisconnect = this._audioNode.disconnect.bind(this.audioNode);
-                this._audioNode.disconnect = function (destination, output, input) {
-                    if (_this._connectedToDestination &&
-                        destination === movie.actx.destination) {
-                        _this._connectedToDestination = false;
-                    }
-                    return oldDisconnect(destination, output, input);
-                };
                 // Connect to actx.destination by default (can be rewired by user)
                 this.audioNode.connect(movie.actx.destination);
+                this._lastAudioDestination = movie.actx.destination;
             };
             MixedAudioSource.prototype.detach = function () {
                 // Cache dest before super.detach() unsets this.movie
@@ -755,7 +740,12 @@ var etro = (function () {
             };
             MixedAudioSource.prototype.seek = function (time) {
                 _super.prototype.seek.call(this, time);
-                this.source.currentTime = this.currentTime + this.sourceStartTime;
+                if (isNaN(this.currentTime)) {
+                    this.source.currentTime = this.sourceStartTime;
+                }
+                else {
+                    this.source.currentTime = this.currentTime + this.sourceStartTime;
+                }
             };
             MixedAudioSource.prototype.render = function () {
                 _super.prototype.render.call(this);
@@ -1445,6 +1435,12 @@ var etro = (function () {
         return Image;
     }(VisualSourceMixin(Visual)));
 
+    var TextStrokePosition;
+    (function (TextStrokePosition) {
+        TextStrokePosition[TextStrokePosition["Inside"] = 0] = "Inside";
+        TextStrokePosition[TextStrokePosition["Center"] = 1] = "Center";
+        TextStrokePosition[TextStrokePosition["Outside"] = 2] = "Outside";
+    })(TextStrokePosition || (TextStrokePosition = {}));
     var Text = /** @class */ (function (_super) {
         __extends(Text, _super);
         /**
@@ -1469,6 +1465,7 @@ var etro = (function () {
             // this._prevMaxWidth = undefined;
         }
         Text.prototype.doRender = function () {
+            var _a, _b;
             _super.prototype.doRender.call(this);
             var text = val(this, 'text', this.currentTime);
             var font = val(this, 'font', this.currentTime);
@@ -1482,6 +1479,28 @@ var etro = (function () {
             this.cctx.textBaseline = val(this, 'textBaseline', this.currentTime);
             this.cctx.direction = val(this, 'textDirection', this.currentTime);
             this.cctx.fillText(text, val(this, 'textX', this.currentTime), val(this, 'textY', this.currentTime), maxWidth);
+            var textStroke = val(this, 'textStroke', this.currentTime);
+            if (textStroke) {
+                this.cctx.strokeStyle = textStroke.color;
+                this.cctx.lineWidth = (_a = textStroke.thickness) !== null && _a !== void 0 ? _a : 1;
+                var position = (_b = textStroke.position) !== null && _b !== void 0 ? _b : 'outer';
+                // Save the globalCompositeOperation, we have to revert it after stroking the text.
+                var globalCompositionOperation = this.cctx.globalCompositeOperation;
+                switch (position) {
+                    case TextStrokePosition.Inside:
+                        this.cctx.globalCompositeOperation = 'source-atop';
+                        this.cctx.lineWidth *= 2;
+                        break;
+                    case TextStrokePosition.Center:
+                        break;
+                    case TextStrokePosition.Outside:
+                        this.cctx.globalCompositeOperation = 'destination-over';
+                        this.cctx.lineWidth *= 2;
+                        break;
+                }
+                this.cctx.strokeText(text, val(this, 'textX', this.currentTime), val(this, 'textY', this.currentTime), maxWidth);
+                this.cctx.globalCompositeOperation = globalCompositionOperation;
+            }
             this._prevText = text;
             this._prevFont = font;
             this._prevMaxWidth = maxWidth;
@@ -1510,7 +1529,7 @@ var etro = (function () {
          * @deprecated See {@link https://github.com/etro-js/etro/issues/131}
          */
         Text.prototype.getDefaultOptions = function () {
-            return __assign(__assign({}, Visual.prototype.getDefaultOptions()), { background: null, text: undefined, font: '10px sans-serif', color: parseColor('#fff'), textX: 0, textY: 0, maxWidth: null, textAlign: 'start', textBaseline: 'top', textDirection: 'ltr' });
+            return __assign(__assign({}, Visual.prototype.getDefaultOptions()), { background: null, text: undefined, font: '10px sans-serif', color: parseColor('#fff'), textX: 0, textY: 0, maxWidth: null, textAlign: 'start', textBaseline: 'top', textDirection: 'ltr', textStroke: null });
         };
         return Text;
     }(Visual));
@@ -1548,6 +1567,7 @@ var etro = (function () {
         Base: Base,
         Image: Image,
         Text: Text,
+        get TextStrokePosition () { return TextStrokePosition; },
         Video: Video,
         VisualSourceMixin: VisualSourceMixin,
         Visual: Visual
@@ -2844,10 +2864,6 @@ var etro = (function () {
             // `render`). It's only valid while rendering.
             this._renderingFrame = false;
             this.currentTime = 0;
-            // The last time `play` was called, -1 works well in comparisons
-            this._lastPlayed = -1;
-            // What `currentTime` was when `play` was called
-            this._lastPlayedOffset = -1;
         }
         Movie.prototype._whenReady = function () {
             return __awaiter(this, void 0, void 0, function () {
@@ -2869,6 +2885,7 @@ var etro = (function () {
          *
          * @param [options]
          * @param [options.onStart] Called when the movie starts playing
+         * @param [options.duration] The duration of the movie to play in seconds
          *
          * @return Fulfilled when the movie is done playing, never fails
          */
@@ -2886,8 +2903,8 @@ var etro = (function () {
                                 throw new Error('Already playing');
                             }
                             this._paused = this._ended = false;
-                            this._lastPlayed = performance.now();
-                            this._lastPlayedOffset = this.currentTime;
+                            this._lastRealTime = performance.now();
+                            this._endTime = options.duration ? this.currentTime + options.duration : this.duration;
                             (_a = options.onStart) === null || _a === void 0 ? void 0 : _a.call(options);
                             // For backwards compatibility
                             publish(this, 'movie.play', {});
@@ -2895,15 +2912,19 @@ var etro = (function () {
                             return [4 /*yield*/, new Promise(function (resolve) {
                                     if (!_this.renderingFrame) {
                                         // Not rendering (and not playing), so play.
-                                        _this._render(true, undefined, resolve);
+                                        _this._render(undefined, resolve);
                                     }
                                     // Stop rendering frame if currently doing so, because playing has higher
                                     // priority. This will affect the next _render call.
                                     _this._renderingFrame = false;
-                                })];
+                                })
+                                // After we're done playing, clear the last timestamp
+                            ];
                         case 2:
                             // Repeatedly render frames until the movie ends
                             _b.sent();
+                            // After we're done playing, clear the last timestamp
+                            this._lastRealTime = undefined;
                             return [2 /*return*/];
                     }
                 });
@@ -2977,16 +2998,17 @@ var etro = (function () {
                             // Create the stream
                             this._currentStream = new MediaStream(tracks);
                             // Play the movie
-                            this._endTime = options.duration ? this.currentTime + options.duration : this.duration;
                             return [4 /*yield*/, this.play({
                                     onStart: function () {
                                         // Call the user's onStart callback
                                         options.onStart(_this._currentStream);
-                                    }
+                                    },
+                                    duration: options.duration
                                 })
                                 // Clear the stream after the movie is done playing
                             ];
                         case 2:
+                            // Play the movie
                             _a.sent();
                             // Clear the stream after the movie is done playing
                             this._currentStream.getTracks().forEach(function (track) {
@@ -3121,11 +3143,13 @@ var etro = (function () {
             return this;
         };
         /**
+         * Processes one frame of the movie and draws it to the canvas
+         *
          * @param [timestamp=performance.now()]
          * @param [done=undefined] - Called when done playing or when the current
          * frame is loaded
          */
-        Movie.prototype._render = function (repeat, timestamp, done) {
+        Movie.prototype._render = function (timestamp, done) {
             var _this = this;
             if (timestamp === void 0) { timestamp = performance.now(); }
             if (done === void 0) { done = undefined; }
@@ -3162,8 +3186,6 @@ var etro = (function () {
                     // value and publish a 'imeupdate' event.
                     this._currentTime = 0;
                     publish(this, 'movie.timeupdate', { movie: this });
-                    this._lastPlayed = performance.now();
-                    this._lastPlayedOffset = 0; // this.currentTime
                     this._renderingFrame = false;
                     // Stop playback or recording if done (except if it's playing and repeat
                     // is true)
@@ -3215,18 +3237,19 @@ var etro = (function () {
             }
             // TODO: Is making a new arrow function every frame bad for performance?
             window.requestAnimationFrame(function () {
-                _this._render(repeat, undefined, done);
+                _this._render(undefined, done);
             });
         };
         Movie.prototype._updateCurrentTime = function (timestampMs, end) {
             // If we're only frame-rendering (current frame only), it doesn't matter if
             // it's paused or not.
             if (!this._renderingFrame) {
-                var sinceLastPlayed = (timestampMs - this._lastPlayed) / 1000;
-                var currentTime = this._lastPlayedOffset + sinceLastPlayed;
-                if (this.currentTime !== currentTime) {
+                var timestamp = timestampMs / 1000;
+                var delta = timestamp - this._lastRealTime;
+                this._lastRealTime = timestamp;
+                if (delta > 0) {
                     // Update the current time (don't use setter)
-                    this._currentTime = currentTime;
+                    this._currentTime += delta;
                     // For backwards compatibility, publish a 'movie.timeupdate' event.
                     publish(this, 'movie.timeupdate', { movie: this });
                 }
@@ -3235,6 +3258,11 @@ var etro = (function () {
                 }
             }
         };
+        /**
+         * Draws the movie's background to the canvas
+         *
+         * @param timestamp The current high-resolution timestamp in milliseconds
+         */
         Movie.prototype._renderBackground = function (timestamp) {
             this.cctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
             // Evaluate background color (since it's a dynamic property)
@@ -3245,7 +3273,7 @@ var etro = (function () {
             }
         };
         /**
-         * @param [timestamp=performance.now()]
+         * Ticks all layers and renders them to the canvas
          */
         Movie.prototype._renderLayers = function () {
             for (var i = 0; i < this.layers.length; i++) {
@@ -3290,6 +3318,12 @@ var etro = (function () {
                 }
             }
         };
+        /**
+         * Applies all of the movie's effects to the canvas
+         *
+         * Note: This method only applies the movie's effects, not the layers'
+         * effects.
+         */
         Movie.prototype._applyEffects = function () {
             for (var i = 0; i < this.effects.length; i++) {
                 var effect = this.effects[i];
@@ -3316,7 +3350,7 @@ var etro = (function () {
             }
             return new Promise(function (resolve) {
                 _this._renderingFrame = true;
-                _this._render(false, undefined, resolve);
+                _this._render(undefined, resolve);
             });
         };
         /**
@@ -3365,7 +3399,7 @@ var etro = (function () {
              *
              * Calculated from the end time of the last layer
              */
-            // TODO: dirty flag?
+            // TODO: cache
             get: function () {
                 return this.layers.reduce(function (end, layer) { return Math.max(layer.startTime + layer.duration, end); }, 0);
             },
@@ -3374,6 +3408,7 @@ var etro = (function () {
         });
         /**
          * Convenience method for `layers.push()`
+         *
          * @param layer
          * @return The movie
          */
@@ -3383,6 +3418,7 @@ var etro = (function () {
         };
         /**
          * Convenience method for `effects.push()`
+         *
          * @param effect
          * @return the movie
          */

package/dist/layer/text.d.ts

@@ -1,5 +1,10 @@
 import { Dynamic, Color } from '../util';
 import { Visual, VisualOptions } from './visual';
+declare enum TextStrokePosition {
+    Inside = 0,
+    Center = 1,
+    Outside = 2
+}
 interface TextOptions extends VisualOptions {
     text: Dynamic<string>;
     font?: Dynamic<string>;
@@ -23,6 +28,11 @@ interface TextOptions extends VisualOptions {
      * @see [`CanvasRenderingContext2D#direction`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/textBaseline)
      */
     textDirection?: Dynamic<string>;
+    textStroke?: Dynamic<{
+        color: Color;
+        position?: TextStrokePosition;
+        thickness?: number;
+    }>;
 }
 declare class Text extends Visual {
     text: Dynamic<string>;
@@ -47,6 +57,11 @@ declare class Text extends Visual {
      * @see [`CanvasRenderingContext2D#direction`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/textBaseline)
      */
     textDirection: Dynamic<string>;
+    textStroke?: Dynamic<{
+        color: Color;
+        position?: TextStrokePosition;
+        thickness?: number;
+    }>;
     private _prevText;
     private _prevFont;
     private _prevMaxWidth;
@@ -60,4 +75,4 @@ declare class Text extends Visual {
      */
     getDefaultOptions(): TextOptions;
 }
-export { Text, TextOptions };
+export { Text, TextOptions, TextStrokePosition };

package/dist/movie/movie.d.ts

@@ -62,8 +62,8 @@ export declare class Movie {
     private _recording;
     private _currentStream;
     private _endTime;
-    private _lastPlayed;
-    private _lastPlayedOffset;
+    /** The timestamp last frame in seconds */
+    private _lastRealTime;
     /**
      * Creates a new movie.
      */
@@ -74,11 +74,13 @@ export declare class Movie {
      *
      * @param [options]
      * @param [options.onStart] Called when the movie starts playing
+     * @param [options.duration] The duration of the movie to play in seconds
      *
      * @return Fulfilled when the movie is done playing, never fails
      */
     play(options?: {
         onStart?: () => void;
+        duration?: number;
     }): Promise<void>;
     /**
      * Updates the rendering canvas and audio destination to the visible canvas
@@ -136,17 +138,30 @@ export declare class Movie {
      */
     stop(): Movie;
     /**
+     * Processes one frame of the movie and draws it to the canvas
+     *
      * @param [timestamp=performance.now()]
      * @param [done=undefined] - Called when done playing or when the current
      * frame is loaded
      */
     private _render;
     private _updateCurrentTime;
+    /**
+     * Draws the movie's background to the canvas
+     *
+     * @param timestamp The current high-resolution timestamp in milliseconds
+     */
     private _renderBackground;
     /**
-     * @param [timestamp=performance.now()]
+     * Ticks all layers and renders them to the canvas
      */
     private _renderLayers;
+    /**
+     * Applies all of the movie's effects to the canvas
+     *
+     * Note: This method only applies the movie's effects, not the layers'
+     * effects.
+     */
     private _applyEffects;
     /**
      * Refreshes the screen
@@ -180,12 +195,14 @@ export declare class Movie {
     get duration(): number;
     /**
      * Convenience method for `layers.push()`
+     *
      * @param layer
      * @return The movie
      */
     addLayer(layer: BaseLayer): Movie;
     /**
      * Convenience method for `effects.push()`
+     *
      * @param effect
      * @return the movie
      */

package/karma.conf.js

@@ -3,6 +3,12 @@
 
 process.env.CHROME_BIN = require('puppeteer').executablePath()
 
+// Make sure TEST_SUITE is set
+if (!process.env.TEST_SUITE) {
+  console.error('TEST_SUITE environment variable must be set')
+  process.exit(1)
+}
+
 module.exports = function (config) {
   config.set({
 
@@ -16,8 +22,8 @@ module.exports = function (config) {
     // list of files / patterns to load in the browser
     files: [
       'src/**/*.ts',
-      'spec/**/*.ts',
-      { pattern: 'spec/integration/assets/**/*', included: false }
+      `spec/${process.env.TEST_SUITE}/**/*.ts`,
+      { pattern: 'spec/assets/**/*', included: false }
     ],
 
     // list of files / patterns to exclude
@@ -57,7 +63,8 @@ module.exports = function (config) {
         base: 'Firefox',
         flags: ['-headless'],
         prefs: {
-          'network.proxy.type': 0
+          'network.proxy.type': 0,
+          'media.autoplay.default': 0  // Allow all autoplay
         }
       }
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "etro",
-  "version": "0.10.1",
+  "version": "0.12.0",
   "description": "An extendable video-editing framework for the browser",
   "browser": "dist/etro-cjs.js",
   "types": "dist/index.d.ts",
@@ -10,11 +10,14 @@
     "test": "spec"
   },
   "devDependencies": {
+    "@commitlint/cli": "^17.6.6",
+    "@commitlint/format": "^17.4.4",
     "@rollup/plugin-eslint": "^8.0.2",
     "@types/jest": "^29.0.0",
     "@typescript-eslint/eslint-plugin": "^5.30.7",
     "@typescript-eslint/parser": "^5.30.7",
     "canvas": "^2.11.2",
+    "cross-env": "^7.0.3",
     "docdash": "^1.1.1",
     "ecstatic": ">=4.1.3",
     "eslint": "^8.20.0",
@@ -25,7 +28,9 @@
     "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-standard": "^5.0.0",
     "ev": "0.0.7",
+    "gitmoji-cli": "^9.0.0",
     "http-server": "^14.1.1",
+    "husky": "^8.0.3",
     "jasmine": "^3.4.0",
     "jasmine-ts": "^0.4.0",
     "karma": "^6.1.1",
@@ -48,14 +53,17 @@
   "scripts": {
     "build": "rollup -c",
     "doc": "rm -rf docs && npx typedoc src/etro.ts --excludePrivate --readme none",
-    "assets": "git fetch origin example-assets:example-assets && git cherry-pick example-assets && git reset --soft HEAD^ && git reset HEAD examples/assets",
+    "prepare": "husky install",
     "effects": "node scripts/effect/save-effect-samples.js",
     "lint": "npm run --silent lint:main && npm run --silent lint:test && npm run --silent lint:examples",
-    "lint:main": "eslint -c eslint.typescript-conf.js --ext .ts --fix src",
-    "lint:test": "eslint -c eslint.test-conf.js --ext .ts --fix spec",
-    "lint:examples": "eslint -c eslint.example-conf.js --ext .html --fix examples",
+    "fix": "npm run --silent lint:main -- --fix && npm run --silent lint:test -- --fix && npm run --silent lint:examples -- --fix",
+    "lint:main": "eslint -c eslint.typescript-conf.js --ext .ts src",
+    "lint:test": "eslint -c eslint.test-conf.js --ext .ts spec",
+    "lint:examples": "eslint -c eslint.example-conf.js --ext .html examples",
     "start": "http-server",
-    "test": "karma start",
+    "test:unit": "cross-env TEST_SUITE=unit karma start",
+    "test:smoke": "cross-env TEST_SUITE=smoke karma start",
+    "test:integration": "cross-env TEST_SUITE=integration karma start",
     "release": "shipjs prepare"
   },
   "repository": {

package/scripts/effect/save-effect-samples.js

@@ -39,7 +39,7 @@ function createDirs(filePath) {
     // remove prefix and save to png
     const buffer = Buffer.from(item.data.replace(/^data:image\/png;base64,/, ''), 'base64')
     console.log(`writing ${item.path} ...`)
-    const path = projectDir + '/spec/integration/assets/effect/' + item.path
+    const path = projectDir + '/spec/assets/effect/' + item.path
     createDirs(path)
     fs.writeFileSync(path, buffer)
   })

package/ship.config.js

@@ -24,7 +24,18 @@ module.exports = {
     release.setDate(new Date()) // today
     const newChangelog = parsed.toString()
     fs.writeFileSync(changelogFile, newChangelog, 'utf8')
-  }
+  },
+  releases: [
+    {
+      extractChangelog: ({ version, dir }) => {
+        const changelogFile = `${dir}/CHANGELOG.md`
+        const changelog = fs.readFileSync(changelogFile, 'utf8')
+        const parsed = parser(changelog)
+        const release = parsed.findRelease(version)
+        return `${release.toString()}\n${release.getCompareLink()}`
+      },
+    }
+  ]
 }
 
 class Changelog {

package/src/layer/audio-source.ts

@@ -50,7 +50,7 @@ function AudioSourceMixin<OptionsSuperclass extends BaseOptions> (superclass: Co
     private _unstretchedDuration: number
     private _playbackRate: number
     private _initialized: boolean
-    private _connectedToDestination: boolean
+    private _lastAudioDestination: AudioNode
 
     /**
      * @param options
@@ -85,9 +85,12 @@ function AudioSourceMixin<OptionsSuperclass extends BaseOptions> (superclass: Co
       applyOptions(options, this)
 
       const load = () => {
-        // TODO:              && ?
-        if ((options.duration || (this.source.duration - this.sourceStartTime)) < 0) {
-          throw new Error('Invalid options.duration or options.sourceStartTime')
+        if (options.duration < 0) {
+          throw new Error('Invalid options.duration. It must be a non-negative value.')
+        }
+
+        if (this.sourceStartTime > this.source.duration) {
+          throw new Error('options.sourceStartTime cannot exceed options.source.duration')
         }
 
         this._unstretchedDuration = options.duration || (this.source.duration - this.sourceStartTime)
@@ -123,36 +126,18 @@ function AudioSourceMixin<OptionsSuperclass extends BaseOptions> (superclass: Co
 
       // TODO: on unattach?
       subscribe(movie, 'audiodestinationupdate', event => {
-        // Connect to new destination if immediately connected to the existing
-        // destination.
-        if (this._connectedToDestination) {
-          this.audioNode.disconnect(movie.actx.destination)
-          this.audioNode.connect(event.destination)
-        }
+        this.audioNode.disconnect(this._lastAudioDestination)
+        this.audioNode.connect(event.destination)
+
+        this._lastAudioDestination = event.destination
       })
 
       // connect to audiocontext
       this._audioNode = this.audioNode || movie.actx.createMediaElementSource(this.source)
 
-      // Spy on connect and disconnect to remember if it connected to
-      // actx.destination (for Movie#record).
-      const oldConnect = this._audioNode.connect.bind(this.audioNode)
-      this._audioNode.connect = <T extends AudioDestinationNode>(destination: T, outputIndex?: number, inputIndex?: number): AudioNode => {
-        this._connectedToDestination = destination === movie.actx.destination
-        return oldConnect(destination, outputIndex, inputIndex)
-      }
-      const oldDisconnect = this._audioNode.disconnect.bind(this.audioNode)
-      this._audioNode.disconnect = <T extends AudioDestinationNode>(destination?: T | number, output?: number, input?: number): AudioNode => {
-        if (this._connectedToDestination &&
-        destination === movie.actx.destination) {
-          this._connectedToDestination = false
-        }
-
-        return oldDisconnect(destination, output, input)
-      }
-
       // Connect to actx.destination by default (can be rewired by user)
       this.audioNode.connect(movie.actx.destination)
+      this._lastAudioDestination = movie.actx.destination
     }
 
     detach () {
@@ -170,7 +155,11 @@ function AudioSourceMixin<OptionsSuperclass extends BaseOptions> (superclass: Co
     seek (time: number): void {
       super.seek(time)
 
-      this.source.currentTime = this.currentTime + this.sourceStartTime
+      if (isNaN(this.currentTime)) {
+        this.source.currentTime = this.sourceStartTime
+      } else {
+        this.source.currentTime = this.currentTime + this.sourceStartTime
+      }
     }
 
     render () {