vimo-dt/lib/components/modal/index.js

A Vue2.x UI Project For Mobile & HyBrid

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _vue = require('vue');

var _vue2 = _interopRequireDefault(_vue);

var _registerListener = require('../../util/register-listener');

var _registerListener2 = _interopRequireDefault(_registerListener);

var _modal = require('./modal.vue');

var _modal2 = _interopRequireDefault(_modal);

var _getInsertPosition = require('../../util/get-insert-position');

var _getInsertPosition2 = _interopRequireDefault(_getInsertPosition);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var modalArr = [];
var unRegisterUrlChange = [];
var isModalEnable = true;
var scrollTop = 0;

function ModalFactory(options) {
  var Modal = _vue2.default.extend(_modal2.default);
  options.dismissOnPageChange = false;
  options.recordInHistory = false;
  options.scrollControl = false;
  return new Modal({
    el: (0, _getInsertPosition2.default)('modalPortal').appendChild(document.createElement('div')),
    propsData: options
  });
}

function present() {
  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

  isModalEnable = false;
  return new Promise(function (resolve) {
    var modalInstance = ModalFactory(options);
    var presentPromise = modalInstance.present();

    window.history.pushState({
      id: new Date().getTime(),
      name: 'Modal-' + modalInstance._uid
    }, '', '');

    modalArr.push(modalInstance);

    if (unRegisterUrlChange.length === 0) {
      (0, _registerListener2.default)(window, 'popstate', function () {
        isModalEnable && dismiss(null, false);
      }, {}, unRegisterUrlChange);

      _disableScroll();
    }

    presentPromise.then(function () {
      isModalEnable = true;
      resolve();
    });
  });
}

function dismiss(dataBack) {
  var changeLocalHistory = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;

  isModalEnable = false;

  if (changeLocalHistory) {
    window.history.back();
  }

  return new Promise(function (resolve) {
    var lastModalInstance = modalArr.pop();

    if (modalArr.length === 0) {
      unRegisterAllListener();

      _enableScroll();
    }

    lastModalInstance.dismiss(dataBack).then(function () {
      isModalEnable = true;

      resolve();
    });
  });
}

function unRegisterAllListener() {
  unRegisterUrlChange.forEach(function (item) {
    return item && item();
  });
  unRegisterUrlChange = [];
}

function _disableScroll() {
  var scrollHeight = window.document.documentElement.scrollHeight;
  var clientHeight = window.document.documentElement.clientHeight;
  if (scrollHeight > clientHeight) {
    scrollTop = window.scrollY;
    window.document.body.style.position = 'fixed';
    window.document.body.style.top = -scrollTop + 'px';
  }
}

function _enableScroll() {
  scrollTop = window.scrollY;
  window.document.body.style.position = '';
  window.document.body.style.top = '';
  window.scrollTo(0, scrollTop);
  scrollTop = 0;
}

exports.default = {
  present: present,
  dismiss: dismiss
};