123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190 |
- 'use strict';
- exports.__esModule = true;
- /* Modified from https://github.com/sdecima/javascript-detect-element-resize
- * version: 0.5.3
- *
- * The MIT License (MIT)
- *
- * Copyright (c) 2013 Sebastián Décima
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to
- * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
- * the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
- * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- */
- var isServer = typeof window === 'undefined';
- /* istanbul ignore next */
- var requestFrame = function () {
- if (isServer) return;
- var raf = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || function (fn) {
- return window.setTimeout(fn, 20);
- };
- return function (fn) {
- return raf(fn);
- };
- }();
- /* istanbul ignore next */
- var cancelFrame = function () {
- if (isServer) return;
- var cancel = window.cancelAnimationFrame || window.mozCancelAnimationFrame || window.webkitCancelAnimationFrame || window.clearTimeout;
- return function (id) {
- return cancel(id);
- };
- }();
- /* istanbul ignore next */
- var resetTrigger = function resetTrigger(element) {
- var trigger = element.__resizeTrigger__;
- var expand = trigger.firstElementChild;
- var contract = trigger.lastElementChild;
- var expandChild = expand.firstElementChild;
- contract.scrollLeft = contract.scrollWidth;
- contract.scrollTop = contract.scrollHeight;
- expandChild.style.width = expand.offsetWidth + 1 + 'px';
- expandChild.style.height = expand.offsetHeight + 1 + 'px';
- expand.scrollLeft = expand.scrollWidth;
- expand.scrollTop = expand.scrollHeight;
- };
- /* istanbul ignore next */
- var checkTriggers = function checkTriggers(element) {
- return element.offsetWidth !== element.__resizeLast__.width || element.offsetHeight !== element.__resizeLast__.height;
- };
- /* istanbul ignore next */
- var scrollListener = function scrollListener(event) {
- var _this = this;
- resetTrigger(this);
- if (this.__resizeRAF__) cancelFrame(this.__resizeRAF__);
- this.__resizeRAF__ = requestFrame(function () {
- if (checkTriggers(_this)) {
- _this.__resizeLast__.width = _this.offsetWidth;
- _this.__resizeLast__.height = _this.offsetHeight;
- _this.__resizeListeners__.forEach(function (fn) {
- fn.call(_this, event);
- });
- }
- });
- };
- /* Detect CSS Animations support to detect element display/re-attach */
- var attachEvent = isServer ? {} : document.attachEvent;
- var DOM_PREFIXES = 'Webkit Moz O ms'.split(' ');
- var START_EVENTS = 'webkitAnimationStart animationstart oAnimationStart MSAnimationStart'.split(' ');
- var RESIZE_ANIMATION_NAME = 'resizeanim';
- var animation = false;
- var keyFramePrefix = '';
- var animationStartEvent = 'animationstart';
- /* istanbul ignore next */
- if (!attachEvent && !isServer) {
- var testElement = document.createElement('fakeelement');
- if (testElement.style.animationName !== undefined) {
- animation = true;
- }
- if (animation === false) {
- var prefix = '';
- for (var i = 0; i < DOM_PREFIXES.length; i++) {
- if (testElement.style[DOM_PREFIXES[i] + 'AnimationName'] !== undefined) {
- prefix = DOM_PREFIXES[i];
- keyFramePrefix = '-' + prefix.toLowerCase() + '-';
- animationStartEvent = START_EVENTS[i];
- animation = true;
- break;
- }
- }
- }
- }
- var stylesCreated = false;
- /* istanbul ignore next */
- var createStyles = function createStyles() {
- if (!stylesCreated && !isServer) {
- var animationKeyframes = '@' + keyFramePrefix + 'keyframes ' + RESIZE_ANIMATION_NAME + ' { from { opacity: 0; } to { opacity: 0; } } ';
- var animationStyle = keyFramePrefix + 'animation: 1ms ' + RESIZE_ANIMATION_NAME + ';';
- // opacity: 0 works around a chrome bug https://code.google.com/p/chromium/issues/detail?id=286360
- var css = animationKeyframes + '\n .resize-triggers { ' + animationStyle + ' visibility: hidden; opacity: 0; }\n .resize-triggers, .resize-triggers > div, .contract-trigger:before { content: " "; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; z-index: -1 }\n .resize-triggers > div { background: #eee; overflow: auto; }\n .contract-trigger:before { width: 200%; height: 200%; }';
- var head = document.head || document.getElementsByTagName('head')[0];
- var style = document.createElement('style');
- style.type = 'text/css';
- if (style.styleSheet) {
- style.styleSheet.cssText = css;
- } else {
- style.appendChild(document.createTextNode(css));
- }
- head.appendChild(style);
- stylesCreated = true;
- }
- };
- /* istanbul ignore next */
- var addResizeListener = exports.addResizeListener = function addResizeListener(element, fn) {
- if (isServer) return;
- if (attachEvent) {
- element.attachEvent('onresize', fn);
- } else {
- if (!element.__resizeTrigger__) {
- if (getComputedStyle(element).position === 'static') {
- element.style.position = 'relative';
- }
- createStyles();
- element.__resizeLast__ = {};
- element.__resizeListeners__ = [];
- var resizeTrigger = element.__resizeTrigger__ = document.createElement('div');
- resizeTrigger.className = 'resize-triggers';
- resizeTrigger.innerHTML = '<div class="expand-trigger"><div></div></div><div class="contract-trigger"></div>';
- element.appendChild(resizeTrigger);
- resetTrigger(element);
- element.addEventListener('scroll', scrollListener, true);
- /* Listen for a css animation to detect element display/re-attach */
- if (animationStartEvent) {
- resizeTrigger.addEventListener(animationStartEvent, function (event) {
- if (event.animationName === RESIZE_ANIMATION_NAME) {
- resetTrigger(element);
- }
- });
- }
- }
- element.__resizeListeners__.push(fn);
- }
- };
- /* istanbul ignore next */
- var removeResizeListener = exports.removeResizeListener = function removeResizeListener(element, fn) {
- if (!element || !element.__resizeListeners__) return;
- if (attachEvent) {
- element.detachEvent('onresize', fn);
- } else {
- element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
- if (!element.__resizeListeners__.length) {
- element.removeEventListener('scroll', scrollListener);
- element.__resizeTrigger__ = !element.removeChild(element.__resizeTrigger__);
- }
- }
- };
|