428 lines
14 KiB
JavaScript
428 lines
14 KiB
JavaScript
/**
|
|
* DO NOT EDIT THIS FILE.
|
|
* See the following change record for more information,
|
|
* https://www.drupal.org/node/2815083
|
|
* @preserve
|
|
**/
|
|
|
|
($ => {
|
|
let cachedScrollbarWidth = null;
|
|
const {
|
|
max,
|
|
abs
|
|
} = Math;
|
|
const regexHorizontal = /left|center|right/;
|
|
const regexVertical = /top|center|bottom/;
|
|
const regexOffset = /[+-]\d+(\.[\d]+)?%?/;
|
|
const regexPosition = /^\w+/;
|
|
const regexPercent = /%$/;
|
|
const _position = $.fn.position;
|
|
|
|
function getOffsets(offsets, width, height) {
|
|
return [parseFloat(offsets[0]) * (regexPercent.test(offsets[0]) ? width / 100 : 1), parseFloat(offsets[1]) * (regexPercent.test(offsets[1]) ? height / 100 : 1)];
|
|
}
|
|
|
|
function parseCss(element, property) {
|
|
return parseInt($.css(element, property), 10) || 0;
|
|
}
|
|
|
|
function getDimensions(elem) {
|
|
const raw = elem[0];
|
|
|
|
if (raw.nodeType === 9) {
|
|
return {
|
|
width: elem.width(),
|
|
height: elem.height(),
|
|
offset: {
|
|
top: 0,
|
|
left: 0
|
|
}
|
|
};
|
|
}
|
|
|
|
if ($.isWindow(raw)) {
|
|
return {
|
|
width: elem.width(),
|
|
height: elem.height(),
|
|
offset: {
|
|
top: elem.scrollTop(),
|
|
left: elem.scrollLeft()
|
|
}
|
|
};
|
|
}
|
|
|
|
if (raw.preventDefault) {
|
|
return {
|
|
width: 0,
|
|
height: 0,
|
|
offset: {
|
|
top: raw.pageY,
|
|
left: raw.pageX
|
|
}
|
|
};
|
|
}
|
|
|
|
return {
|
|
width: elem.outerWidth(),
|
|
height: elem.outerHeight(),
|
|
offset: elem.offset()
|
|
};
|
|
}
|
|
|
|
const collisions = {
|
|
fit: {
|
|
left(position, data) {
|
|
const {
|
|
within
|
|
} = data;
|
|
const withinOffset = within.isWindow ? within.scrollLeft : within.offset.left;
|
|
const outerWidth = within.width;
|
|
const collisionPosLeft = position.left - data.collisionPosition.marginLeft;
|
|
const overLeft = withinOffset - collisionPosLeft;
|
|
const overRight = collisionPosLeft + data.collisionWidth - outerWidth - withinOffset;
|
|
let newOverRight;
|
|
|
|
if (data.collisionWidth > outerWidth) {
|
|
if (overLeft > 0 && overRight <= 0) {
|
|
newOverRight = position.left + overLeft + data.collisionWidth - outerWidth - withinOffset;
|
|
position.left += overLeft - newOverRight;
|
|
} else if (overRight > 0 && overLeft <= 0) {
|
|
position.left = withinOffset;
|
|
} else if (overLeft > overRight) {
|
|
position.left = withinOffset + outerWidth - data.collisionWidth;
|
|
} else {
|
|
position.left = withinOffset;
|
|
}
|
|
} else if (overLeft > 0) {
|
|
position.left += overLeft;
|
|
} else if (overRight > 0) {
|
|
position.left -= overRight;
|
|
} else {
|
|
position.left = max(position.left - collisionPosLeft, position.left);
|
|
}
|
|
},
|
|
|
|
top(position, data) {
|
|
const {
|
|
within
|
|
} = data;
|
|
const withinOffset = within.isWindow ? within.scrollTop : within.offset.top;
|
|
const outerHeight = data.within.height;
|
|
const collisionPosTop = position.top - data.collisionPosition.marginTop;
|
|
const overTop = withinOffset - collisionPosTop;
|
|
const overBottom = collisionPosTop + data.collisionHeight - outerHeight - withinOffset;
|
|
let newOverBottom;
|
|
|
|
if (data.collisionHeight > outerHeight) {
|
|
if (overTop > 0 && overBottom <= 0) {
|
|
newOverBottom = position.top + overTop + data.collisionHeight - outerHeight - withinOffset;
|
|
position.top += overTop - newOverBottom;
|
|
} else if (overBottom > 0 && overTop <= 0) {
|
|
position.top = withinOffset;
|
|
} else if (overTop > overBottom) {
|
|
position.top = withinOffset + outerHeight - data.collisionHeight;
|
|
} else {
|
|
position.top = withinOffset;
|
|
}
|
|
} else if (overTop > 0) {
|
|
position.top += overTop;
|
|
} else if (overBottom > 0) {
|
|
position.top -= overBottom;
|
|
} else {
|
|
position.top = max(position.top - collisionPosTop, position.top);
|
|
}
|
|
}
|
|
|
|
},
|
|
flip: {
|
|
left(position, data) {
|
|
const {
|
|
within
|
|
} = data;
|
|
const withinOffset = within.offset.left + within.scrollLeft;
|
|
const outerWidth = within.width;
|
|
const offsetLeft = within.isWindow ? within.scrollLeft : within.offset.left;
|
|
const collisionPosLeft = position.left - data.collisionPosition.marginLeft;
|
|
const overLeft = collisionPosLeft - offsetLeft;
|
|
const overRight = collisionPosLeft + data.collisionWidth - outerWidth - offsetLeft;
|
|
const myOffset = data.my[0] === 'left' ? -data.elemWidth : data.my[0] === 'right' ? data.elemWidth : 0;
|
|
const atOffset = data.at[0] === 'left' ? data.targetWidth : data.at[0] === 'right' ? -data.targetWidth : 0;
|
|
const offset = -2 * data.offset[0];
|
|
let newOverRight;
|
|
let newOverLeft;
|
|
|
|
if (overLeft < 0) {
|
|
newOverRight = position.left + myOffset + atOffset + offset + data.collisionWidth - outerWidth - withinOffset;
|
|
|
|
if (newOverRight < 0 || newOverRight < abs(overLeft)) {
|
|
position.left += myOffset + atOffset + offset;
|
|
}
|
|
} else if (overRight > 0) {
|
|
newOverLeft = position.left - data.collisionPosition.marginLeft + myOffset + atOffset + offset - offsetLeft;
|
|
|
|
if (newOverLeft > 0 || abs(newOverLeft) < overRight) {
|
|
position.left += myOffset + atOffset + offset;
|
|
}
|
|
}
|
|
},
|
|
|
|
top(position, data) {
|
|
const {
|
|
within
|
|
} = data;
|
|
const withinOffset = within.offset.top + within.scrollTop;
|
|
const outerHeight = within.height;
|
|
const offsetTop = within.isWindow ? within.scrollTop : within.offset.top;
|
|
const collisionPosTop = position.top - data.collisionPosition.marginTop;
|
|
const overTop = collisionPosTop - offsetTop;
|
|
const overBottom = collisionPosTop + data.collisionHeight - outerHeight - offsetTop;
|
|
const top = data.my[1] === 'top';
|
|
const myOffset = top ? -data.elemHeight : data.my[1] === 'bottom' ? data.elemHeight : 0;
|
|
const atOffset = data.at[1] === 'top' ? data.targetHeight : data.at[1] === 'bottom' ? -data.targetHeight : 0;
|
|
const offset = -2 * data.offset[1];
|
|
let newOverTop;
|
|
let newOverBottom;
|
|
|
|
if (overTop < 0) {
|
|
newOverBottom = position.top + myOffset + atOffset + offset + data.collisionHeight - outerHeight - withinOffset;
|
|
|
|
if (newOverBottom < 0 || newOverBottom < abs(overTop)) {
|
|
position.top += myOffset + atOffset + offset;
|
|
}
|
|
} else if (overBottom > 0) {
|
|
newOverTop = position.top - data.collisionPosition.marginTop + myOffset + atOffset + offset - offsetTop;
|
|
|
|
if (newOverTop > 0 || abs(newOverTop) < overBottom) {
|
|
position.top += myOffset + atOffset + offset;
|
|
}
|
|
}
|
|
}
|
|
|
|
},
|
|
flipfit: {
|
|
left(...args) {
|
|
collisions.flip.left.apply(this, args);
|
|
collisions.fit.left.apply(this, args);
|
|
},
|
|
|
|
top(...args) {
|
|
collisions.flip.top.apply(this, args);
|
|
collisions.fit.top.apply(this, args);
|
|
}
|
|
|
|
}
|
|
};
|
|
$.position = {
|
|
scrollbarWidth() {
|
|
if (cachedScrollbarWidth !== undefined) {
|
|
return cachedScrollbarWidth;
|
|
}
|
|
|
|
const div = $('<div ' + "style='display:block;position:absolute;width:50px;height:50px;overflow:hidden;'>" + "<div style='height:100px;width:auto;'></div></div>");
|
|
const innerDiv = div.children()[0];
|
|
$('body').append(div);
|
|
const w1 = innerDiv.offsetWidth;
|
|
div.css('overflow', 'scroll');
|
|
let w2 = innerDiv.offsetWidth;
|
|
|
|
if (w1 === w2) {
|
|
w2 = div[0].clientWidth;
|
|
}
|
|
|
|
div.remove();
|
|
cachedScrollbarWidth = w1 - w2;
|
|
return cachedScrollbarWidth;
|
|
},
|
|
|
|
getScrollInfo(within) {
|
|
const overflowX = within.isWindow || within.isDocument ? '' : within.element.css('overflow-x');
|
|
const overflowY = within.isWindow || within.isDocument ? '' : within.element.css('overflow-y');
|
|
const hasOverflowX = overflowX === 'scroll' || overflowX === 'auto' && within.width < within.element[0].scrollWidth;
|
|
const hasOverflowY = overflowY === 'scroll' || overflowY === 'auto' && within.height < within.element[0].scrollHeight;
|
|
return {
|
|
width: hasOverflowY ? $.position.scrollbarWidth() : 0,
|
|
height: hasOverflowX ? $.position.scrollbarWidth() : 0
|
|
};
|
|
},
|
|
|
|
getWithinInfo(element) {
|
|
const withinElement = $(element || window);
|
|
const isWindow = $.isWindow(withinElement[0]);
|
|
const isDocument = !!withinElement[0] && withinElement[0].nodeType === 9;
|
|
const hasOffset = !isWindow && !isDocument;
|
|
return {
|
|
element: withinElement,
|
|
isWindow,
|
|
isDocument,
|
|
offset: hasOffset ? $(element).offset() : {
|
|
left: 0,
|
|
top: 0
|
|
},
|
|
scrollLeft: withinElement.scrollLeft(),
|
|
scrollTop: withinElement.scrollTop(),
|
|
width: withinElement.outerWidth(),
|
|
height: withinElement.outerHeight()
|
|
};
|
|
}
|
|
|
|
};
|
|
|
|
$.fn.position = function (options) {
|
|
if (!options || !options.of) {
|
|
return _position.apply(this, arguments);
|
|
}
|
|
|
|
options = $.extend({}, options);
|
|
const within = $.position.getWithinInfo(options.within);
|
|
const scrollInfo = $.position.getScrollInfo(within);
|
|
const collision = (options.collision || 'flip').split(' ');
|
|
const offsets = {};
|
|
const target = $(options.of);
|
|
const dimensions = getDimensions(target);
|
|
const targetWidth = dimensions.width;
|
|
const targetHeight = dimensions.height;
|
|
const targetOffset = dimensions.offset;
|
|
|
|
if (target[0].preventDefault) {
|
|
options.at = 'left top';
|
|
}
|
|
|
|
const basePosition = $.extend({}, targetOffset);
|
|
$.each(['my', 'at'], function () {
|
|
let pos = (options[this] || '').split(' ');
|
|
|
|
if (pos.length === 1) {
|
|
pos = regexHorizontal.test(pos[0]) ? pos.concat(['center']) : regexVertical.test(pos[0]) ? ['center'].concat(pos) : ['center', 'center'];
|
|
}
|
|
|
|
pos[0] = regexHorizontal.test(pos[0]) ? pos[0] : 'center';
|
|
pos[1] = regexVertical.test(pos[1]) ? pos[1] : 'center';
|
|
const horizontalOffset = regexOffset.exec(pos[0]);
|
|
const verticalOffset = regexOffset.exec(pos[1]);
|
|
offsets[this] = [horizontalOffset ? horizontalOffset[0] : 0, verticalOffset ? verticalOffset[0] : 0];
|
|
options[this] = [regexPosition.exec(pos[0])[0], regexPosition.exec(pos[1])[0]];
|
|
});
|
|
|
|
if (collision.length === 1) {
|
|
collision[1] = collision[0];
|
|
}
|
|
|
|
if (options.at[0] === 'right') {
|
|
basePosition.left += targetWidth;
|
|
} else if (options.at[0] === 'center') {
|
|
basePosition.left += targetWidth / 2;
|
|
}
|
|
|
|
if (options.at[1] === 'bottom') {
|
|
basePosition.top += targetHeight;
|
|
} else if (options.at[1] === 'center') {
|
|
basePosition.top += targetHeight / 2;
|
|
}
|
|
|
|
const atOffset = getOffsets(offsets.at, targetWidth, targetHeight);
|
|
basePosition.left += atOffset[0];
|
|
basePosition.top += atOffset[1];
|
|
return this.each(function () {
|
|
let using;
|
|
const elem = $(this);
|
|
const elemWidth = elem.outerWidth();
|
|
const elemHeight = elem.outerHeight();
|
|
const marginLeft = parseCss(this, 'marginLeft');
|
|
const marginTop = parseCss(this, 'marginTop');
|
|
const collisionWidth = elemWidth + marginLeft + parseCss(this, 'marginRight') + scrollInfo.width;
|
|
const collisionHeight = elemHeight + marginTop + parseCss(this, 'marginBottom') + scrollInfo.height;
|
|
const position = $.extend({}, basePosition);
|
|
const myOffset = getOffsets(offsets.my, elem.outerWidth(), elem.outerHeight());
|
|
|
|
if (options.my[0] === 'right') {
|
|
position.left -= elemWidth;
|
|
} else if (options.my[0] === 'center') {
|
|
position.left -= elemWidth / 2;
|
|
}
|
|
|
|
if (options.my[1] === 'bottom') {
|
|
position.top -= elemHeight;
|
|
} else if (options.my[1] === 'center') {
|
|
position.top -= elemHeight / 2;
|
|
}
|
|
|
|
position.left += myOffset[0];
|
|
position.top += myOffset[1];
|
|
const collisionPosition = {
|
|
marginLeft,
|
|
marginTop
|
|
};
|
|
$.each(['left', 'top'], function (i, dir) {
|
|
if (collisions[collision[i]]) {
|
|
collisions[collision[i]][dir](position, {
|
|
targetWidth,
|
|
targetHeight,
|
|
elemWidth,
|
|
elemHeight,
|
|
collisionPosition,
|
|
collisionWidth,
|
|
collisionHeight,
|
|
offset: [atOffset[0] + myOffset[0], atOffset[1] + myOffset[1]],
|
|
my: options.my,
|
|
at: options.at,
|
|
within,
|
|
elem
|
|
});
|
|
}
|
|
});
|
|
|
|
if (options.using) {
|
|
using = function (props) {
|
|
const left = targetOffset.left - position.left;
|
|
const right = left + targetWidth - elemWidth;
|
|
const top = targetOffset.top - position.top;
|
|
const bottom = top + targetHeight - elemHeight;
|
|
const feedback = {
|
|
target: {
|
|
element: target,
|
|
left: targetOffset.left,
|
|
top: targetOffset.top,
|
|
width: targetWidth,
|
|
height: targetHeight
|
|
},
|
|
element: {
|
|
element: elem,
|
|
left: position.left,
|
|
top: position.top,
|
|
width: elemWidth,
|
|
height: elemHeight
|
|
},
|
|
horizontal: right < 0 ? 'left' : left > 0 ? 'right' : 'center',
|
|
vertical: bottom < 0 ? 'top' : top > 0 ? 'bottom' : 'middle'
|
|
};
|
|
|
|
if (targetWidth < elemWidth && abs(left + right) < targetWidth) {
|
|
feedback.horizontal = 'center';
|
|
}
|
|
|
|
if (targetHeight < elemHeight && abs(top + bottom) < targetHeight) {
|
|
feedback.vertical = 'middle';
|
|
}
|
|
|
|
if (max(abs(left), abs(right)) > max(abs(top), abs(bottom))) {
|
|
feedback.important = 'horizontal';
|
|
} else {
|
|
feedback.important = 'vertical';
|
|
}
|
|
|
|
options.using.call(this, props, feedback);
|
|
};
|
|
}
|
|
|
|
elem.offset($.extend(position, {
|
|
using
|
|
}));
|
|
});
|
|
};
|
|
|
|
if (!$.hasOwnProperty('ui')) {
|
|
$.ui = {};
|
|
}
|
|
|
|
$.ui.position = collisions;
|
|
})(jQuery); |