Minor Improvements on consuming alphaTab in WebPack and TS environments

package.json

@@ -27,7 +27,9 @@
         ".": {
             "import": "./dist/alphaTab.mjs",
             "require": "./dist/alphaTab.js"
-        }
+        },
+        "./soundfont/*": "./dist/soundfont/*",
+        "./font/*": "./dist/font/*"
     },
     "engines": {
         "node": ">=6.0.0"

src.compiler/BuilderHelpers.ts

@@ -50,15 +50,21 @@ function findNode(node: ts.Node, kind: ts.SyntaxKind): ts.Node | null {
 export function addNewLines(stmts: ts.Statement[]) {
     return stmts.map(stmt => ts.addSyntheticTrailingComment(stmt, ts.SyntaxKind.SingleLineCommentTrivia, '', true));
 }
-export function getTypeWithNullableInfo(checker: ts.TypeChecker, node: ts.TypeNode | undefined) {
+export function getTypeWithNullableInfo(
+    checker: ts.TypeChecker,
+    node: ts.TypeNode | undefined,
+    allowUnionAsPrimitive: boolean
+) {
     if (!node) {
         return {
             isNullable: false,
+            isUnionType: false,
             type: {} as ts.Type
         };
     }
 
     let isNullable = false;
+    let isUnionType = false;
     let type: ts.Type | null = null;
     if (ts.isUnionTypeNode(node)) {
         for (const t of node.types) {
@@ -67,12 +73,18 @@ export function getTypeWithNullableInfo(checker: ts.TypeChecker, node: ts.TypeNo
             } else if (ts.isLiteralTypeNode(t) && t.literal.kind === ts.SyntaxKind.NullKeyword) {
                 isNullable = true;
             } else if (type !== null) {
-                throw new Error(
-                    'Multi union types on JSON settings not supported: ' +
-                        node.getSourceFile().fileName +
-                        ':' +
-                        node.getText()
-                );
+                if (allowUnionAsPrimitive) {
+                    isUnionType = true;
+                    type = checker.getTypeAtLocation(node);
+                    break;
+                } else {
+                    throw new Error(
+                        'Multi union types on JSON settings not supported: ' +
+                            node.getSourceFile().fileName +
+                            ':' +
+                            node.getText()
+                    );
+                }
             } else {
                 type = checker.getTypeAtLocation(t);
             }
@@ -83,6 +95,7 @@ export function getTypeWithNullableInfo(checker: ts.TypeChecker, node: ts.TypeNo
 
     return {
         isNullable,
+        isUnionType,
         type: type as ts.Type
     };
 }
@@ -98,6 +111,9 @@ export function unwrapArrayItemType(type: ts.Type, typeChecker: ts.TypeChecker):
 
     if (type.isUnion()) {
         const nonNullable = typeChecker.getNonNullableType(type);
+        if (type === nonNullable) {
+            return null;
+        }
         return unwrapArrayItemType(nonNullable, typeChecker);
     }
 
@@ -170,7 +186,7 @@ export function isMap(type: ts.Type | null): boolean {
 }
 
 function markNodeSynthesized(node: ts.Node): ts.Node {
-    for(const c of node.getChildren()) {
+    for (const c of node.getChildren()) {
         markNodeSynthesized(c);
     }
     ts.setTextRange(node, {

src.compiler/typescript/CloneEmitter.ts

@@ -56,7 +56,7 @@ function generateClonePropertyStatements(
     typeChecker: ts.TypeChecker,
     importer: (name: string, module: string) => void
 ): ts.Statement[] {
-    const propertyType = getTypeWithNullableInfo(typeChecker, prop.type!);
+    const propertyType = getTypeWithNullableInfo(typeChecker, prop.type!, true);
 
     const statements: ts.Statement[] = [];
 

src.compiler/typescript/Serializer.common.ts

@@ -6,6 +6,7 @@ export interface JsonProperty {
     property: ts.PropertyDeclaration;
     jsonNames: string[];
     target?: string;
+    isReadOnly: boolean;
 }
 
 export interface JsonSerializable {

src.compiler/typescript/Serializer.toJson.ts

@@ -92,11 +92,11 @@ function generateToJsonBody(
         const fieldName = (prop.property.name as ts.Identifier).text;
         const jsonName = prop.jsonNames.filter(n => n !== '')[0];
 
-        if (!jsonName) {
+        if (!jsonName || prop.isReadOnly) {
             continue;
         }
         const typeChecker = program.getTypeChecker();
-        const type = getTypeWithNullableInfo(typeChecker, prop.property.type!);
+        const type = getTypeWithNullableInfo(typeChecker, prop.property.type!, false);
         const isArray = isTypedArray(type.type!);
 
         let propertyStatements: ts.Statement[] = [];

src.compiler/typescript/SerializerEmitter.ts

@@ -45,7 +45,8 @@ export default createEmitter('json', (program, input) => {
                         property: propertyDeclaration,
                         jsonNames: jsonNames,
                         partialNames: !!ts.getJSDocTags(member).find(t => t.tagName.text === 'json_partial_names'),
-                        target: ts.getJSDocTags(member).find(t => t.tagName.text === 'target')?.comment as string
+                        target: ts.getJSDocTags(member).find(t => t.tagName.text === 'target')?.comment as string,
+                        isReadOnly: !!ts.getJSDocTags(member).find(t => t.tagName.text === 'json_read_only')
                     });
                 }
             }

src/PlayerSettings.ts

@@ -102,8 +102,10 @@ export class PlayerSettings {
 
     /**
      * Gets or sets the element that should be used for scrolling.
+     * @target web
+     * @json_read_only
      */
-    public scrollElement: string = 'html,body';
+    public scrollElement: string | HTMLElement = 'html,body';
 
     /**
      * Gets or sets whether the player should be enabled.

src/generated/PlayerSettingsSerializer.ts

@@ -21,7 +21,6 @@ export class PlayerSettingsSerializer {
         } 
         const o = new Map<string, unknown>(); 
         o.set("soundfont", obj.soundFont); 
-        o.set("scrollelement", obj.scrollElement); 
         o.set("enableplayer", obj.enablePlayer); 
         o.set("enablecursor", obj.enableCursor); 
         o.set("enableanimatedbeatcursor", obj.enableAnimatedBeatCursor); 
@@ -45,8 +44,9 @@ export class PlayerSettingsSerializer {
             case "soundfont":
                 obj.soundFont = v as string | null;
                 return true;
+            /*@target web*/
             case "scrollelement":
-                obj.scrollElement = v! as string;
+                obj.scrollElement = v! as string | HTMLElement;
                 return true;
             case "enableplayer":
                 obj.enablePlayer = v! as boolean;

src/platform/javascript/AlphaTabApi.ts

@@ -15,8 +15,8 @@ import { SettingsSerializer } from '@src/generated/SettingsSerializer';
 /**
  * @target web
  */
-export class AlphaTabApi extends AlphaTabApiBase<unknown> {
-    public constructor(element: HTMLElement, options: unknown) {
+export class AlphaTabApi extends AlphaTabApiBase<any|Settings> {
+    public constructor(element: HTMLElement, options: any|Settings) {
         super(new BrowserUiFacade(element), options);
     }
 
@@ -25,7 +25,7 @@ export class AlphaTabApi extends AlphaTabApiBase<unknown> {
         super.tex(tex, browser.parseTracks(tracks));
     }
 
-    public print(width: string, additionalSettings:unknown = null): void {
+    public print(width?: string, additionalSettings:unknown = null): void {
         // prepare a popup window for printing (a4 width, window height, centered)
         let preview: Window = window.open('', '', 'width=0,height=0')!;
         let a4: HTMLElement = preview.document.createElement('div');

src/platform/javascript/BrowserUiFacade.ts

@@ -159,7 +159,7 @@ export class BrowserUiFacade implements IUiFacade<unknown> {
         return new AlphaTabWorkerScoreRenderer<unknown>(this._api, this._api.settings);
     }
 
-    public initialize(api: AlphaTabApiBase<unknown>, raw: unknown): void {
+    public initialize(api: AlphaTabApiBase<unknown>, raw: any | Settings): void {
         this._api = api;
         let settings: Settings;
         if (raw instanceof Settings) {
@@ -432,8 +432,8 @@ export class BrowserUiFacade implements IUiFacade<unknown> {
             placeholder.replaceChildren(body as Node);
         }
         placeholder.resultState = ResultState.RenderDone;
-        placeholder.renderedResultId = renderResult.id; 
-        placeholder.renderedResult = Array.from(placeholder.children)
+        placeholder.renderedResultId = renderResult.id;
+        placeholder.renderedResult = Array.from(placeholder.children);
     }
 
     public beginAppendRenderResults(renderResult: RenderFinishedEventArgs | null): void {
@@ -501,7 +501,8 @@ export class BrowserUiFacade implements IUiFacade<unknown> {
 
         // Once https://github.com/webpack/webpack/issues/11543 is decided
         // we can support audio worklets together with WebPack
-        let supportsAudioWorklets: boolean = window.isSecureContext && 'AudioWorkletNode' in window && !Environment.isWebPackBundled;
+        let supportsAudioWorklets: boolean =
+            window.isSecureContext && 'AudioWorkletNode' in window && !Environment.isWebPackBundled;
 
         if (supportsAudioWorklets) {
             Logger.debug('Player', 'Will use webworkers for synthesizing and web audio api with worklets for playback');

test/model/JsonConverter.test.ts

@@ -128,6 +128,7 @@ describe('JsonConverterTest', () => {
         expected.importer.mergePartGroupsInMusicXml = false;
 
         expected.player.soundFont = 'soundfont';
+        /**@target web*/
         expected.player.scrollElement = 'scroll';
         expected.player.vibrato.noteSlightAmplitude = 10;
         expected.player.slide.simpleSlideDurationRatio = 8;