feat: Add Slash Notation

package.json

@@ -57,7 +57,8 @@
         "build-kotlin": "npm run generate-kotlin && cd src.kotlin/alphaTab && gradlew assembleRelease",
         "test": "mocha",
         "test-csharp": "cd src.csharp && dotnet test -c Release",
-        "test-kotlin": "cd src.kotlin/alphaTab && gradlew testReleaseUnitTest --info"
+        "test-kotlin": "cd src.kotlin/alphaTab && gradlew testReleaseUnitTest --info",
+        "test-accept-reference": "node scripts/accept-new-reference-files.mjs"
     },
     "devDependencies": {
         "@coderline/alphaskia": "^2.1.120",

rollup.plugin.server.ts

@@ -3,6 +3,9 @@ import opener from 'opener';
 import fs from 'fs';
 import path from 'path';
 import cors from 'cors';
+import url from 'url';
+
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
 
 export interface ServerOptions {
     port: number,

scripts/accept-new-reference-files.mjs

@@ -0,0 +1,32 @@
+import url from 'url';
+import path from 'path';
+import fs from 'fs';
+
+
+async function accept(d) {
+    const dir = await fs.promises.opendir(d);
+    try {
+        while (true) {
+            const entry = await dir.read();
+            if (!entry) {
+                break;
+            } else if (entry.isDirectory() && entry.name !== '.' && entry.name !== '..') {
+                await accept(path.join(d, entry.name))
+            } else if (entry.isFile()) {
+                if (entry.name.endsWith('.new.png')) {
+                    console.log('Accepting ', path.join(entry.path, entry.name));
+                    fs.promises.rename(path.join(entry.path, entry.name), path.join(entry.path, entry.name.replace('.new', '')));
+                } else if (entry.name.endsWith('.diff.png')) {
+                    fs.promises.unlink(path.join(entry.path, entry.name))
+                }
+            }
+        }
+    }
+    finally {
+        await dir.close();
+    }
+}
+
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
+const testDataPath = path.join(__dirname, '..', 'test-data');
+await accept(testDataPath);

src.csharp/AlphaTab.Test/Test/Globals.cs

@@ -3,7 +3,9 @@
 
 namespace AlphaTab.Test
 {
+#pragma warning disable CS8981 // The type name only contains lower-cased ascii characters. Such names may become reserved for the language.
     public static class assert
+#pragma warning restore CS8981 // The type name only contains lower-cased ascii characters. Such names may become reserved for the language.
     {
         public static void Fail(string message)
         {

src.csharp/AlphaTab.Windows/AlphaTab.Windows.csproj

@@ -1,10 +1,10 @@
-<Project Sdk="Microsoft.NET.Sdk.WindowsDesktop">
+<Project Sdk="Microsoft.NET.Sdk">
 
     <PropertyGroup>
         <RootNamespace>AlphaTab</RootNamespace>
         <AssemblyName>AlphaTab.Windows</AssemblyName>
         <PackageId>AlphaTab.Windows</PackageId>
-		<PackageReadmeFile>README.md</PackageReadmeFile>
+		    <PackageReadmeFile>README.md</PackageReadmeFile>
         <GeneratePackageOnBuild>true</GeneratePackageOnBuild>
         <GenerateDocumentationFile>true</GenerateDocumentationFile>
         <TargetFramework>net8.0-windows</TargetFramework>

src/Environment.ts

@@ -2,7 +2,7 @@ import { LayoutMode } from '@src/LayoutMode';
 import { StaveProfile } from '@src/StaveProfile';
 import { AlphaTexImporter } from '@src/importer/AlphaTexImporter';
 import { Gp3To5Importer } from '@src/importer/Gp3To5Importer';
-import { Gp7Importer } from '@src/importer/Gp7Importer';
+import { Gp7To8Importer } from '@src/importer/Gp7To8Importer';
 import { GpxImporter } from '@src/importer/GpxImporter';
 import { MusicXmlImporter } from '@src/importer/MusicXmlImporter';
 import { ScoreImporter } from '@src/importer/ScoreImporter';
@@ -60,6 +60,7 @@ import { SkiaCanvas } from './platform/skia/SkiaCanvas';
 import { Font } from './model';
 import { Settings } from './Settings';
 import { AlphaTabError, AlphaTabErrorType } from './AlphaTabError';
+import { SlashBarRendererFactory } from './rendering/SlashBarRendererFactory';
 
 export class LayoutEngineFactory {
     public readonly vertical: boolean;
@@ -132,7 +133,7 @@ export class Environment {
             }
             .at-surface-svg text {
                 dominant-baseline: central;
-            }             
+            }
             .at {
                  font-family: 'alphaTab';
                  speak: none;
@@ -411,7 +412,7 @@ export class Environment {
         return [
             new Gp3To5Importer(),
             new GpxImporter(),
-            new Gp7Importer(),
+            new Gp7To8Importer(),
             new MusicXmlImporter(),
             new CapellaImporter(),
             new AlphaTexImporter()
@@ -479,12 +480,15 @@ export class Environment {
 
         // default combinations of stave textprofiles
         staveProfiles.set(StaveProfile.ScoreTab, [
-            new EffectBarRendererFactory('score-effects', [
+            new EffectBarRendererFactory('top-effects', [
                 new TempoEffectInfo(),
                 new TripletFeelEffectInfo(),
                 new MarkerEffectInfo(),
                 new TextEffectInfo(),
                 new ChordsEffectInfo(),
+            ]),
+            new SlashBarRendererFactory(),
+            new EffectBarRendererFactory('score-effects', [
                 new FermataEffectInfo(),
                 new WhammyBarEffectInfo(),
                 new TrillEffectInfo(),
@@ -526,12 +530,15 @@ export class Environment {
             new TabBarRendererFactory(false, false, false)
         ]);
         staveProfiles.set(StaveProfile.Score, [
-            new EffectBarRendererFactory('score-effects', [
+            new EffectBarRendererFactory('top-effects', [
                 new TempoEffectInfo(),
                 new TripletFeelEffectInfo(),
                 new MarkerEffectInfo(),
                 new TextEffectInfo(),
                 new ChordsEffectInfo(),
+            ]), 
+            new SlashBarRendererFactory(),
+            new EffectBarRendererFactory('score-effects', [
                 new FermataEffectInfo(),
                 new WhammyBarEffectInfo(),
                 new TrillEffectInfo(),
@@ -585,11 +592,13 @@ export class Environment {
             new AlternateEndingsEffectInfo()
         ];
         staveProfiles.set(StaveProfile.Tab, [
+            new SlashBarRendererFactory(),
             new EffectBarRendererFactory('tab-effects', tabEffectInfos),
             new TabBarRendererFactory(true, true, true),
             new EffectBarRendererFactory('tab-bottom-effects', [new LyricsEffectInfo()])
         ]);
         staveProfiles.set(StaveProfile.TabMixed, [
+            new SlashBarRendererFactory(),
             new EffectBarRendererFactory('tab-effects', tabEffectInfos),
             new TabBarRendererFactory(false, false, false),
             new EffectBarRendererFactory('tab-bottom-effects', [new LyricsEffectInfo()])

src/generated/model/StaffSerializer.ts

@@ -34,6 +34,7 @@ export class StaffSerializer {
         o.set("transpositionpitch", obj.transpositionPitch);
         o.set("displaytranspositionpitch", obj.displayTranspositionPitch);
         o.set("stringtuning", TuningSerializer.toJson(obj.stringTuning));
+        o.set("showslash", obj.showSlash);
         o.set("showtablature", obj.showTablature);
         o.set("showstandardnotation", obj.showStandardNotation);
         o.set("ispercussion", obj.isPercussion);
@@ -67,6 +68,9 @@ export class StaffSerializer {
             case "displaytranspositionpitch":
                 obj.displayTranspositionPitch = v! as number;
                 return true;
+            case "showslash":
+                obj.showSlash = v! as boolean;
+                return true;
             case "showtablature":
                 obj.showTablature = v! as boolean;
                 return true;

src/importer/AlphaTexImporter.ts

@@ -1074,6 +1074,7 @@ export class AlphaTexImporter extends ScoreImporter {
         this._sy = this.newSy();
         let showStandardNotation: boolean = false;
         let showTabs: boolean = false;
+        let showSlash: boolean = false;
         while (this._sy === AlphaTexSymbols.String) {
             switch ((this._syData as string).toLowerCase()) {
                 case 'score':
@@ -1084,14 +1085,19 @@ export class AlphaTexImporter extends ScoreImporter {
                     showTabs = true;
                     this._sy = this.newSy();
                     break;
+                case 'slash':
+                    showSlash = true;
+                    this._sy = this.newSy();
+                    break;
                 default:
                     this.error('staff-properties', AlphaTexSymbols.String, false);
                     break;
             }
         }
-        if (showStandardNotation || showTabs) {
+        if (showStandardNotation || showTabs || showSlash) {
             this._currentStaff.showStandardNotation = showStandardNotation;
             this._currentStaff.showTablature = showTabs;
+            this._currentStaff.showSlash = showSlash;
         }
         if (this._sy !== AlphaTexSymbols.RBrace) {
             this.error('staff-properties', AlphaTexSymbols.RBrace, true);

src/importer/Gp7Importer.ts → src/importer/Gp7To8Importer.ts

@@ -14,11 +14,11 @@ import { IOHelper } from '@src/io/IOHelper';
 import { LayoutConfiguration } from './LayoutConfiguration';
 
 /**
- * This ScoreImporter can read Guitar Pro 7 (gp) files.
+ * This ScoreImporter can read Guitar Pro 7 and 8 (gp) files.
  */
-export class Gp7Importer extends ScoreImporter {
+export class Gp7To8Importer extends ScoreImporter {
     public get name(): string {
-        return 'Guitar Pro 7';
+        return 'Guitar Pro 7-8';
     }
 
     public constructor() {

src/importer/PartConfiguration.ts

@@ -60,6 +60,7 @@ export class PartConfiguration {
                     for(const staff of track.staves) {
                         staff.showTablature = trackConfig.showTablature;
                         staff.showStandardNotation = trackConfig.showStandardNotation;
+                        staff.showSlash = trackConfig.showSlash;
                     }
                 }
                 trackIndex++;
@@ -108,6 +109,7 @@ export class PartConfiguration {
             // in the Guitar Pro UI there is no individual staff config
             trackConfiguration.showStandardNotation = track.staves[0].showStandardNotation;
             trackConfiguration.showTablature = track.staves[0].showTablature;
+            trackConfiguration.showSlash = track.staves[0].showSlash;
 
             scoreViews[0].trackViewGroups.push(trackConfiguration);
 

src/model/MusicFontSymbol.ts

@@ -48,6 +48,10 @@ export enum MusicFontSymbol {
     NoteheadHeavyX = 0xe0f8,
     NoteheadHeavyXHat = 0xe0f9,
 
+    NoteheadSlashVerticalEnds = 0xe100,
+    NoteheadSlashWhiteWhole = 0xe102,
+    NoteheadSlashWhiteHalf = 0xe103,
+
     NoteQuarterUp = 0xe1d5,
     NoteEighthUp = 0xe1d7,
 

src/model/Staff.ts

@@ -77,6 +77,11 @@ export class Staff {
         return this.stringTuning.tunings.length > 0;
     }
 
+    /**
+     * Gets or sets whether the slash notation is shown.
+     */
+    public showSlash: boolean = false;
+
     /**
      * Gets or sets whether the tabs are shown.
      */

src/platform/svg/SvgCanvas.ts

@@ -133,7 +133,7 @@ export abstract class SvgCanvas implements ICanvas {
         }
         let s: string = `<text x="${x | 0}" y="${y | 0}" style="stroke: none; font:${this.font.toCssString(
             this.settings.display.scale
-        )}" ${this.getSvgBaseLine()}`;
+        )}; ${this.getSvgBaseLine()}"`;
         if (this.color.rgba !== '#000000') {
             s += ` fill="${this.color.rgba}"`;
         }
@@ -168,9 +168,9 @@ export abstract class SvgCanvas implements ICanvas {
     protected getSvgBaseLine(): string {
         switch (this.textBaseline) {
             case TextBaseline.Top:
-                return `dominant-baseline="hanging"`;
+                return `dominant-baseline: hanging`;
             case TextBaseline.Bottom:
-                return `dominant-baseline="bottom"`;
+                return `dominant-baseline: bottom`;
             // case TextBaseline.Middle:
             default:
                 // middle is set as default on the SVG tag via css

src/rendering/BarRendererBase.ts

@@ -23,6 +23,7 @@ import { Settings } from '@src/Settings';
 import { BeatOnNoteGlyphBase } from '@src/rendering/glyphs/BeatOnNoteGlyphBase';
 import { BeamingHelper } from '@src/rendering/utils/BeamingHelper';
 import { InternalSystemsLayoutMode } from './layout/ScoreLayout';
+import { BeamDirection } from './utils/BeamDirection';
 
 /**
  * Lists the different position modes for {@link BarRendererBase.getNoteY}
@@ -72,12 +73,12 @@ export enum NoteXPosition {
  * This is the base public class for creating blocks which can render bars.
  */
 export class BarRendererBase {
-    public static readonly LineSpacing: number = 8;
-    public static readonly StemWidth: number = 0.12 /*bravura stemThickness */ * BarRendererBase.LineSpacing;
+    protected static readonly RawLineSpacing: number = 8;
+    public static readonly StemWidth: number = 0.12 /*bravura stemThickness */ * BarRendererBase.RawLineSpacing;
     public static readonly StaffLineThickness: number =
-        0.13 /*bravura staffLineThickness */ * BarRendererBase.LineSpacing;
-    public static readonly BeamThickness: number = 0.5 /*bravura beamThickness */ * BarRendererBase.LineSpacing;
-    public static readonly BeamSpacing: number = 0.25 /*bravura beamSpacing */ * BarRendererBase.LineSpacing;
+        0.13 /*bravura staffLineThickness */ * BarRendererBase.RawLineSpacing;
+    public static readonly BeamThickness: number = 0.5 /*bravura beamThickness */ * BarRendererBase.RawLineSpacing;
+    public static readonly BeamSpacing: number = 0.25 /*bravura beamSpacing */ * BarRendererBase.RawLineSpacing;
 
     private _preBeatGlyphs: LeftToRightLayoutingGlyphGroup = new LeftToRightLayoutingGlyphGroup();
     private _voiceContainers: Map<number, VoiceContainerGlyph> = new Map();
@@ -455,10 +456,9 @@ export class BarRendererBase {
     }
 
     protected createBeatGlyphs(): void {
-        for (let v: number = 0; v < this.bar.voices.length; v++) {
-            let voice: Voice = this.bar.voices[v];
+        for(const voice of this.bar.voices) {
             if (this.hasVoiceContainer(voice)) {
-                this.createVoiceGlyphs(this.bar.voices[v]);
+                this.createVoiceGlyphs(voice);
             }
         }
     }
@@ -562,4 +562,8 @@ export class BarRendererBase {
     public completeBeamingHelper(helper: BeamingHelper) {
         // nothing by default
     }
+
+    public getBeatDirection(beat: Beat): BeamDirection {
+        return this.helpers.getBeamingHelperForBeat(beat).direction;
+    }
 }