Dynamically load SDK from skynet-js.hns

skynet-js.hns.html

<script type="text/javascript">
  fetch(document.location.href, { method: "HEAD" })
.then(resp => {
  const portal = resp.headers.get("skynet-portal-api");

  const _loadScript = function(path) {
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = path;
    var callback = function () {
      // Logic for finished initialization.
      const button = document.getElementById("save-trigger")
      button.classList.remove("loading")
    }
    script.onload = callback;
    document.head.appendChild(script);
  };

  const _addSubdomain = function(url, subdomain) {
    const urlObj = new URL(url);
    urlObj.hostname = `${subdomain}.${urlObj.hostname}`;
    return urlObj.toString();
  }

  _loadScript(_addSubdomain(portal, "skynet-js.hns") + "/4.0-beta/index.js");
});
</script>

Few notes:

• You will have to wait until the script has been loaded. You can put custom code in the callback function.
• Once the SDK script is loaded you can access it with skynet., e.g. new skynet.SkynetClient().
• Downloading the script takes a while, so this method is pretty slow. For simple skapps you may want to use fetch calls instead. Example.