clip-navigator · Mar 9–11, 2021 · v2.0–v3.0

vzPlayer support, mobile support

vzPlayer Support v2.0

Clip Navigator now supports the Vzaar video player, which is what most of the videos submitted to Twin Galaxies use. There was no readily available npm package for the vzaar player so I had to instead write a wrapper around around their javascript API.

The data schema is updated to support a type of either YouTube or Vzaar and the player will automatically switch based on the type of the currently selected video.

Support for Twin Galaxies videos means I’ll be able to include a lot more videos in the bubble bobble comparison.

Mobile support v3.0

Getting clip navigator to not look like garbage on mobile required wrapping the video iframes using this technique and switching out the iframe that embeds the react app into the blog with the script and link tags generated by create-react-app.

Embedding the clip-navigator directly into the page required parsing the index.html that is built by create-react-app, querying for all links and scripts, and outputting them to a new file called out.html. I do this in package.js and then move the file to my jekyll _includes folder for generation when the blog deploys.

Finally, I moved the clip tools into their own drop-down menu and changed the hotkeys, hence the major version bump. Still some work to have mobile auto-play.