@medipass/checkout-sdk 2.1.0 → 3.0.0-alpha.0

package/lib/index.js

@@ -1,280 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _get2 = _interopRequireDefault(require("lodash/get"));
-
-var _overlay = _interopRequireDefault(require("./overlay"));
-
-var _constants = require("./constants");
-
-require("./style.css");
-
-var _initialiseWindow = _interopRequireDefault(require("./initialiseWindow"));
-
-var _requestUpdatePaymentDetails = _interopRequireDefault(require("./requestUpdatePaymentDetails"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-////////////////////////////////////////////////////////////
-var _windowReferenceObject = null; ////////////////////////////////////////////////////////////
-
-var checkoutSDK = {
-  ENVS: _constants.ENVS,
-  isCheckoutInitiated: false,
-  isCheckoutComplete: null,
-  env: null,
-  onSuccess: null,
-  onFailure: null,
-  onCancel: null,
-  onCose: null,
-  init: function init(_ref) {
-    var _this = this;
-
-    var env = _ref.env,
-        onSuccess = _ref.onSuccess,
-        onFailure = _ref.onFailure,
-        onCancel = _ref.onCancel,
-        onClose = _ref.onClose;
-    if (!env) return;
-    this.env = env;
-    this.onSuccess = onSuccess;
-    this.onFailure = onFailure;
-    this.onCancel = onCancel;
-    this.onClose = onClose; // Open a blank window
-
-    _windowReferenceObject = (0, _initialiseWindow["default"])({
-      url: ''
-    });
-
-    var handleClose = function handleClose() {
-      _overlay["default"].removeOverlay();
-
-      onClose && onClose();
-      if (!_windowReferenceObject) return;
-
-      _windowReferenceObject.close();
-    };
-
-    var onClickRelaunch = function onClickRelaunch() {
-      if (!_windowReferenceObject) {
-        _windowReferenceObject = (0, _initialiseWindow["default"])({
-          url: ''
-        });
-        return;
-      }
-
-      _windowReferenceObject.focus();
-    };
-
-    var checkWindowClosed = function checkWindowClosed() {
-      if (_this.isCheckoutInitiated) {
-        clearInterval(timer);
-        return;
-      }
-
-      if ((0, _get2["default"])(_windowReferenceObject, 'closed')) {
-        clearInterval(timer);
-        handleClose();
-      }
-    };
-
-    var onClickCancel = function onClickCancel() {
-      _overlay["default"].removeOverlay();
-
-      if (_windowReferenceObject) {
-        _windowReferenceObject.close();
-      }
-
-      clearInterval(timer);
-      onClose && onClose();
-    }; // This creates the gray overlay covering the client's screen while payment is in progress.
-
-
-    _overlay["default"].createOverlay({
-      window: window,
-      onClickRelaunch: onClickRelaunch,
-      onClickCancel: onClickCancel
-    }); // Check the window every 0.5 seconds to see if it has been closed.
-
-
-    var timer = setInterval(checkWindowClosed, 500);
-  },
-  createCheckout: function createCheckout(_ref2) {
-    var _this2 = this;
-
-    var paymentRequestUrl = _ref2.paymentRequestUrl;
-    if (!paymentRequestUrl || !window) return;
-    var env = this.env;
-    var onSuccess = this.onSuccess;
-    var onFailure = this.onFailure;
-    var onCancel = this.onCancel;
-    var onClose = this.onClose; ////////////////////////////////////////////////////////////
-
-    var checkWindowClosed = function checkWindowClosed() {
-      if ((0, _get2["default"])(_windowReferenceObject, 'closed')) {
-        clearInterval(timer);
-        handleClose();
-      }
-    }; // Check the window every 0.5 seconds to see if it has been closed.
-
-
-    var timer = setInterval(checkWindowClosed, 500);
-    this.isCheckoutInitiated = true; ////////////////////////////////////////////////////////////
-
-    var openWindow = function openWindow() {
-      // windowReferenceObject may not be defined if browser blocks the pop-up.
-      if (!_windowReferenceObject) {
-        _windowReferenceObject = (0, _initialiseWindow["default"])({
-          url: paymentRequestUrl
-        });
-      } else {
-        _windowReferenceObject.location.replace(paymentRequestUrl);
-      }
-
-      if (!_windowReferenceObject) {
-        return;
-      } // Start listening for incoming messages    
-
-
-      window.addEventListener('message', function (e) {
-        return onReceiveMessage(e);
-      });
-
-      var onReceiveMessage = function onReceiveMessage(e) {
-        if (!e) return;
-        var transactionId = getMessage(e);
-
-        if (transactionId) {
-          _this2.isCheckoutComplete = true;
-        }
-      };
-
-      var getMessage = function getMessage(e) {
-        var origin = _constants.ORIGINS[env];
-        if (!e || !origin) return; // Ensure the message is coming from the correct origin.
-
-        if ((0, _get2["default"])(e, 'origin') !== origin) return;
-        var event = (0, _get2["default"])(e, 'data.event');
-        var transactionId = (0, _get2["default"])(e, 'data.transactionId');
-        var receiptAutoSent = (0, _get2["default"])(e, 'data.receiptAutoSent');
-        if (!event || !transactionId) return;
-
-        if (event === _constants.EVENTS.SUCCESS) {
-          if (receiptAutoSent) {
-            // Give 1.5 seconds for the user to see the success page before auto-closing the pop-up.
-            setTimeout(function () {
-              onSuccess && onSuccess({
-                transactionId: transactionId
-              });
-
-              _windowReferenceObject.close();
-            }, 1500);
-          } else {
-            onSuccess && onSuccess({
-              transactionId: transactionId
-            });
-          }
-
-          return transactionId;
-        }
-
-        if (event === _constants.EVENTS.fAILURE) {
-          onFailure && onFailure({
-            transactionId: transactionId
-          });
-          return transactionId;
-        }
-
-        if (event === _constants.EVENTS.CANCEL) {
-          // Give 1.5 seconds for the user to see the reject page before auto-closing the pop-up.
-          setTimeout(function () {
-            onCancel && onCancel({
-              transactionId: transactionId
-            });
-
-            _windowReferenceObject.close();
-          }, 1500);
-          return transactionId;
-        }
-      };
-
-      return _windowReferenceObject;
-    }; ////////////////////////////////////////////////////////////
-    // open the pop-up
-
-
-    openWindow(); ////////////////////////////////////////////////////////////
-
-    var handleClose = function handleClose() {
-      // We need to remove the gray overlay covering the client's screen.
-      _overlay["default"].removeOverlay(); // If the pop-up has been closed before a payment action has been taken out, then we
-      // need to invoke the onClose callback.
-
-
-      if (!_this2.isCheckoutComplete) {
-        onClose && onClose();
-      }
-
-      if (!_windowReferenceObject) return;
-
-      _windowReferenceObject.close();
-    }; ////////////////////////////////////////////////////////////
-
-
-    var onClickRelaunch = function onClickRelaunch() {
-      if (!_windowReferenceObject) {
-        _windowReferenceObject = openWindow();
-        return;
-      }
-
-      _windowReferenceObject.focus();
-    };
-
-    var onClickCancel = function onClickCancel() {
-      if (_windowReferenceObject) {
-        _windowReferenceObject.close();
-      } else {
-        clearInterval(timer);
-      }
-
-      _overlay["default"].removeOverlay();
-
-      onClose && onClose();
-    }; // Reset the relaunch and cancel functions on the subheading
-
-
-    _overlay["default"].updateSubheading({
-      window: window,
-      onClickRelaunch: onClickRelaunch,
-      onClickCancel: onClickCancel
-    }); ////////////////////////////////////////////////////////////
-
-  },
-  requestUpdatePaymentDetails: function requestUpdatePaymentDetails(_ref3) {
-    var apiKey = _ref3.apiKey,
-        token = _ref3.token,
-        patientRefId = _ref3.patientRefId,
-        env = _ref3.env,
-        onSuccess = _ref3.onSuccess,
-        onFailure = _ref3.onFailure,
-        onCancel = _ref3.onCancel,
-        onClose = _ref3.onClose,
-        callbackOrigin = _ref3.callbackOrigin;
-    (0, _requestUpdatePaymentDetails["default"])({
-      apiKey: apiKey,
-      token: token,
-      patientRefId: patientRefId,
-      env: env,
-      onSuccess: onSuccess,
-      onFailure: onFailure,
-      onCancel: onCancel,
-      onClose: onClose,
-      callbackOrigin: callbackOrigin
-    });
-  }
-};
-var _default = checkoutSDK;
-exports["default"] = _default;
-module.exports = exports.default;

package/lib/initialiseWindow.js

@@ -1,42 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _get2 = _interopRequireDefault(require("lodash/get"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var POPUP_WIDTH = 450;
-
-var getWindowFeatures = function getWindowFeatures(_ref) {
-  var height = _ref.height,
-      width = _ref.width,
-      left = _ref.left,
-      top = _ref.top;
-  return "menubar=no, location=no, resizable=no, scrollbars=yes, status=no, height=" + height + ", width=" + width + ", left=" + left + ", top=" + top;
-};
-
-function initialiseWindow(_ref2) {
-  var url = _ref2.url;
-  if (!window) return; // The target window could either be in an iframe, or just a normal standalone window.
-  // We need to grab the correct window height and width for calculating dimensions.
-
-  var windowHeight = (0, _get2["default"])(window, 'outerHeight') || (0, _get2["default"])(window, 'innerHeight');
-  var windowWidth = (0, _get2["default"])(window, 'outerWidth') || (0, _get2["default"])(window, 'innerWidth');
-  var popupHeight = windowHeight * 0.80;
-  var popupWidth = windowWidth > POPUP_WIDTH ? POPUP_WIDTH : windowWidth * 0.25;
-  var xPosition = windowWidth / 2 - popupWidth / 2;
-  var yPosition = windowHeight / 2 - popupHeight / 2;
-  var windowRef = window.open(url, 'Medipass Checkout', getWindowFeatures({
-    height: popupHeight,
-    width: popupWidth,
-    left: xPosition,
-    top: yPosition
-  }));
-  return windowRef;
-}
-
-var _default = initialiseWindow;
-exports["default"] = _default;
-module.exports = exports.default;

package/lib/overlay.js

@@ -1,196 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _constants = require("./constants");
-
-var _objectToCss = _interopRequireDefault(require("./utils/object-to-css"));
-
-var _get2 = _interopRequireDefault(require("lodash/get"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var SUBHEADING_ELEMENT_ID = 'medipass-checkout-sdk-subheading';
-
-function createElement(_ref) {
-  var window = _ref.window,
-      element = _ref.element,
-      text = _ref.text,
-      id = _ref.id,
-      styles = _ref.styles,
-      onClick = _ref.onClick;
-  if (!window) return;
-  var newElement = window.document.createElement(element);
-
-  if (text) {
-    newElement.innerHTML = text;
-  }
-
-  if (id) {
-    newElement.id = id;
-  }
-
-  if (styles) {
-    newElement.style.cssText = (0, _objectToCss["default"])(styles);
-  }
-
-  if ((0, _get2["default"])(newElement, 'addEventListener') && onClick) {
-    newElement.addEventListener('click', function () {
-      onClick();
-    });
-  }
-
-  return newElement;
-}
-
-var overlay = {
-  contentElement: null,
-  removeOverlay: function removeOverlay() {
-    var containerDiv = document.getElementById(_constants.ROOT_ELEMENT_ID);
-    if (!containerDiv) return;
-    containerDiv.remove();
-  },
-  createOverlay: function createOverlay(_ref2) {
-    var window = _ref2.window,
-        onClickRelaunch = _ref2.onClickRelaunch,
-        onClickCancel = _ref2.onClickCancel;
-    if (!window) return;
-    var containerDiv = createElement({
-      window: window,
-      element: 'div',
-      id: _constants.ROOT_ELEMENT_ID,
-      styles: {
-        'z-index': '2147483100',
-        position: 'fixed',
-        top: '0',
-        left: '0',
-        width: '100%',
-        height: '100%',
-        'background-color': 'rgba(0, 0, 0, 0.8)',
-        'font-family': 'Lato',
-        color: 'white',
-        display: 'flex'
-      }
-    });
-    var content = createElement({
-      window: window,
-      element: 'div',
-      styles: {
-        'max-width': '360px',
-        'margin-left': 'auto',
-        'margin-right': 'auto',
-        'margin-top': 'auto',
-        'margin-bottom': 'auto',
-        'text-align': 'center'
-      }
-    });
-    this.contentElement = content; ////////////////////////////////////////////////////////////  
-
-    var heading = createElement({
-      window: window,
-      element: 'div',
-      text: 'Secure Medipass payment in progress',
-      styles: {
-        color: 'white',
-        'font-size': '35px',
-        'font-weight': '600',
-        'margin-bottom': '30px'
-      }
-    }); ////////////////////////////////////////////////////////////
-
-    var subHeading = this.createSubHeading({
-      window: window,
-      onClickRelaunch: onClickRelaunch,
-      onClickCancel: onClickCancel
-    }); ////////////////////////////////////////////////////////////
-
-    content.appendChild(heading);
-    content.appendChild(subHeading);
-    containerDiv.appendChild(content); ////////////////////////////////////////////////////////////
-
-    window.document.body.appendChild(containerDiv);
-  },
-  createSubHeading: function createSubHeading(_ref3) {
-    var window = _ref3.window,
-        onClickRelaunch = _ref3.onClickRelaunch,
-        onClickCancel = _ref3.onClickCancel;
-    if (!window) return;
-    var subHeadingContainer = createElement({
-      window: window,
-      id: SUBHEADING_ELEMENT_ID,
-      element: 'div'
-    });
-    var subHeading1 = createElement({
-      window: window,
-      element: 'div',
-      text: 'Don\'t see the payment window?'
-    });
-    var link1 = createElement({
-      window: window,
-      element: 'a',
-      text: 'Click here',
-      onClick: onClickRelaunch,
-      styles: {
-        'text-decoration': 'underline',
-        cursor: 'pointer',
-        'font-weight': '600'
-      }
-    });
-    var subHeading2 = createElement({
-      window: window,
-      element: 'span',
-      text: ' to relaunch and complete your payment.'
-    });
-    var subHeading3 = createElement({
-      window: window,
-      element: 'div',
-      text: 'OR',
-      styles: {
-        'margin-top': '20px',
-        'margin-bottom': '20px'
-      }
-    });
-    var link2 = createElement({
-      window: window,
-      element: 'a',
-      text: 'Click here to cancel the payment.',
-      onClick: onClickCancel,
-      styles: {
-        'text-decoration': 'underline',
-        cursor: 'pointer',
-        'font-weight': '600'
-      }
-    });
-    subHeadingContainer.appendChild(subHeading1);
-    subHeadingContainer.appendChild(link1);
-    subHeadingContainer.appendChild(subHeading2);
-    subHeadingContainer.appendChild(subHeading3);
-    subHeadingContainer.appendChild(link2);
-    return subHeadingContainer;
-  },
-  updateSubheading: function updateSubheading(_ref4) {
-    var window = _ref4.window,
-        onClickRelaunch = _ref4.onClickRelaunch,
-        onClickCancel = _ref4.onClickCancel;
-    if (!window) return;
-    var subheaderElement = document.getElementById(SUBHEADING_ELEMENT_ID);
-
-    if (subheaderElement) {
-      subheaderElement.remove();
-    }
-
-    var newSubheading = this.createSubHeading({
-      window: window,
-      onClickRelaunch: onClickRelaunch,
-      onClickCancel: onClickCancel
-    });
-
-    if (this.contentElement && (0, _get2["default"])(this.contentElement, 'appendChild')) {
-      this.contentElement.appendChild(newSubheading);
-    }
-  }
-};
-var _default = overlay;
-exports["default"] = _default;
-module.exports = exports.default;