vc-popup
Version:
vue popup components with power position and animation support and back key support as well
2,419 lines • 94.8 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("vue"));
else if(typeof define === 'function' && define.amd)
define(["vue"], factory);
else {
var a = typeof exports === 'object' ? factory(require("vue")) : factory(root["vue"]);
for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
}
})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_5__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 42);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function(useSourceMap) {
var list = [];
// return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if(item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
}
// Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ }),
/* 1 */
/***/ (function(module, exports, __webpack_require__) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
Modified by Evan You @yyx990803
*/
var hasDocument = typeof document !== 'undefined'
if (typeof DEBUG !== 'undefined' && DEBUG) {
if (!hasDocument) {
throw new Error(
'vue-style-loader cannot be used in a non-browser environment. ' +
"Use { target: 'node' } in your Webpack config to indicate a server-rendering environment."
) }
}
var listToStyles = __webpack_require__(4)
/*
type StyleObject = {
id: number;
parts: Array<StyleObjectPart>
}
type StyleObjectPart = {
css: string;
media: string;
sourceMap: ?string
}
*/
var stylesInDom = {/*
[id: number]: {
id: number,
refs: number,
parts: Array<(obj?: StyleObjectPart) => void>
}
*/}
var head = hasDocument && (document.head || document.getElementsByTagName('head')[0])
var singletonElement = null
var singletonCounter = 0
var isProduction = false
var noop = function () {}
var options = null
var ssrIdKey = 'data-vue-ssr-id'
// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>
// tags it will allow on a page
var isOldIE = typeof navigator !== 'undefined' && /msie [6-9]\b/.test(navigator.userAgent.toLowerCase())
module.exports = function (parentId, list, _isProduction, _options) {
isProduction = _isProduction
options = _options || {}
var styles = listToStyles(parentId, list)
addStylesToDom(styles)
return function update (newList) {
var mayRemove = []
for (var i = 0; i < styles.length; i++) {
var item = styles[i]
var domStyle = stylesInDom[item.id]
domStyle.refs--
mayRemove.push(domStyle)
}
if (newList) {
styles = listToStyles(parentId, newList)
addStylesToDom(styles)
} else {
styles = []
}
for (var i = 0; i < mayRemove.length; i++) {
var domStyle = mayRemove[i]
if (domStyle.refs === 0) {
for (var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j]()
}
delete stylesInDom[domStyle.id]
}
}
}
}
function addStylesToDom (styles /* Array<StyleObject> */) {
for (var i = 0; i < styles.length; i++) {
var item = styles[i]
var domStyle = stylesInDom[item.id]
if (domStyle) {
domStyle.refs++
for (var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j](item.parts[j])
}
for (; j < item.parts.length; j++) {
domStyle.parts.push(addStyle(item.parts[j]))
}
if (domStyle.parts.length > item.parts.length) {
domStyle.parts.length = item.parts.length
}
} else {
var parts = []
for (var j = 0; j < item.parts.length; j++) {
parts.push(addStyle(item.parts[j]))
}
stylesInDom[item.id] = { id: item.id, refs: 1, parts: parts }
}
}
}
function createStyleElement () {
var styleElement = document.createElement('style')
styleElement.type = 'text/css'
head.appendChild(styleElement)
return styleElement
}
function addStyle (obj /* StyleObjectPart */) {
var update, remove
var styleElement = document.querySelector('style[' + ssrIdKey + '~="' + obj.id + '"]')
if (styleElement) {
if (isProduction) {
// has SSR styles and in production mode.
// simply do nothing.
return noop
} else {
// has SSR styles but in dev mode.
// for some reason Chrome can't handle source map in server-rendered
// style tags - source maps in <style> only works if the style tag is
// created and inserted dynamically. So we remove the server rendered
// styles and inject new ones.
styleElement.parentNode.removeChild(styleElement)
}
}
if (isOldIE) {
// use singleton mode for IE9.
var styleIndex = singletonCounter++
styleElement = singletonElement || (singletonElement = createStyleElement())
update = applyToSingletonTag.bind(null, styleElement, styleIndex, false)
remove = applyToSingletonTag.bind(null, styleElement, styleIndex, true)
} else {
// use multi-style-tag mode in all other cases
styleElement = createStyleElement()
update = applyToTag.bind(null, styleElement)
remove = function () {
styleElement.parentNode.removeChild(styleElement)
}
}
update(obj)
return function updateStyle (newObj /* StyleObjectPart */) {
if (newObj) {
if (newObj.css === obj.css &&
newObj.media === obj.media &&
newObj.sourceMap === obj.sourceMap) {
return
}
update(obj = newObj)
} else {
remove()
}
}
}
var replaceText = (function () {
var textStore = []
return function (index, replacement) {
textStore[index] = replacement
return textStore.filter(Boolean).join('\n')
}
})()
function applyToSingletonTag (styleElement, index, remove, obj) {
var css = remove ? '' : obj.css
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = replaceText(index, css)
} else {
var cssNode = document.createTextNode(css)
var childNodes = styleElement.childNodes
if (childNodes[index]) styleElement.removeChild(childNodes[index])
if (childNodes.length) {
styleElement.insertBefore(cssNode, childNodes[index])
} else {
styleElement.appendChild(cssNode)
}
}
}
function applyToTag (styleElement, obj) {
var css = obj.css
var media = obj.media
var sourceMap = obj.sourceMap
if (media) {
styleElement.setAttribute('media', media)
}
if (options.ssrId) {
styleElement.setAttribute(ssrIdKey, obj.id)
}
if (sourceMap) {
// https://developer.chrome.com/devtools/docs/javascript-debugging
// this makes source maps inside style tags work properly in Chrome
css += '\n/*# sourceURL=' + sourceMap.sources[0] + ' */'
// http://stackoverflow.com/a/26603875
css += '\n/*# sourceMappingURL=data:application/json;base64,' + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + ' */'
}
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = css
} else {
while (styleElement.firstChild) {
styleElement.removeChild(styleElement.firstChild)
}
styleElement.appendChild(document.createTextNode(css))
}
}
/***/ }),
/* 2 */
/***/ (function(module, exports) {
/* globals __VUE_SSR_CONTEXT__ */
// IMPORTANT: Do NOT use ES2015 features in this file.
// This module is a runtime utility for cleaner component module output and will
// be included in the final webpack user bundle.
module.exports = function normalizeComponent (
rawScriptExports,
compiledTemplate,
functionalTemplate,
injectStyles,
scopeId,
moduleIdentifier /* server only */
) {
var esModule
var scriptExports = rawScriptExports = rawScriptExports || {}
// ES6 modules interop
var type = typeof rawScriptExports.default
if (type === 'object' || type === 'function') {
esModule = rawScriptExports
scriptExports = rawScriptExports.default
}
// Vue.extend constructor export interop
var options = typeof scriptExports === 'function'
? scriptExports.options
: scriptExports
// render functions
if (compiledTemplate) {
options.render = compiledTemplate.render
options.staticRenderFns = compiledTemplate.staticRenderFns
options._compiled = true
}
// functional template
if (functionalTemplate) {
options.functional = true
}
// scopedId
if (scopeId) {
options._scopeId = scopeId
}
var hook
if (moduleIdentifier) { // server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__
}
// inject component styles
if (injectStyles) {
injectStyles.call(this, context)
}
// register component module identifier for async chunk inferrence
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier)
}
}
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook
} else if (injectStyles) {
hook = injectStyles
}
if (hook) {
var functional = options.functional
var existing = functional
? options.render
: options.beforeCreate
if (!functional) {
// inject component registration as beforeCreate hook
options.beforeCreate = existing
? [].concat(existing, hook)
: [hook]
} else {
// for template-only hot-reload because in that case the render fn doesn't
// go through the normalizer
options._injectStyles = hook
// register for functioal component in vue file
options.render = function renderWithStyleInjection (h, context) {
hook.call(context)
return existing(h, context)
}
}
}
return {
esModule: esModule,
exports: scriptExports,
options: options
}
}
/***/ }),
/* 3 */,
/* 4 */
/***/ (function(module, exports) {
/**
* Translates the list format produced by css-loader into something
* easier to manipulate.
*/
module.exports = function listToStyles (parentId, list) {
var styles = []
var newStyles = {}
for (var i = 0; i < list.length; i++) {
var item = list[i]
var id = item[0]
var css = item[1]
var media = item[2]
var sourceMap = item[3]
var part = {
id: parentId + ':' + i,
css: css,
media: media,
sourceMap: sourceMap
}
if (!newStyles[id]) {
styles.push(newStyles[id] = { id: id, parts: [part] })
} else {
newStyles[id].parts.push(part)
}
}
return styles
}
/***/ }),
/* 5 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_5__;
/***/ }),
/* 6 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.last = last;
exports.countDays = countDays;
exports.offsetMonth = offsetMonth;
exports.monthsBetween = monthsBetween;
exports.throttle = throttle;
exports.fixZero = fixZero;
exports.forEach = forEach;
exports.arrToUrlArg = arrToUrlArg;
function last(arr) {
return arr[arr.length - 1];
}
// 日期相关函数
function countDays(year, month) {
var date;
year = parseInt(year, 10);
month = parseInt(month, 10);
month--; // 月份从0开始算,上面就是从1开始算
if (month === 11) {
month = 0;
year++;
} else {
month++;
}
date = new Date(year, month);
date.setTime(date.getTime() - 100);
return date.getDate();
}
function offsetMonth(year, month) {
var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
if (month < 1 || month > 12) {
console.log('检查到非法month, 范围应该为1~12');
}
year = year + Math.floor((month + offset - 1) / 12);
month = month + offset;
if (offset > 0) {
month = month % 12;
month = month === 0 ? 12 : month;
} else if (offset < 0) {
while (month <= 0) {
month += 12;
}
}
return [year, month];
}
function monthsBetween(y1, m1, y2, m2) {
var months1 = y1 * 12 + m1;
var months2 = y2 * 12 + m2;
return months1 - months2;
}
function throttle(callback, delay) {
var tail = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var timer = null;
var context;
return function () {
if (timer) return;
var args = arguments;
context = this;
if (!tail) callback.apply(context, args);
timer = setTimeout(function () {
timer = null;
if (tail) callback.apply(context, args);
}, delay);
};
}
function fixZero(val) {
if (val < 10) val = '0' + val;
return val;
}
function forEach(obj, func, context) {
for (var p in obj) {
if (context) {
func.call(context, obj[p], p);
} else {
func(obj[p], p);
}
}
}
function arrToUrlArg(obj) {
var arg = '?';
for (var p in obj) {
arg += p + '=' + obj[p] + '&';
}
return arg.slice(0, -1);
}
/***/ }),
/* 7 */,
/* 8 */,
/* 9 */,
/* 10 */,
/* 11 */,
/* 12 */,
/* 13 */,
/* 14 */,
/* 15 */,
/* 16 */,
/* 17 */,
/* 18 */,
/* 19 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _popupController = __webpack_require__(43);
Object.defineProperty(exports, 'default', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_popupController).default;
}
});
var _popupRegister = __webpack_require__(57);
Object.defineProperty(exports, 'popupRegister', {
enumerable: true,
get: function get() {
return _popupRegister.popupRegister;
}
});
var _effectRegister = __webpack_require__(21);
Object.defineProperty(exports, 'effectRegister', {
enumerable: true,
get: function get() {
return _effectRegister.effectRegister;
}
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/***/ }),
/* 20 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _effectRegister = __webpack_require__(21);
exports.default = {
name: 'vc-popup-base',
props: {
e: {
default: null
},
maskDisable: {
type: Boolean,
default: false
},
runtimeConfig: Object
},
data: function data() {
return {
positionType: null
};
},
created: function created() {
this.isShowing = false;
this.$animateDom = null;
this.afterEnterLocker = false;
this.afterLeaveLocker = false;
this._onOpenTimestamp = null;
this._animationConfigurable = null;
this._removeAnimationEndListener = null;
},
methods: {
// 以下是提供给外部使用的
setMaskOpacity: function setMaskOpacity(val) {
this.$refs.mask.style.opacity = val;
},
setMaskBgColor: function setMaskBgColor(val) {
this.$refs.mask.style.backgroundColor = val;
},
addMaskClass: function addMaskClass(name) {
this.$refs.mask.classList.add(name);
},
removeMaskClass: function removeMaskClass(name) {
this.$refs.mask.classList.remove(name);
},
trunOffMaskTransition: function trunOffMaskTransition() {
this.$refs.mask.style.webkitTransitionDuration = '0ms';
},
trunOnMaskTransition: function trunOnMaskTransition() {
this.$refs.mask.style.webkitTransitionDuration = '';
},
setAnimateDom: function setAnimateDom($dom) {
this.$animateDom = $dom;
},
getAnimateDom: function getAnimateDom($dom) {
return this.$animateDom || this.$refs.slot;
},
wrapSlotWith: function wrapSlotWith(TplConstructor, props) {
var vmWrapper = new TplConstructor({
el: document.createElement('div'),
propsData: props
});
this.$refs.slotContainer.appendChild(vmWrapper.$el);
vmWrapper.$refs.slot.appendChild(this.$refs.slot);
this.vmWrapper = vmWrapper;
return vmWrapper;
},
//内部使用的
_turnOffMask: function _turnOffMask() {
!this.maskDisable && this.vmSlot.$popupCtrl.close();
},
_maskPreventScroll: function _maskPreventScroll(e) {
this.isShowing === true && this.runtimeConfig.lockScroll && this.$refs.base === e.target && e.preventDefault();
},
_addAnimationEndListener: function _addAnimationEndListener(callback, lock) {
var _this = this;
var $dom = this.$animateDom || this.$refs.slot;
var safeBellTimer;
this[lock] = false;
var onAnimationEnd = function onAnimationEnd(e) {
if (e.target === $dom) {
if (_this[lock]) return;
_this._removeAnimationEndListener();
callback instanceof Function && callback();
_this[lock] = true;
}
};
$dom.addEventListener('transitionend', onAnimationEnd);
$dom.addEventListener('animationend', onAnimationEnd);
this.hasAnimationEndListener = true;
if (callback === this._afterLeave && Date.now() - this._onOpenTimestamp < 200) {
// 快速关闭的时候, 会导致animationEnd不会触发
safeBellTimer = setTimeout(function () {
onAnimationEnd({
target: $dom
});
}, 200);
}
this._removeAnimationEndListener = function () {
if (_this.hasAnimationEndListener) {
$dom.removeEventListener('transitionend', onAnimationEnd);
$dom.removeEventListener('animationend', onAnimationEnd);
_this.hasAnimationEndListener = false;
if (safeBellTimer) clearTimeout(safeBellTimer);
}
};
},
_beforeMount: function _beforeMount() {
this.$refs.slot.style.webkitTransitionDuration = '0ms';
if (this.runtimeConfig.lockScroll) document.body.style.overflow = 'hidden';
var className = this.runtimeConfig.className;
this._animationConfigurable = this.runtimeConfig.animationConfigurable;
if (typeof className === 'string') this.vmSlot.$el.classList.add(className);else if (className instanceof Array) this.vmSlot.$el.classList.add.apply(this.vmSlot.$el.classList, className);
this.vmSlot.popupEvt.beforeMount && this.vmSlot.popupEvt.beforeMount();
this._animation('beforeMount');
},
_afterMount: function _afterMount() {
this.vmSlot.$popupCtrl.configPosition(this.e);
this._animation('afterMount');
this._enter();
this.vmSlot.popupEvt.afterMount && this.vmSlot.popupEvt.afterMount();
},
_enter: function _enter() {
this._beforeEnter();
this.isShowing = true;
this._onOpenTimestamp = Date.now();
},
_leave: function _leave(callback) {
this._afterLeaveCallback = callback;
this._beforeLeave();
this.isShowing = false;
},
_beforeEnter: function _beforeEnter() {
var _this2 = this;
this._initMask();
var animationCfg = this.runtimeConfig.animation.in;
var maskOpacity = this.runtimeConfig.maskOpacity || 0.25;
var maskBgColor = this.runtimeConfig.maskBgColor;
var hasConfigAnimation = this._animationConfigurable && animationCfg !== undefined;
this.setMaskOpacity(animationCfg !== false ? 0 : maskOpacity);
this._animation('beforeEnter');
this._animation('init');
this.vmSlot.popupEvt.beforeEnter instanceof Function && this.vmSlot.popupEvt.beforeEnter(hasConfigAnimation);
!hasConfigAnimation && this.vmSlot.popupEvt.inAnimation instanceof Function && this.vmSlot.popupEvt.inAnimation();
this.runtimeConfig.beforeEnter instanceof Function && this.runtimeConfig.beforeEnter();
this.getAnimateDom().style.webkitTransitionDuration = '0ms';
this.$nextTick(function () {
requestAnimationFrame(function () {
_this2._addAnimationEndListener(_this2._afterEnter, 'afterEnterLocker');
_this2.$refs.slot.style.webkitTransitionDuration = '';
_this2.getAnimateDom().style.webkitTransitionDuration = '';
_this2.getAnimateDom().classList.add('vc-popup-default-transition');
_this2.setMaskOpacity(maskOpacity);
maskBgColor && _this2.setMaskBgColor(maskBgColor);
});
});
},
_afterEnter: function _afterEnter() {
if (this.animationendTriggered) return;
this._animation('afterEnter');
this.vmSlot.popupEvt.afterEnter instanceof Function && this.vmSlot.popupEvt.afterEnter();
this.runtimeConfig.afterEnter instanceof Function && this.runtimeConfig.afterEnter();
this.animationendTriggered = true;
},
_beforeLeave: function _beforeLeave() {
var _this3 = this;
this._freezeEvents();
this._removeAnimationEndListener();
requestAnimationFrame(function () {
var animationCfg = _this3.runtimeConfig.animation.out;
var hasConfigAnimation = _this3._animationConfigurable && animationCfg !== undefined;
_this3.setMaskOpacity(animationCfg !== false ? 0 : 0.25);
_this3._animation('beforeLeave');
_this3.vmSlot.popupEvt.beforeLeave instanceof Function && _this3.vmSlot.popupEvt.beforeLeave(hasConfigAnimation);
!hasConfigAnimation && _this3.vmSlot.popupEvt.outAnimation instanceof Function && _this3.vmSlot.popupEvt.outAnimation();
_this3.runtimeConfig.beforeLeave instanceof Function && _this3.runtimeConfig.beforeLeave();
_this3._addAnimationEndListener(_this3._afterLeave, 'afterLeaveLocker');
});
},
_afterLeave: function _afterLeave() {
this._animation('afterLeave');
this.vmSlot.popupEvt.afterLeave instanceof Function && this.vmSlot.popupEvt.afterLeave();
this.runtimeConfig.afterLeave instanceof Function && this.runtimeConfig.afterLeave();
this._afterLeaveCallback instanceof Function && this._afterLeaveCallback();
document.body.style.overflow = '';
},
_freezeEvents: function _freezeEvents() {
this.$refs.base.addEventListener('touchstart', this._stopPropagation, true);
this.$refs.base.addEventListener('touchmove', this._stopPropagation, true);
this.$refs.base.addEventListener('touchend', this._stopPropagation, true);
},
_stopPropagation: function _stopPropagation(e) {
e.stopPropagation();
e.preventDefault();
},
_animation: function _animation(evt) {
var _this4 = this;
var animation = this.runtimeConfig.animation;
if (!this._animationConfigurable) return;
if (animation instanceof Object === false) return;
var cfg;
var $dom = this.getAnimateDom();
var isPowerByTransition = animation.init !== undefined;
var animationOffClass = 'vc-animation-fake-off-' + evt;
var evtToCfg = {
beforeMount: 'in',
afterMount: 'in',
beforeEnter: 'in',
afterEnter: 'in',
beforeLeave: 'out',
afterLeave: 'out',
init: 'init'
};
var parseString = function parseString(val, unset) {
if (typeof val === 'string') {
if (!unset) $dom.classList.add(val);else $dom.classList.remove(val);
}
};
var parseBoolean = function parseBoolean(val, unset) {
if (typeof val === 'boolean') {
if (!unset) $dom.classList.add(animationOffClass);else $dom.classList.remove(animationOffClass);
}
};
var parseObject = function parseObject(val) {
var effect;
if (val instanceof Object) {
effect = _effectRegister.effectStack[val.effect];
if (effect) effect[evt] instanceof Function && effect[evt](val, _this4);
}
};
cfg = animation[evtToCfg[evt]];
if (cfg === undefined) return;
if (evt === 'beforeMount' || evt === 'afterMount' || evt === 'afterLeave') {
parseObject(cfg);
cfg instanceof Array && cfg.forEach(function (val) {
parseObject(val);
});
} else if (evt === 'init') {
parseString(cfg);
cfg instanceof Array && cfg.forEach(function (val) {
parseString(val);
});
} else if (evt === 'beforeEnter') {
parseBoolean(cfg);
parseString(cfg);
parseObject(cfg);
isPowerByTransition && this.$nextTick(function () {
requestAnimationFrame(function () {
parseString(cfg, true);
});
});
cfg instanceof Array && cfg.forEach(function (val) {
parseString(val);
parseObject(val);
});
} else if (evt === 'afterEnter') {
parseBoolean(cfg, true);
parseString(cfg, true);
parseObject(cfg);
cfg instanceof Array && cfg.forEach(function (val) {
parseString(val, true);
parseObject(val);
});
} else if (evt === 'beforeLeave') {
parseBoolean(cfg);
parseString(cfg);
parseObject(cfg);
cfg instanceof Array && cfg.forEach(function (val) {
parseString(val);
parseObject(val);
});
}
},
_initMask: function _initMask() {
if (this.runtimeConfig.positionType === 'absolute') {
// 因为背景没有文字, 所以可以使用动画偏移
this.$refs.mask.style.webkitTransform = 'translate(' + window.scrollX + 'px,' + window.scrollY + 'px)';
// mask就跟踪好了, 不使用fixed来做定位的了
if (!this.runtimeConfig.lockScroll) window.addEventListener('scroll', this._maskFollowScroll);
}
},
_maskFollowScroll: function _maskFollowScroll() {
this.$refs.mask.style.webkitTransitionDuration = '0ms';
this.$refs.mask.style.webkitTransform = 'translate(' + window.scrollX + 'px,' + window.scrollY + 'px)';
}
},
destroyed: function destroyed() {
this.$animateDom = null;
window.removeEventListener('scroll', this._maskFollowScroll);
}
}; //
//
//
//
//
//
//
//
//
//
//
//
//
//
//
/***/ }),
/* 21 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var effectStack = {};
function effectRegister(name, processor) {
if (effectStack[name] !== undefined) console.log('\u6CE8\u610F\u5DF2\u5B58\u5728' + name + '\u7684effect, \u5DF2\u8986\u76D6');
effectStack[name] = processor;
}
// 注册内置effect
/**
* zoomFromDom 效果是从触发事件点击的dom节点开始放大, 如其名
* fromDom: HTMLElemet
*/
effectRegister('zoomFromDom', {
beforeEnter: function beforeEnter(cfg, vmBase) {
var $fromDom = cfg.fromDom || (vmBase.e ? vmBase.e.target : null),
$slot = vmBase.vmSlot.$el,
fromDomRect,
slotRect,
scaleAdjusted = 2 / 3,
translateX,
translateY,
fromDomCenterX,
fromDomCenterY,
slotCenterX,
slotCenterY;
if (!$fromDom) throw new Error('无法找到zoomFromDom的参考dom节点, 请检查设置');
if ($fromDom) {
slotRect = $slot.getBoundingClientRect();
fromDomRect = $fromDom.getBoundingClientRect();
if (cfg.scale !== undefined) scaleAdjusted = cfg.scale;
slotCenterX = slotRect.left + slotRect.width / 2;
slotCenterY = slotRect.top + slotRect.height / 2;
fromDomCenterX = fromDomRect.left + fromDomRect.width / 2;
fromDomCenterY = fromDomRect.top + fromDomRect.height / 2;
translateX = fromDomCenterX - slotCenterX;
translateY = fromDomCenterY - slotCenterY;
$slot._x = translateX * scaleAdjusted;
$slot._y = translateY * scaleAdjusted;
$slot._scale = scaleAdjusted;
//无论in或者out都是一样的
$slot.style.opacity = 0;
$slot.style.webkitTransform = 'translate3d(' + $slot._x + 'px, ' + $slot._y + 'px,0) scale(' + $slot._scale + ')';
vmBase.$nextTick(function () {
requestAnimationFrame(function () {
$slot.style.webkitTransform = null;
$slot.style.webkitTransitionDuration = null;
$slot.style.opacity = null;
});
});
}
},
beforeLeave: function beforeLeave(cfg, vmBase) {
var $slot = vmBase.vmSlot.$el;
$slot.style.opacity = 0;
$slot.style.webkitTransform = 'translate3d(' + $slot._x + 'px, ' + $slot._y + 'px,0) scale(' + $slot._scale + ')';
}
});
/**
* addClass 方便添加class的工具, 算是一个内置的拓展, 增加onDom的配置
* value: String | Array
* onDom: HTMLElemet | String(parse by document.querySelector)
*/
effectRegister('addClass', {
beforeEnter: function beforeEnter(cfg, vmBase) {
var $dom = vmBase.vmSlot.$el;
if (typeof cfg.onDom === 'string') $dom = document.querySelector(cfg.onDom);else if (cfg.onDom instanceof HTMLElement) $dom = cfg.onDom;
if (typeof cfg.value === 'string') $dom.classList.add(cfg.value);else if (cfg.value instanceof Array) $dom.classList.add.apply($dom.classList, cfg.value);
},
beforeLeave: function beforeLeave(cfg, vmBase) {
var $dom = vmBase.vmSlot.$el;
if (typeof cfg.onDom === 'string') $dom = document.querySelector(cfg.onDom);else if (cfg.onDom instanceof HTMLElement) $dom = cfg.onDom;
if (typeof cfg.value === 'string') $dom.classList.add(cfg.value);else if (cfg.value instanceof Array) $dom.classList.add.apply($dom.classList, cfg.value);
}
});
/**
* bodyBlur 实现模糊效果, 等同于addClass到#app而已, 这是图个方便
*/
effectRegister('bodyBlur', {
beforeEnter: function beforeEnter() {
document.querySelector('#app').style.filter = 'blur(1.5px)';
},
beforeLeave: function beforeLeave() {
document.querySelector('#app').style.filter = '';
}
});
exports.default = effectRegister;
exports.effectStack = effectStack;
exports.effectRegister = effectRegister;
/***/ }),
/* 22 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
//
//
//
//
//
//
//
//
//
//
//
exports.default = {
name: 'vc-popup-conatiner',
methods: {
addPopup: function addPopup($dom) {
this.$refs.container.appendChild($dom);
},
removePopup: function removePopup($dom) {
this.$refs.container.removeChild($dom);
},
turnOn: function turnOn() {
this.$el.classList.add('on');
},
turnOff: function turnOff() {
this.$el.classList.remove('on');
}
}
};
/***/ }),
/* 23 */,
/* 24 */,
/* 25 */,
/* 26 */,
/* 27 */,
/* 28 */,
/* 29 */,
/* 30 */,
/* 31 */,
/* 32 */,
/* 33 */,
/* 34 */,
/* 35 */,
/* 36 */,
/* 37 */,
/* 38 */,
/* 39 */,
/* 40 */,
/* 41 */,
/* 42 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _popupBase = __webpack_require__(19);
var version = '0.1.25';
var install = function install(Vue) {
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (install.installed) return;
__webpack_require__(19);
};
// auto install
if (typeof window !== 'undefined' && window.Vue) {
install(window.Vue);
}
exports.default = {
install: install,
version: version,
popupRegister: _popupBase.popupRegister,
effectRegister: _popupBase.effectRegister
};
/***/ }),
/* 43 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Popup = undefined;
var _vue = __webpack_require__(5);
var _vue2 = _interopRequireDefault(_vue);
var _router = __webpack_require__(44);
var _router2 = _interopRequireDefault(_router);
var _popupBase = __webpack_require__(45);
var _popupBase2 = _interopRequireDefault(_popupBase);
var _popupConatiner = __webpack_require__(49);
var _popupConatiner2 = _interopRequireDefault(_popupConatiner);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function top(arr) {
return arr[arr.length - 1];
}
function prev(arr) {
return arr[arr.length - 2];
}
function splitPopupValue(val) {
return val ? decodeURIComponent(val).split('/') : [];
}
var Popup;
if (_vue2.default.prototype.__popup__ !== undefined) {
exports.Popup = Popup = _vue2.default.prototype.__popup__;
} else {
__webpack_require__(53);
__webpack_require__(55);
var popupContainer = null;
var vmBaseOfRouterId = {};
var constructorOfRouterId = {};
var PopupBaseConstructor = _vue2.default.extend(_popupBase2.default);
var PopupContainerConstructor = _vue2.default.extend(_popupConatiner2.default);
var containerInBody = document.body.getElementsByClassName('vc-popup-conatiner');
_router2.default.initialParam('popup');
if (containerInBody.length === 0) {
popupContainer = new PopupContainerConstructor({
el: document.createElement('div')
});
document.body.appendChild(popupContainer.$el);
} else {
popupContainer = containerInBody[0].__vue__;
}
// TODO: 提供全局常用方法来实现引用解耦
_vue2.default.prototype.$popup = {};
_vue2.default.prototype.$popup.prototype = {
$closeTop: function $closeTop() {},
$getPopupCtrls: function $getPopupCtrls() {}
};
_vue2.default.prototype.__popup__ = exports.Popup = Popup = {
fromHashChange: false,
fromUpdateRouter: false,
popupInShowingNum: 0,
lastPageStatus: null,
open: function open(vmBase, routerId) {
popupContainer.turnOn();
this.popupInShowingNum++;
vmBase._beforeMount();
popupContainer.addPopup(vmBase.$el);
vmBase._afterMount();
this.updateRouter(routerId);
this.lastPageStatus = 'showing';
},
close: function close(routerId) {
var _this = this;
var vmBase = vmBaseOfRouterId[routerId];
this.lastPageStatus = 'closing';
vmBase && vmBase._leave(function () {
if (--_this.popupInShowingNum === 0) {
popupContainer.turnOff();
_this.lastPageStatus = 'closed';
}
_this.destroyPopup(routerId);
});
},
register: function register(routerId, trigger) {
constructorOfRouterId[routerId] = trigger;
},
createPopup: function createPopup(config, runtimeConfig, routerId) {
config.runtimeConfig = runtimeConfig;
config.e = runtimeConfig.propsData.e;
return vmBaseOfRouterId[routerId] = new PopupBaseConstructor({
el: document.createElement('div'),
propsData: config
});
},
destroyPopup: function destroyPopup(routerId) {
var vmBase = vmBaseOfRouterId[routerId];
vmBaseOfRouterId[routerId] = undefined;
vmBase.isShowing = false;
popupContainer.removePopup(vmBase.$el);
vmBase.vmSlot.$destroy();
vmBase.$destroy();
},
updateRouter: function updateRouter(popupName) {
if (this.fromHashChange) {
this.fromHashChange = false;
return this.fromHashChange;
}
var value = _router2.default.getParamValue('popup');
if (value && value.split('/').pop() !== popupName) {
value += '/' + popupName;
} else {
value = popupName;
}
this.fromUpdateRouter = true;
_router2.default.parseHashCommand('&popup=' + value);
}
};
// 返回键
_router2.default.listenParam('popup', {
onEnter: function onEnter(val) {
if (Popup.fromUpdateRouter) {
Popup.fromUpdateRouter = false;
return Popup.fromUpdateRouter;
}
var list = splitPopupValue(val);
var trigger = constructorOfRouterId[top(list)];
Popup.fromHashChange = true;
trigger && trigger();
},
onLeave: function onLeave(val, oVal) {
var oList = splitPopupValue(oVal);
var list = splitPopupValue(val);
var oListTop = top(oList);
if (prev(list) !== oListTop) {
Popup.fromUpdateRouter = false;
Popup.fromHashChange = false;
Popup.close(oListTop);
}
},
onBack: function onBack(val) {}
});
// esc键
var ESC_KEY_CODE = 27;
window.addEventListener('keyup', function (e) {
e.keyCode === ESC_KEY_CODE && Popup.lastPageStatus === 'showing' && Popup.popupInShowingNum > 0 && history.back();
});
}
exports.Popup = Popup;
exports.default = Popup;
/***/ }),
/* 44 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Router = undefined;
var _utils = __webpack_require__(6);
var Router = {
history: [],
listeners: {},
init: function init() {
var _this = this;
Object.defineProperty(this.history, 'top', {
get: function get() {
return this[this.length - 1];
}
});
Object.defineProperty(this.history, 'prev', {
get: function get() {
return this[this.length - 2];
}
});
if (window) {
window.addEventListener('popstate', function () {
var hash = location.hash;
var params, lastParams;
// 返回
if (_this.history.prev === hash) {
lastParams = _this.getUrlParams(_this.history.pop());
params = _this.getUrlParams(_this.history.top);
(0, _utils.forEach)(_this.listeners, function (config, name) {
if (params.hasOwnProperty(name)) {
config.onBack(params[name], lastParams[name]);
}
if (lastParams.hasOwnProperty(name)) {
config.onLeave(params[name], lastParams[name]);
}
});
// 前进
} else if (_this.history.top !== hash) {
params = _this.getUrlParams(hash);
lastParams = _this.getUrlParams(_this.history.top);
_this.history.push(hash);
(0, _utils.forEach)(_this.listeners, function (config, name) {
if (params.hasOwnProperty(name)) {
config.onEnter(params[name], lastParams[name]);
}
if (lastParams.hasOwnProperty(name)) {
config.onLeave(params[name], lastParams[name]);
}
});
}
});
this.history.push(location.hash);
}
},
getUrlParams: function getUrlParams(url) {
var params = {};
if (url.indexOf('?') !== -1) {
url = url.slice(url.indexOf('?'));
var str = url.substr(1);
var strs = str.split('&');
for (var i = 0; i < strs.length; i++) {
params[strs[i].split('=')[0]] = strs[i].split('=')[1];
}
}
return params;
},
setUrlParams: function setUrlParams(params) {
history.replaceState({}, null, this.getNoHashUrl() + this.getHashOfParams(params));
},
getNoHashUrl: function getNoHashUrl() {
return location.href.replace(location.hash, '');
},
getHashOfParams: function getHashOfParams(params) {
// 保存非params部分
var hash = location.hash;
if (hash.indexOf('#') === -1) {
hash = '#';
} else if (hash.indexOf('?') !== -1) {
hash = hash.slice(0, hash.indexOf('?', 0));
}
// 生成params部分
hash += '?';
for (var p in params) {
hash += p + '=' + params[p] + '&';
}
return hash.slice(0, hash.length - 1);
},
listenParam: function listenParam(paramName, config) {
this.listeners[paramName] = config;
},
unListenParam: function unListenParam(paramName) {
this.listeners[paramName] = undefined;
},
parseHashCommand: function parseHashCommand(command) {
if (command === '#back') {
history.back();
return;
}
if (command === '#void') {
return;
}
if (command[0] === '&') {
var currentParams = this.getUrlParams(location.hash);
var params = this.getUrlParams('?' + command.slice(1));
var href = location.href;
var hash = location.hash;
for (var p in params) {
currentParams[p] = params[p];
}
command = (0, _utils.arrToUrlArg)(currentParams);
if (hash.indexOf('?') !== -1) {
command = href.slice(0, href.indexOf('#')) + hash.slice(0, hash.indexOf('?')) + command;
} else if (href.indexOf('#') !== -1) {
command = href.slice(0, href.indexOf('#')) + (hash || '#') + command;
} else if (hash === '') {
command = href + '#' + command;
}
} else if (command[0] === '?') {
if (hash.indexOf('?') !== -1) {
command = href.slice(0, href.indexOf('#')) + hash.slice(0, hash.indexOf('?')) + command;
} else if (href.indexOf('#') !== -1) {
command = href.slice(0, href.indexOf('#')) + hash + command;
} else if (hash === '') {
command = href + '#' + command;
}
}
location.href = command;
// window.history.replaceState({}, null, command)
return true;
},
getParamValue: function getParamValue(paramName) {
return this.getUrlParams(location.hash)[paramName];
},
initialParam: function initialParam(paramName) {
// 修复显示两个##问题
if (location.href.indexOf('#') !== 1 && location.hash === '') return;
var params = this.getUrlParams(location.hash);
delete params[paramName];
this.setUrlParams(params);
}
};
Router.init();
exports.Router = Router;
exports.default = Router;
/***/ }),
/* 45 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue__ = __webpack_require__(20);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue__);
/* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_76ca6e5c_hasScoped_false_transformToRequire_video_src_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_popup_base_vue__ = __webpack_require__(48);
var disposed = false
function injectStyle (ssrContext) {
if (disposed) return
__webpack_require__(46)
}
var normalizeComponent = __webpack_require__(2)
/* script */
/* template */
/* template functional */
var __vue_template_functional__ = false
/* styles */
var __vue_styles__ = injectStyle
/* scopeId */
var __vue_scopeId__ = null
/* moduleIdentifier (server only) */
var __vue_module_identifier__ = null
var Component = normalizeComponent(
__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_base_vue___default.a,
__WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_76ca6e5c_hasScoped_false_transformToRequire_video_src_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_popup_base_vue__["a" /* default */],
__vue_template_functional__,
__vue_styles__,
__vue_scopeId__,
__vue_module_identifier__
)
Component.options.__file = "src\\components\\popup-base\\popup-base.vue"
/* hot reload */
if (false) {(function () {
var hotAPI = require("vue-hot-reload-api")
hotAPI.install(require("vue"), false)
if (!hotAPI.compatible) return
module.hot.accept()
if (!module.hot.data) {
hotAPI.createRecord("data-v-76ca6e5c", Component.options)
} else {
hotAPI.reload("data-v-76ca6e5c", Component.options)
}
module.hot.dispose(function (data) {
disposed = true
})
})()}
/* harmony default export */ __webpack_exports__["default"] = (Component.exports);
/***/ }),
/* 46 */
/***/ (function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(47);
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var update = __webpack_require__(1)("0eb4e884", content, false, {});
// Hot Module Replacement
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../../../node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false}!../../../node_modules/vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-76ca6e5c\",\"scoped\":false,\"hasInlineConfig\":false}!../../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./popup-base.vue", function() {
var newContent = require("!!../../../node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false}!../../../node_modules/vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-76ca6e5c\",\"scoped\":false,\"hasInlineConfig\":false}!../../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./popup-base.vue");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
/***/ }),
/* 47 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(0)(false);
// imports
// module
exports.push([module.i, "\n.vc-popup-base{\n width: 100%;\n height: 100%;\n top: 0;\n}\n.vc-popup-slot{\n position: relative;\n z-index: 0;\n height: 0;\n}\n.vc-popup-default-transition {\n -webkit-transition: all 280ms ease;\n transition: all 280ms ease;\n}\n.vc-popup-mask {\n position: absolute;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n opacity: 0;\n background-color: #000000;\n -webkit-transition: opacity 350ms ease 0s;\n transition: opacity 350ms ease 0s;\n /* will-change: opacity; */\n}\n", ""]);
// exports
/***/ }),
/* 48 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c(
"div",
{
ref: "base",
staticClass: "vc-popup-base",
style: { position: _vm.positionType },
on: {
touchmove: _vm._maskPreventScroll,
mousewheel: _vm._maskPreventScroll,
DOMMouseScroll: _vm._maskPreventScroll
}
},
[
_c("div", {
ref: "mask",
staticClass: "vc-popup-mask",
on: { click: _vm._turnOffMask }
}),
_vm._v(" "),
_c("div", { ref: "slotContainer", staticClass: "vc-popup-slot" }, [
_c("div", { ref: "slot", on: { touchmove: _vm._stopPropagation } })
])
]
)
}
var staticRenderFns = []
render._withStripped = true
var esExports = { render: render, staticRenderFns: staticRenderFns }
/* harmony default export */ __webpack_exports__["a"] = (esExports);
if (false) {
module.hot.accept()
if (module.hot.data) {
require("vue-hot-reload-api") .rerender("data-v-76ca6e5c", esExports)
}
}
/***/ }),
/* 49 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue__ = __webpack_require__(22);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue__);
/* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_027d98cc_hasScoped_false_transformToRequire_video_src_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_popup_conatiner_vue__ = __webpack_require__(52);
var disposed = false
function injectStyle (ssrContext) {
if (disposed) return
__webpack_require__(50)
}
var normalizeComponent = __webpack_require__(2)
/* script */
/* template */
/* template functional */
var __vue_template_functional__ = false
/* styles */
var __vue_styles__ = injectStyle
/* scopeId */
var __vue_scopeId__ = null
/* moduleIdentifier (server only) */
var __vue_module_identifier__ = null
var Component = normalizeComponent(
__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_popup_conatiner_vue___default.a,
__WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_027d98cc_hasScoped_false_transformToRequire_video_src_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_popup_conatiner_vue__["a" /* default */],
__vue_template_functional__,
__vue_styles__,
__vue_scopeId__,
__vue_module_identifier__
)
Component.options.__file = "src\\components\\popup-base\\popup-conatiner.vue"
/* hot reload */
if (false) {(function () {
var hotAPI = require("vue-hot-reload-api")
hotAPI.install(require("vue"), false)
if (!hotAPI.compatible) return
module.hot.accept()
if (!module.hot.data) {
hotAPI.createRecord("data-v-027d98cc", Component.options)
} else {
hotAPI.reload("data-v-027d98cc", Component.options)
}
module.hot.dispose(function (data) {
disposed = true
})
})()}
/* harmony default export */ __webpack_exports__["default"] = (Component.exports);
/***/ }),
/* 50 */
/***/ (function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(51);
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var update = __webpack_require__(1)("36c88915", content, false, {});
// Hot Module Replacement
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../../../node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false}!../../../node_modules/vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-027d98cc\",\"scoped\":false,\"hasInlineConfig\":false}!../../../node_modules/sass-loader/lib/loader.js?{\"sourceMap\":false}!../../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./popup-conatiner.vue", function() {
var newContent = require("!!../../../node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false}!../../../node_modules/vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-027d98cc\",\"scoped\":false,\"hasInlineConfig\":false}!../../../node_modules/sass-loader/lib/loader.js?{\"sourceMap\":false}!../../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./popup-conatiner.vue");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
/***/ }),
/* 51 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(0)(false);
// imports
// module
exports.push([module.i, "\n.vc-popup-conatiner {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: -1;\n}\n.vc-popup-conatiner.on {\n z-index: 0;\n}\nbody > *:first-child {\n position: relative;\n z-index: 0;\n}\n", ""]);
// exports
/***/ }),
/* 52 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c("div", { ref: "container", staticClass: "vc-popup-conatiner" }, [
_c("svg", { attrs: { display: "none" } }, [
_c(
"filter",
{ attrs: { id: "vc-effect-turbulence" } },
[
_c("feTurbulence", {
attrs: {
type: "fractalNoise",
baseFrequency: "0 8.001",
numOctaves: "2",
"data-filterId": "3"
}
}),
_vm._v(" "),
_c("feDisplacementMap", {
attrs: {
xChannelSelector: "R",
yChannelSelector: "G",
in: "SourceGraphic",
scale: "20"
}
})
],
1
)
])
])
}
var staticRenderFns = []
render._withStripped = true
var esExports = { render: render, staticRenderFns: staticRenderFns }
/* harmony default export */ __webpack_exports__["a"] = (esExports);
if (false) {
module.hot.accept()
if (module.hot.data) {
require("vue-hot-reload-api") .rerender("data-v-027d98cc", esExports)
}
}
/***/ }),
/* 53 */
/***/ (function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(54);
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var update = __webpack_require__(1)("0fc72d08", content, false, {});
// Hot Module Replacement
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../../node_modules/css-loader/index.js??ref--6-1!./basic-animatin.css", function() {
var newContent = require("!!../../node_modules/css-loader/index.js??ref--6-1!./basic-animatin.css");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
/***/ }),
/* 54 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(0)(true);
// imports
// module
exports.push([module.i, ".vc-slide-up-in.vc-slide-up-init {\r\n opacity: 0;\r\n transform: translateY(100%) translateZ(0);\r\n}\r\n\r\n.vc-slide-up-in {\r\n opacity: 1;\r\n transform: translateY(0%) translateZ(0);\r\n}\r\n\r\n.vc-slide-up-out {\r\n opacity: 0;\r\n transform: translateY(100%) translateZ(0);\r\n transition-duration: 400ms;\r\n}\r\n\r\n.vc-zoom-in.vc-zoom-init {\r\n opacity: 0;\r\n transform: scale(0.8) translateZ(0);\r\n}\r\n\r\n.vc-zoom-in {\r\n opacity: 1;\r\n transform: scale(1) translateZ(0);\r\n}\r\n\r\n.vc-zoom-out {\r\n opacity: 0;\r\n transform: scale(0.8) translateZ(0);\r\n}\r\n\r\n.vc-effect-turbulence-in {\r\n animation: vc-animation-turbulence-in 280ms;\r\n}\r\n\r\n.vc-effect-turbulence-out {\r\n animation: vc-animation-turbulence-out 280ms;\r\n -webkit-filter: url('#vc-effect-turbulence');\r\n}\r\n\r\n.vc-animation-fake-off-in {\r\n animation: vc-animation-fake-off 10ms ease forwards;\r\n}\r\n\r\n.vc-animation-fake-off-out {\r\n animation: vc-animation-fake-off 10ms ease reverse;\r\n}\r\n\r\n.vc-animation-jelly-in {\r\n animation: vc-animation-jelly-in 900ms ease forwards;\r\n}\r\n\r\n.vc-animation-jelly-out {\r\n animation: vc-animation-jelly-out 280ms ease forwards;\r\n}\r\n\r\n.vc-animation-donna-left-in {\r\n animation: vc-animation-donna-left-in 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-left-out {\r\n animation: vc-animation-donna-left-out 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-right-in {\r\n animation: vc-animation-donna-right-in 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-right-out {\r\n animation: vc-animation-donna-right-out 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n@keyframes vc-animation-fake-off {\r\n 0% {opacity: 0.99;}\r\n 100%{opacity: 1;}\r\n}\r\n\r\n@keyframes vc-animation-turbulence-out{\r\n 0%{\r\n opacity: 1;\r\n }\r\n 100%{\r\n opacity: 0;\r\n }\r\n}\r\n\r\n@keyframes vc-animation-turbulence-in{\r\n 0%{\r\n -webkit-filter: none;\r\n opacity: 0;\r\n }\r\n 10%{\r\n -webkit-filter: url('#vc-effect-turbulence');\r\n }\r\n 100%{\r\n -webkit-filter: none;\r\n opacity: 1;\r\n }\r\n}\r\n\r\n@keyframes vc-animation-jelly-in {\r\n\t0% { opacity: 0; transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t2.083333% { transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t4.166667% { transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t6.25% { transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t8.333333% { transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t10.416667% { transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t12.5% { transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t14.583333% { transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t16.666667% { transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t18.75% { transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t20.833333% { transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t22.916667% { transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t25% { transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t27.083333% { transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t29.166667% { transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t31.25% { transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t33.333333% { transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t35.416667% { transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t37.5% { transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t39.583333% { transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t41.666667% { transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t43.75% { transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t45.833333% { transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t47.916667% { transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t50% { opacity: 1; transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t52.083333% { transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t54.166667% { transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t56.25% { transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t58.333333% { transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t60.416667% { transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t62.5% { transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t64.583333% { transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t66.666667% { transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t68.75% { transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t70.833333% { transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t72.916667% { transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t75% { transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t77.083333% { transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t79.166667% { transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t81.25% { transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t83.333333% { transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t85.416667% { transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t87.5% { transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t89.583333% { transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t91.666667% { transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t93.75% { transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t95.833333% { transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t97.916667% { transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t100% { opacity: 1; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n}\r\n\r\n@keyframes vc-animation-jelly-out {\r\n\t0% { opacity: 1; }\r\n\t100% { opacity: 0; transform: scale3d(0.8, 0.8, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-left-in {\r\n\t0% { opacity: 0; transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1); }\r\n\t100% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-left-out {\r\n\t0% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t20% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t100% { opacity: 0; transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-right-in {\r\n\t0% { opacity: 0; transform: translate3d(400px, 0, 0) scale3d(1.4, 0, 1); }\r\n\t100% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-right-out {\r\n\t0% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t20% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t100% { opacity: 0; transform: translate3d(400px, 0, 0) scale3d(1.4, 0, 1); }\r\n}", "", {"version":3,"sources":["D:/DEV/Github/opensource/vc-popup/src/style/basic-animatin.css"],"names":[],"mappings":"AAAA;EACE,WAAW;EACX,0CAA0C;CAC3C;;AAED;EACE,WAAW;EACX,wCAAwC;CACzC;;AAED;EACE,WAAW;EACX,0CAA0C;EAC1C,2BAA2B;CAC5B;;AAED;EACE,WAAW;EACX,oCAAoC;CACrC;;AAED;EACE,WAAW;EACX,kCAAkC;CACnC;;AAED;EACE,WAAW;EACX,oCAAoC;CACrC;;AAED;EACE,4CAA4C;CAC7C;;AAED;EACE,6CAA6C;EAC7C,6CAA6C;CAC9C;;AAED;EACE,oDAAoD;CACrD;;AAED;EACE,mDAAmD;CACpD;;AAED;EACE,qDAAqD;CACtD;;AAED;EACE,sDAAsD;CACvD;;AAED;EACE,2EAA2E;CAC5E;;AAED;EACE,4EAA4E;CAC7E;;AAED;EACE,4EAA4E;CAC7E;;AAED;EACE,6EAA6E;CAC9E;;AAED;EACE,KAAK,cAAc,CAAC;EACpB,KAAK,WAAW,CAAC;CAClB;;AAED;EACE;IACE,WAAW;GACZ;EACD;IACE,WAAW;GACZ;CACF;;AAED;EACE;IACE,qBAAqB;IACrB,WAAW;GACZ;EACD;IACE,6CAA6C;GAC9C;EACD;IACE,qBAAqB;IACrB,WAAW;GACZ;CACF;;AAED;CACC,KAAK,WAAW,EAAE,wEAAwE,EAAE;CAC5F,aAAa,gFAAgF,EAAE;CAC/F,aAAa,gFAAgF,EAAE;CAC/F,SAAS,+EAA+E,EAAE;CAC1F,YAAY,0EAA0E,EAAE;CACxF,cAAc,gFAAgF,EAAE;CAChG,QAAQ,0EAA0E,EAAE;CACpF,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,MAAM,0EAA0E,EAAE;CAClF,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,QAAQ,0EAA0E,EAAE;CACpF,cAAc,gFAAgF,EAAE;CAChG,aAAa,0EAA0E,EAAE;CACzF,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,MAAM,WAAW,EAAE,gFAAgF,EAAE;CACrG,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,UAAU,+EAA+E,EAAE;CAC3F,aAAa,0EAA0E,EAAE;CACzF,cAAc,gFAAgF,EAAE;CAChG,QAAQ,0EAA0E,EAAE;CACpF,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,MAAM,wEAAwE,EAAE;CAChF,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,QAAQ,0EAA0E,EAAE;CACpF,cAAc,gFAAgF,EAAE;CAChG,aAAa,0EAA0E,EAAE;CACzF,UAAU,gFAAgF,EAAE;CAC5F,cAAc,gFAAgF,EAAE;CAChG,cAAc,gFAAgF,EAAE;CAChG,OAAO,WAAW,CAAC,oEAAoE,EAAE;CACzF;;AAED;CACC,KAAK,WAAW,EAAE;CAClB,OAAO,WAAW,CAAC,gCAAgC,EAAE;CACrD;;AAED;CACC,KAAK,WAAW,CAAC,wDAAwD,EAAE;CAC3E,OAAO,WAAW,CAAC,iDAAiD,EAAE;CACtE;;AAED;CACC,KAAK,WAAW,CAAC,iDAAiD,EAAE;CACpE,MAAM,WAAW,CAAC,iDAAiD,EAAE;CACrE,OAAO,WAAW,CAAC,wDAAwD,EAAE;CAC7E;;AAED;CACC,KAAK,WAAW,CAAC,uDAAuD,EAAE;CAC1E,OAAO,WAAW,CAAC,iDAAiD,EAAE;CACtE;;AAED;CACC,KAAK,WAAW,CAAC,iDAAiD,EAAE;CACpE,MAAM,WAAW,CAAC,iDAAiD,EAAE;CACrE,OAAO,WAAW,CAAC,uDAAuD,EAAE;CAC5E","file":"basic-animatin.css","sourcesContent":[".vc-slide-up-in.vc-slide-up-init {\r\n opacity: 0;\r\n transform: translateY(100%) translateZ(0);\r\n}\r\n\r\n.vc-slide-up-in {\r\n opacity: 1;\r\n transform: translateY(0%) translateZ(0);\r\n}\r\n\r\n.vc-slide-up-out {\r\n opacity: 0;\r\n transform: translateY(100%) translateZ(0);\r\n transition-duration: 400ms;\r\n}\r\n\r\n.vc-zoom-in.vc-zoom-init {\r\n opacity: 0;\r\n transform: scale(0.8) translateZ(0);\r\n}\r\n\r\n.vc-zoom-in {\r\n opacity: 1;\r\n transform: scale(1) translateZ(0);\r\n}\r\n\r\n.vc-zoom-out {\r\n opacity: 0;\r\n transform: scale(0.8) translateZ(0);\r\n}\r\n\r\n.vc-effect-turbulence-in {\r\n animation: vc-animation-turbulence-in 280ms;\r\n}\r\n\r\n.vc-effect-turbulence-out {\r\n animation: vc-animation-turbulence-out 280ms;\r\n -webkit-filter: url('#vc-effect-turbulence');\r\n}\r\n\r\n.vc-animation-fake-off-in {\r\n animation: vc-animation-fake-off 10ms ease forwards;\r\n}\r\n\r\n.vc-animation-fake-off-out {\r\n animation: vc-animation-fake-off 10ms ease reverse;\r\n}\r\n\r\n.vc-animation-jelly-in {\r\n animation: vc-animation-jelly-in 900ms ease forwards;\r\n}\r\n\r\n.vc-animation-jelly-out {\r\n animation: vc-animation-jelly-out 280ms ease forwards;\r\n}\r\n\r\n.vc-animation-donna-left-in {\r\n animation: vc-animation-donna-left-in 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-left-out {\r\n animation: vc-animation-donna-left-out 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-right-in {\r\n animation: vc-animation-donna-right-in 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n.vc-animation-donna-right-out {\r\n animation: vc-animation-donna-right-out 400ms cubic-bezier(0.7,0,0.3,1) both;\r\n}\r\n\r\n@keyframes vc-animation-fake-off {\r\n 0% {opacity: 0.99;}\r\n 100%{opacity: 1;}\r\n}\r\n\r\n@keyframes vc-animation-turbulence-out{\r\n 0%{\r\n opacity: 1;\r\n }\r\n 100%{\r\n opacity: 0;\r\n }\r\n}\r\n\r\n@keyframes vc-animation-turbulence-in{\r\n 0%{\r\n -webkit-filter: none;\r\n opacity: 0;\r\n }\r\n 10%{\r\n -webkit-filter: url('#vc-effect-turbulence');\r\n }\r\n 100%{\r\n -webkit-filter: none;\r\n opacity: 1;\r\n }\r\n}\r\n\r\n@keyframes vc-animation-jelly-in {\r\n\t0% { opacity: 0; transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t2.083333% { transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t4.166667% { transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t6.25% { transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t8.333333% { transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t10.416667% { transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t12.5% { transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t14.583333% { transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t16.666667% { transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t18.75% { transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t20.833333% { transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t22.916667% { transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t25% { transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t27.083333% { transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t29.166667% { transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t31.25% { transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t33.333333% { transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t35.416667% { transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t37.5% { transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t39.583333% { transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t41.666667% { transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t43.75% { transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t45.833333% { transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t47.916667% { transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t50% { opacity: 1; transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t52.083333% { transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t54.166667% { transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t56.25% { transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t58.333333% { transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t60.416667% { transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t62.5% { transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t64.583333% { transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t66.666667% { transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t68.75% { transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t70.833333% { transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t72.916667% { transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t75% { transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t77.083333% { transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t79.166667% { transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t81.25% { transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t83.333333% { transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t85.416667% { transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t87.5% { transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t89.583333% { transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t91.666667% { transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t93.75% { transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t95.833333% { transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t97.916667% { transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n\t100% { opacity: 1; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }\r\n}\r\n\r\n@keyframes vc-animation-jelly-out {\r\n\t0% { opacity: 1; }\r\n\t100% { opacity: 0; transform: scale3d(0.8, 0.8, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-left-in {\r\n\t0% { opacity: 0; transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1); }\r\n\t100% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-left-out {\r\n\t0% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t20% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t100% { opacity: 0; transform: translate3d(-400px, 0, 0) scale3d(1.4, 0, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-right-in {\r\n\t0% { opacity: 0; transform: translate3d(400px, 0, 0) scale3d(1.4, 0, 1); }\r\n\t100% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n}\r\n\r\n@keyframes vc-animation-donna-right-out {\r\n\t0% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t20% { opacity: 1; transform: translate3d(0, 0, 0) scale3d(1, 1, 1); }\r\n\t100% { opacity: 0; transform: translate3d(400px, 0, 0) scale3d(1.4, 0, 1); }\r\n}"],"sourceRoot":""}]);
// exports
/***/ }),
/* 55 */
/***/ (function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(56);
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var update = __webpack_require__(1)("6acd3886", content, false, {});
// Hot Module Replacement
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../../node_modules/css-loader/index.js??ref--6-1!./animation-duration-preset.css", function() {
var newContent = require("!!../../node_modules/css-loader/index.js??ref--6-1!./animation-duration-preset.css");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
/***/ }),
/* 56 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(0)(true);
// imports
// module
exports.push([module.i, ".vc-duration-750{animation-duration:750ms;animation-fill-mode:both;}\r\n.vc-duration-500{animation-duration:500ms;animation-fill-mode:both;}\r\n.vc-duration-350{animation-duration:350ms;animation-fill-mode:both;}\r\n.vc-duration-300{animation-duration:300ms;animation-fill-mode:both;}\r\n.vc-duration-280{animation-duration:280ms;animation-fill-mode:both;}\r\n.vc-duration-250{animation-duration:250ms;animation-fill-mode:both;}\r\n.vc-duration-200{animation-duration:200ms;animation-fill-mode:both;}\r\n.vc-duration-150{animation-duration:150ms;animation-fill-mode:both;}\r\n.vc-duration-80 {animation-duration:80ms; animation-fill-mode:both;}", "", {"version":3,"sources":["D:/DEV/Github/opensource/vc-popup/src/style/animation-duration-preset.css"],"names":[],"mappings":"AAAA,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,yBAAyB,yBAAyB,CAAC;AACpE,iBAAiB,wBAAwB,CAAC,yBAAyB,CAAC","file":"animation-duration-preset.css","sourcesContent":[".vc-duration-750{animation-duration:750ms;animation-fill-mode:both;}\r\n.vc-duration-500{animation-duration:500ms;animation-fill-mode:both;}\r\n.vc-duration-350{animation-duration:350ms;animation-fill-mode:both;}\r\n.vc-duration-300{animation-duration:300ms;animation-fill-mode:both;}\r\n.vc-duration-280{animation-duration:280ms;animation-fill-mode:both;}\r\n.vc-duration-250{animation-duration:250ms;animation-fill-mode:both;}\r\n.vc-duration-200{animation-duration:200ms;animation-fill-mode:both;}\r\n.vc-duration-150{animation-duration:150ms;animation-fill-mode:both;}\r\n.vc-duration-80 {animation-duration:80ms; animation-fill-mode:both;}"],"sourceRoot":""}]);
// exports
/***/ }),
/* 57 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.popupRegister = undefined;
var _vue = __webpack_require__(5);
var _vue2 = _interopRequireDefault(_vue);
var _popupBase = __webpack_require__(58);
var _popupBase2 = _interopRequireDefault(_popupBase);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function popupRegister(name, template, popupConfig, defaultConfig) {
// 首字母大写
name = name[0].toUpperCase() + name.slice(1);
function popupTemplate(constructConfig) {
if (this === undefined) return console.log('记得加new~');
this.name = name;
this.popupConfig = popupConfig;
this.Template = _vue2.default.extend(template);
this.config = this.constructConfig = Object.assign({
animationConfigurable: true
}, defaultConfig, constructConfig);
}
popupTemplate.prototype = _popupBase2.default;
_vue2.default.prototype.$popup[name] = popupTemplate;
return popupTemplate;
}
exports.popupRegister = popupRegister;
exports.default = popupRegister;
/***/ }),
/* 58 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _index = __webpack_require__(19);
var _index2 = _interopRequireDefault(_index);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var popupBase = {
open: function open(e) {
var runtimeConfig = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (this.vmBase && this.vmBase.isShowing) return console.log('已经open调用了, 需要close之后再调用, 不过可以多次new');
var routerId = this.getRouterId();
// 配置初始化
this.config = Object.assign({
animation: {},
lockScroll: true,
positionType: 'absolute'
}, this.constructConfig, runtimeConfig);
this.config.propsData = Object.assign({}, this.constructConfig.propsData, runtimeConfig.propsData);
this.config.propsData.e = e;
// dom节点初始化
this.vmBase = _index2.default.createPopup(this.popupConfig, this.config, routerId);
this.vmBase.vmSlot = this.vmSlot = new this.Template({
el: this.vmBase.$refs.slot,
propsData: this.config.propsData
});
this.vmBase.$refs.slot = this.vmSlot.$el;
this.vmSlot.$popupCtrl = this;
this.vmSlot.popupEvt = this.vmSlot.popupEvt || {};
_index2.default.register(routerId, this.open.bind(this, e, runtimeConfig));
_index2.default.open(this.vmBase, routerId);
},
close: function close() {
if (this.vmBase.isShowing) {
this.vmBase.isShowing = false;
history.back();
}
},
configPosition: function configPosition(e) {
var config = this.config;
var $slotContainer = this.vmBase.$refs.slotContainer;
var $slot = $slotContainer.children[0];
var position = config.position;
// 公用
var fromLeft, fromTop, originX, originY;
var fromFrameLeft, fromFrameTop;
var placeLeftOffset, placeRightOffset, placeBottomOffset, placeTopOffset;
var margins = [];
var frame = {};
var dWidth = $slot.clientWidth;
var dHeight = $slot.clientHeight;
// clickRelative 需要的
var clickX, clickY;
// domRelative 需要的
var $refDom, refRect;
var refCorner, relativeToCorner;
this.vmBase.positionType = config.positionType;
if (config.positionType === 'absolute') {
$slotContainer.style.webkitTransform = 'translate(' + window.scrollX + 'px, ' + window.scrollY + 'px)';
}
if (position === 'center' || position === undefined) {
position = {};
}
if (position instanceof Object) {
frame.width = window.innerWidth;
frame.height = window.innerHeight;
var helper = function helper(one, another) {
var tmp;
var frameOne = one === 'top' ? frame.height : frame.width;
var dOne = one === 'top' ? dHeight : dWidth;
one = position[one];
another = position[another];
if (one !== undefined) {
// 百分比处理
if (typeof one === 'string' && one.indexOf('%') !== -1) {
tmp = parseFloat(one.slice(0, one.indexOf('%'))) * frameOne;
} else if (typeof one === 'string' || typeof one === 'number') {
tmp = one;
} else {
console.log('position.top的参数类型不对~');
}
} else if (another !== undefined) {
// 百分比处理
if (typeof another === 'string' && another.indexOf('%') !== -1) {
tmp = (1 - parseFloat(another.slice(0, another.indexOf('%')))) * frameOne;
} else if (typeof another === 'string' || typeof another === 'number') {
tmp = frameOne - parseFloat(another) - dOne;
} else {
console.log('position.bottom的参数类型不对~');
}
} else {
// 居中
tmp = (frameOne - dOne) / 2;
}
return tmp;
};
fromTop = helper('top', 'bottom');
fromLeft = helper('left', 'right');
$slot.style.marginLeft = fromLeft + 'px';
$slot.style.marginTop = fromTop + 'px';
}
if (position === 'clickRelative') {
// region 点击坐标初始化
if (e === undefined) return;
if (e.touches && e.touches[0]) {
clickX = e.touches[0].clientX;
clickY = e.touches[0].clientY;
} else if (e.clientX) {
clickX = e.clientX;
clickY = e.clientY;
}
// endregion
// region 外框 格式化 TODO 之后可以缓存这个,不过动态也是有好处的, 性能优化的时候在做吧
if (config.frame instanceof Object) {
frame.top = config.frame.top;
frame.left = config.frame.left;
frame.width = config.frame.width;
frame.height = config.frame.height;
} else if (config.frame instanceof HTMLElement) {
var rect = config.frame.getBoundingClientRect();
frame.top = rect.top;
frame.left = rect.left;
frame.width = rect.width;
frame.height = rect.height;
} else {
frame.top = 0;
frame.left = 0;
frame.width = window.innerWidth;
frame.height = window.innerHeight;
}
// endregion
// region margin 导入
if (typeof config.margin === 'number' || typeof config.margin === 'string') {
margins[0] = margins[1] = margins[2] = margins[3] = config.margin;
} else if (config.margin instanceof Array) {
if (config.margin.length === 2) {
margins[0] = margins[2] = config.margins[0];
margins[1] = margins[3] = config.margins[1];
} else if (config.margin.length === 4) {
margins[0] = config.margins[0];
margins[1] = config.margins[1];
margins[2] = config.margins[2];
margins[3] = config.margins[3];
}
} else {
margins[0] = margins[1] = margins[2] = margins[3] = 0;
}
// margin 数值格式化
var formatValue = function formatValue(val, base) {
if (typeof val === 'string') {
if (val[val.length - 1] === '%') {
return parseInt(val.slice(0, val.length - 1)) * base;
} else if (val.indexOf('px') !== -1) {
return parseInt(val.replace('px', ''));
}
} else if (typeof val === 'number') {
return val;
}
};
margins[0] = formatValue(margins[0], frame.height);
margins[1] = formatValue(margins[1], frame.width);
margins[2] = formatValue(margins[2], frame.height);
margins[3] = formatValue(margins[3], frame.width);
//endregion
fromFrameLeft = clickX - frame.left;
fromFrameTop = clickY - frame.top;
//region 左右
// 假设放在左右边的情况
placeLeftOffset = frame.width - fromFrameLeft - dWidth - margins[1];
placeRightOffset = fromFrameLeft - dWidth - margins[3];
if (dWidth < frame.width) {
if (placeLeftOffset < 0) {
if (placeRightOffset > 0) {
fromLeft = clickX - dWidth;
originX = 'right';
} else {
if (placeLeftOffset > placeRightOffset) {
fromLeft = clickX + placeLeftOffset;
originX = 'left';
} else {
fromLeft = clickX - dWidth - placeRightOffset;
originX = 'left';
}
}
} else {
// 右边可以嵌入正常
fromLeft = clickX;
originX = 'left';
}
} else {
// 溢出的情况
fromLeft = 0;
originX = 'left';
}
// endregion
// region 上下
// 假设放在上下边的情况
placeBottomOffset = frame.height - fromFrameTop - dHeight - margins[2];
placeTopOffset = fromFrameTop - dHeight - margins[0];
if (dHeight < frame.height) {
if (placeBottomOffset < 0) {
if (placeTopOffset > 0) {
fromTop = clickY - dHeight;
originY = 'bottom';
} else {
if (placeBottomOffset > placeTopOffset) {
fromTop = clickY + placeBottomOffset;
originY = 'top';
} else {
fromTop = clickY - dHeight - placeTopOffset;
originY = 'bottom';
}
}
} else {
// 右边可以嵌入正常
fromTop = clickY;
originY = 'top';
}
} else {
// 溢出的情况
fromTop = 0;
originY = 'top';
}
// endregion
$slot.style.position = 'absolute';
$slot.style.left = fromLeft + 'px';
$slot.style.top = fromTop + 'px';
}
// region
if (position === 'domRelative' && config.refDom instanceof HTMLElement) {
$refDom = config.refDom;
refRect = $refDom.getBoundingClientRect();
//解析参数
refCorner = this.parseRefCorner(config.refCorner);
relativeToCorner = this.parseRelativeToCorner(config.relativeToCorner);
// 设定位置
fromLeft = refRect.left;
fromTop = refRect.top;
if (refCorner[0] === 'bottom') {
fromTop += refRect.height;
} else if (refCorner[0] === 'center') {
fromTop += refRect.height / 2 - dHeight / 2;
}
if (refCorner[1] === 'right') {
fromLeft += refRect.width;
} else if (refCorner[1] === 'center') {
fromLeft += refRect.width / 2 - dWidth / 2;
}
if (relativeToCorner[0] === 'above' && refCorner[0] !== 'center') {
fromTop -= dHeight;
}
if (relativeToCorner[1] === 'before' && refCorner[1] !== 'center') {
fromLeft -= dWidth;
}
originY = refCorner[0] !== 'center' ? relativeToCorner[0] === 'above' ? 'bottom' : 'top' : 'center';
originX = refCorner[1] !== 'center' ? relativeToCorner[1] === 'before' ? 'right' : 'left' : 'center';
$slot.style.position = 'absolute';
$slot.style.left = fromLeft + 'px';
$slot.style.top = fromTop + 'px';
}
// endregion
// 设置动画重心
if (config.autoSetOrthocenter === true) {
$slot.style['transform-origin'] = originY + ' ' + originX;
}
},
getRouterId: function getRouterId() {
if (this.config.name === undefined) {
return this.name + '_' + _index2.default.popupInShowingNum;
} else if (typeof this.config.name === 'string' && this.config.name !== '') {
return this.config.name;
} else {
console.log('出现不合法的routerId~');
return null;
}
},
parseRefCorner: function parseRefCorner(cRefCorner) {
// 解析refCorner
var refCorner;
var validVerticalRefCorner = ['top', 'bottom', 'center'];
var validHorizonalRefCorner = ['left', 'right', 'center'];
if (cRefCorner === undefined) {
// 缺省默认
refCorner = ['top', 'right'];
} else if (typeof cRefCorner === 'string') {
refCorner = cRefCorner.split(' ');
// 检查参数是否合法
if (refCorner.length !== 2 || !validVerticalRefCorner.includes(refCorner[0]) || !validHorizonalRefCorner.includes(refCorner[1])) {
console.log('refCorner配置有误~');
}
} else {
// 非法参数,或者不可解析的参数
console.log('refCorner配置有误~');
}
return refCorner;
},
parseRelativeToCorner: function parseRelativeToCorner(cRelativeToCorner) {
// 解析refCorner
var relativeToCorner;
var validVerticalRelativeToCorner = ['below', 'above'];
var validHorizonalRelativeToCorner = ['before', 'after'];
// 解析relativeToCorner
if (cRelativeToCorner === undefined) {
// 缺省默认
relativeToCorner = ['below', 'after'];
} else if (typeof cRelativeToCorner === 'string') {
relativeToCorner = cRelativeToCorner.split(' ');
// 检查参数是否合法
if (relativeToCorner.length !== 2 || !validVerticalRelativeToCorner.includes(relativeToCorner[0]) || !validHorizonalRelativeToCorner.includes(relativeToCorner[1])) {
console.log('relativeToCorner配置有误~');
}
} else {
// 非法参数,或者不可解析的参数
console.log('relativeToCorner配置有误~');
}
return relativeToCorner;
}
};
exports.default = popupBase;
/***/ })
/******/ ])["default"];
});
//# sourceMappingURL=index.js.map