tether.js 51 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715
  1. /*! tether 1.1.0 */
  2. (function(root, factory) {
  3. if (typeof define === 'function' && define.amd) {
  4. define(factory);
  5. } else if (typeof exports === 'object') {
  6. module.exports = factory(require, exports, module);
  7. } else {
  8. root.Tether = factory();
  9. }
  10. }(this, function(require, exports, module) {
  11. 'use strict';
  12. 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; }; })();
  13. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
  14. var TetherBase = undefined;
  15. if (typeof TetherBase === 'undefined') {
  16. TetherBase = { modules: [] };
  17. }
  18. function getScrollParent(el) {
  19. var _getComputedStyle = getComputedStyle(el);
  20. var position = _getComputedStyle.position;
  21. if (position === 'fixed') {
  22. return el;
  23. }
  24. var parent = el;
  25. while (parent = parent.parentNode) {
  26. var style = undefined;
  27. try {
  28. style = getComputedStyle(parent);
  29. } catch (err) {}
  30. if (typeof style === 'undefined' || style === null) {
  31. return parent;
  32. }
  33. var _style = style;
  34. var overflow = _style.overflow;
  35. var overflowX = _style.overflowX;
  36. var overflowY = _style.overflowY;
  37. if (/(auto|scroll)/.test(overflow + overflowY + overflowX)) {
  38. if (position !== 'absolute' || ['relative', 'absolute', 'fixed'].indexOf(style.position) >= 0) {
  39. return parent;
  40. }
  41. }
  42. }
  43. return document.body;
  44. }
  45. var uniqueId = (function () {
  46. var id = 0;
  47. return function () {
  48. return ++id;
  49. };
  50. })();
  51. var zeroPosCache = {};
  52. var getOrigin = function getOrigin(doc) {
  53. // getBoundingClientRect is unfortunately too accurate. It introduces a pixel or two of
  54. // jitter as the user scrolls that messes with our ability to detect if two positions
  55. // are equivilant or not. We place an element at the top left of the page that will
  56. // get the same jitter, so we can cancel the two out.
  57. var node = doc._tetherZeroElement;
  58. if (typeof node === 'undefined') {
  59. node = doc.createElement('div');
  60. node.setAttribute('data-tether-id', uniqueId());
  61. extend(node.style, {
  62. top: 0,
  63. left: 0,
  64. position: 'absolute'
  65. });
  66. doc.body.appendChild(node);
  67. doc._tetherZeroElement = node;
  68. }
  69. var id = node.getAttribute('data-tether-id');
  70. if (typeof zeroPosCache[id] === 'undefined') {
  71. zeroPosCache[id] = {};
  72. var rect = node.getBoundingClientRect();
  73. for (var k in rect) {
  74. // Can't use extend, as on IE9, elements don't resolve to be hasOwnProperty
  75. zeroPosCache[id][k] = rect[k];
  76. }
  77. // Clear the cache when this position call is done
  78. defer(function () {
  79. delete zeroPosCache[id];
  80. });
  81. }
  82. return zeroPosCache[id];
  83. };
  84. function getBounds(el) {
  85. var doc = undefined;
  86. if (el === document) {
  87. doc = document;
  88. el = document.documentElement;
  89. } else {
  90. doc = el.ownerDocument;
  91. }
  92. var docEl = doc.documentElement;
  93. var box = {};
  94. // The original object returned by getBoundingClientRect is immutable, so we clone it
  95. // We can't use extend because the properties are not considered part of the object by hasOwnProperty in IE9
  96. var rect = el.getBoundingClientRect();
  97. for (var k in rect) {
  98. box[k] = rect[k];
  99. }
  100. var origin = getOrigin(doc);
  101. box.top -= origin.top;
  102. box.left -= origin.left;
  103. if (typeof box.width === 'undefined') {
  104. box.width = document.body.scrollWidth - box.left - box.right;
  105. }
  106. if (typeof box.height === 'undefined') {
  107. box.height = document.body.scrollHeight - box.top - box.bottom;
  108. }
  109. box.top = box.top - docEl.clientTop;
  110. box.left = box.left - docEl.clientLeft;
  111. box.right = doc.body.clientWidth - box.width - box.left;
  112. box.bottom = doc.body.clientHeight - box.height - box.top;
  113. return box;
  114. }
  115. function getOffsetParent(el) {
  116. return el.offsetParent || document.documentElement;
  117. }
  118. function getScrollBarSize() {
  119. var inner = document.createElement('div');
  120. inner.style.width = '100%';
  121. inner.style.height = '200px';
  122. var outer = document.createElement('div');
  123. extend(outer.style, {
  124. position: 'absolute',
  125. top: 0,
  126. left: 0,
  127. pointerEvents: 'none',
  128. visibility: 'hidden',
  129. width: '200px',
  130. height: '150px',
  131. overflow: 'hidden'
  132. });
  133. outer.appendChild(inner);
  134. document.body.appendChild(outer);
  135. var widthContained = inner.offsetWidth;
  136. outer.style.overflow = 'scroll';
  137. var widthScroll = inner.offsetWidth;
  138. if (widthContained === widthScroll) {
  139. widthScroll = outer.clientWidth;
  140. }
  141. document.body.removeChild(outer);
  142. var width = widthContained - widthScroll;
  143. return { width: width, height: width };
  144. }
  145. function extend() {
  146. var out = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
  147. var args = [];
  148. Array.prototype.push.apply(args, arguments);
  149. args.slice(1).forEach(function (obj) {
  150. if (obj) {
  151. for (var key in obj) {
  152. if (({}).hasOwnProperty.call(obj, key)) {
  153. out[key] = obj[key];
  154. }
  155. }
  156. }
  157. });
  158. return out;
  159. }
  160. function removeClass(el, name) {
  161. if (typeof el.classList !== 'undefined') {
  162. name.split(' ').forEach(function (cls) {
  163. if (cls.trim()) {
  164. el.classList.remove(cls);
  165. }
  166. });
  167. } else {
  168. var regex = new RegExp('(^| )' + name.split(' ').join('|') + '( |$)', 'gi');
  169. var className = getClassName(el).replace(regex, ' ');
  170. setClassName(el, className);
  171. }
  172. }
  173. function addClass(el, name) {
  174. if (typeof el.classList !== 'undefined') {
  175. name.split(' ').forEach(function (cls) {
  176. if (cls.trim()) {
  177. el.classList.add(cls);
  178. }
  179. });
  180. } else {
  181. removeClass(el, name);
  182. var cls = getClassName(el) + (' ' + name);
  183. setClassName(el, cls);
  184. }
  185. }
  186. function hasClass(el, name) {
  187. if (typeof el.classList !== 'undefined') {
  188. return el.classList.contains(name);
  189. }
  190. var className = getClassName(el);
  191. return new RegExp('(^| )' + name + '( |$)', 'gi').test(className);
  192. }
  193. function getClassName(el) {
  194. if (el.className instanceof SVGAnimatedString) {
  195. return el.className.baseVal;
  196. }
  197. return el.className;
  198. }
  199. function setClassName(el, className) {
  200. el.setAttribute('class', className);
  201. }
  202. function updateClasses(el, add, all) {
  203. // Of the set of 'all' classes, we need the 'add' classes, and only the
  204. // 'add' classes to be set.
  205. all.forEach(function (cls) {
  206. if (add.indexOf(cls) === -1 && hasClass(el, cls)) {
  207. removeClass(el, cls);
  208. }
  209. });
  210. add.forEach(function (cls) {
  211. if (!hasClass(el, cls)) {
  212. addClass(el, cls);
  213. }
  214. });
  215. }
  216. var deferred = [];
  217. var defer = function defer(fn) {
  218. deferred.push(fn);
  219. };
  220. var flush = function flush() {
  221. var fn = undefined;
  222. while (fn = deferred.pop()) {
  223. fn();
  224. }
  225. };
  226. var Evented = (function () {
  227. function Evented() {
  228. _classCallCheck(this, Evented);
  229. }
  230. _createClass(Evented, [{
  231. key: 'on',
  232. value: function on(event, handler, ctx) {
  233. var once = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
  234. if (typeof this.bindings === 'undefined') {
  235. this.bindings = {};
  236. }
  237. if (typeof this.bindings[event] === 'undefined') {
  238. this.bindings[event] = [];
  239. }
  240. this.bindings[event].push({ handler: handler, ctx: ctx, once: once });
  241. }
  242. }, {
  243. key: 'once',
  244. value: function once(event, handler, ctx) {
  245. this.on(event, handler, ctx, true);
  246. }
  247. }, {
  248. key: 'off',
  249. value: function off(event, handler) {
  250. if (typeof this.bindings !== 'undefined' && typeof this.bindings[event] !== 'undefined') {
  251. return;
  252. }
  253. if (typeof handler === 'undefined') {
  254. delete this.bindings[event];
  255. } else {
  256. var i = 0;
  257. while (i < this.bindings[event].length) {
  258. if (this.bindings[event][i].handler === handler) {
  259. this.bindings[event].splice(i, 1);
  260. } else {
  261. ++i;
  262. }
  263. }
  264. }
  265. }
  266. }, {
  267. key: 'trigger',
  268. value: function trigger(event) {
  269. if (typeof this.bindings !== 'undefined' && this.bindings[event]) {
  270. var i = 0;
  271. for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
  272. args[_key - 1] = arguments[_key];
  273. }
  274. while (i < this.bindings[event].length) {
  275. var _bindings$event$i = this.bindings[event][i];
  276. var handler = _bindings$event$i.handler;
  277. var ctx = _bindings$event$i.ctx;
  278. var once = _bindings$event$i.once;
  279. var context = ctx;
  280. if (typeof context === 'undefined') {
  281. context = this;
  282. }
  283. handler.apply(context, args);
  284. if (once) {
  285. this.bindings[event].splice(i, 1);
  286. } else {
  287. ++i;
  288. }
  289. }
  290. }
  291. }
  292. }]);
  293. return Evented;
  294. })();
  295. TetherBase.Utils = {
  296. getScrollParent: getScrollParent,
  297. getBounds: getBounds,
  298. getOffsetParent: getOffsetParent,
  299. extend: extend,
  300. addClass: addClass,
  301. removeClass: removeClass,
  302. hasClass: hasClass,
  303. updateClasses: updateClasses,
  304. defer: defer,
  305. flush: flush,
  306. uniqueId: uniqueId,
  307. Evented: Evented,
  308. getScrollBarSize: getScrollBarSize
  309. };
  310. /* globals TetherBase, performance */
  311. 'use strict';
  312. var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
  313. 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; }; })();
  314. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
  315. if (typeof TetherBase === 'undefined') {
  316. throw new Error('You must include the utils.js file before tether.js');
  317. }
  318. var _TetherBase$Utils = TetherBase.Utils;
  319. var getScrollParent = _TetherBase$Utils.getScrollParent;
  320. var getBounds = _TetherBase$Utils.getBounds;
  321. var getOffsetParent = _TetherBase$Utils.getOffsetParent;
  322. var extend = _TetherBase$Utils.extend;
  323. var addClass = _TetherBase$Utils.addClass;
  324. var removeClass = _TetherBase$Utils.removeClass;
  325. var updateClasses = _TetherBase$Utils.updateClasses;
  326. var defer = _TetherBase$Utils.defer;
  327. var flush = _TetherBase$Utils.flush;
  328. var getScrollBarSize = _TetherBase$Utils.getScrollBarSize;
  329. function within(a, b) {
  330. var diff = arguments.length <= 2 || arguments[2] === undefined ? 1 : arguments[2];
  331. return a + diff >= b && b >= a - diff;
  332. }
  333. var transformKey = (function () {
  334. if (typeof document === 'undefined') {
  335. return '';
  336. }
  337. var el = document.createElement('div');
  338. var transforms = ['transform', 'webkitTransform', 'OTransform', 'MozTransform', 'msTransform'];
  339. for (var i = 0; i < transforms.length; ++i) {
  340. var key = transforms[i];
  341. if (el.style[key] !== undefined) {
  342. return key;
  343. }
  344. }
  345. })();
  346. var tethers = [];
  347. var position = function position() {
  348. tethers.forEach(function (tether) {
  349. tether.position(false);
  350. });
  351. flush();
  352. };
  353. function now() {
  354. if (typeof performance !== 'undefined' && typeof performance.now !== 'undefined') {
  355. return performance.now();
  356. }
  357. return +new Date();
  358. }
  359. (function () {
  360. var lastCall = null;
  361. var lastDuration = null;
  362. var pendingTimeout = null;
  363. var tick = function tick() {
  364. if (typeof lastDuration !== 'undefined' && lastDuration > 16) {
  365. // We voluntarily throttle ourselves if we can't manage 60fps
  366. lastDuration = Math.min(lastDuration - 16, 250);
  367. // Just in case this is the last event, remember to position just once more
  368. pendingTimeout = setTimeout(tick, 250);
  369. return;
  370. }
  371. if (typeof lastCall !== 'undefined' && now() - lastCall < 10) {
  372. // Some browsers call events a little too frequently, refuse to run more than is reasonable
  373. return;
  374. }
  375. if (typeof pendingTimeout !== 'undefined') {
  376. clearTimeout(pendingTimeout);
  377. pendingTimeout = null;
  378. }
  379. lastCall = now();
  380. position();
  381. lastDuration = now() - lastCall;
  382. };
  383. if (typeof window !== 'undefined') {
  384. ['resize', 'scroll', 'touchmove'].forEach(function (event) {
  385. window.addEventListener(event, tick);
  386. });
  387. }
  388. })();
  389. var MIRROR_LR = {
  390. center: 'center',
  391. left: 'right',
  392. right: 'left'
  393. };
  394. var MIRROR_TB = {
  395. middle: 'middle',
  396. top: 'bottom',
  397. bottom: 'top'
  398. };
  399. var OFFSET_MAP = {
  400. top: 0,
  401. left: 0,
  402. middle: '50%',
  403. center: '50%',
  404. bottom: '100%',
  405. right: '100%'
  406. };
  407. var autoToFixedAttachment = function autoToFixedAttachment(attachment, relativeToAttachment) {
  408. var left = attachment.left;
  409. var top = attachment.top;
  410. if (left === 'auto') {
  411. left = MIRROR_LR[relativeToAttachment.left];
  412. }
  413. if (top === 'auto') {
  414. top = MIRROR_TB[relativeToAttachment.top];
  415. }
  416. return { left: left, top: top };
  417. };
  418. var attachmentToOffset = function attachmentToOffset(attachment) {
  419. var left = attachment.left;
  420. var top = attachment.top;
  421. if (typeof OFFSET_MAP[attachment.left] !== 'undefined') {
  422. left = OFFSET_MAP[attachment.left];
  423. }
  424. if (typeof OFFSET_MAP[attachment.top] !== 'undefined') {
  425. top = OFFSET_MAP[attachment.top];
  426. }
  427. return { left: left, top: top };
  428. };
  429. function addOffset() {
  430. var out = { top: 0, left: 0 };
  431. for (var _len = arguments.length, offsets = Array(_len), _key = 0; _key < _len; _key++) {
  432. offsets[_key] = arguments[_key];
  433. }
  434. offsets.forEach(function (_ref) {
  435. var top = _ref.top;
  436. var left = _ref.left;
  437. if (typeof top === 'string') {
  438. top = parseFloat(top, 10);
  439. }
  440. if (typeof left === 'string') {
  441. left = parseFloat(left, 10);
  442. }
  443. out.top += top;
  444. out.left += left;
  445. });
  446. return out;
  447. }
  448. function offsetToPx(offset, size) {
  449. if (typeof offset.left === 'string' && offset.left.indexOf('%') !== -1) {
  450. offset.left = parseFloat(offset.left, 10) / 100 * size.width;
  451. }
  452. if (typeof offset.top === 'string' && offset.top.indexOf('%') !== -1) {
  453. offset.top = parseFloat(offset.top, 10) / 100 * size.height;
  454. }
  455. return offset;
  456. }
  457. var parseOffset = function parseOffset(value) {
  458. var _value$split = value.split(' ');
  459. var _value$split2 = _slicedToArray(_value$split, 2);
  460. var top = _value$split2[0];
  461. var left = _value$split2[1];
  462. return { top: top, left: left };
  463. };
  464. var parseAttachment = parseOffset;
  465. var TetherClass = (function () {
  466. function TetherClass(options) {
  467. var _this = this;
  468. _classCallCheck(this, TetherClass);
  469. this.position = this.position.bind(this);
  470. tethers.push(this);
  471. this.history = [];
  472. this.setOptions(options, false);
  473. TetherBase.modules.forEach(function (module) {
  474. if (typeof module.initialize !== 'undefined') {
  475. module.initialize.call(_this);
  476. }
  477. });
  478. this.position();
  479. }
  480. _createClass(TetherClass, [{
  481. key: 'getClass',
  482. value: function getClass() {
  483. var key = arguments.length <= 0 || arguments[0] === undefined ? '' : arguments[0];
  484. var classes = this.options.classes;
  485. if (typeof classes !== 'undefined' && classes[key]) {
  486. return this.options.classes[key];
  487. } else if (this.options.classPrefix) {
  488. return this.options.classPrefix + '-' + key;
  489. } else {
  490. return key;
  491. }
  492. }
  493. }, {
  494. key: 'setOptions',
  495. value: function setOptions(options) {
  496. var _this2 = this;
  497. var pos = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
  498. var defaults = {
  499. offset: '0 0',
  500. targetOffset: '0 0',
  501. targetAttachment: 'auto auto',
  502. classPrefix: 'tether'
  503. };
  504. this.options = extend(defaults, options);
  505. var _options = this.options;
  506. var element = _options.element;
  507. var target = _options.target;
  508. var targetModifier = _options.targetModifier;
  509. this.element = element;
  510. this.target = target;
  511. this.targetModifier = targetModifier;
  512. if (this.target === 'viewport') {
  513. this.target = document.body;
  514. this.targetModifier = 'visible';
  515. } else if (this.target === 'scroll-handle') {
  516. this.target = document.body;
  517. this.targetModifier = 'scroll-handle';
  518. }
  519. ['element', 'target'].forEach(function (key) {
  520. if (typeof _this2[key] === 'undefined') {
  521. throw new Error('Tether Error: Both element and target must be defined');
  522. }
  523. if (typeof _this2[key].jquery !== 'undefined') {
  524. _this2[key] = _this2[key][0];
  525. } else if (typeof _this2[key] === 'string') {
  526. _this2[key] = document.querySelector(_this2[key]);
  527. }
  528. });
  529. addClass(this.element, this.getClass('element'));
  530. if (!(this.options.addTargetClasses === false)) {
  531. addClass(this.target, this.getClass('target'));
  532. }
  533. if (!this.options.attachment) {
  534. throw new Error('Tether Error: You must provide an attachment');
  535. }
  536. this.targetAttachment = parseAttachment(this.options.targetAttachment);
  537. this.attachment = parseAttachment(this.options.attachment);
  538. this.offset = parseOffset(this.options.offset);
  539. this.targetOffset = parseOffset(this.options.targetOffset);
  540. if (typeof this.scrollParent !== 'undefined') {
  541. this.disable();
  542. }
  543. if (this.targetModifier === 'scroll-handle') {
  544. this.scrollParent = this.target;
  545. } else {
  546. this.scrollParent = getScrollParent(this.target);
  547. }
  548. if (!(this.options.enabled === false)) {
  549. this.enable(pos);
  550. }
  551. }
  552. }, {
  553. key: 'getTargetBounds',
  554. value: function getTargetBounds() {
  555. if (typeof this.targetModifier !== 'undefined') {
  556. if (this.targetModifier === 'visible') {
  557. if (this.target === document.body) {
  558. return { top: pageYOffset, left: pageXOffset, height: innerHeight, width: innerWidth };
  559. } else {
  560. var bounds = getBounds(this.target);
  561. var out = {
  562. height: bounds.height,
  563. width: bounds.width,
  564. top: bounds.top,
  565. left: bounds.left
  566. };
  567. out.height = Math.min(out.height, bounds.height - (pageYOffset - bounds.top));
  568. out.height = Math.min(out.height, bounds.height - (bounds.top + bounds.height - (pageYOffset + innerHeight)));
  569. out.height = Math.min(innerHeight, out.height);
  570. out.height -= 2;
  571. out.width = Math.min(out.width, bounds.width - (pageXOffset - bounds.left));
  572. out.width = Math.min(out.width, bounds.width - (bounds.left + bounds.width - (pageXOffset + innerWidth)));
  573. out.width = Math.min(innerWidth, out.width);
  574. out.width -= 2;
  575. if (out.top < pageYOffset) {
  576. out.top = pageYOffset;
  577. }
  578. if (out.left < pageXOffset) {
  579. out.left = pageXOffset;
  580. }
  581. return out;
  582. }
  583. } else if (this.targetModifier === 'scroll-handle') {
  584. var bounds = undefined;
  585. var target = this.target;
  586. if (target === document.body) {
  587. target = document.documentElement;
  588. bounds = {
  589. left: pageXOffset,
  590. top: pageYOffset,
  591. height: innerHeight,
  592. width: innerWidth
  593. };
  594. } else {
  595. bounds = getBounds(target);
  596. }
  597. var style = getComputedStyle(target);
  598. var hasBottomScroll = target.scrollWidth > target.clientWidth || [style.overflow, style.overflowX].indexOf('scroll') >= 0 || this.target !== document.body;
  599. var scrollBottom = 0;
  600. if (hasBottomScroll) {
  601. scrollBottom = 15;
  602. }
  603. var height = bounds.height - parseFloat(style.borderTopWidth) - parseFloat(style.borderBottomWidth) - scrollBottom;
  604. var out = {
  605. width: 15,
  606. height: height * 0.975 * (height / target.scrollHeight),
  607. left: bounds.left + bounds.width - parseFloat(style.borderLeftWidth) - 15
  608. };
  609. var fitAdj = 0;
  610. if (height < 408 && this.target === document.body) {
  611. fitAdj = -0.00011 * Math.pow(height, 2) - 0.00727 * height + 22.58;
  612. }
  613. if (this.target !== document.body) {
  614. out.height = Math.max(out.height, 24);
  615. }
  616. var scrollPercentage = this.target.scrollTop / (target.scrollHeight - height);
  617. out.top = scrollPercentage * (height - out.height - fitAdj) + bounds.top + parseFloat(style.borderTopWidth);
  618. if (this.target === document.body) {
  619. out.height = Math.max(out.height, 24);
  620. }
  621. return out;
  622. }
  623. } else {
  624. return getBounds(this.target);
  625. }
  626. }
  627. }, {
  628. key: 'clearCache',
  629. value: function clearCache() {
  630. this._cache = {};
  631. }
  632. }, {
  633. key: 'cache',
  634. value: function cache(k, getter) {
  635. // More than one module will often need the same DOM info, so
  636. // we keep a cache which is cleared on each position call
  637. if (typeof this._cache === 'undefined') {
  638. this._cache = {};
  639. }
  640. if (typeof this._cache[k] === 'undefined') {
  641. this._cache[k] = getter.call(this);
  642. }
  643. return this._cache[k];
  644. }
  645. }, {
  646. key: 'enable',
  647. value: function enable() {
  648. var pos = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
  649. if (!(this.options.addTargetClasses === false)) {
  650. addClass(this.target, this.getClass('enabled'));
  651. }
  652. addClass(this.element, this.getClass('enabled'));
  653. this.enabled = true;
  654. if (this.scrollParent !== document) {
  655. this.scrollParent.addEventListener('scroll', this.position);
  656. }
  657. if (pos) {
  658. this.position();
  659. }
  660. }
  661. }, {
  662. key: 'disable',
  663. value: function disable() {
  664. removeClass(this.target, this.getClass('enabled'));
  665. removeClass(this.element, this.getClass('enabled'));
  666. this.enabled = false;
  667. if (typeof this.scrollParent !== 'undefined') {
  668. this.scrollParent.removeEventListener('scroll', this.position);
  669. }
  670. }
  671. }, {
  672. key: 'destroy',
  673. value: function destroy() {
  674. var _this3 = this;
  675. this.disable();
  676. tethers.forEach(function (tether, i) {
  677. if (tether === _this3) {
  678. tethers.splice(i, 1);
  679. return;
  680. }
  681. });
  682. }
  683. }, {
  684. key: 'updateAttachClasses',
  685. value: function updateAttachClasses(elementAttach, targetAttach) {
  686. var _this4 = this;
  687. elementAttach = elementAttach || this.attachment;
  688. targetAttach = targetAttach || this.targetAttachment;
  689. var sides = ['left', 'top', 'bottom', 'right', 'middle', 'center'];
  690. if (typeof this._addAttachClasses !== 'undefined' && this._addAttachClasses.length) {
  691. // updateAttachClasses can be called more than once in a position call, so
  692. // we need to clean up after ourselves such that when the last defer gets
  693. // ran it doesn't add any extra classes from previous calls.
  694. this._addAttachClasses.splice(0, this._addAttachClasses.length);
  695. }
  696. if (typeof this._addAttachClasses === 'undefined') {
  697. this._addAttachClasses = [];
  698. }
  699. var add = this._addAttachClasses;
  700. if (elementAttach.top) {
  701. add.push(this.getClass('element-attached') + '-' + elementAttach.top);
  702. }
  703. if (elementAttach.left) {
  704. add.push(this.getClass('element-attached') + '-' + elementAttach.left);
  705. }
  706. if (targetAttach.top) {
  707. add.push(this.getClass('target-attached') + '-' + targetAttach.top);
  708. }
  709. if (targetAttach.left) {
  710. add.push(this.getClass('target-attached') + '-' + targetAttach.left);
  711. }
  712. var all = [];
  713. sides.forEach(function (side) {
  714. all.push(_this4.getClass('element-attached') + '-' + side);
  715. all.push(_this4.getClass('target-attached') + '-' + side);
  716. });
  717. defer(function () {
  718. if (!(typeof _this4._addAttachClasses !== 'undefined')) {
  719. return;
  720. }
  721. updateClasses(_this4.element, _this4._addAttachClasses, all);
  722. if (!(_this4.options.addTargetClasses === false)) {
  723. updateClasses(_this4.target, _this4._addAttachClasses, all);
  724. }
  725. delete _this4._addAttachClasses;
  726. });
  727. }
  728. }, {
  729. key: 'position',
  730. value: function position() {
  731. var _this5 = this;
  732. var flushChanges = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
  733. // flushChanges commits the changes immediately, leave true unless you are positioning multiple
  734. // tethers (in which case call Tether.Utils.flush yourself when you're done)
  735. if (!this.enabled) {
  736. return;
  737. }
  738. this.clearCache();
  739. // Turn 'auto' attachments into the appropriate corner or edge
  740. var targetAttachment = autoToFixedAttachment(this.targetAttachment, this.attachment);
  741. this.updateAttachClasses(this.attachment, targetAttachment);
  742. var elementPos = this.cache('element-bounds', function () {
  743. return getBounds(_this5.element);
  744. });
  745. var width = elementPos.width;
  746. var height = elementPos.height;
  747. if (width === 0 && height === 0 && typeof this.lastSize !== 'undefined') {
  748. var _lastSize = this.lastSize;
  749. // We cache the height and width to make it possible to position elements that are
  750. // getting hidden.
  751. width = _lastSize.width;
  752. height = _lastSize.height;
  753. } else {
  754. this.lastSize = { width: width, height: height };
  755. }
  756. var targetPos = this.cache('target-bounds', function () {
  757. return _this5.getTargetBounds();
  758. });
  759. var targetSize = targetPos;
  760. // Get an actual px offset from the attachment
  761. var offset = offsetToPx(attachmentToOffset(this.attachment), { width: width, height: height });
  762. var targetOffset = offsetToPx(attachmentToOffset(targetAttachment), targetSize);
  763. var manualOffset = offsetToPx(this.offset, { width: width, height: height });
  764. var manualTargetOffset = offsetToPx(this.targetOffset, targetSize);
  765. // Add the manually provided offset
  766. offset = addOffset(offset, manualOffset);
  767. targetOffset = addOffset(targetOffset, manualTargetOffset);
  768. // It's now our goal to make (element position + offset) == (target position + target offset)
  769. var left = targetPos.left + targetOffset.left - offset.left;
  770. var top = targetPos.top + targetOffset.top - offset.top;
  771. for (var i = 0; i < TetherBase.modules.length; ++i) {
  772. var _module2 = TetherBase.modules[i];
  773. var ret = _module2.position.call(this, {
  774. left: left,
  775. top: top,
  776. targetAttachment: targetAttachment,
  777. targetPos: targetPos,
  778. elementPos: elementPos,
  779. offset: offset,
  780. targetOffset: targetOffset,
  781. manualOffset: manualOffset,
  782. manualTargetOffset: manualTargetOffset,
  783. scrollbarSize: scrollbarSize,
  784. attachment: this.attachment
  785. });
  786. if (ret === false) {
  787. return false;
  788. } else if (typeof ret === 'undefined' || typeof ret !== 'object') {
  789. continue;
  790. } else {
  791. top = ret.top;
  792. left = ret.left;
  793. }
  794. }
  795. // We describe the position three different ways to give the optimizer
  796. // a chance to decide the best possible way to position the element
  797. // with the fewest repaints.
  798. var next = {
  799. // It's position relative to the page (absolute positioning when
  800. // the element is a child of the body)
  801. page: {
  802. top: top,
  803. left: left
  804. },
  805. // It's position relative to the viewport (fixed positioning)
  806. viewport: {
  807. top: top - pageYOffset,
  808. bottom: pageYOffset - top - height + innerHeight,
  809. left: left - pageXOffset,
  810. right: pageXOffset - left - width + innerWidth
  811. }
  812. };
  813. var scrollbarSize = undefined;
  814. if (document.body.scrollWidth > window.innerWidth) {
  815. scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
  816. next.viewport.bottom -= scrollbarSize.height;
  817. }
  818. if (document.body.scrollHeight > window.innerHeight) {
  819. scrollbarSize = this.cache('scrollbar-size', getScrollBarSize);
  820. next.viewport.right -= scrollbarSize.width;
  821. }
  822. if (['', 'static'].indexOf(document.body.style.position) === -1 || ['', 'static'].indexOf(document.body.parentElement.style.position) === -1) {
  823. // Absolute positioning in the body will be relative to the page, not the 'initial containing block'
  824. next.page.bottom = document.body.scrollHeight - top - height;
  825. next.page.right = document.body.scrollWidth - left - width;
  826. }
  827. if (typeof this.options.optimizations !== 'undefined' && this.options.optimizations.moveElement !== false && !(typeof this.targetModifier !== 'undefined')) {
  828. (function () {
  829. var offsetParent = _this5.cache('target-offsetparent', function () {
  830. return getOffsetParent(_this5.target);
  831. });
  832. var offsetPosition = _this5.cache('target-offsetparent-bounds', function () {
  833. return getBounds(offsetParent);
  834. });
  835. var offsetParentStyle = getComputedStyle(offsetParent);
  836. var offsetParentSize = offsetPosition;
  837. var offsetBorder = {};
  838. ['Top', 'Left', 'Bottom', 'Right'].forEach(function (side) {
  839. offsetBorder[side.toLowerCase()] = parseFloat(offsetParentStyle['border' + side + 'Width']);
  840. });
  841. offsetPosition.right = document.body.scrollWidth - offsetPosition.left - offsetParentSize.width + offsetBorder.right;
  842. offsetPosition.bottom = document.body.scrollHeight - offsetPosition.top - offsetParentSize.height + offsetBorder.bottom;
  843. if (next.page.top >= offsetPosition.top + offsetBorder.top && next.page.bottom >= offsetPosition.bottom) {
  844. if (next.page.left >= offsetPosition.left + offsetBorder.left && next.page.right >= offsetPosition.right) {
  845. // We're within the visible part of the target's scroll parent
  846. var scrollTop = offsetParent.scrollTop;
  847. var scrollLeft = offsetParent.scrollLeft;
  848. // It's position relative to the target's offset parent (absolute positioning when
  849. // the element is moved to be a child of the target's offset parent).
  850. next.offset = {
  851. top: next.page.top - offsetPosition.top + scrollTop - offsetBorder.top,
  852. left: next.page.left - offsetPosition.left + scrollLeft - offsetBorder.left
  853. };
  854. }
  855. }
  856. })();
  857. }
  858. // We could also travel up the DOM and try each containing context, rather than only
  859. // looking at the body, but we're gonna get diminishing returns.
  860. this.move(next);
  861. this.history.unshift(next);
  862. if (this.history.length > 3) {
  863. this.history.pop();
  864. }
  865. if (flushChanges) {
  866. flush();
  867. }
  868. return true;
  869. }
  870. // THE ISSUE
  871. }, {
  872. key: 'move',
  873. value: function move(pos) {
  874. var _this6 = this;
  875. if (!(typeof this.element.parentNode !== 'undefined')) {
  876. return;
  877. }
  878. var same = {};
  879. for (var type in pos) {
  880. same[type] = {};
  881. for (var key in pos[type]) {
  882. var found = false;
  883. for (var i = 0; i < this.history.length; ++i) {
  884. var point = this.history[i];
  885. if (typeof point[type] !== 'undefined' && !within(point[type][key], pos[type][key])) {
  886. found = true;
  887. break;
  888. }
  889. }
  890. if (!found) {
  891. same[type][key] = true;
  892. }
  893. }
  894. }
  895. var css = { top: '', left: '', right: '', bottom: '' };
  896. var transcribe = function transcribe(_same, _pos) {
  897. var hasOptimizations = typeof _this6.options.optimizations !== 'undefined';
  898. var gpu = hasOptimizations ? _this6.options.optimizations.gpu : null;
  899. if (gpu !== false) {
  900. var yPos = undefined,
  901. xPos = undefined;
  902. if (_same.top) {
  903. css.top = 0;
  904. yPos = _pos.top;
  905. } else {
  906. css.bottom = 0;
  907. yPos = -_pos.bottom;
  908. }
  909. if (_same.left) {
  910. css.left = 0;
  911. xPos = _pos.left;
  912. } else {
  913. css.right = 0;
  914. xPos = -_pos.right;
  915. }
  916. css[transformKey] = 'translateX(' + Math.round(xPos) + 'px) translateY(' + Math.round(yPos) + 'px)';
  917. if (transformKey !== 'msTransform') {
  918. // The Z transform will keep this in the GPU (faster, and prevents artifacts),
  919. // but IE9 doesn't support 3d transforms and will choke.
  920. css[transformKey] += " translateZ(0)";
  921. }
  922. } else {
  923. if (_same.top) {
  924. css.top = _pos.top + 'px';
  925. } else {
  926. css.bottom = _pos.bottom + 'px';
  927. }
  928. if (_same.left) {
  929. css.left = _pos.left + 'px';
  930. } else {
  931. css.right = _pos.right + 'px';
  932. }
  933. }
  934. };
  935. var moved = false;
  936. if ((same.page.top || same.page.bottom) && (same.page.left || same.page.right)) {
  937. css.position = 'absolute';
  938. transcribe(same.page, pos.page);
  939. } else if ((same.viewport.top || same.viewport.bottom) && (same.viewport.left || same.viewport.right)) {
  940. css.position = 'fixed';
  941. transcribe(same.viewport, pos.viewport);
  942. } else if (typeof same.offset !== 'undefined' && same.offset.top && same.offset.left) {
  943. (function () {
  944. css.position = 'absolute';
  945. var offsetParent = _this6.cache('target-offsetparent', function () {
  946. return getOffsetParent(_this6.target);
  947. });
  948. if (getOffsetParent(_this6.element) !== offsetParent) {
  949. defer(function () {
  950. _this6.element.parentNode.removeChild(_this6.element);
  951. offsetParent.appendChild(_this6.element);
  952. });
  953. }
  954. transcribe(same.offset, pos.offset);
  955. moved = true;
  956. })();
  957. } else {
  958. css.position = 'absolute';
  959. transcribe({ top: true, left: true }, pos.page);
  960. }
  961. if (!moved) {
  962. var offsetParentIsBody = true;
  963. var currentNode = this.element.parentNode;
  964. while (currentNode && currentNode.tagName !== 'BODY') {
  965. if (getComputedStyle(currentNode).position !== 'static') {
  966. offsetParentIsBody = false;
  967. break;
  968. }
  969. currentNode = currentNode.parentNode;
  970. }
  971. if (!offsetParentIsBody) {
  972. this.element.parentNode.removeChild(this.element);
  973. document.body.appendChild(this.element);
  974. }
  975. }
  976. // Any css change will trigger a repaint, so let's avoid one if nothing changed
  977. var writeCSS = {};
  978. var write = false;
  979. for (var key in css) {
  980. var val = css[key];
  981. var elVal = this.element.style[key];
  982. if (elVal !== '' && val !== '' && ['top', 'left', 'bottom', 'right'].indexOf(key) >= 0) {
  983. elVal = parseFloat(elVal);
  984. val = parseFloat(val);
  985. }
  986. if (elVal !== val) {
  987. write = true;
  988. writeCSS[key] = val;
  989. }
  990. }
  991. if (write) {
  992. defer(function () {
  993. extend(_this6.element.style, writeCSS);
  994. });
  995. }
  996. }
  997. }]);
  998. return TetherClass;
  999. })();
  1000. TetherClass.modules = [];
  1001. TetherBase.position = position;
  1002. var Tether = extend(TetherClass, TetherBase);
  1003. /* globals TetherBase */
  1004. 'use strict';
  1005. var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
  1006. var _TetherBase$Utils = TetherBase.Utils;
  1007. var getBounds = _TetherBase$Utils.getBounds;
  1008. var extend = _TetherBase$Utils.extend;
  1009. var updateClasses = _TetherBase$Utils.updateClasses;
  1010. var defer = _TetherBase$Utils.defer;
  1011. var BOUNDS_FORMAT = ['left', 'top', 'right', 'bottom'];
  1012. function getBoundingRect(tether, to) {
  1013. if (to === 'scrollParent') {
  1014. to = tether.scrollParent;
  1015. } else if (to === 'window') {
  1016. to = [pageXOffset, pageYOffset, innerWidth + pageXOffset, innerHeight + pageYOffset];
  1017. }
  1018. if (to === document) {
  1019. to = to.documentElement;
  1020. }
  1021. if (typeof to.nodeType !== 'undefined') {
  1022. (function () {
  1023. var size = getBounds(to);
  1024. var pos = size;
  1025. var style = getComputedStyle(to);
  1026. to = [pos.left, pos.top, size.width + pos.left, size.height + pos.top];
  1027. BOUNDS_FORMAT.forEach(function (side, i) {
  1028. side = side[0].toUpperCase() + side.substr(1);
  1029. if (side === 'Top' || side === 'Left') {
  1030. to[i] += parseFloat(style['border' + side + 'Width']);
  1031. } else {
  1032. to[i] -= parseFloat(style['border' + side + 'Width']);
  1033. }
  1034. });
  1035. })();
  1036. }
  1037. return to;
  1038. }
  1039. TetherBase.modules.push({
  1040. position: function position(_ref) {
  1041. var _this = this;
  1042. var top = _ref.top;
  1043. var left = _ref.left;
  1044. var targetAttachment = _ref.targetAttachment;
  1045. if (!this.options.constraints) {
  1046. return true;
  1047. }
  1048. var _cache = this.cache('element-bounds', function () {
  1049. return getBounds(_this.element);
  1050. });
  1051. var height = _cache.height;
  1052. var width = _cache.width;
  1053. if (width === 0 && height === 0 && typeof this.lastSize !== 'undefined') {
  1054. var _lastSize = this.lastSize;
  1055. // Handle the item getting hidden as a result of our positioning without glitching
  1056. // the classes in and out
  1057. width = _lastSize.width;
  1058. height = _lastSize.height;
  1059. }
  1060. var targetSize = this.cache('target-bounds', function () {
  1061. return _this.getTargetBounds();
  1062. });
  1063. var targetHeight = targetSize.height;
  1064. var targetWidth = targetSize.width;
  1065. var allClasses = [this.getClass('pinned'), this.getClass('out-of-bounds')];
  1066. this.options.constraints.forEach(function (constraint) {
  1067. var outOfBoundsClass = constraint.outOfBoundsClass;
  1068. var pinnedClass = constraint.pinnedClass;
  1069. if (outOfBoundsClass) {
  1070. allClasses.push(outOfBoundsClass);
  1071. }
  1072. if (pinnedClass) {
  1073. allClasses.push(pinnedClass);
  1074. }
  1075. });
  1076. allClasses.forEach(function (cls) {
  1077. ['left', 'top', 'right', 'bottom'].forEach(function (side) {
  1078. allClasses.push(cls + '-' + side);
  1079. });
  1080. });
  1081. var addClasses = [];
  1082. var tAttachment = extend({}, targetAttachment);
  1083. var eAttachment = extend({}, this.attachment);
  1084. this.options.constraints.forEach(function (constraint) {
  1085. var to = constraint.to;
  1086. var attachment = constraint.attachment;
  1087. var pin = constraint.pin;
  1088. if (typeof attachment === 'undefined') {
  1089. attachment = '';
  1090. }
  1091. var changeAttachX = undefined,
  1092. changeAttachY = undefined;
  1093. if (attachment.indexOf(' ') >= 0) {
  1094. var _attachment$split = attachment.split(' ');
  1095. var _attachment$split2 = _slicedToArray(_attachment$split, 2);
  1096. changeAttachY = _attachment$split2[0];
  1097. changeAttachX = _attachment$split2[1];
  1098. } else {
  1099. changeAttachX = changeAttachY = attachment;
  1100. }
  1101. var bounds = getBoundingRect(_this, to);
  1102. if (changeAttachY === 'target' || changeAttachY === 'both') {
  1103. if (top < bounds[1] && tAttachment.top === 'top') {
  1104. top += targetHeight;
  1105. tAttachment.top = 'bottom';
  1106. }
  1107. if (top + height > bounds[3] && tAttachment.top === 'bottom') {
  1108. top -= targetHeight;
  1109. tAttachment.top = 'top';
  1110. }
  1111. }
  1112. if (changeAttachY === 'together') {
  1113. if (top < bounds[1] && tAttachment.top === 'top') {
  1114. if (eAttachment.top === 'bottom') {
  1115. top += targetHeight;
  1116. tAttachment.top = 'bottom';
  1117. top += height;
  1118. eAttachment.top = 'top';
  1119. } else if (eAttachment.top === 'top') {
  1120. top += targetHeight;
  1121. tAttachment.top = 'bottom';
  1122. top -= height;
  1123. eAttachment.top = 'bottom';
  1124. }
  1125. }
  1126. if (top + height > bounds[3] && tAttachment.top === 'bottom') {
  1127. if (eAttachment.top === 'top') {
  1128. top -= targetHeight;
  1129. tAttachment.top = 'top';
  1130. top -= height;
  1131. eAttachment.top = 'bottom';
  1132. } else if (eAttachment.top === 'bottom') {
  1133. top -= targetHeight;
  1134. tAttachment.top = 'top';
  1135. top += height;
  1136. eAttachment.top = 'top';
  1137. }
  1138. }
  1139. if (tAttachment.top === 'middle') {
  1140. if (top + height > bounds[3] && eAttachment.top === 'top') {
  1141. top -= height;
  1142. eAttachment.top = 'bottom';
  1143. } else if (top < bounds[1] && eAttachment.top === 'bottom') {
  1144. top += height;
  1145. eAttachment.top = 'top';
  1146. }
  1147. }
  1148. }
  1149. if (changeAttachX === 'target' || changeAttachX === 'both') {
  1150. if (left < bounds[0] && tAttachment.left === 'left') {
  1151. left += targetWidth;
  1152. tAttachment.left = 'right';
  1153. }
  1154. if (left + width > bounds[2] && tAttachment.left === 'right') {
  1155. left -= targetWidth;
  1156. tAttachment.left = 'left';
  1157. }
  1158. }
  1159. if (changeAttachX === 'together') {
  1160. if (left < bounds[0] && tAttachment.left === 'left') {
  1161. if (eAttachment.left === 'right') {
  1162. left += targetWidth;
  1163. tAttachment.left = 'right';
  1164. left += width;
  1165. eAttachment.left = 'left';
  1166. } else if (eAttachment.left === 'left') {
  1167. left += targetWidth;
  1168. tAttachment.left = 'right';
  1169. left -= width;
  1170. eAttachment.left = 'right';
  1171. }
  1172. } else if (left + width > bounds[2] && tAttachment.left === 'right') {
  1173. if (eAttachment.left === 'left') {
  1174. left -= targetWidth;
  1175. tAttachment.left = 'left';
  1176. left -= width;
  1177. eAttachment.left = 'right';
  1178. } else if (eAttachment.left === 'right') {
  1179. left -= targetWidth;
  1180. tAttachment.left = 'left';
  1181. left += width;
  1182. eAttachment.left = 'left';
  1183. }
  1184. } else if (tAttachment.left === 'center') {
  1185. if (left + width > bounds[2] && eAttachment.left === 'left') {
  1186. left -= width;
  1187. eAttachment.left = 'right';
  1188. } else if (left < bounds[0] && eAttachment.left === 'right') {
  1189. left += width;
  1190. eAttachment.left = 'left';
  1191. }
  1192. }
  1193. }
  1194. if (changeAttachY === 'element' || changeAttachY === 'both') {
  1195. if (top < bounds[1] && eAttachment.top === 'bottom') {
  1196. top += height;
  1197. eAttachment.top = 'top';
  1198. }
  1199. if (top + height > bounds[3] && eAttachment.top === 'top') {
  1200. top -= height;
  1201. eAttachment.top = 'bottom';
  1202. }
  1203. }
  1204. if (changeAttachX === 'element' || changeAttachX === 'both') {
  1205. if (left < bounds[0] && eAttachment.left === 'right') {
  1206. left += width;
  1207. eAttachment.left = 'left';
  1208. }
  1209. if (left + width > bounds[2] && eAttachment.left === 'left') {
  1210. left -= width;
  1211. eAttachment.left = 'right';
  1212. }
  1213. }
  1214. if (typeof pin === 'string') {
  1215. pin = pin.split(',').map(function (p) {
  1216. return p.trim();
  1217. });
  1218. } else if (pin === true) {
  1219. pin = ['top', 'left', 'right', 'bottom'];
  1220. }
  1221. pin = pin || [];
  1222. var pinned = [];
  1223. var oob = [];
  1224. if (top < bounds[1]) {
  1225. if (pin.indexOf('top') >= 0) {
  1226. top = bounds[1];
  1227. pinned.push('top');
  1228. } else {
  1229. oob.push('top');
  1230. }
  1231. }
  1232. if (top + height > bounds[3]) {
  1233. if (pin.indexOf('bottom') >= 0) {
  1234. top = bounds[3] - height;
  1235. pinned.push('bottom');
  1236. } else {
  1237. oob.push('bottom');
  1238. }
  1239. }
  1240. if (left < bounds[0]) {
  1241. if (pin.indexOf('left') >= 0) {
  1242. left = bounds[0];
  1243. pinned.push('left');
  1244. } else {
  1245. oob.push('left');
  1246. }
  1247. }
  1248. if (left + width > bounds[2]) {
  1249. if (pin.indexOf('right') >= 0) {
  1250. left = bounds[2] - width;
  1251. pinned.push('right');
  1252. } else {
  1253. oob.push('right');
  1254. }
  1255. }
  1256. if (pinned.length) {
  1257. (function () {
  1258. var pinnedClass = undefined;
  1259. if (typeof _this.options.pinnedClass !== 'undefined') {
  1260. pinnedClass = _this.options.pinnedClass;
  1261. } else {
  1262. pinnedClass = _this.getClass('pinned');
  1263. }
  1264. addClasses.push(pinnedClass);
  1265. pinned.forEach(function (side) {
  1266. addClasses.push(pinnedClass + '-' + side);
  1267. });
  1268. })();
  1269. }
  1270. if (oob.length) {
  1271. (function () {
  1272. var oobClass = undefined;
  1273. if (typeof _this.options.outOfBoundsClass !== 'undefined') {
  1274. oobClass = _this.options.outOfBoundsClass;
  1275. } else {
  1276. oobClass = _this.getClass('out-of-bounds');
  1277. }
  1278. addClasses.push(oobClass);
  1279. oob.forEach(function (side) {
  1280. addClasses.push(oobClass + '-' + side);
  1281. });
  1282. })();
  1283. }
  1284. if (pinned.indexOf('left') >= 0 || pinned.indexOf('right') >= 0) {
  1285. eAttachment.left = tAttachment.left = false;
  1286. }
  1287. if (pinned.indexOf('top') >= 0 || pinned.indexOf('bottom') >= 0) {
  1288. eAttachment.top = tAttachment.top = false;
  1289. }
  1290. if (tAttachment.top !== targetAttachment.top || tAttachment.left !== targetAttachment.left || eAttachment.top !== _this.attachment.top || eAttachment.left !== _this.attachment.left) {
  1291. _this.updateAttachClasses(eAttachment, tAttachment);
  1292. }
  1293. });
  1294. defer(function () {
  1295. if (!(_this.options.addTargetClasses === false)) {
  1296. updateClasses(_this.target, addClasses, allClasses);
  1297. }
  1298. updateClasses(_this.element, addClasses, allClasses);
  1299. });
  1300. return { top: top, left: left };
  1301. }
  1302. });
  1303. /* globals TetherBase */
  1304. 'use strict';
  1305. var _TetherBase$Utils = TetherBase.Utils;
  1306. var getBounds = _TetherBase$Utils.getBounds;
  1307. var updateClasses = _TetherBase$Utils.updateClasses;
  1308. var defer = _TetherBase$Utils.defer;
  1309. TetherBase.modules.push({
  1310. position: function position(_ref) {
  1311. var _this = this;
  1312. var top = _ref.top;
  1313. var left = _ref.left;
  1314. var _cache = this.cache('element-bounds', function () {
  1315. return getBounds(_this.element);
  1316. });
  1317. var height = _cache.height;
  1318. var width = _cache.width;
  1319. var targetPos = this.getTargetBounds();
  1320. var bottom = top + height;
  1321. var right = left + width;
  1322. var abutted = [];
  1323. if (top <= targetPos.bottom && bottom >= targetPos.top) {
  1324. ['left', 'right'].forEach(function (side) {
  1325. var targetPosSide = targetPos[side];
  1326. if (targetPosSide === left || targetPosSide === right) {
  1327. abutted.push(side);
  1328. }
  1329. });
  1330. }
  1331. if (left <= targetPos.right && right >= targetPos.left) {
  1332. ['top', 'bottom'].forEach(function (side) {
  1333. var targetPosSide = targetPos[side];
  1334. if (targetPosSide === top || targetPosSide === bottom) {
  1335. abutted.push(side);
  1336. }
  1337. });
  1338. }
  1339. var allClasses = [];
  1340. var addClasses = [];
  1341. var sides = ['left', 'top', 'right', 'bottom'];
  1342. allClasses.push(this.getClass('abutted'));
  1343. sides.forEach(function (side) {
  1344. allClasses.push(_this.getClass('abutted') + '-' + side);
  1345. });
  1346. if (abutted.length) {
  1347. addClasses.push(this.getClass('abutted'));
  1348. }
  1349. abutted.forEach(function (side) {
  1350. addClasses.push(_this.getClass('abutted') + '-' + side);
  1351. });
  1352. defer(function () {
  1353. if (!(_this.options.addTargetClasses === false)) {
  1354. updateClasses(_this.target, addClasses, allClasses);
  1355. }
  1356. updateClasses(_this.element, addClasses, allClasses);
  1357. });
  1358. return true;
  1359. }
  1360. });
  1361. /* globals TetherBase */
  1362. 'use strict';
  1363. var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
  1364. TetherBase.modules.push({
  1365. position: function position(_ref) {
  1366. var top = _ref.top;
  1367. var left = _ref.left;
  1368. if (!this.options.shift) {
  1369. return;
  1370. }
  1371. var shift = this.options.shift;
  1372. if (typeof this.options.shift === 'function') {
  1373. shift = this.options.shift.call(this, { top: top, left: left });
  1374. }
  1375. var shiftTop = undefined,
  1376. shiftLeft = undefined;
  1377. if (typeof shift === 'string') {
  1378. shift = shift.split(' ');
  1379. shift[1] = shift[1] || shift[0];
  1380. var _shift = shift;
  1381. var _shift2 = _slicedToArray(_shift, 2);
  1382. shiftTop = _shift2[0];
  1383. shiftLeft = _shift2[1];
  1384. shiftTop = parseFloat(shiftTop, 10);
  1385. shiftLeft = parseFloat(shiftLeft, 10);
  1386. } else {
  1387. shiftTop = shift.top;
  1388. shiftLeft = shift.left;
  1389. }
  1390. top += shiftTop;
  1391. left += shiftLeft;
  1392. return { top: top, left: left };
  1393. }
  1394. });
  1395. return Tether;
  1396. }));