2.0.3 • Published 8 months ago

@wochit/embedded v2.0.3

Weekly downloads
-
License
GPL-2.0
Repository
github
Last release
8 months ago

@wochit/embedded NPM module

Intro

https://user-images.githubusercontent.com/3756473/167427983-89c60590-a1f5-4c6c-9e95-bb54facdfddd.mp4

Using NPM module

Install

npm i @wochit/embedded
yarn add @wochit/embedded
pnpm add @wochit/embedded

Using default import

import wt from '@wochit/embedded';

wt.config({ clientId, userToken });

document.querySelector('.video-editor-btn').addEventListener('click', () => {
  wt.openVideoEditor({});
});

Using named import

import { config, openVideoEditor } from '@wochit/embedded';

config({ clientId, userToken });

document.querySelector('.video-editor-btn').addEventListener('click', () => {
  openVideoEditor({});
});

Using script from CDN

  • async IIFE (non-blocking)

    <script type="application/javascript">
      (function (window, document, tag, url, name, a, m) {
        window['__wochit_object_name__'] = name;
        window[name] =
          window[name] ||
          function () {
            (window[name].q = window[name].q || []).push(arguments);
          };
        (a = document.createElement(tag)), (m = document.getElementsByTagName(tag)[0]);
        a.async = 1;
        a.src = url;
        m.parentNode.insertBefore(a, m);
      })(window, document, 'script', 'https://embedded.wochit.com/latest.min.js', 'wt');
    </script>
  • sync (blocking)

    <script
      src="https://embedded.wochit.com/latest.min.js"
      type="application/javascript"
    ></script>

Then somewhere in your app:

window.wt('config', { clientId, userToken });

document.querySelector('.video-editor-btn').addEventListener('click', () => {
  window.wt('openVideoEditor', {});
});

Subresource Integrity (SRI)

  • To find integrity string for given version please check-out the Releases page.
  • Use versioned CDN link, for example: embedded.wochit.com/#.#.#.min.js
  • add crossorigin and integrity attributes depending on usage like so:
...
a.setAttribute('crossorigin', 'anonymous');
a.setAttribute('integrity', 'PASTE_INTEGRITY_STRING');
// paste the above before this line:
a.src = url;
...
<script
  src="https://embedded.wochit.com/#.#.#.min.js"
  type="application/javascript"
  crossorigin="anonymous"
  integrity="PASTE_INTEGRITY_STRING"
></script>