@coderline/alphatab 1.6.0-alpha.1416 → 1.6.0-alpha.1420

package/dist/alphaTab.core.mjs

@@ -1,5 +1,5 @@
 /*!
- * alphaTab v1.6.0-alpha.1416 (develop, build 1416)
+ * alphaTab v1.6.0-alpha.1420 (develop, build 1420)
  *
  * Copyright © 2025, Daniel Kuschny and Contributors, All rights reserved.
  *
@@ -14312,13 +14312,6 @@ class XmlDocument extends XmlNode {
  * @json_strict
  */
 class BackingTrack {
-    constructor() {
-        /**
-         * The number of milliseconds the audio should be shifted to align with the song.
-         * (e.g. negative values allow skipping potential silent parts at the start of the file and directly start with the first note).
-         */
-        this.padding = 0;
-    }
 }
 
 /**
@@ -14351,6 +14344,7 @@ class GpifParser {
     constructor() {
         this._hasAnacrusis = false;
         this._skipApplyLyrics = false;
+        this._backingTrackPadding = 0;
         this._doubleBars = new Set();
         this._keySignatures = new Map();
     }
@@ -14583,7 +14577,7 @@ class GpifParser {
                     assetId = c.innerText;
                     break;
                 case 'FramePadding':
-                    backingTrack.padding = GpifParser.parseIntSafe(c.innerText, 0) / GpifParser.SampleRate * 1000;
+                    this._backingTrackPadding = GpifParser.parseIntSafe(c.innerText, 0) / GpifParser.SampleRate * 1000;
                     break;
             }
         }
@@ -16797,6 +16791,7 @@ class GpifParser {
                         masterBar.tempoAutomations.push(automation);
                         break;
                     case AutomationType.SyncPoint:
+                        automation.syncPointValue.millisecondOffset -= this._backingTrackPadding;
                         masterBar.addSyncPoint(automation);
                         break;
                 }
@@ -22285,17 +22280,6 @@ class SynthEvent {
     }
 }
 
-/**
- * Rerpresents a point to sync the alphaTab time axis with an external backing track.
- */
-class BackingTrackSyncPoint {
-    constructor(tick, data) {
-        this.tick = 0;
-        this.tick = tick;
-        this.data = data;
-    }
-}
-
 class MidiFileSequencerTempoChange {
     constructor(bpm, ticks, time) {
         this.bpm = bpm;
@@ -22303,10 +22287,12 @@ class MidiFileSequencerTempoChange {
         this.time = time;
     }
 }
-class BackingTrackSyncPointWithTime extends BackingTrackSyncPoint {
-    constructor(tick, data, time) {
-        super(tick, data);
-        this.time = time;
+class BackingTrackSyncPointWithTime {
+    constructor(tick, time, modifiedTempo, millisecondOffset) {
+        this.alphaTabTick = tick;
+        this.alphaTabTime = time;
+        this.modifiedTempo = modifiedTempo;
+        this.millisecondOffset = millisecondOffset;
     }
 }
 class MidiSequencerState {
@@ -22412,7 +22398,7 @@ class MidiFileSequencer {
             this._mainState.currentTempo = this._mainState.tempoChanges[0].bpm;
             this._mainState.modifiedTempo =
                 this._mainState.syncPoints.length > 0
-                    ? this._mainState.syncPoints[0].data.modifiedTempo
+                    ? this._mainState.syncPoints[0].modifiedTempo
                     : this._mainState.currentTempo;
             if (this.isPlayingMain) {
                 const metronomeVolume = this._synthesizer.metronomeVolume;
@@ -22584,25 +22570,52 @@ class MidiFileSequencer {
     mainUpdateSyncPoints(syncPoints) {
         const state = this._mainState;
         syncPoints.sort((a, b) => a.tick - b.tick); // just in case
-        state.syncPoints = new Array(syncPoints.length);
+        state.syncPoints = [];
         if (syncPoints.length >= 0) {
             let bpm = 120;
             let absTick = 0;
             let absTime = 0.0;
-            let previousTick = 0;
             let tempoChangeIndex = 0;
             for (let i = 0; i < syncPoints.length; i++) {
                 const p = syncPoints[i];
-                const deltaTick = p.tick - previousTick;
-                absTick += deltaTick;
-                absTime += deltaTick * (60000.0 / (bpm * state.division));
-                state.syncPoints[i] = new BackingTrackSyncPointWithTime(p.tick, p.data, absTime);
-                previousTick = p.tick;
+                let deltaTick = 0;
+                // remember state from previous sync point (or start). to handle linear interpolation
+                let previousModifiedTempo;
+                let previousMillisecondOffset;
+                let previousTick;
+                if (i === 0) {
+                    previousModifiedTempo = bpm;
+                    previousMillisecondOffset = 0;
+                    previousTick = 0;
+                }
+                else {
+                    const previousSyncPoint = syncPoints[i - 1];
+                    previousModifiedTempo = previousSyncPoint.data.modifiedTempo;
+                    previousMillisecondOffset = previousSyncPoint.data.millisecondOffset;
+                    previousTick = previousSyncPoint.tick;
+                }
+                // process time until sync point
+                // here it gets a bit tricky. if we have tempo changes on the synthesizer time axis (inbetween two sync points)
+                // we have to calculate a interpolated sync point on the alphaTab time axis.
+                // otherwise the linear interpolation later in the lookup will fail.
+                // goal is to have always a linear increase between two points, no matter if the time axis is sliced by tempo changes or sync points
                 while (tempoChangeIndex < state.tempoChanges.length &&
-                    state.tempoChanges[tempoChangeIndex].ticks <= absTick) {
+                    state.tempoChanges[tempoChangeIndex].ticks <= p.tick) {
+                    deltaTick = state.tempoChanges[tempoChangeIndex].ticks - absTick;
+                    if (deltaTick > 0) {
+                        absTick += deltaTick;
+                        absTime += deltaTick * (60000.0 / (bpm * state.division));
+                        const millisPerTick = (p.data.millisecondOffset - previousMillisecondOffset) / (p.tick - previousTick);
+                        const interpolatedMillisecondOffset = (absTick - previousTick) * millisPerTick + previousMillisecondOffset;
+                        state.syncPoints.push(new BackingTrackSyncPointWithTime(absTick, absTime, previousModifiedTempo, interpolatedMillisecondOffset));
+                    }
                     bpm = state.tempoChanges[tempoChangeIndex].bpm;
                     tempoChangeIndex++;
                 }
+                deltaTick = p.tick - absTick;
+                absTick += deltaTick;
+                absTime += deltaTick * (60000.0 / (bpm * state.division));
+                state.syncPoints.push(new BackingTrackSyncPointWithTime(p.tick, absTime, p.data.modifiedTempo, p.data.millisecondOffset));
             }
         }
         state.syncPointIndex = 0;
@@ -22616,7 +22629,7 @@ class MidiFileSequencer {
         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);
+        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;
     }
@@ -22636,16 +22649,16 @@ class MidiFileSequencer {
         const syncPoints = state.syncPoints;
         if (syncPoints.length > 0) {
             let syncPointIndex = Math.min(state.syncPointIndex, syncPoints.length - 1);
-            if (timePosition < syncPoints[syncPointIndex].data.millisecondOffset) {
+            if (timePosition < syncPoints[syncPointIndex].millisecondOffset) {
                 syncPointIndex = 0;
             }
             while (syncPointIndex + 1 < syncPoints.length &&
-                syncPoints[syncPointIndex + 1].data.millisecondOffset <= timePosition) {
+                syncPoints[syncPointIndex + 1].millisecondOffset <= timePosition) {
                 syncPointIndex++;
             }
             if (syncPointIndex !== state.syncPointIndex) {
                 state.syncPointIndex = syncPointIndex;
-                state.modifiedTempo = syncPoints[syncPointIndex].data.modifiedTempo;
+                state.modifiedTempo = syncPoints[syncPointIndex].modifiedTempo;
             }
         }
         else {
@@ -22661,18 +22674,18 @@ class MidiFileSequencer {
         this.updateCurrentTempo(this._mainState, timePosition);
         const syncPointIndex = Math.min(mainState.syncPointIndex, syncPoints.length - 1);
         const currentSyncPoint = syncPoints[syncPointIndex];
-        const timeDiff = timePosition - currentSyncPoint.data.millisecondOffset;
+        const timeDiff = timePosition - currentSyncPoint.millisecondOffset;
         let alphaTabTimeDiff;
         if (syncPointIndex + 1 < syncPoints.length) {
             const nextSyncPoint = syncPoints[syncPointIndex + 1];
-            const relativeTimeDiff = timeDiff / (nextSyncPoint.data.millisecondOffset - currentSyncPoint.data.millisecondOffset);
-            alphaTabTimeDiff = (nextSyncPoint.time - currentSyncPoint.time) * relativeTimeDiff;
+            const relativeTimeDiff = timeDiff / (nextSyncPoint.millisecondOffset - currentSyncPoint.millisecondOffset);
+            alphaTabTimeDiff = (nextSyncPoint.alphaTabTime - currentSyncPoint.alphaTabTime) * relativeTimeDiff;
         }
         else {
-            const relativeTimeDiff = timeDiff / (backingTrackLength - currentSyncPoint.data.millisecondOffset);
-            alphaTabTimeDiff = (mainState.endTime - currentSyncPoint.time) * relativeTimeDiff;
+            const relativeTimeDiff = timeDiff / (backingTrackLength - currentSyncPoint.millisecondOffset);
+            alphaTabTimeDiff = (mainState.endTime - currentSyncPoint.alphaTabTime) * relativeTimeDiff;
         }
-        return (currentSyncPoint.time + alphaTabTimeDiff) / this.playbackSpeed;
+        return (currentSyncPoint.alphaTabTime + alphaTabTimeDiff) / this.playbackSpeed;
     }
     mainTimePositionToBackingTrack(timePosition, backingTrackLength) {
         const mainState = this._mainState;
@@ -22682,25 +22695,27 @@ class MidiFileSequencer {
         }
         timePosition *= this.playbackSpeed;
         let syncPointIndex = Math.min(mainState.syncPointIndex, syncPoints.length - 1);
-        if (timePosition < syncPoints[syncPointIndex].time) {
+        if (timePosition < syncPoints[syncPointIndex].alphaTabTime) {
             syncPointIndex = 0;
         }
-        while (syncPointIndex + 1 < syncPoints.length && syncPoints[syncPointIndex + 1].time <= timePosition) {
+        while (syncPointIndex + 1 < syncPoints.length && syncPoints[syncPointIndex + 1].alphaTabTime <= timePosition) {
             syncPointIndex++;
         }
+        // NOTE: this logic heavily relies on the interpolation done in mainUpdateSyncPoints
+        // we ensure that we have a linear increase between two points
         const currentSyncPoint = syncPoints[syncPointIndex];
-        const alphaTabTimeDiff = timePosition - currentSyncPoint.time;
+        const alphaTabTimeDiff = timePosition - currentSyncPoint.alphaTabTime;
         let backingTrackPos;
         if (syncPointIndex + 1 < syncPoints.length) {
             const nextSyncPoint = syncPoints[syncPointIndex + 1];
-            const relativeAlphaTabTimeDiff = alphaTabTimeDiff / (nextSyncPoint.time - currentSyncPoint.time);
-            const backingTrackDiff = nextSyncPoint.data.millisecondOffset - currentSyncPoint.data.millisecondOffset;
-            backingTrackPos = currentSyncPoint.data.millisecondOffset + backingTrackDiff * relativeAlphaTabTimeDiff;
+            const relativeAlphaTabTimeDiff = alphaTabTimeDiff / (nextSyncPoint.alphaTabTime - currentSyncPoint.alphaTabTime);
+            const backingTrackDiff = nextSyncPoint.millisecondOffset - currentSyncPoint.millisecondOffset;
+            backingTrackPos = currentSyncPoint.millisecondOffset + backingTrackDiff * relativeAlphaTabTimeDiff;
         }
         else {
-            const relativeAlphaTabTimeDiff = alphaTabTimeDiff / (mainState.endTime - currentSyncPoint.time);
-            const frameDiff = backingTrackLength - currentSyncPoint.data.millisecondOffset;
-            backingTrackPos = currentSyncPoint.data.millisecondOffset + frameDiff * relativeAlphaTabTimeDiff;
+            const relativeAlphaTabTimeDiff = alphaTabTimeDiff / (mainState.endTime - currentSyncPoint.alphaTabTime);
+            const frameDiff = backingTrackLength - currentSyncPoint.millisecondOffset;
+            backingTrackPos = currentSyncPoint.millisecondOffset + frameDiff * relativeAlphaTabTimeDiff;
         }
         return backingTrackPos;
     }
@@ -28582,7 +28597,9 @@ class AlphaSynthBase {
     hasSamplesForPercussion(key) {
         return this.synthesizer.hasSamplesForPercussion(key);
     }
-    loadBackingTrack(_score, _syncPoints) {
+    loadBackingTrack(_score) {
+    }
+    updateSyncPoints(_syncPoints) {
     }
 }
 /**
@@ -29070,7 +29087,7 @@ class Font {
         }
         switch (typeof v) {
             case 'undefined':
-                return null;
+                return undefined;
             case 'object': {
                 const m = v;
                 const families = m.get('families');
@@ -29150,10 +29167,13 @@ class Font {
                 return Font.withFamilyList(families, fontSize, fontStyle, fontWeight);
             }
             default:
-                return null;
+                return undefined;
         }
     }
     static toJson(font) {
+        if (!font) {
+            return undefined;
+        }
         const o = new Map();
         o.set('families', font.families);
         o.set('size', font.size);
@@ -30160,6 +30180,14 @@ class CoreSettingsSerializer {
         /*@target web*/
         o.set("fontdirectory", obj.fontDirectory);
         /*@target web*/
+        if (obj.smuflFontSources !== null) {
+            const m = new Map();
+            o.set("smuflfontsources", m);
+            for (const [k, v] of obj.smuflFontSources) {
+                m.set(k.toString(), v);
+            }
+        }
+        /*@target web*/
         o.set("file", obj.file);
         /*@target web*/
         o.set("tex", obj.tex);
@@ -30183,6 +30211,13 @@ class CoreSettingsSerializer {
                 obj.fontDirectory = v;
                 return true;
             /*@target web*/
+            case "smuflfontsources":
+                obj.smuflFontSources = new Map();
+                JsonHelper.forEach(v, (v, k) => {
+                    obj.smuflFontSources.set(JsonHelper.parseEnum(k, FontFileFormat), v);
+                });
+                return true;
+            /*@target web*/
             case "file":
                 obj.file = v;
                 return true;
@@ -30226,6 +30261,7 @@ class RenderingResourcesSerializer {
             return null;
         }
         const o = new Map();
+        o.set("smuflfont", Font.toJson(obj.smuflFont));
         o.set("copyrightfont", Font.toJson(obj.copyrightFont));
         o.set("titlefont", Font.toJson(obj.titleFont));
         o.set("subtitlefont", Font.toJson(obj.subTitleFont));
@@ -30252,6 +30288,9 @@ class RenderingResourcesSerializer {
     }
     static setProperty(obj, property, v) {
         switch (property) {
+            case "smuflfont":
+                obj.smuflFont = Font.fromJson(v);
+                return true;
             case "copyrightfont":
                 obj.copyrightFont = Font.fromJson(v);
                 return true;
@@ -32457,15 +32496,9 @@ class BackingTrackSerializer {
             return null;
         }
         const o = new Map();
-        o.set("padding", obj.padding);
         return o;
     }
     static setProperty(obj, property, v) {
-        switch (property) {
-            case "padding":
-                obj.padding = v;
-                return true;
-        }
         return false;
     }
 }
@@ -34229,15 +34262,6 @@ class Html5Canvas {
         this._color = new Color(0, 0, 0, 0xff);
         this._font = new Font('Arial', 10, FontStyle.Plain);
         this._lineWidth = 0;
-        const fontElement = document.createElement('span');
-        fontElement.classList.add('at');
-        document.body.appendChild(fontElement);
-        const style = window.getComputedStyle(fontElement);
-        let family = style.fontFamily;
-        if (family.startsWith('"') || family.startsWith("'")) {
-            family = family.substr(1, family.length - 2);
-        }
-        this._musicFont = new Font(family, Number.parseFloat(style.fontSize), FontStyle.Plain);
         this._measureCanvas = document.createElement('canvas');
         this._measureCanvas.width = 10;
         this._measureCanvas.height = 10;
@@ -34252,6 +34276,7 @@ class Html5Canvas {
         return null;
     }
     beginRender(width, height) {
+        this._musicFont = this.settings.display.resources.smuflFont;
         const scale = this.settings.display.scale;
         this._canvas = document.createElement('canvas');
         this._canvas.width = (width * Environment.HighDpiFactor) | 0;
@@ -34936,7 +34961,13 @@ class MasterBarTickLookup {
          * Gets the list of tempo changes within the tick lookup.
          */
         this.tempoChanges = [];
+        /**
+         * The first beat in the bar.
+         */
         this.firstBeat = null;
+        /**
+         * The last beat in the bar.
+         */
         this.lastBeat = null;
         /**
          * Gets or sets the {@link MasterBarTickLookup} of the next masterbar in the {@link Score}
@@ -35350,14 +35381,13 @@ class MidiTickLookup {
     constructor() {
         this._currentMasterBar = null;
         /**
-         * Gets a dictionary of all master bars played. The index is the index equals to {@link MasterBar.index}.
+         * A dictionary of all master bars played. The index is the index equals to {@link MasterBar.index}.
          * This lookup only contains the first time a MasterBar is played. For a whole sequence of the song refer to {@link MasterBars}.
          * @internal
          */
         this.masterBarLookup = new Map();
         /**
-         * Gets a list of all {@link MasterBarTickLookup} sorted by time.
-         * @internal
+         * A list of all {@link MasterBarTickLookup} sorted by time.
          */
         this.masterBars = [];
         /**
@@ -35731,6 +35761,17 @@ class MidiTickLookup {
     }
 }
 
+/**
+ * Rerpresents a point to sync the alphaTab time axis with an external backing track.
+ */
+class BackingTrackSyncPoint {
+    constructor(tick, data) {
+        this.tick = 0;
+        this.tick = tick;
+        this.data = data;
+    }
+}
+
 class MidiNoteDuration {
     constructor() {
         this.noteOnly = 0;
@@ -35800,62 +35841,22 @@ class MidiFileGenerator {
             this.generateTrack(track);
         }
         Logger.debug('Midi', 'Begin midi generation');
-        const controller = new MidiPlaybackController(this._score);
-        let previousMasterBar = null;
-        let currentTempo = this._score.tempo;
-        // store the previous played bar for repeats
-        const barOccurence = new Map();
-        while (!controller.finished) {
-            const index = controller.index;
-            const bar = this._score.masterBars[index];
-            const currentTick = controller.currentTick;
-            controller.processCurrent();
-            if (controller.shouldPlay) {
-                let occurence = barOccurence.has(index) ? barOccurence.get(index) : -1;
-                occurence++;
-                barOccurence.set(index, occurence);
-                this.generateMasterBar(bar, previousMasterBar, currentTick, currentTempo, occurence);
-                if (bar.tempoAutomations.length > 0) {
-                    currentTempo = bar.tempoAutomations[0].value;
-                }
-                for (const track of this._score.tracks) {
-                    for (const staff of track.staves) {
-                        if (index < staff.bars.length) {
-                            this.generateBar(staff.bars[index], currentTick, currentTempo);
-                        }
+        this.syncPoints = [];
+        MidiFileGenerator.playThroughSong(this._score, this.syncPoints, (bar, previousMasterBar, currentTick, currentTempo, occurence) => {
+            this.generateMasterBar(bar, previousMasterBar, currentTick, currentTempo, occurence);
+        }, (index, currentTick, currentTempo) => {
+            for (const track of this._score.tracks) {
+                for (const staff of track.staves) {
+                    if (index < staff.bars.length) {
+                        this.generateBar(staff.bars[index], currentTick, currentTempo);
                     }
                 }
-                if (bar.tempoAutomations.length > 0) {
-                    currentTempo = bar.tempoAutomations[bar.tempoAutomations.length - 1].value;
-                }
             }
-            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));
+        }, endTick => {
+            for (const track of this._score.tracks) {
+                this._handler.finishTrack(track.index, endTick);
             }
-        }
-        for (const track of this._score.tracks) {
-            this._handler.finishTrack(track.index, controller.currentTick);
-        }
+        });
         Logger.debug('Midi', 'Midi generation done');
     }
     generateTrack(track) {
@@ -35900,6 +35901,81 @@ class MidiFileGenerator {
         this._handler.addControlChange(track.index, 0, channel, ControllerType.DataEntryCoarse, MidiFileGenerator.PitchBendRangeInSemitones);
         this.addProgramChange(track, 0, channel, playbackInfo.program);
     }
+    /**
+     * Generates the sync points for the given score without re-generating the midi itself.
+     * @remarks
+     * Use this method if a re-generation of the sync points after modification is required.
+     * It correctly handles repeats and places sync points accoridng to their absolute midi tick when they
+     * need to be considered for synchronization.
+     * @param score The song for which to regenerate the sync points.
+     * @returns The generated sync points for usage in the backing track playback.
+     */
+    static generateSyncPoints(score) {
+        const syncPoints = [];
+        MidiFileGenerator.playThroughSong(score, syncPoints, (_masterBar, _previousMasterBar, _currentTick, _currentTempo, _barOccurence) => {
+        }, (_barIndex, _currentTick, _currentTempo) => {
+        }, _endTick => {
+        });
+        return syncPoints;
+    }
+    static playThroughSong(score, syncPoints, generateMasterBar, generateTracks, finish) {
+        const controller = new MidiPlaybackController(score);
+        let currentTempo = score.tempo;
+        let previousMasterBar = null;
+        // store the previous played bar for repeats
+        const barOccurence = new Map();
+        while (!controller.finished) {
+            const index = controller.index;
+            const bar = score.masterBars[index];
+            const currentTick = controller.currentTick;
+            controller.processCurrent();
+            if (controller.shouldPlay) {
+                let occurence = barOccurence.has(index) ? barOccurence.get(index) : -1;
+                occurence++;
+                barOccurence.set(index, occurence);
+                generateMasterBar(bar, previousMasterBar, currentTick, currentTempo, occurence);
+                const barSyncPoints = bar.syncPoints;
+                if (barSyncPoints) {
+                    for (const syncPoint of barSyncPoints) {
+                        if (syncPoint.syncPointValue.barOccurence === occurence) {
+                            const tick = currentTick + bar.calculateDuration() * syncPoint.ratioPosition;
+                            syncPoints.push(new BackingTrackSyncPoint(tick, syncPoint.syncPointValue));
+                        }
+                    }
+                }
+                if (bar.tempoAutomations.length > 0) {
+                    currentTempo = bar.tempoAutomations[0].value;
+                }
+                generateTracks(index, currentTick, currentTempo);
+                if (bar.tempoAutomations.length > 0) {
+                    currentTempo = bar.tempoAutomations[bar.tempoAutomations.length - 1].value;
+                }
+            }
+            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 (syncPoints.length > 0) {
+            const lastSyncPoint = syncPoints[syncPoints.length - 1];
+            const remainingTicks = controller.currentTick - lastSyncPoint.tick;
+            if (remainingTicks > 0) {
+                const syncPointData = new SyncPointData();
+                // last occurence of the last bar
+                syncPointData.barOccurence = barOccurence.get(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);
+                syncPoints.push(new BackingTrackSyncPoint(controller.currentTick, syncPointData));
+            }
+        }
+        finish(controller.currentTick);
+    }
     static toChannelShort(data) {
         const value = Math.max(-32768, Math.min(32767, data * 8 - 1));
         return Math.max(value, -1) + 1;
@@ -38236,21 +38312,23 @@ class BackingTrackPlayer extends AlphaSynthBase {
             this._backingTrackOutput.seekTo(this.sequencer.mainTimePositionToBackingTrack(timePosition, this._backingTrackOutput.backingTrackDuration));
         }
     }
-    loadBackingTrack(score, syncPoints) {
+    loadBackingTrack(score) {
         const backingTrackInfo = score.backingTrack;
         if (backingTrackInfo) {
             this._backingTrackOutput.loadBackingTrack(backingTrackInfo);
-            this.sequencer.mainUpdateSyncPoints(syncPoints);
             this.timePosition = 0;
         }
     }
+    updateSyncPoints(syncPoints) {
+        this.sequencer.mainUpdateSyncPoints(syncPoints);
+        this.tickPosition = this.tickPosition;
+    }
 }
 
 class ExternalMediaSynthOutput {
     constructor() {
         // fake rate
         this.sampleRate = 44100;
-        this._padding = 0;
         this._seekPosition = 0;
         this.ready = new EventEmitter();
         this.samplesPlayed = new EventEmitterOfT();
@@ -38293,20 +38371,19 @@ class ExternalMediaSynthOutput {
     seekTo(time) {
         const handler = this.handler;
         if (handler) {
-            handler.seekTo(time - this._padding);
+            handler.seekTo(time);
         }
         else {
-            this._seekPosition = time - this._padding;
+            this._seekPosition = time;
         }
     }
-    loadBackingTrack(backingTrack) {
-        this._padding = backingTrack.padding;
+    loadBackingTrack(_backingTrack) {
     }
     open(_bufferTimeInMilliseconds) {
         this.ready.trigger();
     }
     updatePosition(currentTime) {
-        this.timeUpdate.trigger(currentTime + this._padding);
+        this.timeUpdate.trigger(currentTime);
     }
     play() {
         this.handler?.play();
@@ -38571,9 +38648,14 @@ class AlphaSynthWrapper {
             this._instance.loadMidiFile(midi);
         }
     }
-    loadBackingTrack(score, syncPoints) {
+    loadBackingTrack(score) {
         if (this._instance) {
-            this._instance.loadBackingTrack(score, syncPoints);
+            this._instance.loadBackingTrack(score);
+        }
+    }
+    updateSyncPoints(syncPoints) {
+        if (this._instance) {
+            this._instance.updateSyncPoints(syncPoints);
         }
     }
     applyTranspositionPitches(transpositionPitches) {
@@ -39902,7 +39984,7 @@ class AlphaTabApiBase {
     }
     appendRenderResult(result, isLast) {
         // resizing the canvas and wrapper elements at the end is enough
-        // it avoids flickering on resizes and re-renders. 
+        // it avoids flickering on resizes and re-renders.
         // the individual partials are anyhow sized correctly
         if (isLast) {
             this.canvasElement.width = result.totalWidth;
@@ -40664,9 +40746,23 @@ class AlphaTabApiBase {
         this.onMidiLoad(midiFile);
         const player = this._player;
         player.loadMidiFile(midiFile);
-        player.loadBackingTrack(score, generator.syncPoints);
+        player.loadBackingTrack(score);
+        player.updateSyncPoints(generator.syncPoints);
         player.applyTranspositionPitches(generator.transpositionPitches);
     }
+    /**
+     * Triggers an update of the sync points for the current score after modification within the data model
+     * @category Methods - Player
+     * @since 1.6.0
+     */
+    updateSyncPoints() {
+        if (!this.score) {
+            return;
+        }
+        const score = this.score;
+        const player = this._player;
+        player.updateSyncPoints(MidiFileGenerator.generateSyncPoints(score));
+    }
     /**
      * Changes the volume of the given tracks.
      * @param tracks The tracks for which the volume should be changed.
@@ -43334,6 +43430,8 @@ class AlphaSynthWebWorkerApi {
     }
     loadBackingTrack(_score) {
     }
+    updateSyncPoints(_syncPoints) {
+    }
 }
 
 /**
@@ -43708,7 +43806,6 @@ class AudioElementBackingTrackSynthOutput {
     constructor() {
         // fake rate
         this.sampleRate = 44100;
-        this._padding = 0;
         this._updateInterval = 0;
         this.ready = new EventEmitter();
         this.samplesPlayed = new EventEmitterOfT();
@@ -43732,13 +43829,12 @@ class AudioElementBackingTrackSynthOutput {
         this.audioElement.volume = value;
     }
     seekTo(time) {
-        this.audioElement.currentTime = time / 1000 - this._padding;
+        this.audioElement.currentTime = time / 1000;
     }
     loadBackingTrack(backingTrack) {
         if (this.audioElement?.src) {
             URL.revokeObjectURL(this.audioElement.src);
         }
-        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. 
@@ -43757,7 +43853,7 @@ class AudioElementBackingTrackSynthOutput {
         this.ready.trigger();
     }
     updatePosition() {
-        const timePos = (this.audioElement.currentTime + this._padding) * 1000;
+        const timePos = this.audioElement.currentTime * 1000;
         this.timeUpdate.trigger(timePos);
     }
     play() {
@@ -43843,10 +43939,6 @@ class BrowserUiFacade {
         return this.areAllFontsLoaded();
     }
     areAllFontsLoaded() {
-        Environment.bravuraFontChecker.checkForFontAvailability();
-        if (!Environment.bravuraFontChecker.isFontLoaded) {
-            return false;
-        }
         let isAnyNotLoaded = false;
         for (const checker of this._fontCheckers.values()) {
             if (!checker.isFontLoaded) {
@@ -43883,7 +43975,6 @@ class BrowserUiFacade {
         rootElement.classList.add('alphaTab');
         this.rootContainer = new HtmlElementContainer(rootElement);
         this.areWorkersSupported = 'Worker' in window;
-        Environment.bravuraFontChecker.fontLoaded.on(this.onFontLoaded.bind(this));
         this._intersectionObserver = new IntersectionObserver(this.onElementVisibilityChanged.bind(this), {
             threshold: [0, 0.01, 1]
         });
@@ -43951,7 +44042,7 @@ class BrowserUiFacade {
             this._contents = element.element.innerHTML;
             element.element.innerHTML = '';
         }
-        this.createStyleElement(settings);
+        this.createStyleElements(settings);
         this._file = settings.core.file;
     }
     setupFontCheckers(settings) {
@@ -43977,10 +44068,16 @@ class BrowserUiFacade {
     }
     destroy() {
         this.rootContainer.element.innerHTML = '';
+        const webFont = this._webFont;
+        webFont.usages--;
+        if (webFont.usages <= 0) {
+            webFont.element.remove();
+            BrowserUiFacade._registeredWebFonts.delete(webFont.hash);
+        }
     }
     createCanvasElement() {
         const canvasElement = document.createElement('div');
-        canvasElement.className = 'at-surface';
+        canvasElement.classList.add('at-surface', `at${this._webFont.fontSuffix}`);
         canvasElement.style.fontSize = '0';
         canvasElement.style.overflow = 'hidden';
         canvasElement.style.lineHeight = '0';
@@ -44078,9 +44175,133 @@ class BrowserUiFacade {
             initialRender();
         }
     }
-    createStyleElement(settings) {
-        const elementDocument = this._api.container.element.ownerDocument;
-        Environment.createStyleElement(elementDocument, settings.core.fontDirectory);
+    createStyleElements(settings) {
+        const root = this._api.container.element.ownerDocument;
+        BrowserUiFacade.createSharedStyleElement(root);
+        // SmuFl Font Specific style
+        const smuflFontSources = settings.core.smuflFontSources ?? CoreSettings.buildDefaultSmuflFontSources(settings.core.fontDirectory);
+        // create a simple unique hash for the font source definition
+        // as data urls might be used we don't want to just use the plain strings.
+        const hash = BrowserUiFacade.cyrb53(smuflFontSources.values());
+        // reuse existing style if available
+        const registeredWebFonts = BrowserUiFacade._registeredWebFonts;
+        if (registeredWebFonts.has(hash)) {
+            const webFont = registeredWebFonts.get(hash);
+            webFont.usages++;
+            webFont.checker.fontLoaded.on(this.onFontLoaded.bind(this));
+            this._webFont = webFont;
+            return;
+        }
+        const fontSuffix = registeredWebFonts.size === 0 ? '' : String(registeredWebFonts.size);
+        const familyName = `alphaTab${fontSuffix}`;
+        const src = Array.from(smuflFontSources.entries())
+            .map(e => `url(${JSON.stringify(e[1])}) format('${BrowserUiFacade.cssFormat(e[0])}')`)
+            .join(',');
+        const css = `
+            @font-face {
+                font-display: block;
+                font-family: '${familyName}';
+                src: ${src};
+                font-weight: normal;
+                font-style: normal;
+            }
+            .at-surface.at${fontSuffix} .at {
+                font-family: '${familyName}';
+                speak: none;
+                font-style: normal;
+                font-weight: normal;
+                font-variant: normal;
+                text-transform: none;
+                line-height: 1;
+                line-height: 1;
+                -webkit-font-smoothing: antialiased;
+                -moz-osx-font-smoothing: grayscale;
+                font-size: ${Environment.MusicFontSize}px;
+                overflow: visible !important;
+            }`;
+        const styleElement = root.createElement('style');
+        styleElement.id = `alphaTabStyle${fontSuffix}`;
+        styleElement.innerHTML = css;
+        root.getElementsByTagName('head').item(0).appendChild(styleElement);
+        const checker = new FontLoadingChecker([familyName]);
+        checker.fontLoaded.on(this.onFontLoaded.bind(this));
+        this._fontCheckers.set(familyName, checker);
+        checker.checkForFontAvailability();
+        settings.display.resources.smuflFont = new Font(familyName, Environment.MusicFontSize, FontStyle.Plain, FontWeight.Regular);
+        const webFont = {
+            hash,
+            element: styleElement,
+            fontSuffix,
+            usages: 1,
+            checker
+        };
+        registeredWebFonts.set(hash, webFont);
+        this._webFont = webFont;
+    }
+    static cssFormat(format) {
+        switch (format) {
+            case FontFileFormat.EmbeddedOpenType:
+                return 'embedded-opentype';
+            case FontFileFormat.Woff:
+                return 'woff';
+            case FontFileFormat.Woff2:
+                return 'woff2';
+            case FontFileFormat.OpenType:
+                return 'opentype';
+            case FontFileFormat.TrueType:
+                return 'truetype';
+            case FontFileFormat.Svg:
+                return 'svg';
+        }
+    }
+    /**
+     * cyrb53 (c) 2018 bryc (github.com/bryc)
+     * License: Public domain (or MIT if needed). Attribution appreciated.
+     * A fast and simple 53-bit string hash function with decent collision resistance.
+     * Largely inspired by MurmurHash2/3, but with a focus on speed/simplicity
+     * @param str
+     * @param seed
+     * @returns
+     */
+    static cyrb53(strings, seed = 0) {
+        let h1 = 0xdeadbeef ^ seed;
+        let h2 = 0x41c6ce57 ^ seed;
+        for (const str of strings) {
+            for (let i = 0; i < str.length; i++) {
+                const ch = str.charCodeAt(i);
+                h1 = Math.imul(h1 ^ ch, 2654435761);
+                h2 = Math.imul(h2 ^ ch, 1597334677);
+            }
+        }
+        h1 = Math.imul(h1 ^ (h1 >>> 16), 2246822507);
+        h1 ^= Math.imul(h2 ^ (h2 >>> 13), 3266489909);
+        h2 = Math.imul(h2 ^ (h2 >>> 16), 2246822507);
+        h2 ^= Math.imul(h1 ^ (h1 >>> 13), 3266489909);
+        return 4294967296 * (2097151 & h2) + (h1 >>> 0);
+    }
+    /**
+     * Creates the default CSS styles used across all alphaTab instances.
+     * @target web
+     * @internal
+     */
+    static createSharedStyleElement(root) {
+        let styleElement = root.getElementById('alphaTabStyle');
+        if (!styleElement) {
+            styleElement = document.createElement('style');
+            styleElement.id = 'alphaTabStyleShared';
+            const css = `
+                .at-surface * {
+                    cursor: default;
+                    vertical-align: top;
+                    overflow: visible;
+                }
+                .at-surface-svg text {
+                    dominant-baseline: central;
+                    white-space:pre;
+                }`;
+            styleElement.innerHTML = css;
+            document.getElementsByTagName('head').item(0).appendChild(styleElement);
+        }
     }
     parseTracks(tracksData) {
         if (!tracksData) {
@@ -44462,6 +44683,7 @@ class BrowserUiFacade {
         return new BackingTrackPlayer(new AudioElementBackingTrackSynthOutput(), this._api.settings.player.bufferTimeInMilliseconds);
     }
 }
+BrowserUiFacade._registeredWebFonts = new Map();
 
 /**
  * Represents the progress of any data being loaded.
@@ -60719,9 +60941,9 @@ class VersionInfo {
         print(`build date: ${VersionInfo.date}`);
     }
 }
-VersionInfo.version = '1.6.0-alpha.1416';
-VersionInfo.date = '2025-05-19T16:41:23.634Z';
-VersionInfo.commit = '4aff072e1be5292482c3d77f434dd1555b6cbb8d';
+VersionInfo.version = '1.6.0-alpha.1420';
+VersionInfo.date = '2025-05-22T03:03:04.057Z';
+VersionInfo.commit = '230bdd455a1906e6f334b63bad3b8cf773f890e6';
 
 /**
  * A factory for custom layout engines.
@@ -60753,59 +60975,6 @@ class RenderEngineFactory {
  * @partial
  */
 class Environment {
-    /**
-     * @target web
-     * @internal
-     */
-    static createStyleElement(elementDocument, fontDirectory) {
-        let styleElement = elementDocument.getElementById('alphaTabStyle');
-        if (!styleElement) {
-            if (!fontDirectory) {
-                Logger.error('AlphaTab', 'Font directory could not be detected, cannot create style element');
-                return;
-            }
-            styleElement = elementDocument.createElement('style');
-            styleElement.id = 'alphaTabStyle';
-            const css = `
-            @font-face {
-                font-display: block;
-                font-family: 'alphaTab';
-                 src: url('${fontDirectory}Bravura.eot');
-                 src: url('${fontDirectory}Bravura.eot?#iefix') format('embedded-opentype')
-                      , url('${fontDirectory}Bravura.woff') format('woff')
-                      , url('${fontDirectory}Bravura.otf') format('opentype')
-                      , url('${fontDirectory}Bravura.svg#Bravura') format('svg');
-                 font-weight: normal;
-                 font-style: normal;
-            }
-            .at-surface * {
-                cursor: default;
-                vertical-align: top;
-                overflow: visible;
-            }
-            .at-surface-svg text {
-                dominant-baseline: central;
-                white-space:pre;
-            }
-            .at {
-                 font-family: 'alphaTab';
-                 speak: none;
-                 font-style: normal;
-                 font-weight: normal;
-                 font-variant: normal;
-                 text-transform: none;
-                 line-height: 1;
-                 line-height: 1;
-                 -webkit-font-smoothing: antialiased;
-                 -moz-osx-font-smoothing: grayscale;
-                 font-size: ${Environment.MusicFontSize}px;
-                 overflow: visible !important;
-            }`;
-            styleElement.innerHTML = css;
-            elementDocument.getElementsByTagName('head').item(0).appendChild(styleElement);
-            Environment.bravuraFontChecker.checkForFontAvailability();
-        }
-    }
     /**
      * @target web
      * @internal
@@ -60881,7 +61050,9 @@ class Environment {
         catch (e) {
         }
         // normal browser include as <script>
-        if ('document' in Environment.globalThis && document.currentScript) {
+        if ('document' in Environment.globalThis &&
+            document.currentScript &&
+            document.currentScript instanceof HTMLScriptElement) {
             return document.currentScript.src;
         }
         return null;
@@ -61359,11 +61530,6 @@ Environment.scriptFile = Environment.detectScriptFile();
  * @target web
  */
 Environment.fontDirectory = Environment.detectFontDirectory();
-/**
- * @target web
- * @internal
- */
-Environment.bravuraFontChecker = new FontLoadingChecker(['alphaTab']);
 Environment.renderEngines = Environment.createDefaultRenderEngines();
 /**
  * @internal
@@ -61374,12 +61540,58 @@ Environment.layoutEngines = Environment.createDefaultLayoutEngines();
  */
 Environment.staveProfiles = Environment.createDefaultStaveProfiles();
 
+/**
+ * Lists the known file formats for font files.
+ * @target web
+ */
+var FontFileFormat;
+(function (FontFileFormat) {
+    /**
+     * .eot
+     */
+    FontFileFormat[FontFileFormat["EmbeddedOpenType"] = 0] = "EmbeddedOpenType";
+    /**
+     * .woff
+     */
+    FontFileFormat[FontFileFormat["Woff"] = 1] = "Woff";
+    /**
+     * .woff2
+     */
+    FontFileFormat[FontFileFormat["Woff2"] = 2] = "Woff2";
+    /**
+     * .otf
+     */
+    FontFileFormat[FontFileFormat["OpenType"] = 3] = "OpenType";
+    /**
+     * .ttf
+     */
+    FontFileFormat[FontFileFormat["TrueType"] = 4] = "TrueType";
+    /**
+     * .svg
+     */
+    FontFileFormat[FontFileFormat["Svg"] = 5] = "Svg";
+})(FontFileFormat || (FontFileFormat = {}));
 /**
  * All main settings of alphaTab controlling rather general aspects of its behavior.
  * @json
  * @json_declaration
  */
 class CoreSettings {
+    /**
+     * Builds the default SMuFL font sources for the usage with alphaTab in cases
+     * where no custom {@link smuflFontSources} are provided.
+     * @param fontDirectory The {@link fontDirectory} configured.
+     * @target web
+     */
+    static buildDefaultSmuflFontSources(fontDirectory) {
+        const map = new Map();
+        // WOFF, WOFF2 and OTF should cover all our platform needs
+        const prefix = fontDirectory ?? '';
+        map.set(FontFileFormat.Woff2, `${prefix}Bravura.woff2`);
+        map.set(FontFileFormat.Woff, `${prefix}Bravura.woff`);
+        map.set(FontFileFormat.OpenType, `${prefix}Bravura.otf`);
+        return map;
+    }
     /**
      * @target web
      */
@@ -61405,12 +61617,27 @@ class CoreSettings {
          * where the Web Font files of [Bravura](https://github.com/steinbergmedia/bravura) are. Normally alphaTab expects
          * them to be in a `font` subfolder beside the script file. If this is not the case, this setting must be used to configure the path.
          * Alternatively also a global variable `ALPHATAB_FONT` can be set on the page before initializing alphaTab.
+         *
+         * Use {@link smuflFontSources} for more flexible font configuration.
          * @defaultValue `"${AlphaTabScriptFolder}/font/"`
          * @category Core - JavaScript Specific
          * @target web
          * @since 0.9.6
          */
         this.fontDirectory = null;
+        /**
+         * Defines the URLs from which to load the SMuFL compliant font files.
+         * @remarks
+         * These sources will be used to load and register the webfonts on the page so
+         * they are available for rendering the music sheet. The sources can be set to any
+         * CSS compatible URL which can be passed into `url()`.
+         * See https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/src#url
+         * @defaultValue Bravura files located at {@link fontDirectory} .
+         * @category Core - JavaScript Specific
+         * @target web
+         * @since 1.6.0
+         */
+        this.smuflFontSources = null;
         /**
          * The full URL to the input file to be loaded.
          * @remarks
@@ -65053,4 +65280,4 @@ const _jsonbarrel = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.definePropert
     __proto__: null
 }, Symbol.toStringTag, { value: 'Module' }));
 
-export { AlphaTabApi, AlphaTabApiBase, AlphaTabError, AlphaTabErrorType, ConsoleLogger, CoreSettings, DisplaySettings, Environment, FileLoadError, FingeringMode, FormatError, ImporterSettings, LayoutMode, LogLevel, Logger, NotationElement, NotationMode, NotationSettings, PlayerMode, PlayerOutputMode, PlayerSettings, ProgressEventArgs, RenderEngineFactory, RenderingResources, ResizeEventArgs, ScrollMode, Settings, SlidePlaybackSettings, StaveProfile, SystemsLayoutMode, TabRhythmMode, VibratoPlaybackSettings, WebPlatform, _barrel$5 as exporter, _barrel$7 as importer, _barrel$6 as io, _jsonbarrel as json, VersionInfo as meta, _barrel$4 as midi, _barrel$3 as model, _barrel$1 as platform, _barrel$2 as rendering, _barrel as synth };
+export { AlphaTabApi, AlphaTabApiBase, AlphaTabError, AlphaTabErrorType, ConsoleLogger, CoreSettings, DisplaySettings, Environment, FileLoadError, FingeringMode, FontFileFormat, FormatError, ImporterSettings, LayoutMode, LogLevel, Logger, NotationElement, NotationMode, NotationSettings, PlayerMode, PlayerOutputMode, PlayerSettings, ProgressEventArgs, RenderEngineFactory, RenderingResources, ResizeEventArgs, ScrollMode, Settings, SlidePlaybackSettings, StaveProfile, SystemsLayoutMode, TabRhythmMode, VibratoPlaybackSettings, WebPlatform, _barrel$5 as exporter, _barrel$7 as importer, _barrel$6 as io, _jsonbarrel as json, VersionInfo as meta, _barrel$4 as midi, _barrel$3 as model, _barrel$1 as platform, _barrel$2 as rendering, _barrel as synth };