Vanilla JS Widget

Overview

This widget is intended to be simple script, style, and iframe tags to be given to clients to embed into their site. In index.html these tags can be found. The script loads our WidgetLib package from UNPKG and will auto-update if and when we update the npm package, as no specific version is specified.

The iframe they would be provided will have an src linking to their series-embed page, which will likely be hosted somewhere in our ecosystem.

Previewing

To get a preview of this embed, simply open index.html in the browser of your choosing.

Checklist

When giving this to be embedded on a client's site, follow these steps:

• Give them the script tag

<script type="module" src='https://unpkg.com/@alibi-tech/vanilla-widget/index.js'></script>

• Give them the css link tag

<link rel="stylesheet" type="text/css" href="https://unpkg.com/@alibi-tech/vanilla-widget/widget-styles.css" />

• Give them the iframe tag
  • Change the iframe src to match their custom series embed page
  • Change the iframe data-host attribute to match the base url where the series embed page is hosted. https://builds.pvep.net for example

<iframe class="filmStrip" id='alibi-tech-widget' src="https://builds.pvep.net/jim-dev/series-embed/218285" data-host="https://builds.pvep.net" />;