Font Source Customization and Media Sync Editor Progress

[Danielku15]

SMuFL Font Source

Yesterday I shortly switched to a request by @BurningTreeC to allow customization of the web font sources. With this change its now easier to reconfigure from where alphaTab loads its SmuFL Font Bravura (and in future other compatible fonts). Previously alphaTab only allowed to customize the general path (or URL) to the fonts.

With this changed devs can now pass-in alternative URLs and file names which opens up a variety of usecases:

• Pass in Fonts as data urls in environments like Electron and TiddlyWiki. You might watch https://github.com/BurningTreeC/tiddlywiki-alphatab to soon use alphaTab in TiddlyWiki 😉
• Resolve the font URLs dynamically (e.g. by asking bundlers like WebPack to bundle it as asset).

Media Sync Editor Progress

With #2113 done, it's time to go back to continue on the external cursor API and backing track topics. I made quite good progress on building the online editor which will allow people to easily synchronize their tabs with external audio/video sources.

The editor is something which will be a tool we offer on the alphaTab website, and it will not be a built-in component to alphaTab itself. The editor will ultimately allow you to then download:

a) A Guitar Pro file with the backing track embedded and the audio synchronized (only for audio files, not YouTube)
b) Code Snippets which allow you to manually apply the sync points (and backing track).

Here a first glance on the usage.

chrome_FRieW5CzIg_1.mp4

You can see how I first open the playground with an unsynced file. Then I load a backing track from disk. On load the editor creates some initial sync points for all tempo changes. I then start the playback and start adjusting the sync points to make the cursor align on what I hear.

The UI/UX of the editor is again mainly inspired from Guitar Pro but things might still change. There is still some stuff to improve (tooltips, accidental selects) but functionally its doing what it should do.

The integration with the UI was a good test to see if the sync points and cursors properly align and the mapping logic works. After some fixes around tempo changes and simplifications on the padding we're almost there.