|
@@ -1,4 +1,4 @@
|
|
|
-/*! tether 1.1.0 */
|
|
|
|
|
|
|
+/*! tether 1.3.3 */
|
|
|
|
|
|
|
|
(function(root, factory) {
|
|
(function(root, factory) {
|
|
|
if (typeof define === 'function' && define.amd) {
|
|
if (typeof define === 'function' && define.amd) {
|
|
@@ -21,24 +21,55 @@ if (typeof TetherBase === 'undefined') {
|
|
|
TetherBase = { modules: [] };
|
|
TetherBase = { modules: [] };
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-function getScrollParent(el) {
|
|
|
|
|
- var _getComputedStyle = getComputedStyle(el);
|
|
|
|
|
|
|
+var zeroElement = null;
|
|
|
|
|
|
|
|
- var position = _getComputedStyle.position;
|
|
|
|
|
|
|
+// Same as native getBoundingClientRect, except it takes into account parent <frame> offsets
|
|
|
|
|
+// if the element lies within a nested document (<frame> or <iframe>-like).
|
|
|
|
|
+function getActualBoundingClientRect(node) {
|
|
|
|
|
+ var boundingRect = node.getBoundingClientRect();
|
|
|
|
|
+
|
|
|
|
|
+ // The original object returned by getBoundingClientRect is immutable, so we clone it
|
|
|
|
|
+ // We can't use extend because the properties are not considered part of the object by hasOwnProperty in IE9
|
|
|
|
|
+ var rect = {};
|
|
|
|
|
+ for (var k in boundingRect) {
|
|
|
|
|
+ rect[k] = boundingRect[k];
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ if (node.ownerDocument !== document) {
|
|
|
|
|
+ var _frameElement = node.ownerDocument.defaultView.frameElement;
|
|
|
|
|
+ if (_frameElement) {
|
|
|
|
|
+ var frameRect = getActualBoundingClientRect(_frameElement);
|
|
|
|
|
+ rect.top += frameRect.top;
|
|
|
|
|
+ rect.bottom += frameRect.top;
|
|
|
|
|
+ rect.left += frameRect.left;
|
|
|
|
|
+ rect.right += frameRect.left;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ return rect;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+function getScrollParents(el) {
|
|
|
|
|
+ // In firefox if the el is inside an iframe with display: none; window.getComputedStyle() will return null;
|
|
|
|
|
+ // https://bugzilla.mozilla.org/show_bug.cgi?id=548397
|
|
|
|
|
+ var computedStyle = getComputedStyle(el) || {};
|
|
|
|
|
+ var position = computedStyle.position;
|
|
|
|
|
+ var parents = [];
|
|
|
|
|
|
|
|
if (position === 'fixed') {
|
|
if (position === 'fixed') {
|
|
|
- return el;
|
|
|
|
|
|
|
+ return [el];
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var parent = el;
|
|
var parent = el;
|
|
|
- while (parent = parent.parentNode) {
|
|
|
|
|
|
|
+ while ((parent = parent.parentNode) && parent && parent.nodeType === 1) {
|
|
|
var style = undefined;
|
|
var style = undefined;
|
|
|
try {
|
|
try {
|
|
|
style = getComputedStyle(parent);
|
|
style = getComputedStyle(parent);
|
|
|
} catch (err) {}
|
|
} catch (err) {}
|
|
|
|
|
|
|
|
if (typeof style === 'undefined' || style === null) {
|
|
if (typeof style === 'undefined' || style === null) {
|
|
|
- return parent;
|
|
|
|
|
|
|
+ parents.push(parent);
|
|
|
|
|
+ return parents;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var _style = style;
|
|
var _style = style;
|
|
@@ -48,12 +79,19 @@ function getScrollParent(el) {
|
|
|
|
|
|
|
|
if (/(auto|scroll)/.test(overflow + overflowY + overflowX)) {
|
|
if (/(auto|scroll)/.test(overflow + overflowY + overflowX)) {
|
|
|
if (position !== 'absolute' || ['relative', 'absolute', 'fixed'].indexOf(style.position) >= 0) {
|
|
if (position !== 'absolute' || ['relative', 'absolute', 'fixed'].indexOf(style.position) >= 0) {
|
|
|
- return parent;
|
|
|
|
|
|
|
+ parents.push(parent);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- return document.body;
|
|
|
|
|
|
|
+ parents.push(el.ownerDocument.body);
|
|
|
|
|
+
|
|
|
|
|
+ // If the node is within a frame, account for the parent window scroll
|
|
|
|
|
+ if (el.ownerDocument !== document) {
|
|
|
|
|
+ parents.push(el.ownerDocument.defaultView);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ return parents;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var uniqueId = (function () {
|
|
var uniqueId = (function () {
|
|
@@ -64,14 +102,14 @@ var uniqueId = (function () {
|
|
|
})();
|
|
})();
|
|
|
|
|
|
|
|
var zeroPosCache = {};
|
|
var zeroPosCache = {};
|
|
|
-var getOrigin = function getOrigin(doc) {
|
|
|
|
|
|
|
+var getOrigin = function getOrigin() {
|
|
|
// getBoundingClientRect is unfortunately too accurate. It introduces a pixel or two of
|
|
// getBoundingClientRect is unfortunately too accurate. It introduces a pixel or two of
|
|
|
// jitter as the user scrolls that messes with our ability to detect if two positions
|
|
// jitter as the user scrolls that messes with our ability to detect if two positions
|
|
|
// are equivilant or not. We place an element at the top left of the page that will
|
|
// are equivilant or not. We place an element at the top left of the page that will
|
|
|
// get the same jitter, so we can cancel the two out.
|
|
// get the same jitter, so we can cancel the two out.
|
|
|
- var node = doc._tetherZeroElement;
|
|
|
|
|
- if (typeof node === 'undefined') {
|
|
|
|
|
- node = doc.createElement('div');
|
|
|
|
|
|
|
+ var node = zeroElement;
|
|
|
|
|
+ if (!node) {
|
|
|
|
|
+ node = document.createElement('div');
|
|
|
node.setAttribute('data-tether-id', uniqueId());
|
|
node.setAttribute('data-tether-id', uniqueId());
|
|
|
extend(node.style, {
|
|
extend(node.style, {
|
|
|
top: 0,
|
|
top: 0,
|
|
@@ -79,20 +117,14 @@ var getOrigin = function getOrigin(doc) {
|
|
|
position: 'absolute'
|
|
position: 'absolute'
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
- doc.body.appendChild(node);
|
|
|
|
|
|
|
+ document.body.appendChild(node);
|
|
|
|
|
|
|
|
- doc._tetherZeroElement = node;
|
|
|
|
|
|
|
+ zeroElement = node;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var id = node.getAttribute('data-tether-id');
|
|
var id = node.getAttribute('data-tether-id');
|
|
|
if (typeof zeroPosCache[id] === 'undefined') {
|
|
if (typeof zeroPosCache[id] === 'undefined') {
|
|
|
- zeroPosCache[id] = {};
|
|
|
|
|
-
|
|
|
|
|
- var rect = node.getBoundingClientRect();
|
|
|
|
|
- for (var k in rect) {
|
|
|
|
|
- // Can't use extend, as on IE9, elements don't resolve to be hasOwnProperty
|
|
|
|
|
- zeroPosCache[id][k] = rect[k];
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ zeroPosCache[id] = getActualBoundingClientRect(node);
|
|
|
|
|
|
|
|
// Clear the cache when this position call is done
|
|
// Clear the cache when this position call is done
|
|
|
defer(function () {
|
|
defer(function () {
|
|
@@ -103,6 +135,13 @@ var getOrigin = function getOrigin(doc) {
|
|
|
return zeroPosCache[id];
|
|
return zeroPosCache[id];
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
+function removeUtilElements() {
|
|
|
|
|
+ if (zeroElement) {
|
|
|
|
|
+ document.body.removeChild(zeroElement);
|
|
|
|
|
+ }
|
|
|
|
|
+ zeroElement = null;
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
function getBounds(el) {
|
|
function getBounds(el) {
|
|
|
var doc = undefined;
|
|
var doc = undefined;
|
|
|
if (el === document) {
|
|
if (el === document) {
|
|
@@ -114,15 +153,9 @@ function getBounds(el) {
|
|
|
|
|
|
|
|
var docEl = doc.documentElement;
|
|
var docEl = doc.documentElement;
|
|
|
|
|
|
|
|
- var box = {};
|
|
|
|
|
- // The original object returned by getBoundingClientRect is immutable, so we clone it
|
|
|
|
|
- // We can't use extend because the properties are not considered part of the object by hasOwnProperty in IE9
|
|
|
|
|
- var rect = el.getBoundingClientRect();
|
|
|
|
|
- for (var k in rect) {
|
|
|
|
|
- box[k] = rect[k];
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ var box = getActualBoundingClientRect(el);
|
|
|
|
|
|
|
|
- var origin = getOrigin(doc);
|
|
|
|
|
|
|
+ var origin = getOrigin();
|
|
|
|
|
|
|
|
box.top -= origin.top;
|
|
box.top -= origin.top;
|
|
|
box.left -= origin.left;
|
|
box.left -= origin.left;
|
|
@@ -239,7 +272,9 @@ function hasClass(el, name) {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function getClassName(el) {
|
|
function getClassName(el) {
|
|
|
- if (el.className instanceof SVGAnimatedString) {
|
|
|
|
|
|
|
+ // Can't use just SVGAnimatedString here since nodes within a Frame in IE have
|
|
|
|
|
+ // completely separately SVGAnimatedString base classes
|
|
|
|
|
+ if (el.className instanceof el.ownerDocument.defaultView.SVGAnimatedString) {
|
|
|
return el.className.baseVal;
|
|
return el.className.baseVal;
|
|
|
}
|
|
}
|
|
|
return el.className;
|
|
return el.className;
|
|
@@ -304,7 +339,7 @@ var Evented = (function () {
|
|
|
}, {
|
|
}, {
|
|
|
key: 'off',
|
|
key: 'off',
|
|
|
value: function off(event, handler) {
|
|
value: function off(event, handler) {
|
|
|
- if (typeof this.bindings !== 'undefined' && typeof this.bindings[event] !== 'undefined') {
|
|
|
|
|
|
|
+ if (typeof this.bindings === 'undefined' || typeof this.bindings[event] === 'undefined') {
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -358,7 +393,8 @@ var Evented = (function () {
|
|
|
})();
|
|
})();
|
|
|
|
|
|
|
|
TetherBase.Utils = {
|
|
TetherBase.Utils = {
|
|
|
- getScrollParent: getScrollParent,
|
|
|
|
|
|
|
+ getActualBoundingClientRect: getActualBoundingClientRect,
|
|
|
|
|
+ getScrollParents: getScrollParents,
|
|
|
getBounds: getBounds,
|
|
getBounds: getBounds,
|
|
|
getOffsetParent: getOffsetParent,
|
|
getOffsetParent: getOffsetParent,
|
|
|
extend: extend,
|
|
extend: extend,
|
|
@@ -370,7 +406,8 @@ TetherBase.Utils = {
|
|
|
flush: flush,
|
|
flush: flush,
|
|
|
uniqueId: uniqueId,
|
|
uniqueId: uniqueId,
|
|
|
Evented: Evented,
|
|
Evented: Evented,
|
|
|
- getScrollBarSize: getScrollBarSize
|
|
|
|
|
|
|
+ getScrollBarSize: getScrollBarSize,
|
|
|
|
|
+ removeUtilElements: removeUtilElements
|
|
|
};
|
|
};
|
|
|
/* globals TetherBase, performance */
|
|
/* globals TetherBase, performance */
|
|
|
|
|
|
|
@@ -380,14 +417,18 @@ var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr =
|
|
|
|
|
|
|
|
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
|
|
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
|
|
|
|
|
|
|
|
|
|
+var _get = function get(_x6, _x7, _x8) { var _again = true; _function: while (_again) { var object = _x6, property = _x7, receiver = _x8; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x6 = parent; _x7 = property; _x8 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
|
|
|
|
|
+
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
|
|
|
|
|
|
|
|
|
|
+function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
|
|
|
+
|
|
|
if (typeof TetherBase === 'undefined') {
|
|
if (typeof TetherBase === 'undefined') {
|
|
|
throw new Error('You must include the utils.js file before tether.js');
|
|
throw new Error('You must include the utils.js file before tether.js');
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var _TetherBase$Utils = TetherBase.Utils;
|
|
var _TetherBase$Utils = TetherBase.Utils;
|
|
|
-var getScrollParent = _TetherBase$Utils.getScrollParent;
|
|
|
|
|
|
|
+var getScrollParents = _TetherBase$Utils.getScrollParents;
|
|
|
var getBounds = _TetherBase$Utils.getBounds;
|
|
var getBounds = _TetherBase$Utils.getBounds;
|
|
|
var getOffsetParent = _TetherBase$Utils.getOffsetParent;
|
|
var getOffsetParent = _TetherBase$Utils.getOffsetParent;
|
|
|
var extend = _TetherBase$Utils.extend;
|
|
var extend = _TetherBase$Utils.extend;
|
|
@@ -397,6 +438,7 @@ var updateClasses = _TetherBase$Utils.updateClasses;
|
|
|
var defer = _TetherBase$Utils.defer;
|
|
var defer = _TetherBase$Utils.defer;
|
|
|
var flush = _TetherBase$Utils.flush;
|
|
var flush = _TetherBase$Utils.flush;
|
|
|
var getScrollBarSize = _TetherBase$Utils.getScrollBarSize;
|
|
var getScrollBarSize = _TetherBase$Utils.getScrollBarSize;
|
|
|
|
|
+var removeUtilElements = _TetherBase$Utils.removeUtilElements;
|
|
|
|
|
|
|
|
function within(a, b) {
|
|
function within(a, b) {
|
|
|
var diff = arguments.length <= 2 || arguments[2] === undefined ? 1 : arguments[2];
|
|
var diff = arguments.length <= 2 || arguments[2] === undefined ? 1 : arguments[2];
|
|
@@ -410,7 +452,7 @@ var transformKey = (function () {
|
|
|
}
|
|
}
|
|
|
var el = document.createElement('div');
|
|
var el = document.createElement('div');
|
|
|
|
|
|
|
|
- var transforms = ['transform', 'webkitTransform', 'OTransform', 'MozTransform', 'msTransform'];
|
|
|
|
|
|
|
+ var transforms = ['transform', 'WebkitTransform', 'OTransform', 'MozTransform', 'msTransform'];
|
|
|
for (var i = 0; i < transforms.length; ++i) {
|
|
for (var i = 0; i < transforms.length; ++i) {
|
|
|
var key = transforms[i];
|
|
var key = transforms[i];
|
|
|
if (el.style[key] !== undefined) {
|
|
if (el.style[key] !== undefined) {
|
|
@@ -455,7 +497,7 @@ function now() {
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (typeof pendingTimeout !== 'undefined') {
|
|
|
|
|
|
|
+ if (pendingTimeout != null) {
|
|
|
clearTimeout(pendingTimeout);
|
|
clearTimeout(pendingTimeout);
|
|
|
pendingTimeout = null;
|
|
pendingTimeout = null;
|
|
|
}
|
|
}
|
|
@@ -465,7 +507,7 @@ function now() {
|
|
|
lastDuration = now() - lastCall;
|
|
lastDuration = now() - lastCall;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- if (typeof window !== 'undefined') {
|
|
|
|
|
|
|
+ if (typeof window !== 'undefined' && typeof window.addEventListener !== 'undefined') {
|
|
|
['resize', 'scroll', 'touchmove'].forEach(function (event) {
|
|
['resize', 'scroll', 'touchmove'].forEach(function (event) {
|
|
|
window.addEventListener(event, tick);
|
|
window.addEventListener(event, tick);
|
|
|
});
|
|
});
|
|
@@ -571,12 +613,15 @@ var parseOffset = function parseOffset(value) {
|
|
|
};
|
|
};
|
|
|
var parseAttachment = parseOffset;
|
|
var parseAttachment = parseOffset;
|
|
|
|
|
|
|
|
-var TetherClass = (function () {
|
|
|
|
|
|
|
+var TetherClass = (function (_Evented) {
|
|
|
|
|
+ _inherits(TetherClass, _Evented);
|
|
|
|
|
+
|
|
|
function TetherClass(options) {
|
|
function TetherClass(options) {
|
|
|
var _this = this;
|
|
var _this = this;
|
|
|
|
|
|
|
|
_classCallCheck(this, TetherClass);
|
|
_classCallCheck(this, TetherClass);
|
|
|
|
|
|
|
|
|
|
+ _get(Object.getPrototypeOf(TetherClass.prototype), 'constructor', this).call(this);
|
|
|
this.position = this.position.bind(this);
|
|
this.position = this.position.bind(this);
|
|
|
|
|
|
|
|
tethers.push(this);
|
|
tethers.push(this);
|
|
@@ -667,14 +712,14 @@ var TetherClass = (function () {
|
|
|
this.offset = parseOffset(this.options.offset);
|
|
this.offset = parseOffset(this.options.offset);
|
|
|
this.targetOffset = parseOffset(this.options.targetOffset);
|
|
this.targetOffset = parseOffset(this.options.targetOffset);
|
|
|
|
|
|
|
|
- if (typeof this.scrollParent !== 'undefined') {
|
|
|
|
|
|
|
+ if (typeof this.scrollParents !== 'undefined') {
|
|
|
this.disable();
|
|
this.disable();
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (this.targetModifier === 'scroll-handle') {
|
|
if (this.targetModifier === 'scroll-handle') {
|
|
|
- this.scrollParent = this.target;
|
|
|
|
|
|
|
+ this.scrollParents = [this.target];
|
|
|
} else {
|
|
} else {
|
|
|
- this.scrollParent = getScrollParent(this.target);
|
|
|
|
|
|
|
+ this.scrollParents = getScrollParents(this.target);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (!(this.options.enabled === false)) {
|
|
if (!(this.options.enabled === false)) {
|
|
@@ -795,6 +840,8 @@ var TetherClass = (function () {
|
|
|
}, {
|
|
}, {
|
|
|
key: 'enable',
|
|
key: 'enable',
|
|
|
value: function enable() {
|
|
value: function enable() {
|
|
|
|
|
+ var _this3 = this;
|
|
|
|
|
+
|
|
|
var pos = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
|
|
var pos = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
|
|
|
|
|
|
|
|
if (!(this.options.addTargetClasses === false)) {
|
|
if (!(this.options.addTargetClasses === false)) {
|
|
@@ -803,9 +850,11 @@ var TetherClass = (function () {
|
|
|
addClass(this.element, this.getClass('enabled'));
|
|
addClass(this.element, this.getClass('enabled'));
|
|
|
this.enabled = true;
|
|
this.enabled = true;
|
|
|
|
|
|
|
|
- if (this.scrollParent !== document) {
|
|
|
|
|
- this.scrollParent.addEventListener('scroll', this.position);
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ this.scrollParents.forEach(function (parent) {
|
|
|
|
|
+ if (parent !== _this3.target.ownerDocument) {
|
|
|
|
|
+ parent.addEventListener('scroll', _this3.position);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
|
|
|
if (pos) {
|
|
if (pos) {
|
|
|
this.position();
|
|
this.position();
|
|
@@ -814,32 +863,40 @@ var TetherClass = (function () {
|
|
|
}, {
|
|
}, {
|
|
|
key: 'disable',
|
|
key: 'disable',
|
|
|
value: function disable() {
|
|
value: function disable() {
|
|
|
|
|
+ var _this4 = this;
|
|
|
|
|
+
|
|
|
removeClass(this.target, this.getClass('enabled'));
|
|
removeClass(this.target, this.getClass('enabled'));
|
|
|
removeClass(this.element, this.getClass('enabled'));
|
|
removeClass(this.element, this.getClass('enabled'));
|
|
|
this.enabled = false;
|
|
this.enabled = false;
|
|
|
|
|
|
|
|
- if (typeof this.scrollParent !== 'undefined') {
|
|
|
|
|
- this.scrollParent.removeEventListener('scroll', this.position);
|
|
|
|
|
|
|
+ if (typeof this.scrollParents !== 'undefined') {
|
|
|
|
|
+ this.scrollParents.forEach(function (parent) {
|
|
|
|
|
+ parent.removeEventListener('scroll', _this4.position);
|
|
|
|
|
+ });
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}, {
|
|
}, {
|
|
|
key: 'destroy',
|
|
key: 'destroy',
|
|
|
value: function destroy() {
|
|
value: function destroy() {
|
|
|
- var _this3 = this;
|
|
|
|
|
|
|
+ var _this5 = this;
|
|
|
|
|
|
|
|
this.disable();
|
|
this.disable();
|
|
|
|
|
|
|
|
tethers.forEach(function (tether, i) {
|
|
tethers.forEach(function (tether, i) {
|
|
|
- if (tether === _this3) {
|
|
|
|
|
|
|
+ if (tether === _this5) {
|
|
|
tethers.splice(i, 1);
|
|
tethers.splice(i, 1);
|
|
|
- return;
|
|
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
+
|
|
|
|
|
+ // Remove any elements we were using for convenience from the DOM
|
|
|
|
|
+ if (tethers.length === 0) {
|
|
|
|
|
+ removeUtilElements();
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}, {
|
|
}, {
|
|
|
key: 'updateAttachClasses',
|
|
key: 'updateAttachClasses',
|
|
|
value: function updateAttachClasses(elementAttach, targetAttach) {
|
|
value: function updateAttachClasses(elementAttach, targetAttach) {
|
|
|
- var _this4 = this;
|
|
|
|
|
|
|
+ var _this6 = this;
|
|
|
|
|
|
|
|
elementAttach = elementAttach || this.attachment;
|
|
elementAttach = elementAttach || this.attachment;
|
|
|
targetAttach = targetAttach || this.targetAttachment;
|
|
targetAttach = targetAttach || this.targetAttachment;
|
|
@@ -872,27 +929,27 @@ var TetherClass = (function () {
|
|
|
|
|
|
|
|
var all = [];
|
|
var all = [];
|
|
|
sides.forEach(function (side) {
|
|
sides.forEach(function (side) {
|
|
|
- all.push(_this4.getClass('element-attached') + '-' + side);
|
|
|
|
|
- all.push(_this4.getClass('target-attached') + '-' + side);
|
|
|
|
|
|
|
+ all.push(_this6.getClass('element-attached') + '-' + side);
|
|
|
|
|
+ all.push(_this6.getClass('target-attached') + '-' + side);
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
defer(function () {
|
|
defer(function () {
|
|
|
- if (!(typeof _this4._addAttachClasses !== 'undefined')) {
|
|
|
|
|
|
|
+ if (!(typeof _this6._addAttachClasses !== 'undefined')) {
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- updateClasses(_this4.element, _this4._addAttachClasses, all);
|
|
|
|
|
- if (!(_this4.options.addTargetClasses === false)) {
|
|
|
|
|
- updateClasses(_this4.target, _this4._addAttachClasses, all);
|
|
|
|
|
|
|
+ updateClasses(_this6.element, _this6._addAttachClasses, all);
|
|
|
|
|
+ if (!(_this6.options.addTargetClasses === false)) {
|
|
|
|
|
+ updateClasses(_this6.target, _this6._addAttachClasses, all);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- delete _this4._addAttachClasses;
|
|
|
|
|
|
|
+ delete _this6._addAttachClasses;
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
}, {
|
|
}, {
|
|
|
key: 'position',
|
|
key: 'position',
|
|
|
value: function position() {
|
|
value: function position() {
|
|
|
- var _this5 = this;
|
|
|
|
|
|
|
+ var _this7 = this;
|
|
|
|
|
|
|
|
var flushChanges = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
|
|
var flushChanges = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
|
|
|
|
|
|
|
@@ -911,7 +968,7 @@ var TetherClass = (function () {
|
|
|
this.updateAttachClasses(this.attachment, targetAttachment);
|
|
this.updateAttachClasses(this.attachment, targetAttachment);
|
|
|
|
|
|
|
|
var elementPos = this.cache('element-bounds', function () {
|
|
var elementPos = this.cache('element-bounds', function () {
|
|
|
- return getBounds(_this5.element);
|
|
|
|
|
|
|
+ return getBounds(_this7.element);
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
var width = elementPos.width;
|
|
var width = elementPos.width;
|
|
@@ -929,7 +986,7 @@ var TetherClass = (function () {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
var targetPos = this.cache('target-bounds', function () {
|
|
var targetPos = this.cache('target-bounds', function () {
|
|
|
- return _this5.getTargetBounds();
|
|
|
|
|
|
|
+ return _this7.getTargetBounds();
|
|
|
});
|
|
});
|
|
|
var targetSize = targetPos;
|
|
var targetSize = targetPos;
|
|
|
|
|
|
|
@@ -994,29 +1051,32 @@ var TetherClass = (function () {
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
+ var doc = this.target.ownerDocument;
|
|
|
|
|
+ var win = doc.defaultView;
|
|
|
|
|
+
|
|
|
var scrollbarSize = undefined;
|
|
var scrollbarSize = undefined;
|
|
|
- if (document.body.scrollWidth > window.innerWidth) {
|
|
|
|
|
|
|
+ if (doc.body.scrollWidth > win.innerWidth) {
|
|
|
scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
|
|
scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
|
|
|
next.viewport.bottom -= scrollbarSize.height;
|
|
next.viewport.bottom -= scrollbarSize.height;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (document.body.scrollHeight > window.innerHeight) {
|
|
|
|
|
|
|
+ if (doc.body.scrollHeight > win.innerHeight) {
|
|
|
scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
|
|
scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
|
|
|
next.viewport.right -= scrollbarSize.width;
|
|
next.viewport.right -= scrollbarSize.width;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (['', 'static'].indexOf(document.body.style.position) === -1 || ['', 'static'].indexOf(document.body.parentElement.style.position) === -1) {
|
|
|
|
|
|
|
+ if (['', 'static'].indexOf(doc.body.style.position) === -1 || ['', 'static'].indexOf(doc.body.parentElement.style.position) === -1) {
|
|
|
// Absolute positioning in the body will be relative to the page, not the 'initial containing block'
|
|
// Absolute positioning in the body will be relative to the page, not the 'initial containing block'
|
|
|
- next.page.bottom = document.body.scrollHeight - top - height;
|
|
|
|
|
- next.page.right = document.body.scrollWidth - left - width;
|
|
|
|
|
|
|
+ next.page.bottom = doc.body.scrollHeight - top - height;
|
|
|
|
|
+ next.page.right = doc.body.scrollWidth - left - width;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (typeof this.options.optimizations !== 'undefined' && this.options.optimizations.moveElement !== false && !(typeof this.targetModifier !== 'undefined')) {
|
|
if (typeof this.options.optimizations !== 'undefined' && this.options.optimizations.moveElement !== false && !(typeof this.targetModifier !== 'undefined')) {
|
|
|
(function () {
|
|
(function () {
|
|
|
- var offsetParent = _this5.cache('target-offsetparent', function () {
|
|
|
|
|
- return getOffsetParent(_this5.target);
|
|
|
|
|
|
|
+ var offsetParent = _this7.cache('target-offsetparent', function () {
|
|
|
|
|
+ return getOffsetParent(_this7.target);
|
|
|
});
|
|
});
|
|
|
- var offsetPosition = _this5.cache('target-offsetparent-bounds', function () {
|
|
|
|
|
|
|
+ var offsetPosition = _this7.cache('target-offsetparent-bounds', function () {
|
|
|
return getBounds(offsetParent);
|
|
return getBounds(offsetParent);
|
|
|
});
|
|
});
|
|
|
var offsetParentStyle = getComputedStyle(offsetParent);
|
|
var offsetParentStyle = getComputedStyle(offsetParent);
|
|
@@ -1027,8 +1087,8 @@ var TetherClass = (function () {
|
|
|
offsetBorder[side.toLowerCase()] = parseFloat(offsetParentStyle['border' + side + 'Width']);
|
|
offsetBorder[side.toLowerCase()] = parseFloat(offsetParentStyle['border' + side + 'Width']);
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
- offsetPosition.right = document.body.scrollWidth - offsetPosition.left - offsetParentSize.width + offsetBorder.right;
|
|
|
|
|
- offsetPosition.bottom = document.body.scrollHeight - offsetPosition.top - offsetParentSize.height + offsetBorder.bottom;
|
|
|
|
|
|
|
+ offsetPosition.right = doc.body.scrollWidth - offsetPosition.left - offsetParentSize.width + offsetBorder.right;
|
|
|
|
|
+ offsetPosition.bottom = doc.body.scrollHeight - offsetPosition.top - offsetParentSize.height + offsetBorder.bottom;
|
|
|
|
|
|
|
|
if (next.page.top >= offsetPosition.top + offsetBorder.top && next.page.bottom >= offsetPosition.bottom) {
|
|
if (next.page.top >= offsetPosition.top + offsetBorder.top && next.page.bottom >= offsetPosition.bottom) {
|
|
|
if (next.page.left >= offsetPosition.left + offsetBorder.left && next.page.right >= offsetPosition.right) {
|
|
if (next.page.left >= offsetPosition.left + offsetBorder.left && next.page.right >= offsetPosition.right) {
|
|
@@ -1069,7 +1129,7 @@ var TetherClass = (function () {
|
|
|
}, {
|
|
}, {
|
|
|
key: 'move',
|
|
key: 'move',
|
|
|
value: function move(pos) {
|
|
value: function move(pos) {
|
|
|
- var _this6 = this;
|
|
|
|
|
|
|
+ var _this8 = this;
|
|
|
|
|
|
|
|
if (!(typeof this.element.parentNode !== 'undefined')) {
|
|
if (!(typeof this.element.parentNode !== 'undefined')) {
|
|
|
return;
|
|
return;
|
|
@@ -1100,8 +1160,8 @@ var TetherClass = (function () {
|
|
|
var css = { top: '', left: '', right: '', bottom: '' };
|
|
var css = { top: '', left: '', right: '', bottom: '' };
|
|
|
|
|
|
|
|
var transcribe = function transcribe(_same, _pos) {
|
|
var transcribe = function transcribe(_same, _pos) {
|
|
|
- var hasOptimizations = typeof _this6.options.optimizations !== 'undefined';
|
|
|
|
|
- var gpu = hasOptimizations ? _this6.options.optimizations.gpu : null;
|
|
|
|
|
|
|
+ var hasOptimizations = typeof _this8.options.optimizations !== 'undefined';
|
|
|
|
|
+ var gpu = hasOptimizations ? _this8.options.optimizations.gpu : null;
|
|
|
if (gpu !== false) {
|
|
if (gpu !== false) {
|
|
|
var yPos = undefined,
|
|
var yPos = undefined,
|
|
|
xPos = undefined;
|
|
xPos = undefined;
|
|
@@ -1153,14 +1213,14 @@ var TetherClass = (function () {
|
|
|
} else if (typeof same.offset !== 'undefined' && same.offset.top && same.offset.left) {
|
|
} else if (typeof same.offset !== 'undefined' && same.offset.top && same.offset.left) {
|
|
|
(function () {
|
|
(function () {
|
|
|
css.position = 'absolute';
|
|
css.position = 'absolute';
|
|
|
- var offsetParent = _this6.cache('target-offsetparent', function () {
|
|
|
|
|
- return getOffsetParent(_this6.target);
|
|
|
|
|
|
|
+ var offsetParent = _this8.cache('target-offsetparent', function () {
|
|
|
|
|
+ return getOffsetParent(_this8.target);
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
- if (getOffsetParent(_this6.element) !== offsetParent) {
|
|
|
|
|
|
|
+ if (getOffsetParent(_this8.element) !== offsetParent) {
|
|
|
defer(function () {
|
|
defer(function () {
|
|
|
- _this6.element.parentNode.removeChild(_this6.element);
|
|
|
|
|
- offsetParent.appendChild(_this6.element);
|
|
|
|
|
|
|
+ _this8.element.parentNode.removeChild(_this8.element);
|
|
|
|
|
+ offsetParent.appendChild(_this8.element);
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -1175,7 +1235,7 @@ var TetherClass = (function () {
|
|
|
if (!moved) {
|
|
if (!moved) {
|
|
|
var offsetParentIsBody = true;
|
|
var offsetParentIsBody = true;
|
|
|
var currentNode = this.element.parentNode;
|
|
var currentNode = this.element.parentNode;
|
|
|
- while (currentNode && currentNode.tagName !== 'BODY') {
|
|
|
|
|
|
|
+ while (currentNode && currentNode.nodeType === 1 && currentNode.tagName !== 'BODY') {
|
|
|
if (getComputedStyle(currentNode).position !== 'static') {
|
|
if (getComputedStyle(currentNode).position !== 'static') {
|
|
|
offsetParentIsBody = false;
|
|
offsetParentIsBody = false;
|
|
|
break;
|
|
break;
|
|
@@ -1186,7 +1246,7 @@ var TetherClass = (function () {
|
|
|
|
|
|
|
|
if (!offsetParentIsBody) {
|
|
if (!offsetParentIsBody) {
|
|
|
this.element.parentNode.removeChild(this.element);
|
|
this.element.parentNode.removeChild(this.element);
|
|
|
- document.body.appendChild(this.element);
|
|
|
|
|
|
|
+ this.element.ownerDocument.body.appendChild(this.element);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -1197,11 +1257,6 @@ var TetherClass = (function () {
|
|
|
var val = css[key];
|
|
var val = css[key];
|
|
|
var elVal = this.element.style[key];
|
|
var elVal = this.element.style[key];
|
|
|
|
|
|
|
|
- if (elVal !== '' && val !== '' && ['top', 'left', 'bottom', 'right'].indexOf(key) >= 0) {
|
|
|
|
|
- elVal = parseFloat(elVal);
|
|
|
|
|
- val = parseFloat(val);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
if (elVal !== val) {
|
|
if (elVal !== val) {
|
|
|
write = true;
|
|
write = true;
|
|
|
writeCSS[key] = val;
|
|
writeCSS[key] = val;
|
|
@@ -1210,14 +1265,14 @@ var TetherClass = (function () {
|
|
|
|
|
|
|
|
if (write) {
|
|
if (write) {
|
|
|
defer(function () {
|
|
defer(function () {
|
|
|
- extend(_this6.element.style, writeCSS);
|
|
|
|
|
|
|
+ extend(_this8.element.style, writeCSS);
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}]);
|
|
}]);
|
|
|
|
|
|
|
|
return TetherClass;
|
|
return TetherClass;
|
|
|
-})();
|
|
|
|
|
|
|
+})(Evented);
|
|
|
|
|
|
|
|
TetherClass.modules = [];
|
|
TetherClass.modules = [];
|
|
|
|
|
|
|
@@ -1240,7 +1295,7 @@ var BOUNDS_FORMAT = ['left', 'top', 'right', 'bottom'];
|
|
|
|
|
|
|
|
function getBoundingRect(tether, to) {
|
|
function getBoundingRect(tether, to) {
|
|
|
if (to === 'scrollParent') {
|
|
if (to === 'scrollParent') {
|
|
|
- to = tether.scrollParent;
|
|
|
|
|
|
|
+ to = tether.scrollParents[0];
|
|
|
} else if (to === 'window') {
|
|
} else if (to === 'window') {
|
|
|
to = [pageXOffset, pageYOffset, innerWidth + pageXOffset, innerHeight + pageYOffset];
|
|
to = [pageXOffset, pageYOffset, innerWidth + pageXOffset, innerHeight + pageYOffset];
|
|
|
}
|
|
}
|
|
@@ -1251,12 +1306,22 @@ function getBoundingRect(tether, to) {
|
|
|
|
|
|
|
|
if (typeof to.nodeType !== 'undefined') {
|
|
if (typeof to.nodeType !== 'undefined') {
|
|
|
(function () {
|
|
(function () {
|
|
|
|
|
+ var node = to;
|
|
|
var size = getBounds(to);
|
|
var size = getBounds(to);
|
|
|
var pos = size;
|
|
var pos = size;
|
|
|
var style = getComputedStyle(to);
|
|
var style = getComputedStyle(to);
|
|
|
|
|
|
|
|
to = [pos.left, pos.top, size.width + pos.left, size.height + pos.top];
|
|
to = [pos.left, pos.top, size.width + pos.left, size.height + pos.top];
|
|
|
|
|
|
|
|
|
|
+ // Account any parent Frames scroll offset
|
|
|
|
|
+ if (node.ownerDocument !== document) {
|
|
|
|
|
+ var win = node.ownerDocument.defaultView;
|
|
|
|
|
+ to[0] += win.pageXOffset;
|
|
|
|
|
+ to[1] += win.pageYOffset;
|
|
|
|
|
+ to[2] += win.pageXOffset;
|
|
|
|
|
+ to[3] += win.pageYOffset;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
BOUNDS_FORMAT.forEach(function (side, i) {
|
|
BOUNDS_FORMAT.forEach(function (side, i) {
|
|
|
side = side[0].toUpperCase() + side.substr(1);
|
|
side = side[0].toUpperCase() + side.substr(1);
|
|
|
if (side === 'Top' || side === 'Left') {
|
|
if (side === 'Top' || side === 'Left') {
|
|
@@ -1368,34 +1433,32 @@ TetherBase.modules.push({
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (changeAttachY === 'together') {
|
|
if (changeAttachY === 'together') {
|
|
|
- if (top < bounds[1] && tAttachment.top === 'top') {
|
|
|
|
|
- if (eAttachment.top === 'bottom') {
|
|
|
|
|
|
|
+ if (tAttachment.top === 'top') {
|
|
|
|
|
+ if (eAttachment.top === 'bottom' && top < bounds[1]) {
|
|
|
top += targetHeight;
|
|
top += targetHeight;
|
|
|
tAttachment.top = 'bottom';
|
|
tAttachment.top = 'bottom';
|
|
|
|
|
|
|
|
top += height;
|
|
top += height;
|
|
|
eAttachment.top = 'top';
|
|
eAttachment.top = 'top';
|
|
|
- } else if (eAttachment.top === 'top') {
|
|
|
|
|
- top += targetHeight;
|
|
|
|
|
|
|
+ } else if (eAttachment.top === 'top' && top + height > bounds[3] && top - (height - targetHeight) >= bounds[1]) {
|
|
|
|
|
+ top -= height - targetHeight;
|
|
|
tAttachment.top = 'bottom';
|
|
tAttachment.top = 'bottom';
|
|
|
|
|
|
|
|
- top -= height;
|
|
|
|
|
eAttachment.top = 'bottom';
|
|
eAttachment.top = 'bottom';
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (top + height > bounds[3] && tAttachment.top === 'bottom') {
|
|
|
|
|
- if (eAttachment.top === 'top') {
|
|
|
|
|
|
|
+ if (tAttachment.top === 'bottom') {
|
|
|
|
|
+ if (eAttachment.top === 'top' && top + height > bounds[3]) {
|
|
|
top -= targetHeight;
|
|
top -= targetHeight;
|
|
|
tAttachment.top = 'top';
|
|
tAttachment.top = 'top';
|
|
|
|
|
|
|
|
top -= height;
|
|
top -= height;
|
|
|
eAttachment.top = 'bottom';
|
|
eAttachment.top = 'bottom';
|
|
|
- } else if (eAttachment.top === 'bottom') {
|
|
|
|
|
- top -= targetHeight;
|
|
|
|
|
|
|
+ } else if (eAttachment.top === 'bottom' && top < bounds[1] && top + (height * 2 - targetHeight) <= bounds[3]) {
|
|
|
|
|
+ top += height - targetHeight;
|
|
|
tAttachment.top = 'top';
|
|
tAttachment.top = 'top';
|
|
|
|
|
|
|
|
- top += height;
|
|
|
|
|
eAttachment.top = 'top';
|
|
eAttachment.top = 'top';
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -1476,14 +1539,24 @@ TetherBase.modules.push({
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (changeAttachX === 'element' || changeAttachX === 'both') {
|
|
if (changeAttachX === 'element' || changeAttachX === 'both') {
|
|
|
- if (left < bounds[0] && eAttachment.left === 'right') {
|
|
|
|
|
- left += width;
|
|
|
|
|
- eAttachment.left = 'left';
|
|
|
|
|
|
|
+ if (left < bounds[0]) {
|
|
|
|
|
+ if (eAttachment.left === 'right') {
|
|
|
|
|
+ left += width;
|
|
|
|
|
+ eAttachment.left = 'left';
|
|
|
|
|
+ } else if (eAttachment.left === 'center') {
|
|
|
|
|
+ left += width / 2;
|
|
|
|
|
+ eAttachment.left = 'left';
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if (left + width > bounds[2] && eAttachment.left === 'left') {
|
|
|
|
|
- left -= width;
|
|
|
|
|
- eAttachment.left = 'right';
|
|
|
|
|
|
|
+ if (left + width > bounds[2]) {
|
|
|
|
|
+ if (eAttachment.left === 'left') {
|
|
|
|
|
+ left -= width;
|
|
|
|
|
+ eAttachment.left = 'right';
|
|
|
|
|
+ } else if (eAttachment.left === 'center') {
|
|
|
|
|
+ left -= width / 2;
|
|
|
|
|
+ eAttachment.left = 'right';
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -1577,6 +1650,10 @@ TetherBase.modules.push({
|
|
|
|
|
|
|
|
if (tAttachment.top !== targetAttachment.top || tAttachment.left !== targetAttachment.left || eAttachment.top !== _this.attachment.top || eAttachment.left !== _this.attachment.left) {
|
|
if (tAttachment.top !== targetAttachment.top || tAttachment.left !== targetAttachment.left || eAttachment.top !== _this.attachment.top || eAttachment.left !== _this.attachment.left) {
|
|
|
_this.updateAttachClasses(eAttachment, tAttachment);
|
|
_this.updateAttachClasses(eAttachment, tAttachment);
|
|
|
|
|
+ _this.trigger('update', {
|
|
|
|
|
+ attachment: eAttachment,
|
|
|
|
|
+ targetAttachment: tAttachment
|
|
|
|
|
+ });
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
|