Media Sync Editor - YouTube and Code Generation

[Danielku15]

Another few hours of extending the media sync editor today and we're getting close.

After various reworks and extensions we have now:

1. Switching between Synth, Audio & Youtube during editing and playback.
2. Editing of pre-existing Mid-Bar sync points.
3. YouTube Video Synchronization (alphaTab will not ship YouTube out-of-the-box but integrating the YouTube iFrame API is fairly easy).
4. Downloading of a Guitar Pro 8 File with Audio Track and Sync Points Embedded
5. Code Generation for Sync Points (for easy applying and JSON serialized storage beside the main input file).

Beside that I cleaned a bit the UI, fixed some UI/UX bits which were bothering me and cleaned up quite some bits in the code. Getting close to the end of this feature. alphaTex needs some extension and then only tests and docs are missing.

Not everything is shown in the video but you get the idea. 😉 Its unfortunate that the YouTube iFrame API is so limited (and hacky to use). Obviously they block access to the raw audio/video data. Therefore we have no Waveform and no auto-sync available. 😭

chrome_XLSD92e2v7.mp4

Everything is live already on https://next.alphatab.net/docs/playground feel free to fiddle around and provide feedback.