simple-live-widget

Commands

# install dependencies
npm install

# serve with hot reload at localhost:3000
npm run dev

# build udm bundle to be embedded into other websites
npm run build

# lint the project with eslint to find code style issues
npm run lint

Example Integration

This widget uses preact-habitat with the inline option. Place a script with bundle.js into the container that should contain the widget.

<!-- Container -->
<div>
  <script
    async
    src="https://unpkg.com/@htl-weather-station/simple-live-widget/dist/bundle.js"
  />
  <script type="text/props">
    {
      "url": "http://142.93.109.224",
      "stationId": "4"
    }
  </script>
</div>

You must pass two properties via a script tag of the type text/props or text/json into preact. These include the URL on which the API is hosted and the ID of the station to be shown.

The widget should work for IE11+ and all other modern browsers. Additional polyfills for IE8+ are provided in the same directory with polyfills.js.

CORS will prevent the widget from working if it is deployed to anything other than localhost. In order for the widget to function your website will have to be added to the list of allowed origins.