@coderline/alphatab 1.6.0-alpha.1405 → 1.6.0-alpha.1409

package/dist/alphaTab.core.mjs

@@ -1,5 +1,5 @@
 /*!
- * alphaTab v1.6.0-alpha.1405 (develop, build 1405)
+ * alphaTab v1.6.0-alpha.1409 (develop, build 1409)
  *
  * Copyright © 2025, Daniel Kuschny and Contributors, All rights reserved.
  *
@@ -22397,6 +22397,11 @@ class MidiFileSequencer {
             this._mainState.eventIndex = 0;
             this._mainState.syncPointIndex = 0;
             this._mainState.tempoChangeIndex = 0;
+            this._mainState.currentTempo = this._mainState.tempoChanges[0].bpm;
+            this._mainState.modifiedTempo =
+                this._mainState.syncPoints.length > 0
+                    ? this._mainState.syncPoints[0].data.modifiedTempo
+                    : this._mainState.currentTempo;
             if (this.isPlayingMain) {
                 const metronomeVolume = this._synthesizer.metronomeVolume;
                 this._synthesizer.noteOffAll(true);
@@ -22535,18 +22540,6 @@ class MidiFileSequencer {
             this._currentState.synthData[this._currentState.eventIndex].time < this._currentState.currentTime) {
             const synthEvent = this._currentState.synthData[this._currentState.eventIndex];
             this._synthesizer.dispatchEvent(synthEvent);
-            while (this._currentState.syncPointIndex < this._currentState.syncPoints.length &&
-                this._currentState.syncPoints[this._currentState.syncPointIndex].tick < synthEvent.event.tick) {
-                this._currentState.modifiedTempo =
-                    this._currentState.syncPoints[this._currentState.syncPointIndex].data.modifiedTempo;
-                this._currentState.syncPointIndex++;
-            }
-            while (this._currentState.tempoChangeIndex < this._currentState.tempoChanges.length &&
-                this._currentState.tempoChanges[this._currentState.tempoChangeIndex].time <= synthEvent.time) {
-                this._currentState.currentTempo =
-                    this._currentState.tempoChanges[this._currentState.tempoChangeIndex].bpm;
-                this._currentState.tempoChangeIndex++;
-            }
             this._currentState.eventIndex++;
             anyEventsDispatched = true;
         }
@@ -22576,9 +22569,6 @@ class MidiFileSequencer {
     mainTickPositionToTimePosition(tickPosition) {
         return this.tickPositionToTimePositionWithSpeed(this._mainState, tickPosition, this.playbackSpeed);
     }
-    mainTimePositionToTickPosition(timePosition) {
-        return this.timePositionToTickPositionWithSpeed(this._mainState, timePosition, this.playbackSpeed);
-    }
     mainUpdateSyncPoints(syncPoints) {
         const state = this._mainState;
         syncPoints.sort((a, b) => a.tick - b.tick); // just in case
@@ -22606,7 +22596,49 @@ class MidiFileSequencer {
         state.syncPointIndex = 0;
     }
     currentTimePositionToTickPosition(timePosition) {
-        return this.timePositionToTickPositionWithSpeed(this._currentState, timePosition, this.playbackSpeed);
+        const state = this._currentState;
+        if (state.tempoChanges.length === 0) {
+            return 0;
+        }
+        timePosition *= this.playbackSpeed;
+        this.updateCurrentTempo(state, timePosition);
+        const lastTempoChange = state.tempoChanges[state.tempoChangeIndex];
+        const timeDiff = timePosition - lastTempoChange.time;
+        const ticks = ((timeDiff / (60000.0 / (lastTempoChange.bpm * state.division))) | 0);
+        // we add 1 for possible rounding errors.(floating point issuses)
+        return lastTempoChange.ticks + ticks + 1;
+    }
+    updateCurrentTempo(state, timePosition) {
+        let tempoChangeIndex = state.tempoChangeIndex;
+        if (timePosition < state.tempoChanges[tempoChangeIndex].time) {
+            tempoChangeIndex = 0;
+        }
+        while (tempoChangeIndex + 1 < state.tempoChanges.length &&
+            state.tempoChanges[tempoChangeIndex + 1].time <= timePosition) {
+            tempoChangeIndex++;
+        }
+        if (tempoChangeIndex !== state.tempoChangeIndex) {
+            state.tempoChangeIndex = tempoChangeIndex;
+            state.currentTempo = state.tempoChanges[state.tempoChangeIndex].bpm;
+        }
+        const syncPoints = state.syncPoints;
+        if (syncPoints.length > 0) {
+            let syncPointIndex = Math.min(state.syncPointIndex, syncPoints.length - 1);
+            if (timePosition < syncPoints[syncPointIndex].data.millisecondOffset) {
+                syncPointIndex = 0;
+            }
+            while (syncPointIndex + 1 < syncPoints.length &&
+                syncPoints[syncPointIndex + 1].data.millisecondOffset <= timePosition) {
+                syncPointIndex++;
+            }
+            if (syncPointIndex !== state.syncPointIndex) {
+                state.syncPointIndex = syncPointIndex;
+                state.modifiedTempo = syncPoints[syncPointIndex].data.modifiedTempo;
+            }
+        }
+        else {
+            state.modifiedTempo = state.currentTempo;
+        }
     }
     mainTimePositionFromBackingTrack(timePosition, backingTrackLength) {
         const mainState = this._mainState;
@@ -22614,11 +22646,8 @@ class MidiFileSequencer {
         if (timePosition < 0 || syncPoints.length === 0) {
             return timePosition;
         }
-        let syncPointIndex = timePosition >= syncPoints[mainState.syncPointIndex].data.millisecondOffset ? mainState.syncPointIndex : 0;
-        while (syncPointIndex + 1 < syncPoints.length &&
-            syncPoints[syncPointIndex + 1].data.millisecondOffset <= timePosition) {
-            syncPointIndex++;
-        }
+        this.updateCurrentTempo(this._mainState, timePosition);
+        const syncPointIndex = Math.min(mainState.syncPointIndex, syncPoints.length - 1);
         const currentSyncPoint = syncPoints[syncPointIndex];
         const timeDiff = timePosition - currentSyncPoint.data.millisecondOffset;
         let alphaTabTimeDiff;
@@ -22640,7 +22669,10 @@ class MidiFileSequencer {
             return timePosition;
         }
         timePosition *= this.playbackSpeed;
-        let syncPointIndex = timePosition >= syncPoints[mainState.syncPointIndex].time ? mainState.syncPointIndex : 0;
+        let syncPointIndex = Math.min(mainState.syncPointIndex, syncPoints.length - 1);
+        if (timePosition < syncPoints[syncPointIndex].time) {
+            syncPointIndex = 0;
+        }
         while (syncPointIndex + 1 < syncPoints.length && syncPoints[syncPointIndex + 1].time <= timePosition) {
             syncPointIndex++;
         }
@@ -22678,26 +22710,6 @@ class MidiFileSequencer {
         timePosition += tickPosition * (60000.0 / (bpm * state.division));
         return timePosition / playbackSpeed;
     }
-    timePositionToTickPositionWithSpeed(state, timePosition, playbackSpeed) {
-        timePosition *= playbackSpeed;
-        let ticks = 0;
-        let bpm = 120.0;
-        let lastChange = 0;
-        // find start and bpm of last tempo change before time
-        for (const c of state.tempoChanges) {
-            if (timePosition < c.time) {
-                break;
-            }
-            ticks = c.ticks;
-            bpm = c.bpm;
-            lastChange = c.time;
-        }
-        // add the missing ticks
-        timePosition -= lastChange;
-        ticks += (timePosition / (60000.0 / (bpm * state.division))) | 0;
-        // we add 1 for possible rounding errors.(floating point issuses)
-        return ticks + 1;
-    }
     get internalEndTime() {
         if (this.isPlayingMain) {
             return !this.mainPlaybackRange ? this._currentState.endTime : this._currentState.playbackRangeEndTime;
@@ -26916,7 +26928,7 @@ class TinySoundFont {
         return processedEvents;
     }
     processMidiMessage(e) {
-        Logger.debug('Midi', `Processing Midi message ${MidiEventType[e.type]}/${e.tick}`);
+        //Logger.debug('Midi', `Processing Midi message ${MidiEventType[e.type]}/${e.tick}`);
         const command = e.type;
         switch (command) {
             case MidiEventType.TimeSignature:
@@ -28037,6 +28049,9 @@ class EventEmitter {
     }
     on(value) {
         this._listeners.push(value);
+        return () => {
+            this.off(value);
+        };
     }
     off(value) {
         this._listeners = this._listeners.filter(l => l !== value);
@@ -28056,6 +28071,9 @@ class EventEmitterOfT {
     }
     on(value) {
         this._listeners.push(value);
+        return () => {
+            this.off(value);
+        };
     }
     off(value) {
         this._listeners = this._listeners.filter(l => l !== value);
@@ -28452,7 +28470,7 @@ class AlphaSynthBase {
             endTick = this.sequencer.currentEndTick;
         }
         if (this._tickPosition >= endTick) {
-            // fully done with playback of remaining samples? 
+            // fully done with playback of remaining samples?
             if (this._notPlayedSamples <= 0) {
                 this._notPlayedSamples = 0;
                 if (this.sequencer.isPlayingCountIn) {
@@ -35802,6 +35820,27 @@ class MidiFileGenerator {
             controller.moveNext();
             previousMasterBar = bar;
         }
+        // here we interpolate the sync point which marks the end of the sync.
+        // Sync points define new tempos at certain positions.
+        // looking from the last sync point to the end we do not assume the end where the audio ends,
+        // but where it ends according to the BPM and the remaining ticks.
+        if (this.syncPoints.length > 0) {
+            const lastSyncPoint = this.syncPoints[this.syncPoints.length - 1];
+            const endTick = controller.currentTick;
+            const remainingTicks = endTick - lastSyncPoint.tick;
+            if (remainingTicks > 0) {
+                const syncPointData = new SyncPointData();
+                // last occurence of the last bar
+                syncPointData.barOccurence = barOccurence.get(this._score.masterBars.length - 1);
+                // same tempo as last point
+                syncPointData.modifiedTempo = lastSyncPoint.data.modifiedTempo;
+                // interpolated end from last syncPoint
+                syncPointData.millisecondOffset =
+                    lastSyncPoint.data.millisecondOffset +
+                        MidiUtils.ticksToMillis(remainingTicks, syncPointData.modifiedTempo);
+                this.syncPoints.push(new BackingTrackSyncPoint(endTick, syncPointData));
+            }
+        }
         for (const track of this._score.tracks) {
             this._handler.finishTrack(track.index, controller.currentTick);
         }
@@ -38293,6 +38332,270 @@ class ExternalMediaPlayer extends BackingTrackPlayer {
     }
 }
 
+/**
+ * A {@link IAlphaSynth} implementation wrapping and underling other {@link IAlphaSynth}
+ * allowing dynamic changing of the underlying instance without loosing aspects like the
+ * main playback information and event listeners.
+ *
+ * @remarks
+ * This wrapper is used when re-exposing the underlying player via {@link AlphaTabApiBase} to integrators.
+ * Even with dynamic switching between synthesizer, backing tracks etc. aspects like volume, playbackspeed,
+ * event listeners etc. should not be lost.
+ */
+class AlphaSynthWrapper {
+    constructor() {
+        // relevant state information we want to remember when switching between player instances
+        this._masterVolume = 1;
+        this._metronomeVolume = 0;
+        this._countInVolume = 0;
+        this._playbackSpeed = 1;
+        this._isLooping = false;
+        this._midiEventsPlayedFilter = [];
+        this.ready = new EventEmitter();
+        this.readyForPlayback = new EventEmitter();
+        this.finished = new EventEmitter();
+        this.soundFontLoaded = new EventEmitter();
+        this.soundFontLoadFailed = new EventEmitterOfT();
+        this.midiLoaded = new EventEmitterOfT();
+        this.midiLoadFailed = new EventEmitterOfT();
+        this.stateChanged = new EventEmitterOfT();
+        this.positionChanged = new EventEmitterOfT();
+        this.midiEventsPlayed = new EventEmitterOfT();
+        this.playbackRangeChanged = new EventEmitterOfT();
+    }
+    get instance() {
+        return this._instance;
+    }
+    set instance(value) {
+        this._instance = value;
+        // unregister all events from previous instance
+        const unregister = this._instanceEventUnregister;
+        if (unregister) {
+            for (const e of unregister) {
+                e();
+            }
+        }
+        if (value) {
+            // regsiter to events of new player and forward them to existing listeners
+            const newUnregister = [];
+            newUnregister.push(value.ready.on(() => this.ready.trigger()));
+            newUnregister.push(value.readyForPlayback.on(() => this.readyForPlayback.trigger()));
+            newUnregister.push(value.finished.on(() => this.finished.trigger()));
+            newUnregister.push(value.soundFontLoaded.on(() => this.soundFontLoaded.trigger()));
+            newUnregister.push(value.soundFontLoadFailed.on(e => this.soundFontLoadFailed.trigger(e)));
+            newUnregister.push(value.midiLoaded.on(e => this.midiLoaded.trigger(e)));
+            newUnregister.push(value.midiLoadFailed.on(e => this.midiLoadFailed.trigger(e)));
+            newUnregister.push(value.stateChanged.on(e => this.stateChanged.trigger(e)));
+            newUnregister.push(value.positionChanged.on(e => this.positionChanged.trigger(e)));
+            newUnregister.push(value.midiEventsPlayed.on(e => this.midiEventsPlayed.trigger(e)));
+            newUnregister.push(value.playbackRangeChanged.on(e => this.playbackRangeChanged.trigger(e)));
+            this._instanceEventUnregister = newUnregister;
+            // restore state on new player
+            if (this.isReady) {
+                value.masterVolume = this._masterVolume;
+                value.metronomeVolume = this._metronomeVolume;
+                value.countInVolume = this._countInVolume;
+                value.playbackSpeed = this._playbackSpeed;
+                value.isLooping = this._isLooping;
+                value.midiEventsPlayedFilter = this._midiEventsPlayedFilter;
+            }
+            else {
+                newUnregister.push(value.ready.on(() => {
+                    value.masterVolume = this._masterVolume;
+                    value.metronomeVolume = this._metronomeVolume;
+                    value.countInVolume = this._countInVolume;
+                    value.playbackSpeed = this._playbackSpeed;
+                    value.isLooping = this._isLooping;
+                    value.midiEventsPlayedFilter = this._midiEventsPlayedFilter;
+                }));
+            }
+        }
+        else {
+            this._instanceEventUnregister = undefined;
+        }
+    }
+    get output() {
+        return this._instance.output;
+    }
+    get isReady() {
+        return this._instance ? this._instance.isReady : false;
+    }
+    get isReadyForPlayback() {
+        return this._instance ? this._instance.isReadyForPlayback : false;
+    }
+    get state() {
+        return this._instance ? this._instance.state : PlayerState.Paused;
+    }
+    get logLevel() {
+        return Logger.logLevel;
+    }
+    set logLevel(value) {
+        Logger.logLevel = value;
+        if (this._instance) {
+            this._instance.logLevel = value;
+        }
+    }
+    get masterVolume() {
+        return this._masterVolume;
+    }
+    set masterVolume(value) {
+        value = Math.max(value, SynthConstants.MinVolume);
+        this._masterVolume = value;
+        if (this._instance) {
+            this._instance.masterVolume = value;
+        }
+    }
+    get metronomeVolume() {
+        return this._metronomeVolume;
+    }
+    set metronomeVolume(value) {
+        value = Math.max(value, SynthConstants.MinVolume);
+        this._metronomeVolume = value;
+        if (this._instance) {
+            this._instance.metronomeVolume = value;
+        }
+    }
+    get playbackSpeed() {
+        return this._playbackSpeed;
+    }
+    set playbackSpeed(value) {
+        this._playbackSpeed = value;
+        if (this._instance) {
+            this._instance.playbackSpeed = value;
+        }
+    }
+    get tickPosition() {
+        return this._instance ? this._instance.tickPosition : 0;
+    }
+    set tickPosition(value) {
+        if (this._instance) {
+            this._instance.tickPosition = value;
+        }
+    }
+    get timePosition() {
+        return this._instance ? this._instance.timePosition : 0;
+    }
+    set timePosition(value) {
+        if (this._instance) {
+            this._instance.timePosition = value;
+        }
+    }
+    get playbackRange() {
+        return this._instance ? this._instance.playbackRange : null;
+    }
+    set playbackRange(value) {
+        if (this._instance) {
+            this._instance.playbackRange = value;
+        }
+    }
+    get isLooping() {
+        return this._isLooping;
+    }
+    set isLooping(value) {
+        this._isLooping = value;
+        if (this._instance) {
+            this._instance.isLooping = value;
+        }
+    }
+    get countInVolume() {
+        return this._countInVolume;
+    }
+    set countInVolume(value) {
+        this._countInVolume = value;
+        if (this._instance) {
+            this._instance.countInVolume = value;
+        }
+    }
+    get midiEventsPlayedFilter() {
+        return this._midiEventsPlayedFilter;
+    }
+    set midiEventsPlayedFilter(value) {
+        this._midiEventsPlayedFilter = value;
+        if (this._instance) {
+            this._instance.midiEventsPlayedFilter = value;
+        }
+    }
+    destroy() {
+        if (this._instance) {
+            this._instance.destroy();
+            this._instance = undefined;
+        }
+    }
+    play() {
+        return this._instance ? this._instance.play() : false;
+    }
+    pause() {
+        if (this._instance) {
+            this._instance.pause();
+        }
+    }
+    playPause() {
+        if (this._instance) {
+            this._instance.playPause();
+        }
+    }
+    stop() {
+        if (this._instance) {
+            this._instance.stop();
+        }
+    }
+    playOneTimeMidiFile(midi) {
+        if (this._instance) {
+            this._instance.playOneTimeMidiFile(midi);
+        }
+    }
+    loadSoundFont(data, append) {
+        if (this._instance) {
+            this._instance.loadSoundFont(data, append);
+        }
+    }
+    resetSoundFonts() {
+        if (this._instance) {
+            this._instance.resetSoundFonts();
+        }
+    }
+    loadMidiFile(midi) {
+        if (this._instance) {
+            this._instance.loadMidiFile(midi);
+        }
+    }
+    loadBackingTrack(score, syncPoints) {
+        if (this._instance) {
+            this._instance.loadBackingTrack(score, syncPoints);
+        }
+    }
+    applyTranspositionPitches(transpositionPitches) {
+        if (this._instance) {
+            this._instance.applyTranspositionPitches(transpositionPitches);
+        }
+    }
+    setChannelTranspositionPitch(channel, semitones) {
+        if (this._instance) {
+            this._instance.setChannelTranspositionPitch(channel, semitones);
+        }
+    }
+    setChannelMute(channel, mute) {
+        if (this._instance) {
+            this._instance.setChannelMute(channel, mute);
+        }
+    }
+    resetChannelStates() {
+        if (this._instance) {
+            this._instance.resetChannelStates();
+        }
+    }
+    setChannelSolo(channel, solo) {
+        if (this._instance) {
+            this._instance.setChannelSolo(channel, solo);
+        }
+    }
+    setChannelVolume(channel, volume) {
+        if (this._instance) {
+            this._instance.setChannelVolume(channel, volume);
+        }
+    }
+}
+
 class SelectionInfo {
     constructor(beat) {
         this.bounds = null;
@@ -38383,43 +38686,13 @@ class AlphaTabApiBase {
         this._tracks = [];
         this._actualPlayerMode = PlayerMode.Disabled;
         this._tickCache = null;
-        /**
-         * The alphaSynth player used for playback.
-         * @remarks
-         * This is the low-level API to the Midi synthesizer used for playback.
-         * Gets access to the underling {@link IAlphaSynth} that is used for the audio playback.
-         * @category Properties - Player
-         * @since 0.9.4
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * setupPlayerEvents(api.settings);
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * SetupPlayerEvents(api.Player);
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * setupPlayerEvents(api.player)
-         * ```
-         */
-        this.player = null;
         this._cursorWrapper = null;
         this._barCursor = null;
         this._beatCursor = null;
         this._selectionWrapper = null;
         this._previousTick = 0;
-        this._playerState = PlayerState.Paused;
         this._currentBeat = null;
-        this._currentBarBounds = null;
+        this._currentBeatBounds = null;
         this._previousStateForCursor = PlayerState.Paused;
         this._previousCursorCache = null;
         this._lastScroll = 0;
@@ -38990,133 +39263,6 @@ class AlphaTabApiBase {
          *
          */
         this.error = new EventEmitterOfT();
-        /**
-         * This event is fired when all required data for playback is loaded and ready.
-         * @remarks
-         * This event is fired when all required data for playback is loaded and ready. The player is ready for playback when
-         * all background workers are started, the audio output is initialized, a soundfont is loaded, and a song was loaded into the player as midi file.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 0.9.4
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.playerReady.on(() => {
-         *     enablePlayerControls();
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.PlayerReady.On(() =>
-         * {
-         *     EnablePlayerControls()
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * api.playerReady.on {
-         *     enablePlayerControls()
-         * }
-         * ```
-         */
-        this.playerReady = new EventEmitter();
-        /**
-         * This event is fired when the playback of the whole song finished.
-         * @remarks
-         * This event is finished regardless on whether looping is enabled or not.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 0.9.4
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.playerFinished.on((args) => {
-         *     // speed trainer
-         *     api.playbackSpeed = Math.min(1.0, api.playbackSpeed + 0.1);
-         * });
-         * api.isLooping = true;
-         * api.playbackSpeed = 0.5;
-         * api.play()
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.PlayerFinished.On(() =>
-         * {
-         *     // speed trainer
-         *     api.PlaybackSpeed = Math.Min(1.0, api.PlaybackSpeed + 0.1);
-         * });
-         * api.IsLooping = true;
-         * api.PlaybackSpeed = 0.5;
-         * api.Play();
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * api.playerFinished.on {
-         *     // speed trainer
-         *     api.playbackSpeed = min(1.0, api.playbackSpeed + 0.1);
-         * }
-         * api.isLooping = true
-         * api.playbackSpeed = 0.5
-         * api.play()
-         * ```
-         *
-         */
-        this.playerFinished = new EventEmitter();
-        /**
-         * This event is fired when the SoundFont needed for playback was loaded.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 0.9.4
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.soundFontLoaded.on(() => {
-         *     hideSoundFontLoadingIndicator();
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.SoundFontLoaded.On(() =>
-         * {
-         *     HideSoundFontLoadingIndicator();
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...);
-         * api.soundFontLoaded.on {
-         *     hideSoundFontLoadingIndicator();
-         * }
-         * ```
-         *
-         */
-        this.soundFontLoaded = new EventEmitter();
         /**
          * This event is fired when a Midi file is being loaded.
          *
@@ -39204,213 +39350,6 @@ class AlphaTabApiBase {
          *
          */
         this.midiLoaded = new EventEmitterOfT();
-        /**
-         * This event is fired when the playback state changed.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 0.9.4
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.playerStateChanged.on((args) => {
-         *     updatePlayerControls(args.state, args.stopped);
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.PlayerStateChanged.On(args =>
-         * {
-         *     UpdatePlayerControls(args);
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * api.playerStateChanged.on { args ->
-         *     updatePlayerControls(args)
-         * }
-         * ```
-         *
-         */
-        this.playerStateChanged = new EventEmitterOfT();
-        /**
-         * This event is fired when the current playback position of the song changed.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 0.9.4
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.playerPositionChanged.on((args) => {
-         *     updatePlayerPosition(args);
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.PlayerPositionChanged.On(args =>
-         * {
-         *     UpdatePlayerPosition(args);
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * api.playerPositionChanged.on { args ->
-         *     updatePlayerPosition(args)
-         * }
-         * ```
-         *
-         */
-        this.playerPositionChanged = new EventEmitterOfT();
-        /**
-         * This event is fired when the synthesizer played certain midi events.
-         *
-         * @remarks
-         * This event is fired when the synthesizer played certain midi events. This allows reacing on various low level
-         * audio playback elements like notes/rests played or metronome ticks.
-         *
-         * Refer to the [related guide](https://www.alphatab.net/docs/guides/handling-midi-events) to learn more about this feature.
-         *
-         * Also note that the provided data models changed significantly in {@version 1.3.0}. We try to provide backwards compatibility
-         * until some extend but highly encourage changing to the new models in case of problems.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 1.2.0
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.midiEventsPlayedFilter = [alphaTab.midi.MidiEventType.AlphaTabMetronome];
-         * api.midiEventsPlayed.on(function(e) {
-         *   for(const midi of e.events) {
-         *     if(midi.isMetronome) {
-         *       console.log('Metronome tick ' + midi.tick);
-         *     }
-         *   }
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.MidiEventsPlayedFilter = new MidiEventType[] { AlphaTab.Midi.MidiEventType.AlphaTabMetronome };
-         * api.MidiEventsPlayed.On(e =>
-         * {
-         *   foreach(var midi of e.events)
-         *   {
-         *     if(midi is AlphaTab.Midi.AlphaTabMetronomeEvent sysex && sysex.IsMetronome)
-         *     {
-         *       Console.WriteLine("Metronome tick " + midi.Tick);
-         *     }
-         *   }
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...);
-         * api.midiEventsPlayedFilter = alphaTab.collections.List<alphaTab.midi.MidiEventType>( alphaTab.midi.MidiEventType.AlphaTabMetronome )
-         * api.midiEventsPlayed.on { e ->
-         *   for (midi in e.events) {
-         *     if(midi instanceof alphaTab.midi.AlphaTabMetronomeEvent && midi.isMetronome) {
-         *       println("Metronome tick " + midi.tick);
-         *     }
-         *   }
-         * }
-         * ```
-         * @see {@link MidiEvent}
-         * @see {@link TimeSignatureEvent}
-         * @see {@link AlphaTabMetronomeEvent}
-         * @see {@link AlphaTabRestEvent}
-         * @see {@link NoteOnEvent}
-         * @see {@link NoteOffEvent}
-         * @see {@link ControlChangeEvent}
-         * @see {@link ProgramChangeEvent}
-         * @see {@link TempoChangeEvent}
-         * @see {@link PitchBendEvent}
-         * @see {@link NoteBendEvent}
-         * @see {@link EndOfTrackEvent}
-         * @see {@link MetaEvent}
-         * @see {@link MetaDataEvent}
-         * @see {@link MetaNumberEvent}
-         * @see {@link Midi20PerNotePitchBendEvent}
-         * @see {@link SystemCommonEvent}
-         * @see {@link SystemExclusiveEvent}
-         */
-        this.midiEventsPlayed = new EventEmitterOfT();
-        /**
-         * This event is fired when the playback range changed.
-         *
-         * @eventProperty
-         * @category Events - Player
-         * @since 1.2.3
-         *
-         * @example
-         * JavaScript
-         * ```js
-         * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
-         * api.playbackRangeChanged.on((args) => {
-         *     if (args.playbackRange) {
-         *         highlightRangeInProgressBar(args.playbackRange.startTick, args.playbackRange.endTick);
-         *     } else {
-         *         clearHighlightInProgressBar();
-         *     }
-         * });
-         * ```
-         *
-         * @example
-         * C#
-         * ```cs
-         * var api = new AlphaTabApi<MyControl>(...);
-         * api.PlaybackRangeChanged.On(args =>
-         * {
-         *     if (args.PlaybackRange != null)
-         *     {
-         *         HighlightRangeInProgressBar(args.PlaybackRange.StartTick, args.PlaybackRange.EndTick);
-         *     }
-         *     else
-         *     {
-         *         ClearHighlightInProgressBar();
-         *     }
-         * });
-         * ```
-         *
-         * @example
-         * Android
-         * ```kotlin
-         * val api = AlphaTabApi<MyControl>(...)
-         * api.playbackRangeChanged.on { args ->
-         *     val playbackRange = args.playbackRange
-         *     if (playbackRange != null) {
-         *         highlightRangeInProgressBar(playbackRange.startTick, playbackRange.endTick)
-         *     } else {
-         *         clearHighlightInProgressBar()
-         *     }
-         * }
-         * ```
-         *
-         */
-        this.playbackRangeChanged = new EventEmitterOfT();
         /**
          * @internal
          */
@@ -39466,8 +39405,9 @@ class AlphaTabApiBase {
             this.appendRenderResult(null); // marks last element
         });
         this.renderer.error.on(this.onError.bind(this));
+        this.setupPlayerWrapper();
         if (this.settings.player.playerMode !== PlayerMode.Disabled) {
-            this.setupPlayer();
+            this.setupOrDestroyPlayer();
         }
         this.setupClickHandling();
         // delay rendering to allow ui to hook up with events first.
@@ -39475,6 +39415,36 @@ class AlphaTabApiBase {
             this.uiFacade.initialRender();
         });
     }
+    setupPlayerWrapper() {
+        const player = new AlphaSynthWrapper();
+        this._player = player;
+        player.ready.on(() => {
+            this.loadMidiForScore();
+        });
+        player.readyForPlayback.on(() => {
+            this.onPlayerReady();
+            if (this.tracks) {
+                for (const track of this.tracks) {
+                    const volume = track.playbackInfo.volume / 16;
+                    player.setChannelVolume(track.playbackInfo.primaryChannel, volume);
+                    player.setChannelVolume(track.playbackInfo.secondaryChannel, volume);
+                }
+            }
+        });
+        player.soundFontLoaded.on(this.onSoundFontLoaded.bind(this));
+        player.soundFontLoadFailed.on(e => {
+            this.onError(e);
+        });
+        player.midiLoaded.on(this.onMidiLoaded.bind(this));
+        player.midiLoadFailed.on(e => {
+            this.onError(e);
+        });
+        player.stateChanged.on(this.onPlayerStateChanged.bind(this));
+        player.positionChanged.on(this.onPlayerPositionChanged.bind(this));
+        player.midiEventsPlayed.on(this.onMidiEventsPlayed.bind(this));
+        player.playbackRangeChanged.on(this.onPlaybackRangeChanged.bind(this));
+        player.finished.on(this.onPlayerFinished.bind(this));
+    }
     /**
      * Destroys the alphaTab control and restores the initial state of the UI.
      * @remarks
@@ -39507,9 +39477,7 @@ class AlphaTabApiBase {
      */
     destroy() {
         this._isDestroyed = true;
-        if (this.player) {
-            this.player.destroy();
-        }
+        this._player.destroy();
         this.uiFacade.destroy();
         this.renderer.destroy();
     }
@@ -39557,14 +39525,8 @@ class AlphaTabApiBase {
             ModelUtils.applyPitchOffsets(this.settings, score);
         }
         this.renderer.updateSettings(this.settings);
-        // enable/disable player if needed
-        if (this.settings.player.playerMode !== PlayerMode.Disabled) {
-            if (this.setupPlayer() && score) {
-                this.loadMidiForScore();
-            }
-        }
-        else {
-            this.destroyPlayer();
+        if (this.setupOrDestroyPlayer()) {
+            this.loadMidiForScore();
         }
         this.onSettingsUpdated();
     }
@@ -39871,9 +39833,6 @@ class AlphaTabApiBase {
      * ```
      */
     loadSoundFont(data, append = false) {
-        if (!this.player) {
-            return false;
-        }
         return this.uiFacade.loadSoundFont(data, append);
     }
     /**
@@ -39919,10 +39878,7 @@ class AlphaTabApiBase {
      * ```
      */
     resetSoundFonts() {
-        if (!this.player) {
-            return;
-        }
-        this.player.resetSoundFonts();
+        this._player.resetSoundFonts();
     }
     /**
      * Initiates a re-rendering of the current setup.
@@ -40036,6 +39992,37 @@ class AlphaTabApiBase {
     get boundsLookup() {
         return this.renderer.boundsLookup;
     }
+    /**
+     * The alphaSynth player used for playback.
+     * @remarks
+     * This is the low-level API to the Midi synthesizer used for playback.
+     * Gets access to the underling {@link IAlphaSynth} that is used for the audio playback.
+     * @category Properties - Player
+     * @since 0.9.4
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * setupPlayerEvents(api.settings);
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * SetupPlayerEvents(api.Player);
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * setupPlayerEvents(api.player)
+     * ```
+     */
+    get player() {
+        return this._player.instance ? this._player : null;
+    }
     /**
      * Whether the player is ready for starting the playback.
      * @remarks
@@ -40065,10 +40052,7 @@ class AlphaTabApiBase {
      * ```
      */
     get isReadyForPlayback() {
-        if (!this.player) {
-            return false;
-        }
-        return this.player.isReadyForPlayback;
+        return this._player.isReadyForPlayback;
     }
     /**
      * The current player state.
@@ -40098,10 +40082,7 @@ class AlphaTabApiBase {
      * ```
      */
     get playerState() {
-        if (!this.player) {
-            return PlayerState.Paused;
-        }
-        return this.player.state;
+        return this._player.state;
     }
     /**
      * The current master volume as percentage (0-1).
@@ -40131,15 +40112,10 @@ class AlphaTabApiBase {
      * ```
      */
     get masterVolume() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.masterVolume;
+        return this._player.masterVolume;
     }
     set masterVolume(value) {
-        if (this.player) {
-            this.player.masterVolume = value;
-        }
+        this._player.masterVolume = value;
     }
     /**
      * The metronome volume as percentage (0-1).
@@ -40170,15 +40146,10 @@ class AlphaTabApiBase {
      * ```
      */
     get metronomeVolume() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.metronomeVolume;
+        return this._player.metronomeVolume;
     }
     set metronomeVolume(value) {
-        if (this.player) {
-            this.player.metronomeVolume = value;
-        }
+        this._player.metronomeVolume = value;
     }
     /**
      * The volume of the count-in metronome ticks.
@@ -40209,15 +40180,10 @@ class AlphaTabApiBase {
      * ```
      */
     get countInVolume() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.countInVolume;
+        return this._player.countInVolume;
     }
     set countInVolume(value) {
-        if (this.player) {
-            this.player.countInVolume = value;
-        }
+        this._player.countInVolume = value;
     }
     /**
      * The midi events which will trigger the `midiEventsPlayed` event
@@ -40276,15 +40242,10 @@ class AlphaTabApiBase {
      * ```
      */
     get midiEventsPlayedFilter() {
-        if (!this.player) {
-            return [];
-        }
-        return this.player.midiEventsPlayedFilter;
+        return this._player.midiEventsPlayedFilter;
     }
     set midiEventsPlayedFilter(value) {
-        if (this.player) {
-            this.player.midiEventsPlayedFilter = value;
-        }
+        this._player.midiEventsPlayedFilter = value;
     }
     /**
      * The position within the song in midi ticks.
@@ -40312,15 +40273,10 @@ class AlphaTabApiBase {
      * ```
      */
     get tickPosition() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.tickPosition;
+        return this._player.tickPosition;
     }
     set tickPosition(value) {
-        if (this.player) {
-            this.player.tickPosition = value;
-        }
+        this._player.tickPosition = value;
     }
     /**
      * The position within the song in milliseconds
@@ -40348,15 +40304,10 @@ class AlphaTabApiBase {
      * ```
      */
     get timePosition() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.timePosition;
+        return this._player.timePosition;
     }
     set timePosition(value) {
-        if (this.player) {
-            this.player.timePosition = value;
-        }
+        this._player.timePosition = value;
     }
     /**
      * The range of the song that should be played.
@@ -40390,17 +40341,12 @@ class AlphaTabApiBase {
      * ```
      */
     get playbackRange() {
-        if (!this.player) {
-            return null;
-        }
-        return this.player.playbackRange;
+        return this._player.playbackRange;
     }
     set playbackRange(value) {
-        if (this.player) {
-            this.player.playbackRange = value;
-            if (this.settings.player.enableCursor) {
-                this.updateSelectionCursor(value);
-            }
+        this._player.playbackRange = value;
+        if (this.settings.player.enableCursor) {
+            this.updateSelectionCursor(value);
         }
     }
     /**
@@ -40432,15 +40378,10 @@ class AlphaTabApiBase {
      * ```
      */
     get playbackSpeed() {
-        if (!this.player) {
-            return 0;
-        }
-        return this.player.playbackSpeed;
+        return this._player.playbackSpeed;
     }
     set playbackSpeed(value) {
-        if (this.player) {
-            this.player.playbackSpeed = value;
-        }
+        this._player.playbackSpeed = value;
     }
     /**
      * Whether the playback should automatically restart after it finished.
@@ -40471,27 +40412,17 @@ class AlphaTabApiBase {
      * ```
      */
     get isLooping() {
-        if (!this.player) {
-            return false;
-        }
-        return this.player.isLooping;
+        return this._player.isLooping;
     }
     set isLooping(value) {
-        if (this.player) {
-            this.player.isLooping = value;
-        }
+        this._player.isLooping = value;
     }
     destroyPlayer() {
-        if (!this.player) {
-            return;
-        }
-        this.player.destroy();
-        this.player = null;
+        this._player.destroy();
         this._previousTick = 0;
-        this._playerState = PlayerState.Paused;
         this.destroyCursors();
     }
-    setupPlayer() {
+    setupOrDestroyPlayer() {
         let mode = this.settings.player.playerMode;
         if (mode === PlayerMode.EnabledAutomatic) {
             const score = this.score;
@@ -40505,66 +40436,34 @@ class AlphaTabApiBase {
                 mode = PlayerMode.EnabledSynthesizer;
             }
         }
+        let newPlayer = null;
         if (mode !== this._actualPlayerMode) {
             this.destroyPlayer();
+            switch (mode) {
+                case PlayerMode.Disabled:
+                    newPlayer = null;
+                    break;
+                case PlayerMode.EnabledSynthesizer:
+                    newPlayer = this.uiFacade.createWorkerPlayer();
+                    break;
+                case PlayerMode.EnabledBackingTrack:
+                    newPlayer = this.uiFacade.createBackingTrackPlayer();
+                    break;
+                case PlayerMode.EnabledExternalMedia:
+                    newPlayer = new ExternalMediaPlayer(this.settings.player.bufferTimeInMilliseconds);
+                    break;
+            }
+        }
+        else {
+            // no change in player mode, just update song info if needed
+            return true;
         }
         this.updateCursors();
         this._actualPlayerMode = mode;
-        switch (mode) {
-            case PlayerMode.Disabled:
-                this.destroyPlayer();
-                return false;
-            case PlayerMode.EnabledSynthesizer:
-                if (this.player) {
-                    return true;
-                }
-                // new player needed
-                this.player = this.uiFacade.createWorkerPlayer();
-                break;
-            case PlayerMode.EnabledBackingTrack:
-                if (this.player) {
-                    return true;
-                }
-                // new player needed
-                this.player = this.uiFacade.createBackingTrackPlayer();
-                break;
-            case PlayerMode.EnabledExternalMedia:
-                if (this.player) {
-                    return true;
-                }
-                this.player = new ExternalMediaPlayer(this.settings.player.bufferTimeInMilliseconds);
-                break;
-        }
-        if (!this.player) {
+        if (!newPlayer) {
             return false;
         }
-        this.player.ready.on(() => {
-            this.loadMidiForScore();
-        });
-        this.player.readyForPlayback.on(() => {
-            this.onPlayerReady();
-            if (this.tracks) {
-                for (const track of this.tracks) {
-                    const volume = track.playbackInfo.volume / 16;
-                    this.player.setChannelVolume(track.playbackInfo.primaryChannel, volume);
-                    this.player.setChannelVolume(track.playbackInfo.secondaryChannel, volume);
-                }
-            }
-        });
-        this.player.soundFontLoaded.on(this.onSoundFontLoaded.bind(this));
-        this.player.soundFontLoadFailed.on(e => {
-            this.onError(e);
-        });
-        this.player.midiLoaded.on(this.onMidiLoaded.bind(this));
-        this.player.midiLoadFailed.on(e => {
-            this.onError(e);
-        });
-        this.player.stateChanged.on(this.onPlayerStateChanged.bind(this));
-        this.player.positionChanged.on(this.onPlayerPositionChanged.bind(this));
-        this.player.midiEventsPlayed.on(this.onMidiEventsPlayed.bind(this));
-        this.player.playbackRangeChanged.on(this.onPlaybackRangeChanged.bind(this));
-        this.player.finished.on(this.onPlayerFinished.bind(this));
-        this.setupPlayerEvents();
+        this._player.instance = newPlayer;
         return false;
     }
     loadMidiForScore() {
@@ -40584,12 +40483,10 @@ class AlphaTabApiBase {
         generator.generate();
         this._tickCache = generator.tickLookup;
         this.onMidiLoad(midiFile);
-        const player = this.player;
-        if (player) {
-            player.loadMidiFile(midiFile);
-            player.loadBackingTrack(score, generator.syncPoints);
-            player.applyTranspositionPitches(generator.transpositionPitches);
-        }
+        const player = this._player;
+        player.loadMidiFile(midiFile);
+        player.loadBackingTrack(score, generator.syncPoints);
+        player.applyTranspositionPitches(generator.transpositionPitches);
     }
     /**
      * Changes the volume of the given tracks.
@@ -40627,12 +40524,9 @@ class AlphaTabApiBase {
      * ```
      */
     changeTrackVolume(tracks, volume) {
-        if (!this.player) {
-            return;
-        }
         for (const track of tracks) {
-            this.player.setChannelVolume(track.playbackInfo.primaryChannel, volume);
-            this.player.setChannelVolume(track.playbackInfo.secondaryChannel, volume);
+            this._player.setChannelVolume(track.playbackInfo.primaryChannel, volume);
+            this._player.setChannelVolume(track.playbackInfo.secondaryChannel, volume);
         }
     }
     /**
@@ -40669,12 +40563,9 @@ class AlphaTabApiBase {
      * ```
      */
     changeTrackSolo(tracks, solo) {
-        if (!this.player) {
-            return;
-        }
         for (const track of tracks) {
-            this.player.setChannelSolo(track.playbackInfo.primaryChannel, solo);
-            this.player.setChannelSolo(track.playbackInfo.secondaryChannel, solo);
+            this._player.setChannelSolo(track.playbackInfo.primaryChannel, solo);
+            this._player.setChannelSolo(track.playbackInfo.secondaryChannel, solo);
         }
     }
     /**
@@ -40710,12 +40601,9 @@ class AlphaTabApiBase {
      * ```
      */
     changeTrackMute(tracks, mute) {
-        if (!this.player) {
-            return;
-        }
         for (const track of tracks) {
-            this.player.setChannelMute(track.playbackInfo.primaryChannel, mute);
-            this.player.setChannelMute(track.playbackInfo.secondaryChannel, mute);
+            this._player.setChannelMute(track.playbackInfo.primaryChannel, mute);
+            this._player.setChannelMute(track.playbackInfo.secondaryChannel, mute);
         }
     }
     /**
@@ -40753,12 +40641,9 @@ class AlphaTabApiBase {
      * ```
      */
     changeTrackTranspositionPitch(tracks, semitones) {
-        if (!this.player) {
-            return;
-        }
         for (const track of tracks) {
-            this.player.setChannelTranspositionPitch(track.playbackInfo.primaryChannel, semitones);
-            this.player.setChannelTranspositionPitch(track.playbackInfo.secondaryChannel, semitones);
+            this._player.setChannelTranspositionPitch(track.playbackInfo.primaryChannel, semitones);
+            this._player.setChannelTranspositionPitch(track.playbackInfo.secondaryChannel, semitones);
         }
     }
     /**
@@ -40789,10 +40674,7 @@ class AlphaTabApiBase {
      * ```
      */
     play() {
-        if (!this.player) {
-            return false;
-        }
-        return this.player.play();
+        return this._player.play();
     }
     /**
      * Pauses the playback of the current song.
@@ -40821,10 +40703,7 @@ class AlphaTabApiBase {
      * ```
      */
     pause() {
-        if (!this.player) {
-            return;
-        }
-        this.player.pause();
+        this._player.pause();
     }
     /**
      * Toggles between play/pause depending on the current player state.
@@ -40855,10 +40734,7 @@ class AlphaTabApiBase {
      * ```
      */
     playPause() {
-        if (!this.player) {
-            return;
-        }
-        this.player.playPause();
+        this._player.playPause();
     }
     /**
      * Stops the playback of the current song, and moves the playback position back to the start.
@@ -40889,10 +40765,7 @@ class AlphaTabApiBase {
      * ```
      */
     stop() {
-        if (!this.player) {
-            return;
-        }
-        this.player.stop();
+        this._player.stop();
     }
     /**
      * Triggers the play of the given beat.
@@ -40928,15 +40801,12 @@ class AlphaTabApiBase {
      * ```
      */
     playBeat(beat) {
-        if (!this.player) {
-            return;
-        }
         // we generate a new midi file containing only the beat
         const midiFile = new MidiFile();
         const handler = new AlphaSynthMidiFileHandler(midiFile);
         const generator = new MidiFileGenerator(beat.voice.bar.staff.track.score, this.settings, handler);
         generator.generateSingleBeat(beat);
-        this.player.playOneTimeMidiFile(midiFile);
+        this._player.playOneTimeMidiFile(midiFile);
     }
     /**
      * Triggers the play of the given note.
@@ -40971,15 +40841,12 @@ class AlphaTabApiBase {
      * ```
      */
     playNote(note) {
-        if (!this.player) {
-            return;
-        }
         // we generate a new midi file containing only the beat
         const midiFile = new MidiFile();
         const handler = new AlphaSynthMidiFileHandler(midiFile);
         const generator = new MidiFileGenerator(note.beat.voice.bar.staff.track.score, this.settings, handler);
         generator.generateSingleNote(note);
-        this.player.playOneTimeMidiFile(midiFile);
+        this._player.playOneTimeMidiFile(midiFile);
     }
     destroyCursors() {
         if (!this._cursorWrapper) {
@@ -41011,36 +40878,6 @@ class AlphaTabApiBase {
             this.destroyCursors();
         }
     }
-    setupPlayerEvents() {
-        //
-        // Hook into events
-        this._previousTick = 0;
-        this._playerState = PlayerState.Paused;
-        // we need to update our position caches if we render a tablature
-        this.renderer.postRenderFinished.on(() => {
-            this._currentBeat = null;
-            this.cursorUpdateTick(this._previousTick, false, 1, this._previousTick > 10);
-        });
-        if (this.player) {
-            this.player.positionChanged.on(e => {
-                this._previousTick = e.currentTick;
-                this.uiFacade.beginInvoke(() => {
-                    const cursorSpeed = e.modifiedTempo / e.originalTempo;
-                    this.cursorUpdateTick(e.currentTick, false, cursorSpeed, false, e.isSeek);
-                });
-            });
-            this.player.stateChanged.on(e => {
-                this._playerState = e.state;
-                if (!e.stopped && e.state === PlayerState.Paused) {
-                    const currentBeat = this._currentBeat;
-                    const tickCache = this._tickCache;
-                    if (currentBeat && tickCache) {
-                        this.player.tickPosition = tickCache.getBeatStart(currentBeat.beat);
-                    }
-                }
-            });
-        }
-    }
     /**
      * updates the cursors to highlight the beat at the specified tick position
      * @param tick
@@ -41081,7 +40918,7 @@ class AlphaTabApiBase {
         if (!forceUpdate &&
             beat === previousBeat?.beat &&
             cache === previousCache &&
-            previousState === this._playerState &&
+            previousState === this._player.state &&
             previousBeat?.start === lookupResult.start) {
             return;
         }
@@ -41093,7 +40930,7 @@ class AlphaTabApiBase {
         // actually show the cursor
         this._currentBeat = lookupResult;
         this._previousCursorCache = cache;
-        this._previousStateForCursor = this._playerState;
+        this._previousStateForCursor = this._player.state;
         this.uiFacade.beginInvoke(() => {
             this.internalCursorUpdateBeat(beat, nextBeat, duration, stop, beatsToHighlight, cache, beatBoundings, shouldScroll, lookupResult.cursorMode, cursorSpeed);
         });
@@ -41104,9 +40941,9 @@ class AlphaTabApiBase {
      * @category Methods - Player
      */
     scrollToCursor() {
-        const barBounds = this._currentBarBounds;
-        if (barBounds) {
-            this.internalScrollToCursor(barBounds);
+        const beatBounds = this._currentBeatBounds;
+        if (beatBounds) {
+            this.internalScrollToCursor(beatBounds.barBounds.masterBarBounds);
         }
     }
     internalScrollToCursor(barBoundings) {
@@ -41165,10 +41002,12 @@ class AlphaTabApiBase {
         const beatCursor = this._beatCursor;
         const barBoundings = beatBoundings.barBounds.masterBarBounds;
         const barBounds = barBoundings.visualBounds;
-        this._currentBarBounds = barBoundings;
+        const previousBeatBounds = this._currentBeatBounds;
+        this._currentBeatBounds = beatBoundings;
         if (barCursor) {
             barCursor.setBounds(barBounds.x, barBounds.y, barBounds.w, barBounds.h);
         }
+        const isPlayingUpdate = this._player.state === PlayerState.Playing && !stop;
         let nextBeatX = barBoundings.visualBounds.x + barBoundings.visualBounds.w;
         // get position of next beat on same system
         if (nextBeat && cursorMode === MidiTickLookupFindBeatResultCursorMode.ToNextBext) {
@@ -41186,12 +41025,38 @@ class AlphaTabApiBase {
             if (this.settings.player.enableAnimatedBeatCursor) {
                 const animationWidth = nextBeatX - beatBoundings.onNotesX;
                 const relativePosition = this._previousTick - this._currentBeat.start;
-                const ratioPosition = relativePosition / this._currentBeat.tickDuration;
+                const ratioPosition = this._currentBeat.tickDuration > 0 ? relativePosition / this._currentBeat.tickDuration : 0;
                 startBeatX = beatBoundings.onNotesX + animationWidth * ratioPosition;
                 duration -= duration * ratioPosition;
-                beatCursor.transitionToX(0, startBeatX);
+                if (isPlayingUpdate) {
+                    // we do not "reset" the cursor if we are smoothly moving from left to right.
+                    const jumpCursor = !previousBeatBounds ||
+                        barBounds.y !== previousBeatBounds.barBounds.masterBarBounds.visualBounds.y ||
+                        startBeatX < previousBeatBounds.onNotesX ||
+                        barBoundings.index > previousBeatBounds.barBounds.masterBarBounds.index + 1;
+                    if (jumpCursor) {
+                        beatCursor.transitionToX(0, startBeatX);
+                        beatCursor.setBounds(startBeatX, barBounds.y, 1, barBounds.h);
+                    }
+                    // we need to put the transition to an own animation frame
+                    // otherwise the stop animation above is not applied.
+                    this.uiFacade.beginInvoke(() => {
+                        // it can happen that the cursor reaches the target position slightly too early (especially on backing tracks)
+                        // to avoid the cursor stopping, causing a wierd look, we animate the cursor to the double position in double time.
+                        // beatCursor!.transitionToX((duration / cursorSpeed), nextBeatX);
+                        const doubleEndBeatX = startBeatX + (nextBeatX - startBeatX) * 2;
+                        beatCursor.transitionToX((duration / cursorSpeed) * 2, doubleEndBeatX);
+                    });
+                }
+                else {
+                    beatCursor.transitionToX(0, startBeatX);
+                    beatCursor.setBounds(startBeatX, barBounds.y, 1, barBounds.h);
+                }
+            }
+            else {
+                // ticking cursor
+                beatCursor.setBounds(startBeatX, barBounds.y, 1, barBounds.h);
             }
-            beatCursor.setBounds(startBeatX, barBounds.y, 1, barBounds.h);
         }
         // if playing, animate the cursor to the next beat
         if (this.settings.player.enableElementHighlighting) {
@@ -41199,7 +41064,6 @@ class AlphaTabApiBase {
         }
         // actively playing? -> animate cursor and highlight items
         let shouldNotifyBeatChange = false;
-        const isPlayingUpdate = this._playerState === PlayerState.Playing && !stop;
         if (isPlayingUpdate) {
             if (this.settings.player.enableElementHighlighting) {
                 for (const highlight of beatsToHighlight) {
@@ -41210,15 +41074,6 @@ class AlphaTabApiBase {
             shouldScroll = !stop;
             shouldNotifyBeatChange = true;
         }
-        if (this.settings.player.enableAnimatedBeatCursor && beatCursor) {
-            if (isPlayingUpdate) {
-                // we need to put the transition to an own animation frame
-                // otherwise the stop animation above is not applied.
-                this.uiFacade.beginInvoke(() => {
-                    beatCursor.transitionToX(duration / cursorSpeed, nextBeatX);
-                });
-            }
-        }
         if (shouldScroll && !this._beatMouseDown && this.settings.player.scrollMode !== ScrollMode.Off) {
             this.internalScrollToCursor(barBoundings);
         }
@@ -41308,7 +41163,7 @@ class AlphaTabApiBase {
                 const realMasterBarStart = tickCache.getMasterBarStart(this._selectionStart.beat.voice.bar.masterBar);
                 // move to selection start
                 this._currentBeat = null; // reset current beat so it is updating the cursor
-                if (this._playerState === PlayerState.Paused) {
+                if (this._player.state === PlayerState.Paused) {
                     this.cursorUpdateTick(this._tickCache.getBeatStart(this._selectionStart.beat), false, 1);
                 }
                 this.tickPosition = realMasterBarStart + this._selectionStart.beat.playbackStart;
@@ -41499,7 +41354,7 @@ class AlphaTabApiBase {
         }
         this.scoreLoaded.trigger(score);
         this.uiFacade.triggerEvent(this.container, 'scoreLoaded', score);
-        if (this.setupPlayer()) {
+        if (this.setupOrDestroyPlayer()) {
             this.loadMidiForScore();
         }
     }
@@ -41528,6 +41383,8 @@ class AlphaTabApiBase {
         if (this._isDestroyed) {
             return;
         }
+        this._currentBeat = null;
+        this.cursorUpdateTick(this._previousTick, false, 1, this._previousTick > 10);
         this.postRenderFinished.trigger();
         this.uiFacade.triggerEvent(this.container, 'postRenderFinished', null);
     }
@@ -41542,25 +41399,155 @@ class AlphaTabApiBase {
         this.error.trigger(error);
         this.uiFacade.triggerEvent(this.container, 'error', error);
     }
+    /**
+     * This event is fired when all required data for playback is loaded and ready.
+     * @remarks
+     * This event is fired when all required data for playback is loaded and ready. The player is ready for playback when
+     * all background workers are started, the audio output is initialized, a soundfont is loaded, and a song was loaded into the player as midi file.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 0.9.4
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.playerReady.on(() => {
+     *     enablePlayerControls();
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.PlayerReady.On(() =>
+     * {
+     *     EnablePlayerControls()
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * api.playerReady.on {
+     *     enablePlayerControls()
+     * }
+     * ```
+     */
+    get playerReady() {
+        return this._player.readyForPlayback;
+    }
     onPlayerReady() {
         if (this._isDestroyed) {
             return;
         }
-        this.playerReady.trigger();
         this.uiFacade.triggerEvent(this.container, 'playerReady', null);
     }
+    /**
+     * This event is fired when the playback of the whole song finished.
+     * @remarks
+     * This event is finished regardless on whether looping is enabled or not.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 0.9.4
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.playerFinished.on((args) => {
+     *     // speed trainer
+     *     api.playbackSpeed = Math.min(1.0, api.playbackSpeed + 0.1);
+     * });
+     * api.isLooping = true;
+     * api.playbackSpeed = 0.5;
+     * api.play()
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.PlayerFinished.On(() =>
+     * {
+     *     // speed trainer
+     *     api.PlaybackSpeed = Math.Min(1.0, api.PlaybackSpeed + 0.1);
+     * });
+     * api.IsLooping = true;
+     * api.PlaybackSpeed = 0.5;
+     * api.Play();
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * api.playerFinished.on {
+     *     // speed trainer
+     *     api.playbackSpeed = min(1.0, api.playbackSpeed + 0.1);
+     * }
+     * api.isLooping = true
+     * api.playbackSpeed = 0.5
+     * api.play()
+     * ```
+     *
+     */
+    get playerFinished() {
+        return this._player.finished;
+    }
     onPlayerFinished() {
         if (this._isDestroyed) {
             return;
         }
-        this.playerFinished.trigger();
         this.uiFacade.triggerEvent(this.container, 'playerFinished', null);
     }
+    /**
+     * This event is fired when the SoundFont needed for playback was loaded.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 0.9.4
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.soundFontLoaded.on(() => {
+     *     hideSoundFontLoadingIndicator();
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.SoundFontLoaded.On(() =>
+     * {
+     *     HideSoundFontLoadingIndicator();
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...);
+     * api.soundFontLoaded.on {
+     *     hideSoundFontLoadingIndicator();
+     * }
+     * ```
+     *
+     */
+    get soundFontLoaded() {
+        return this._player.soundFontLoaded;
+    }
     onSoundFontLoaded() {
         if (this._isDestroyed) {
             return;
         }
-        this.soundFontLoaded.trigger();
         this.uiFacade.triggerEvent(this.container, 'soundFontLoaded', null);
     }
     onMidiLoad(e) {
@@ -41577,34 +41564,255 @@ class AlphaTabApiBase {
         this.midiLoaded.trigger(e);
         this.uiFacade.triggerEvent(this.container, 'midiFileLoaded', e);
     }
+    /**
+     * This event is fired when the playback state changed.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 0.9.4
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.playerStateChanged.on((args) => {
+     *     updatePlayerControls(args.state, args.stopped);
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.PlayerStateChanged.On(args =>
+     * {
+     *     UpdatePlayerControls(args);
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * api.playerStateChanged.on { args ->
+     *     updatePlayerControls(args)
+     * }
+     * ```
+     *
+     */
+    get playerStateChanged() {
+        return this._player.stateChanged;
+    }
     onPlayerStateChanged(e) {
         if (this._isDestroyed) {
             return;
         }
-        this.playerStateChanged.trigger(e);
+        if (!e.stopped && e.state === PlayerState.Paused) {
+            const currentBeat = this._currentBeat;
+            const tickCache = this._tickCache;
+            if (currentBeat && tickCache) {
+                this._player.tickPosition = tickCache.getBeatStart(currentBeat.beat);
+            }
+        }
         this.uiFacade.triggerEvent(this.container, 'playerStateChanged', e);
     }
+    /**
+     * This event is fired when the current playback position of the song changed.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 0.9.4
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.playerPositionChanged.on((args) => {
+     *     updatePlayerPosition(args);
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.PlayerPositionChanged.On(args =>
+     * {
+     *     UpdatePlayerPosition(args);
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * api.playerPositionChanged.on { args ->
+     *     updatePlayerPosition(args)
+     * }
+     * ```
+     *
+     */
+    get playerPositionChanged() {
+        return this._player.positionChanged;
+    }
     onPlayerPositionChanged(e) {
         if (this._isDestroyed) {
             return;
         }
-        if (this.score !== null && this.tracks.length > 0) {
-            this.playerPositionChanged.trigger(e);
-            this.uiFacade.triggerEvent(this.container, 'playerPositionChanged', e);
-        }
+        this._previousTick = e.currentTick;
+        this.uiFacade.beginInvoke(() => {
+            const cursorSpeed = e.modifiedTempo / e.originalTempo;
+            this.cursorUpdateTick(e.currentTick, false, cursorSpeed, false, e.isSeek);
+        });
+        this.uiFacade.triggerEvent(this.container, 'playerPositionChanged', e);
+    }
+    /**
+     * This event is fired when the synthesizer played certain midi events.
+     *
+     * @remarks
+     * This event is fired when the synthesizer played certain midi events. This allows reacing on various low level
+     * audio playback elements like notes/rests played or metronome ticks.
+     *
+     * Refer to the [related guide](https://www.alphatab.net/docs/guides/handling-midi-events) to learn more about this feature.
+     *
+     * Also note that the provided data models changed significantly in {@version 1.3.0}. We try to provide backwards compatibility
+     * until some extend but highly encourage changing to the new models in case of problems.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 1.2.0
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.midiEventsPlayedFilter = [alphaTab.midi.MidiEventType.AlphaTabMetronome];
+     * api.midiEventsPlayed.on(function(e) {
+     *   for(const midi of e.events) {
+     *     if(midi.isMetronome) {
+     *       console.log('Metronome tick ' + midi.tick);
+     *     }
+     *   }
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.MidiEventsPlayedFilter = new MidiEventType[] { AlphaTab.Midi.MidiEventType.AlphaTabMetronome };
+     * api.MidiEventsPlayed.On(e =>
+     * {
+     *   foreach(var midi of e.events)
+     *   {
+     *     if(midi is AlphaTab.Midi.AlphaTabMetronomeEvent sysex && sysex.IsMetronome)
+     *     {
+     *       Console.WriteLine("Metronome tick " + midi.Tick);
+     *     }
+     *   }
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...);
+     * api.midiEventsPlayedFilter = alphaTab.collections.List<alphaTab.midi.MidiEventType>( alphaTab.midi.MidiEventType.AlphaTabMetronome )
+     * api.midiEventsPlayed.on { e ->
+     *   for (midi in e.events) {
+     *     if(midi instanceof alphaTab.midi.AlphaTabMetronomeEvent && midi.isMetronome) {
+     *       println("Metronome tick " + midi.tick);
+     *     }
+     *   }
+     * }
+     * ```
+     * @see {@link MidiEvent}
+     * @see {@link TimeSignatureEvent}
+     * @see {@link AlphaTabMetronomeEvent}
+     * @see {@link AlphaTabRestEvent}
+     * @see {@link NoteOnEvent}
+     * @see {@link NoteOffEvent}
+     * @see {@link ControlChangeEvent}
+     * @see {@link ProgramChangeEvent}
+     * @see {@link TempoChangeEvent}
+     * @see {@link PitchBendEvent}
+     * @see {@link NoteBendEvent}
+     * @see {@link EndOfTrackEvent}
+     * @see {@link MetaEvent}
+     * @see {@link MetaDataEvent}
+     * @see {@link MetaNumberEvent}
+     * @see {@link Midi20PerNotePitchBendEvent}
+     * @see {@link SystemCommonEvent}
+     * @see {@link SystemExclusiveEvent}
+     */
+    get midiEventsPlayed() {
+        return this._player.midiEventsPlayed;
     }
     onMidiEventsPlayed(e) {
         if (this._isDestroyed) {
             return;
         }
-        this.midiEventsPlayed.trigger(e);
         this.uiFacade.triggerEvent(this.container, 'midiEventsPlayed', e);
     }
+    /**
+     * This event is fired when the playback range changed.
+     *
+     * @eventProperty
+     * @category Events - Player
+     * @since 1.2.3
+     *
+     * @example
+     * JavaScript
+     * ```js
+     * const api = new alphaTab.AlphaTabApi(document.querySelector('#alphaTab'));
+     * api.playbackRangeChanged.on((args) => {
+     *     if (args.playbackRange) {
+     *         highlightRangeInProgressBar(args.playbackRange.startTick, args.playbackRange.endTick);
+     *     } else {
+     *         clearHighlightInProgressBar();
+     *     }
+     * });
+     * ```
+     *
+     * @example
+     * C#
+     * ```cs
+     * var api = new AlphaTabApi<MyControl>(...);
+     * api.PlaybackRangeChanged.On(args =>
+     * {
+     *     if (args.PlaybackRange != null)
+     *     {
+     *         HighlightRangeInProgressBar(args.PlaybackRange.StartTick, args.PlaybackRange.EndTick);
+     *     }
+     *     else
+     *     {
+     *         ClearHighlightInProgressBar();
+     *     }
+     * });
+     * ```
+     *
+     * @example
+     * Android
+     * ```kotlin
+     * val api = AlphaTabApi<MyControl>(...)
+     * api.playbackRangeChanged.on { args ->
+     *     val playbackRange = args.playbackRange
+     *     if (playbackRange != null) {
+     *         highlightRangeInProgressBar(playbackRange.startTick, playbackRange.endTick)
+     *     } else {
+     *         clearHighlightInProgressBar()
+     *     }
+     * }
+     * ```
+     *
+     */
+    get playbackRangeChanged() {
+        return this._player.playbackRangeChanged;
+    }
     onPlaybackRangeChanged(e) {
         if (this._isDestroyed) {
             return;
         }
-        this.playbackRangeChanged.trigger(e);
         this.uiFacade.triggerEvent(this.container, 'playbackRangeChanged', e);
     }
     onSettingsUpdated() {
@@ -41666,10 +41874,7 @@ class AlphaTabApiBase {
      * ```
      */
     async enumerateOutputDevices() {
-        if (this.player) {
-            return await this.player.output.enumerateOutputDevices();
-        }
-        return [];
+        return await this._player.output.enumerateOutputDevices();
     }
     /**
      * Changes the output device which should be used for playing the audio (player must be enabled).
@@ -41720,9 +41925,7 @@ class AlphaTabApiBase {
      * ```
      */
     async setOutputDevice(device) {
-        if (this.player) {
-            await this.player.output.setOutputDevice(device);
-        }
+        await this._player.output.setOutputDevice(device);
     }
     /**
      * The currently configured output device if changed via {@link setOutputDevice}.
@@ -41762,10 +41965,7 @@ class AlphaTabApiBase {
      *
      */
     async getOutputDevice() {
-        if (this.player) {
-            return await this.player.output.getOutputDevice();
-        }
-        return null;
+        return await this._player.output.getOutputDevice();
     }
 }
 
@@ -41942,38 +42142,52 @@ class HtmlElementContainer {
         this.element = element;
         this.mouseDown = {
             on: (value) => {
-                this.element.addEventListener('mousedown', e => {
+                const nativeListener = e => {
                     value(new BrowserMouseEventArgs(e));
-                }, true);
+                };
+                this.element.addEventListener('mousedown', nativeListener, true);
+                return () => {
+                    this.element.removeEventListener('mousedown', nativeListener, true);
+                };
             },
             off: (value) => {
             }
         };
         this.mouseUp = {
             on: (value) => {
-                this.element.addEventListener('mouseup', e => {
+                const nativeListener = e => {
                     value(new BrowserMouseEventArgs(e));
-                }, true);
+                };
+                this.element.addEventListener('mouseup', nativeListener, true);
+                return () => {
+                    this.element.removeEventListener('mouseup', nativeListener, true);
+                };
             },
             off: (value) => {
             }
         };
         this.mouseMove = {
             on: (value) => {
-                this.element.addEventListener('mousemove', e => {
+                const nativeListener = e => {
                     value(new BrowserMouseEventArgs(e));
-                }, true);
+                };
+                this.element.addEventListener('mousemove', nativeListener, true);
+                return () => {
+                    this.element.removeEventListener('mousemove', nativeListener, true);
+                };
             },
             off: (_) => {
             }
         };
+        const container = this;
         this.resize = {
-            on: (value) => {
-                if (this._resizeListeners === 0) {
-                    HtmlElementContainer.resizeObserver.value.observe(this.element);
+            on: function (value) {
+                if (container._resizeListeners === 0) {
+                    HtmlElementContainer.resizeObserver.value.observe(container.element);
                 }
-                this.element.addEventListener('resize', value, true);
-                this._resizeListeners++;
+                container.element.addEventListener('resize', value, true);
+                container._resizeListeners++;
+                return () => this.off(value);
             },
             off: (value) => {
                 this.element.removeEventListener('resize', value, true);
@@ -42554,21 +42768,6 @@ class AlphaSynthScriptProcessorOutput extends AlphaSynthWebAudioOutputBase {
     }
 }
 
-/**
- * Represents the progress of any data being loaded.
- */
-class ProgressEventArgs {
-    /**
-     * Initializes a new instance of the {@link ProgressEventArgs} class.
-     * @param loaded
-     * @param total
-     */
-    constructor(loaded, total) {
-        this.loaded = loaded;
-        this.total = total;
-    }
-}
-
 /**
  * a WebWorker based alphaSynth which uses the given player as output.
  * @target web
@@ -42805,25 +43004,6 @@ class AlphaSynthWebWorkerApi {
             append: append
         });
     }
-    loadSoundFontFromUrl(url, append, progress) {
-        Logger.debug('AlphaSynth', `Start loading Soundfont from url ${url}`);
-        const request = new XMLHttpRequest();
-        request.open('GET', url, true, null, null);
-        request.responseType = 'arraybuffer';
-        request.onload = _ => {
-            const buffer = new Uint8Array(request.response);
-            this.loadSoundFont(buffer, append);
-        };
-        request.onerror = e => {
-            Logger.error('AlphaSynth', `Loading failed: ${e.message}`);
-            this.soundFontLoadFailed.trigger(new FileLoadError(e.message, request));
-        };
-        request.onprogress = e => {
-            Logger.debug('AlphaSynth', `Soundfont downloading: ${e.loaded}/${e.total} bytes`);
-            progress(new ProgressEventArgs(e.loaded, e.total));
-        };
-        request.send();
-    }
     resetSoundFonts() {
         this._synth.postMessage({
             cmd: 'alphaSynth.resetSoundFonts'
@@ -43375,7 +43555,11 @@ class AudioElementBackingTrackSynthOutput {
         }
         this._padding = backingTrack.padding / 1000;
         const blob = new Blob([backingTrack.rawAudioFile]);
+        // https://html.spec.whatwg.org/multipage/media.html#loading-the-media-resource
+        // Step 8. resets the playbackRate, we need to remember and restore it. 
+        const playbackRate = this.audioElement.playbackRate;
         this.audioElement.src = URL.createObjectURL(blob);
+        this.audioElement.playbackRate = playbackRate;
     }
     open(_bufferTimeInMilliseconds) {
         const audioElement = document.createElement('audio');
@@ -44094,6 +44278,21 @@ class BrowserUiFacade {
     }
 }
 
+/**
+ * Represents the progress of any data being loaded.
+ */
+class ProgressEventArgs {
+    /**
+     * Initializes a new instance of the {@link ProgressEventArgs} class.
+     * @param loaded
+     * @param total
+     */
+    constructor(loaded, total) {
+        this.loaded = loaded;
+        this.total = total;
+    }
+}
+
 /**
  * @target web
  */
@@ -44337,13 +44536,29 @@ class AlphaTabApi extends AlphaTabApiBase {
      * @since 0.9.4
      */
     loadSoundFontFromUrl(url, append) {
-        if (!this.player) {
+        const player = this.player;
+        if (!player) {
             return;
         }
-        this.player.loadSoundFontFromUrl(url, append, e => {
-            this.soundFontLoad.trigger(e);
-            this.uiFacade.triggerEvent(this.container, 'soundFontLoad', e);
-        });
+        Logger.debug('AlphaSynth', `Start loading Soundfont from url ${url}`);
+        const request = new XMLHttpRequest();
+        request.open('GET', url, true, null, null);
+        request.responseType = 'arraybuffer';
+        request.onload = _ => {
+            const buffer = new Uint8Array(request.response);
+            this.loadSoundFont(buffer, append);
+        };
+        request.onerror = e => {
+            Logger.error('AlphaSynth', `Loading failed: ${e.message}`);
+            player.soundFontLoadFailed.trigger(new FileLoadError(e.message, request));
+        };
+        request.onprogress = e => {
+            Logger.debug('AlphaSynth', `Soundfont downloading: ${e.loaded}/${e.total} bytes`);
+            const args = new ProgressEventArgs(e.loaded, e.total);
+            this.soundFontLoad.trigger(args);
+            this.uiFacade.triggerEvent(this.container, 'soundFontLoad', args);
+        };
+        request.send();
     }
 }
 
@@ -60310,9 +60525,9 @@ class VersionInfo {
         print(`build date: ${VersionInfo.date}`);
     }
 }
-VersionInfo.version = '1.6.0-alpha.1405';
-VersionInfo.date = '2025-05-10T17:25:30.743Z';
-VersionInfo.commit = 'a9f729a65e195d4fec684444cd2c2a259dc9729b';
+VersionInfo.version = '1.6.0-alpha.1409';
+VersionInfo.date = '2025-05-14T02:06:32.990Z';
+VersionInfo.commit = 'f91fed13b0a0946b3fa9306b480ddf8044b948e2';
 
 /**
  * A factory for custom layout engines.