htmlgaga/Client/dist/htmlgaga.cjs.dev.js

Manage non-SPA pages with webpack and React.js

'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var MessageType = require('../../dist/MessageType-312bbe19.cjs.dev.js');
var stripAnsi = _interopDefault(require('strip-ansi'));
var htmlEntities = require('html-entities');

function calculateDelayMs() {
  var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 200;
  var retries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
  return delay * Math.pow(2, retries);
}

/**
 * Copyright 2020-present, Sam Chen.
 * 
 * Licensed under GPL-3.0-or-later
 * 
 * This file is part of htmlgaga.

    htmlgaga is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    htmlgaga is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with htmlgaga.  If not, see <https://www.gnu.org/licenses/>.
 */
var entities = new htmlEntities.AllHtmlEntities();
var overlay = document.createElement('div'); // FIXME styles from app might spill into overlay
// we might use iframe if needed

var overlayStyles = {
  position: 'fixed',
  top: '0',
  right: '0',
  bottom: '0',
  left: '0',
  background: 'white',
  zIndex: 999999,
  fontSize: '18px',
  // I hate small font size
  whiteSpace: 'pre',
  paddingLeft: '20px',
  paddingRight: '20px',
  overflow: 'auto',
  lineHeight: 1.5
}; // set styles for overlay

Object.keys(overlayStyles).forEach(function (key) {
  overlay.style[key] = overlayStyles[key];
});

function htmlElement(txt) {
  var tag = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'div';
  var styles = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
  var element = document.createElement(tag);
  element.innerHTML = txt; // set styles

  Object.keys(styles).forEach(function (key) {
    element.style[key] = styles[key];
  });
  return element;
}

function report(errors) {
  var _document$body;

  var _errors$ = errors[0],
      moduleName = _errors$.moduleName,
      message = _errors$.message;
  overlay.appendChild(htmlElement("ERROR in ".concat(moduleName), 'h1', {
    color: 'red'
  }));
  overlay.appendChild(htmlElement(entities.encode(stripAnsi(message)), 'pre'));
  (_document$body = document.body) === null || _document$body === void 0 ? void 0 : _document$body.appendChild(overlay);
}

/**
 * Copyright 2020-present, Sam Chen.
 * 
 * Licensed under GPL-3.0-or-later
 * 
 * This file is part of htmlgaga.

    htmlgaga is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    htmlgaga is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with htmlgaga.  If not, see <https://www.gnu.org/licenses/>.
 */
var prefix = "[htmlgaga]";
var socketUrl = "ws://".concat(__WEBSOCKET__); // let's try at most 10 times

var maxRetries = 10; // begin with 0

var retries = 0;
var delay = 200;
var linkOpening = false;
document.addEventListener('click', function (e) {
  var _e$target;

  if (((_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.tagName.toLowerCase()) === 'a') {
    linkOpening = true;
  }
});

function createWebSocketClient(socketUrl) {
  var client = new WebSocket(socketUrl);

  client.onopen = function () {
    if (retries > 0) {
      return window.location.reload();
    }

    console.log("".concat(prefix, " Socket connected on ").concat(socketUrl));
  };

  client.onmessage = function (event) {
    var _JSON$parse = JSON.parse(event === null || event === void 0 ? void 0 : event.data),
        type = _JSON$parse.type,
        data = _JSON$parse.data;

    switch (true) {
      case type === MessageType.MessageType.HASH:
        console.log("".concat(prefix, " Built in ").concat(data.endTime - data.startTime, "ms"));
        return;

      case type === MessageType.MessageType.RELOAD:
        if (linkOpening) return; // we should wait here

        window.location.reload();
        return;

      case type === MessageType.MessageType.INVALID:
        console.log("".concat(prefix, " Rebuilding..."));
        return;

      case type === MessageType.MessageType.ERRORS:
        report(data);
        return;
    }
  };

  client.onclose = function (event) {
    console.log("".concat(prefix, " Disconnected"), event); // try to reconnect in case server restarted

    if (retries < maxRetries) {
      retries = retries + 1;
      client = null; // https://aws.amazon.com/blogs/architecture/exponential-backoff-and-jitter/

      setTimeout(function () {
        createWebSocketClient(socketUrl);
      }, Math.random() * calculateDelayMs(delay, retries));
    } else {
      console.log("".concat(prefix, " Please make sure the server is on and refresh the page."));
    }
  };

  return client;
}

createWebSocketClient(socketUrl);