@coderline/alphatab 1.3.0-alpha.140 → 1.3.0-alpha.141

package/dist/alphaTab.d.ts

@@ -4730,6 +4730,7 @@ declare class AlphaTabApiBase<TSettings> {
     private _previousTick;
     private _playerState;
     private _currentBeat;
+    private _currentBarBounds;
     private _previousStateForCursor;
     private _previousCursorCache;
     private _lastScroll;
@@ -4739,12 +4740,18 @@ declare class AlphaTabApiBase<TSettings> {
      * updates the cursors to highlight the beat at the specified tick position
      * @param tick
      * @param stop
+     * @param shouldScroll whether we should scroll to the bar (if scrolling is active)
      */
     private cursorUpdateTick;
     /**
      * updates the cursors to highlight the specified beat
      */
     private cursorUpdateBeat;
+    /**
+     * Initiates a scroll to the cursor
+     */
+    scrollToCursor(): void;
+    internalScrollToCursor(barBoundings: MasterBarBounds): void;
     private internalCursorUpdateBeat;
     playedBeatChanged: IEventEmitterOfT<Beat>;
     private onPlayedBeatChanged;
@@ -6151,7 +6158,7 @@ declare class StaveGroup {
     paint(cx: number, cy: number, canvas: ICanvas): void;
     paintPartial(cx: number, cy: number, canvas: ICanvas, startIndex: number, count: number): void;
     finalizeGroup(): void;
-    private buildBoundingsLookup;
+    buildBoundingsLookup(cx: number, cy: number): void;
     getBarX(index: number): number;
 }
 
@@ -6428,7 +6435,7 @@ declare class TuningContainerGlyph extends RowContainerGlyph {
 }
 
 /**
- * This is the base public class for creating new layouting engines for the score renderer.
+ * This is the base class for creating new layouting engines for the score renderer.
  */
 declare abstract class ScoreLayout {
     private _barRendererLookup;
@@ -6472,6 +6479,9 @@ declare class ScoreRenderer implements IScoreRenderer {
     canvas: ICanvas | null;
     score: Score | null;
     tracks: Track[] | null;
+    /**
+     * @internal
+     */
     layout: ScoreLayout | null;
     settings: Settings;
     boundsLookup: BoundsLookup | null;

package/dist/alphaTab.js

@@ -1,7 +1,7 @@
 /**
- * alphaTab v1.3.0-alpha.140 (develop, build 140)
+ * alphaTab v1.3.0-alpha.141 (develop, build 141)
  * 
- * Copyright © 2021, Daniel Kuschny and Contributors, All rights reserved.
+ * Copyright © 2022, Daniel Kuschny and Contributors, All rights reserved.
  * 
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
@@ -4585,7 +4585,12 @@
             if (this.masterBars.length !== 0) {
                 bar.previousMasterBar = this.masterBars[this.masterBars.length - 1];
                 bar.previousMasterBar.nextMasterBar = bar;
-                bar.start = bar.previousMasterBar.start + bar.previousMasterBar.calculateDuration();
+                // TODO: this will not work on anacrusis. Correct anacrusis durations are only working
+                // when there are beats with playback positions already computed which requires full finish
+                // chicken-egg problem here. temporarily forcing anacrusis length here to 0
+                bar.start =
+                    bar.previousMasterBar.start +
+                        (bar.previousMasterBar.isAnacrusis ? 0 : bar.previousMasterBar.calculateDuration());
             }
             // if the group is closed only the next upcoming header can
             // reopen the group in case of a repeat alternative, so we
@@ -14411,7 +14416,7 @@
             this.firstTimeSignatureNumerator = 0;
             this.firstTimeSignatureDenominator = 0;
             this.synthData = [];
-            this.division = 0;
+            this.division = MidiUtils.QuarterTime;
             this.eventIndex = 0;
             this.currentTime = 0;
             this.playbackRange = null;
@@ -14921,13 +14926,12 @@
             const samples = new Float32Array(samplesLeft);
             let samplesPos = 0;
             const sampleBuffer = new Uint8Array(2048);
-            const testBuffer = new Int16Array((sampleBuffer.length / 2) | 0);
             while (samplesLeft > 0) {
                 let samplesToRead = Math.min(samplesLeft, (sampleBuffer.length / 2) | 0);
                 reader.read(sampleBuffer, 0, samplesToRead * 2);
                 for (let i = 0; i < samplesToRead; i++) {
-                    testBuffer[i] = (sampleBuffer[i * 2 + 1] << 8) | sampleBuffer[i * 2];
-                    samples[samplesPos + i] = testBuffer[i] / 32767;
+                    const shortSample = TypeConversions.int32ToInt16((sampleBuffer[i * 2 + 1] << 8) | sampleBuffer[i * 2]);
+                    samples[samplesPos + i] = shortSample / 32767;
                 }
                 samplesLeft -= samplesToRead;
                 samplesPos += samplesToRead;
@@ -21513,6 +21517,9 @@
             this.canvas = null;
             this.score = null;
             this.tracks = null;
+            /**
+             * @internal
+             */
             this.layout = null;
             this.boundsLookup = null;
             this.width = 0;
@@ -24039,6 +24046,7 @@
             this._previousTick = 0;
             this._playerState = PlayerState.Paused;
             this._currentBeat = null;
+            this._currentBarBounds = null;
             this._previousStateForCursor = PlayerState.Paused;
             this._previousCursorCache = null;
             this._lastScroll = 0;
@@ -24641,7 +24649,7 @@
             this._playerState = PlayerState.Paused;
             // we need to update our position caches if we render a tablature
             this.renderer.postRenderFinished.on(() => {
-                this.cursorUpdateTick(this._previousTick, false);
+                this.cursorUpdateTick(this._previousTick, false, this._previousTick > 10);
             });
             if (this.player) {
                 this.player.positionChanged.on(e => {
@@ -24668,15 +24676,16 @@
          * updates the cursors to highlight the beat at the specified tick position
          * @param tick
          * @param stop
+         * @param shouldScroll whether we should scroll to the bar (if scrolling is active)
          */
-        cursorUpdateTick(tick, stop) {
+        cursorUpdateTick(tick, stop, shouldScroll = false) {
             let cache = this._tickCache;
             if (cache) {
                 let tracks = this.tracks;
                 if (tracks.length > 0) {
                     let beat = cache.findBeat(tracks, tick, this._currentBeat);
                     if (beat) {
-                        this.cursorUpdateBeat(beat, stop);
+                        this.cursorUpdateBeat(beat, stop, shouldScroll);
                     }
                 }
             }
@@ -24684,7 +24693,7 @@
         /**
          * updates the cursors to highlight the specified beat
          */
-        cursorUpdateBeat(lookupResult, stop) {
+        cursorUpdateBeat(lookupResult, stop, shouldScroll) {
             const beat = lookupResult.currentBeat;
             const nextBeat = lookupResult.nextBeat;
             const duration = lookupResult.duration;
@@ -24699,9 +24708,6 @@
             let previousBeat = this._currentBeat;
             let previousCache = this._previousCursorCache;
             let previousState = this._previousStateForCursor;
-            this._currentBeat = lookupResult;
-            this._previousCursorCache = cache;
-            this._previousStateForCursor = this._playerState;
             if (beat === (previousBeat === null || previousBeat === void 0 ? void 0 : previousBeat.currentBeat) && cache === previousCache && previousState === this._playerState) {
                 return;
             }
@@ -24709,15 +24715,81 @@
             if (!beatBoundings) {
                 return;
             }
+            // only if we really found some bounds we remember the beat and cache we used to
+            // actually show the cursor
+            this._currentBeat = lookupResult;
+            this._previousCursorCache = cache;
+            this._previousStateForCursor = this._playerState;
             this.uiFacade.beginInvoke(() => {
-                this.internalCursorUpdateBeat(beat, nextBeat, duration, stop, beatsToHighlight, cache, beatBoundings);
+                this.internalCursorUpdateBeat(beat, nextBeat, duration, stop, beatsToHighlight, cache, beatBoundings, shouldScroll);
             });
         }
-        internalCursorUpdateBeat(beat, nextBeat, duration, stop, beatsToHighlight, cache, beatBoundings) {
+        /**
+         * Initiates a scroll to the cursor
+         */
+        scrollToCursor() {
+            const barBounds = this._currentBarBounds;
+            if (barBounds) {
+                this.internalScrollToCursor(barBounds);
+            }
+        }
+        internalScrollToCursor(barBoundings) {
+            let scrollElement = this.uiFacade.getScrollContainer();
+            let isVertical = Environment.getLayoutEngineFactory(this.settings.display.layoutMode).vertical;
+            let mode = this.settings.player.scrollMode;
+            if (isVertical) {
+                // when scrolling on the y-axis, we preliminary check if the new beat/bar have
+                // moved on the y-axis
+                let y = barBoundings.realBounds.y + this.settings.player.scrollOffsetY;
+                if (y !== this._lastScroll) {
+                    this._lastScroll = y;
+                    switch (mode) {
+                        case exports.ScrollMode.Continuous:
+                            let elementOffset = this.uiFacade.getOffset(scrollElement, this.container);
+                            this.uiFacade.scrollToY(scrollElement, elementOffset.y + y, this.settings.player.scrollSpeed);
+                            break;
+                        case exports.ScrollMode.OffScreen:
+                            let elementBottom = scrollElement.scrollTop + this.uiFacade.getOffset(null, scrollElement).h;
+                            if (barBoundings.visualBounds.y + barBoundings.visualBounds.h >= elementBottom ||
+                                barBoundings.visualBounds.y < scrollElement.scrollTop) {
+                                let scrollTop = barBoundings.realBounds.y + this.settings.player.scrollOffsetY;
+                                this.uiFacade.scrollToY(scrollElement, scrollTop, this.settings.player.scrollSpeed);
+                            }
+                            break;
+                    }
+                }
+            }
+            else {
+                // when scrolling on the x-axis, we preliminary check if the new bar has
+                // moved on the x-axis
+                let x = barBoundings.visualBounds.x;
+                if (x !== this._lastScroll) {
+                    this._lastScroll = x;
+                    switch (mode) {
+                        case exports.ScrollMode.Continuous:
+                            let scrollLeftContinuous = barBoundings.realBounds.x + this.settings.player.scrollOffsetX;
+                            this._lastScroll = barBoundings.visualBounds.x;
+                            this.uiFacade.scrollToX(scrollElement, scrollLeftContinuous, this.settings.player.scrollSpeed);
+                            break;
+                        case exports.ScrollMode.OffScreen:
+                            let elementRight = scrollElement.scrollLeft + this.uiFacade.getOffset(null, scrollElement).w;
+                            if (barBoundings.visualBounds.x + barBoundings.visualBounds.w >= elementRight ||
+                                barBoundings.visualBounds.x < scrollElement.scrollLeft) {
+                                let scrollLeftOffScreen = barBoundings.realBounds.x + this.settings.player.scrollOffsetX;
+                                this._lastScroll = barBoundings.visualBounds.x;
+                                this.uiFacade.scrollToX(scrollElement, scrollLeftOffScreen, this.settings.player.scrollSpeed);
+                            }
+                            break;
+                    }
+                }
+            }
+        }
+        internalCursorUpdateBeat(beat, nextBeat, duration, stop, beatsToHighlight, cache, beatBoundings, shouldScroll) {
             let barCursor = this._barCursor;
             let beatCursor = this._beatCursor;
             let barBoundings = beatBoundings.barBounds.masterBarBounds;
             let barBounds = barBoundings.visualBounds;
+            this._currentBarBounds = barBoundings;
             barCursor.setBounds(barBounds.x, barBounds.y, barBounds.w, barBounds.h);
             // move beat to start position immediately
             if (this.settings.player.enableAnimatedBeatCursor) {
@@ -24728,90 +24800,45 @@
             if (this.settings.player.enableElementHighlighting) {
                 this.uiFacade.removeHighlights();
             }
-            if (this._playerState === PlayerState.Playing || stop) {
-                duration /= this.playbackSpeed;
-                if (!stop) {
-                    if (this.settings.player.enableElementHighlighting && beatsToHighlight) {
-                        for (let highlight of beatsToHighlight) {
-                            let className = BeatContainerGlyph.getGroupId(highlight);
-                            this.uiFacade.highlightElements(className, beat.voice.bar.index);
-                        }
-                    }
-                    if (this.settings.player.enableAnimatedBeatCursor) {
-                        let nextBeatX = barBoundings.visualBounds.x + barBoundings.visualBounds.w;
-                        // get position of next beat on same stavegroup
-                        if (nextBeat) {
-                            // if we are moving within the same bar or to the next bar
-                            // transition to the next beat, otherwise transition to the end of the bar.
-                            if ((nextBeat.voice.bar.index === beat.voice.bar.index && nextBeat.index > beat.index) ||
-                                nextBeat.voice.bar.index === beat.voice.bar.index + 1) {
-                                let nextBeatBoundings = cache.findBeat(nextBeat);
-                                if (nextBeatBoundings &&
-                                    nextBeatBoundings.barBounds.masterBarBounds.staveGroupBounds ===
-                                        barBoundings.staveGroupBounds) {
-                                    nextBeatX = nextBeatBoundings.visualBounds.x;
-                                }
-                            }
-                        }
-                        // 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, nextBeatX);
-                        });
-                    }
-                }
-                if (!this._beatMouseDown && this.settings.player.scrollMode !== exports.ScrollMode.Off) {
-                    let scrollElement = this.uiFacade.getScrollContainer();
-                    let isVertical = Environment.getLayoutEngineFactory(this.settings.display.layoutMode).vertical;
-                    let mode = this.settings.player.scrollMode;
-                    if (isVertical) {
-                        // when scrolling on the y-axis, we preliminary check if the new beat/bar have
-                        // moved on the y-axis
-                        let y = barBoundings.realBounds.y + this.settings.player.scrollOffsetY;
-                        if (y !== this._lastScroll) {
-                            this._lastScroll = y;
-                            switch (mode) {
-                                case exports.ScrollMode.Continuous:
-                                    let elementOffset = this.uiFacade.getOffset(scrollElement, this.container);
-                                    this.uiFacade.scrollToY(scrollElement, elementOffset.y + y, this.settings.player.scrollSpeed);
-                                    break;
-                                case exports.ScrollMode.OffScreen:
-                                    let elementBottom = scrollElement.scrollTop + this.uiFacade.getOffset(null, scrollElement).h;
-                                    if (barBoundings.visualBounds.y + barBoundings.visualBounds.h >= elementBottom ||
-                                        barBoundings.visualBounds.y < scrollElement.scrollTop) {
-                                        let scrollTop = barBoundings.realBounds.y + this.settings.player.scrollOffsetY;
-                                        this.uiFacade.scrollToY(scrollElement, scrollTop, this.settings.player.scrollSpeed);
-                                    }
-                                    break;
-                            }
-                        }
-                    }
-                    else {
-                        // when scrolling on the x-axis, we preliminary check if the new bar has
-                        // moved on the x-axis
-                        let x = barBoundings.visualBounds.x;
-                        if (x !== this._lastScroll) {
-                            this._lastScroll = x;
-                            switch (mode) {
-                                case exports.ScrollMode.Continuous:
-                                    let scrollLeftContinuous = barBoundings.realBounds.x + this.settings.player.scrollOffsetX;
-                                    this._lastScroll = barBoundings.visualBounds.x;
-                                    this.uiFacade.scrollToX(scrollElement, scrollLeftContinuous, this.settings.player.scrollSpeed);
-                                    break;
-                                case exports.ScrollMode.OffScreen:
-                                    let elementRight = scrollElement.scrollLeft + this.uiFacade.getOffset(null, scrollElement).w;
-                                    if (barBoundings.visualBounds.x + barBoundings.visualBounds.w >= elementRight ||
-                                        barBoundings.visualBounds.x < scrollElement.scrollLeft) {
-                                        let scrollLeftOffScreen = barBoundings.realBounds.x + this.settings.player.scrollOffsetX;
-                                        this._lastScroll = barBoundings.visualBounds.x;
-                                        this.uiFacade.scrollToX(scrollElement, scrollLeftOffScreen, this.settings.player.scrollSpeed);
-                                    }
-                                    break;
+            // actively playing? -> animate cursor and highlight items
+            let shouldNotifyBeatChange = false;
+            if (this._playerState === PlayerState.Playing && !stop) {
+                if (this.settings.player.enableElementHighlighting && beatsToHighlight) {
+                    for (let highlight of beatsToHighlight) {
+                        let className = BeatContainerGlyph.getGroupId(highlight);
+                        this.uiFacade.highlightElements(className, beat.voice.bar.index);
+                    }
+                }
+                if (this.settings.player.enableAnimatedBeatCursor) {
+                    let nextBeatX = barBoundings.visualBounds.x + barBoundings.visualBounds.w;
+                    // get position of next beat on same stavegroup
+                    if (nextBeat) {
+                        // if we are moving within the same bar or to the next bar
+                        // transition to the next beat, otherwise transition to the end of the bar.
+                        if ((nextBeat.voice.bar.index === beat.voice.bar.index && nextBeat.index > beat.index) ||
+                            nextBeat.voice.bar.index === beat.voice.bar.index + 1) {
+                            let nextBeatBoundings = cache.findBeat(nextBeat);
+                            if (nextBeatBoundings &&
+                                nextBeatBoundings.barBounds.masterBarBounds.staveGroupBounds ===
+                                    barBoundings.staveGroupBounds) {
+                                nextBeatX = nextBeatBoundings.visualBounds.x;
                             }
                         }
                     }
+                    // 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 / this.playbackSpeed, nextBeatX);
+                    });
                 }
-                // trigger an event for others to indicate which beat/bar is played
+                shouldScroll = !stop;
+                shouldNotifyBeatChange = true;
+            }
+            if (shouldScroll && !this._beatMouseDown && this.settings.player.scrollMode !== exports.ScrollMode.Off) {
+                this.internalScrollToCursor(barBoundings);
+            }
+            // trigger an event for others to indicate which beat/bar is played
+            if (shouldNotifyBeatChange) {
                 this.onPlayedBeatChanged(beat);
             }
         }
@@ -25118,8 +25145,10 @@
             if (this._isDestroyed) {
                 return;
             }
-            this.playerPositionChanged.trigger(e);
-            this.uiFacade.triggerEvent(this.container, 'playerPositionChanged', e);
+            if (this.score !== null && this.tracks.length > 0) {
+                this.playerPositionChanged.trigger(e);
+                this.uiFacade.triggerEvent(this.container, 'playerPositionChanged', e);
+            }
         }
         onMidiEventsPlayed(e) {
             if (this._isDestroyed) {
@@ -32042,7 +32071,6 @@
             this.paintPartial(cx + this.x, cy + this.y, canvas, 0, this.masterBarsRenderers.length);
         }
         paintPartial(cx, cy, canvas, startIndex, count) {
-            this.buildBoundingsLookup(cx, cy);
             for (let i = 0, j = this._allStaves.length; i < j; i++) {
                 this._allStaves[i].paint(cx, cy, canvas, startIndex, count);
             }
@@ -32300,7 +32328,7 @@
         }
     }
     /**
-     * This is the base public class for creating new layouting engines for the score renderer.
+     * This is the base class for creating new layouting engines for the score renderer.
      */
     class ScoreLayout {
         constructor(renderer) {
@@ -32514,7 +32542,7 @@
                 : this.firstBarX;
             e.y = y;
             e.totalWidth = this.width;
-            e.totalHeight = this.height;
+            e.totalHeight = y + height;
             e.firstMasterBarIndex = -1;
             e.lastMasterBarIndex = -1;
             this.registerPartial(e, canvas => {
@@ -32529,6 +32557,7 @@
 
     class HorizontalScreenLayoutPartialInfo {
         constructor() {
+            this.x = 0;
             this.width = 0;
             this.masterBars = [];
         }
@@ -32597,6 +32626,7 @@
             let countPerPartial = this.renderer.settings.display.barCountPerPartial;
             let partials = [];
             let currentPartial = new HorizontalScreenLayoutPartialInfo();
+            let renderX = 0;
             while (currentBarIndex <= endBarIndex) {
                 let result = this._group.addBars(this.renderer.tracks, currentBarIndex);
                 if (result) {
@@ -32606,6 +32636,8 @@
                         let previousPartial = partials[partials.length - 1];
                         previousPartial.masterBars.push(score.masterBars[currentBarIndex]);
                         previousPartial.width += result.width;
+                        renderX += result.width;
+                        currentPartial.x += renderX;
                     }
                     else {
                         currentPartial.masterBars.push(score.masterBars[currentBarIndex]);
@@ -32613,14 +32645,17 @@
                         // no targetPartial here because previous partials already handled this code
                         if (currentPartial.masterBars.length >= countPerPartial) {
                             if (partials.length === 0) {
-                                currentPartial.width += this._group.x + this._group.accoladeSpacing;
+                                // respect accolade and on first partial
+                                currentPartial.width += this._group.accoladeSpacing + this._pagePadding[0];
                             }
+                            renderX += currentPartial.width;
                             partials.push(currentPartial);
                             Logger.debug(this.name, 'Finished partial from bar ' +
                                 currentPartial.masterBars[0].index +
                                 ' to ' +
                                 currentPartial.masterBars[currentPartial.masterBars.length - 1].index, null);
                             currentPartial = new HorizontalScreenLayoutPartialInfo();
+                            currentPartial.x = renderX;
                         }
                     }
                 }
@@ -32629,7 +32664,7 @@
             // don't miss the last partial if not empty
             if (currentPartial.masterBars.length > 0) {
                 if (partials.length === 0) {
-                    currentPartial.width += this._group.x + this._group.accoladeSpacing;
+                    currentPartial.width += this._group.accoladeSpacing + this._pagePadding[0];
                 }
                 partials.push(currentPartial);
                 Logger.debug(this.name, 'Finished partial from bar ' +
@@ -32643,7 +32678,7 @@
             currentBarIndex = 0;
             let x = 0;
             for (let i = 0; i < partials.length; i++) {
-                let partial = partials[i];
+                const partial = partials[i];
                 const e = new RenderFinishedEventArgs();
                 e.x = x;
                 e.y = 0;
@@ -32654,14 +32689,19 @@
                 e.firstMasterBarIndex = partial.masterBars[0].index;
                 e.lastMasterBarIndex = partial.masterBars[partial.masterBars.length - 1].index;
                 x += partial.width;
+                // pull to local scope for lambda
                 const partialBarIndex = currentBarIndex;
+                const partialIndex = i;
+                this._group.buildBoundingsLookup(this._group.x, this._group.y);
                 this.registerPartial(e, canvas => {
                     canvas.color = this.renderer.settings.display.resources.mainGlyphColor;
                     canvas.textAlign = TextAlign.Left;
                     let renderX = this._group.getBarX(partial.masterBars[0].index) + this._group.accoladeSpacing;
-                    if (i === 0) {
+                    if (partialIndex === 0) {
                         renderX -= this._group.x + this._group.accoladeSpacing;
                     }
+                    canvas.color = this.renderer.settings.display.resources.mainGlyphColor;
+                    canvas.textAlign = TextAlign.Left;
                     Logger.debug(this.name, 'Rendering partial from bar ' +
                         partial.masterBars[0].index +
                         ' to ' +
@@ -32956,6 +32996,7 @@
             args.height = height;
             args.firstMasterBarIndex = group.firstBarIndex;
             args.lastMasterBarIndex = group.lastBarIndex;
+            group.buildBoundingsLookup(0, 0);
             this.registerPartial(args, canvas => {
                 this.renderer.canvas.color = this.renderer.settings.display.resources.mainGlyphColor;
                 this.renderer.canvas.textAlign = TextAlign.Left;
@@ -40552,8 +40593,8 @@
     // </auto-generated>
     class VersionInfo {
     }
-    VersionInfo.version = '1.3.0-alpha.140';
-    VersionInfo.date = '2021-12-29T23:06:43.677Z';
+    VersionInfo.version = '1.3.0-alpha.141';
+    VersionInfo.date = '2022-01-09T20:09:00.901Z';
 
     var index$5 = /*#__PURE__*/Object.freeze({
         __proto__: null,