tabledrag.js 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003
  1. /**
  2. * DO NOT EDIT THIS FILE.
  3. * See the following change record for more information,
  4. * https://www.drupal.org/node/2815083
  5. * @preserve
  6. **/
  7. var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
  8. (function ($, Drupal, drupalSettings) {
  9. var showWeight = JSON.parse(localStorage.getItem('Drupal.tableDrag.showWeight'));
  10. Drupal.behaviors.tableDrag = {
  11. attach: function attach(context, settings) {
  12. function initTableDrag(table, base) {
  13. if (table.length) {
  14. Drupal.tableDrag[base] = new Drupal.tableDrag(table[0], settings.tableDrag[base]);
  15. }
  16. }
  17. Object.keys(settings.tableDrag || {}).forEach(function (base) {
  18. initTableDrag($(context).find('#' + base).once('tabledrag'), base);
  19. });
  20. }
  21. };
  22. Drupal.tableDrag = function init(table, tableSettings) {
  23. var _this = this;
  24. var self = this;
  25. var $table = $(table);
  26. this.$table = $(table);
  27. this.table = table;
  28. this.tableSettings = tableSettings;
  29. this.dragObject = null;
  30. this.rowObject = null;
  31. this.oldRowElement = null;
  32. this.oldY = null;
  33. this.changed = false;
  34. this.maxDepth = 0;
  35. this.rtl = $(this.table).css('direction') === 'rtl' ? -1 : 1;
  36. this.striping = $(this.table).data('striping') === 1;
  37. this.scrollSettings = { amount: 4, interval: 50, trigger: 70 };
  38. this.scrollInterval = null;
  39. this.scrollY = 0;
  40. this.windowHeight = 0;
  41. this.indentEnabled = false;
  42. Object.keys(tableSettings || {}).forEach(function (group) {
  43. Object.keys(tableSettings[group] || {}).forEach(function (n) {
  44. if (tableSettings[group][n].relationship === 'parent') {
  45. _this.indentEnabled = true;
  46. }
  47. if (tableSettings[group][n].limit > 0) {
  48. _this.maxDepth = tableSettings[group][n].limit;
  49. }
  50. });
  51. });
  52. if (this.indentEnabled) {
  53. this.indentCount = 1;
  54. var indent = Drupal.theme('tableDragIndentation');
  55. var testRow = $('<tr></tr>').addClass('draggable').appendTo(table);
  56. var testCell = $('<td></td>').appendTo(testRow).prepend(indent).prepend(indent);
  57. var $indentation = testCell.find('.js-indentation');
  58. this.indentAmount = $indentation.get(1).offsetLeft - $indentation.get(0).offsetLeft;
  59. testRow.remove();
  60. }
  61. $table.find('> tr.draggable, > tbody > tr.draggable').each(function initDraggable() {
  62. self.makeDraggable(this);
  63. });
  64. $table.before($(Drupal.theme('tableDragToggleWrapper')).addClass('js-tabledrag-toggle-weight-wrapper').on('click', '.js-tabledrag-toggle-weight', $.proxy(function toggleColumns(event) {
  65. event.preventDefault();
  66. this.toggleColumns();
  67. }, this)));
  68. self.initColumns();
  69. $(document).on('touchmove', function (event) {
  70. return self.dragRow(event.originalEvent.touches[0], self);
  71. });
  72. $(document).on('touchend', function (event) {
  73. return self.dropRow(event.originalEvent.touches[0], self);
  74. });
  75. $(document).on('mousemove pointermove', function (event) {
  76. return self.dragRow(event, self);
  77. });
  78. $(document).on('mouseup pointerup', function (event) {
  79. return self.dropRow(event, self);
  80. });
  81. $(window).on('storage', $.proxy(function weightColumnDisplayChange(event) {
  82. if (event.originalEvent.key === 'Drupal.tableDrag.showWeight') {
  83. showWeight = JSON.parse(event.originalEvent.newValue);
  84. this.displayColumns(showWeight);
  85. }
  86. }, this));
  87. };
  88. $.extend(Drupal.tableDrag.prototype, {
  89. initColumns: function initColumns() {
  90. var _this2 = this;
  91. var $table = this.$table;
  92. var hidden = void 0;
  93. var cell = void 0;
  94. var columnIndex = void 0;
  95. Object.keys(this.tableSettings || {}).forEach(function (group) {
  96. Object.keys(_this2.tableSettings[group]).some(function (tableSetting) {
  97. var field = $table.find('.' + _this2.tableSettings[group][tableSetting].target).eq(0);
  98. if (field.length && _this2.tableSettings[group][tableSetting].hidden) {
  99. hidden = _this2.tableSettings[group][tableSetting].hidden;
  100. cell = field.closest('td');
  101. return true;
  102. }
  103. return false;
  104. });
  105. if (hidden && cell[0]) {
  106. columnIndex = cell.parent().find('> td').index(cell.get(0)) + 1;
  107. $table.find('> thead > tr, > tbody > tr, > tr').each(_this2.addColspanClass(columnIndex));
  108. }
  109. });
  110. this.displayColumns(showWeight);
  111. },
  112. addColspanClass: function addColspanClass(columnIndex) {
  113. return function addColspanClass() {
  114. var $row = $(this);
  115. var index = columnIndex;
  116. var cells = $row.children();
  117. var cell = void 0;
  118. cells.each(function checkColspan(n) {
  119. if (n < index && this.colSpan && this.colSpan > 1) {
  120. index -= this.colSpan - 1;
  121. }
  122. });
  123. if (index > 0) {
  124. cell = cells.filter(':nth-child(' + index + ')');
  125. if (cell[0].colSpan && cell[0].colSpan > 1) {
  126. cell.addClass('tabledrag-has-colspan');
  127. } else {
  128. cell.addClass('tabledrag-hide');
  129. }
  130. }
  131. };
  132. },
  133. displayColumns: function displayColumns(displayWeight) {
  134. if (displayWeight) {
  135. this.showColumns();
  136. } else {
  137. this.hideColumns();
  138. }
  139. $('table').findOnce('tabledrag').trigger('columnschange', !!displayWeight);
  140. },
  141. toggleColumns: function toggleColumns() {
  142. showWeight = !showWeight;
  143. this.displayColumns(showWeight);
  144. if (showWeight) {
  145. localStorage.setItem('Drupal.tableDrag.showWeight', showWeight);
  146. } else {
  147. localStorage.removeItem('Drupal.tableDrag.showWeight');
  148. }
  149. },
  150. hideColumns: function hideColumns() {
  151. var $tables = $('table').findOnce('tabledrag');
  152. $tables.find('.tabledrag-hide').css('display', 'none');
  153. $tables.find('.js-tabledrag-handle').css('display', '');
  154. $tables.find('.tabledrag-has-colspan').each(function decreaseColspan() {
  155. this.colSpan = this.colSpan - 1;
  156. });
  157. $('.js-tabledrag-toggle-weight-wrapper').each(function addShowWeightToggle() {
  158. var $wrapper = $(this);
  159. var toggleWasFocused = $wrapper.find('.js-tabledrag-toggle-weight:focus').length;
  160. $wrapper.empty().append($(Drupal.theme('tableDragToggle', 'show', Drupal.t('Show row weights'))).addClass('js-tabledrag-toggle-weight'));
  161. if (toggleWasFocused) {
  162. $wrapper.find('.js-tabledrag-toggle-weight').trigger('focus');
  163. }
  164. });
  165. },
  166. showColumns: function showColumns() {
  167. var $tables = $('table').findOnce('tabledrag');
  168. $tables.find('.tabledrag-hide').css('display', '');
  169. $tables.find('.js-tabledrag-handle').css('display', 'none');
  170. $tables.find('.tabledrag-has-colspan').each(function increaseColspan() {
  171. this.colSpan = this.colSpan + 1;
  172. });
  173. $('.js-tabledrag-toggle-weight-wrapper').each(function addHideWeightToggle() {
  174. var $wrapper = $(this);
  175. var toggleWasFocused = $wrapper.find('.js-tabledrag-toggle-weight:focus').length;
  176. $wrapper.empty().append($(Drupal.theme('tableDragToggle', 'hide', Drupal.t('Hide row weights'))).addClass('js-tabledrag-toggle-weight'));
  177. if (toggleWasFocused) {
  178. $wrapper.find('.js-tabledrag-toggle-weight').trigger('focus');
  179. }
  180. });
  181. },
  182. rowSettings: function rowSettings(group, row) {
  183. var field = $(row).find('.' + group);
  184. var tableSettingsGroup = this.tableSettings[group];
  185. return Object.keys(tableSettingsGroup).map(function (delta) {
  186. var targetClass = tableSettingsGroup[delta].target;
  187. var rowSettings = void 0;
  188. if (field.is('.' + targetClass)) {
  189. rowSettings = {};
  190. Object.keys(tableSettingsGroup[delta]).forEach(function (n) {
  191. rowSettings[n] = tableSettingsGroup[delta][n];
  192. });
  193. }
  194. return rowSettings;
  195. }).filter(function (rowSetting) {
  196. return rowSetting;
  197. })[0];
  198. },
  199. makeDraggable: function makeDraggable(item) {
  200. var self = this;
  201. var $item = $(item);
  202. var $firstCell = $item.find('td:first-of-type').wrapInner(Drupal.theme.tableDragCellContentWrapper()).wrapInner($(Drupal.theme('tableDragCellItemsWrapper')).addClass('js-tabledrag-cell-content'));
  203. var $targetElem = $firstCell.find('.js-tabledrag-cell-content').length ? $firstCell.find('.js-tabledrag-cell-content') : $firstCell.addClass('js-tabledrag-cell-content');
  204. $targetElem.find('.js-indentation').detach().prependTo($targetElem);
  205. $targetElem.find('a').addClass('menu-item__link');
  206. var handle = $(Drupal.theme.tableDragHandle()).addClass('js-tabledrag-handle').attr('title', Drupal.t('Drag to re-order'));
  207. var $indentationLast = $targetElem.find('.js-indentation').eq(-1);
  208. if ($indentationLast.length) {
  209. $indentationLast.after(handle);
  210. self.indentCount = Math.max($item.find('.js-indentation').length, self.indentCount);
  211. } else {
  212. $targetElem.prepend(handle);
  213. }
  214. handle.on('click', function (event) {
  215. event.preventDefault();
  216. });
  217. if (handle.closest('.js-tabledrag-disabled').length) {
  218. return;
  219. }
  220. handle.on('mousedown touchstart pointerdown', function (event) {
  221. event.preventDefault();
  222. if (event.originalEvent.type === 'touchstart') {
  223. event = event.originalEvent.touches[0];
  224. }
  225. self.dragStart(event, self, item);
  226. });
  227. handle.on('focus', function () {
  228. self.safeBlur = true;
  229. });
  230. handle.on('blur', function (event) {
  231. if (self.rowObject && self.safeBlur) {
  232. self.dropRow(event, self);
  233. }
  234. });
  235. handle.on('keydown', function (event) {
  236. if (event.keyCode !== 9 && !self.rowObject) {
  237. self.rowObject = new self.row(item, 'keyboard', self.indentEnabled, self.maxDepth, true);
  238. }
  239. var keyChange = false;
  240. var groupHeight = void 0;
  241. switch (event.keyCode) {
  242. case 37:
  243. case 63234:
  244. keyChange = true;
  245. self.rowObject.indent(-1 * self.rtl);
  246. break;
  247. case 38:
  248. case 63232:
  249. {
  250. var $previousRow = $(self.rowObject.element).prev('tr').eq(0);
  251. var previousRow = $previousRow.get(0);
  252. while (previousRow && $previousRow.is(':hidden')) {
  253. $previousRow = $(previousRow).prev('tr').eq(0);
  254. previousRow = $previousRow.get(0);
  255. }
  256. if (previousRow) {
  257. self.safeBlur = false;
  258. self.rowObject.direction = 'up';
  259. keyChange = true;
  260. if ($(item).is('.tabledrag-root')) {
  261. groupHeight = 0;
  262. while (previousRow && $previousRow.find('.js-indentation').length) {
  263. $previousRow = $(previousRow).prev('tr').eq(0);
  264. previousRow = $previousRow.get(0);
  265. groupHeight += $previousRow.is(':hidden') ? 0 : previousRow.offsetHeight;
  266. }
  267. if (previousRow) {
  268. self.rowObject.swap('before', previousRow);
  269. window.scrollBy(0, -groupHeight);
  270. }
  271. } else if (self.table.tBodies[0].rows[0] !== previousRow || $previousRow.is('.draggable')) {
  272. self.rowObject.swap('before', previousRow);
  273. self.rowObject.interval = null;
  274. self.rowObject.indent(0);
  275. window.scrollBy(0, -parseInt(item.offsetHeight, 10));
  276. }
  277. handle.trigger('focus');
  278. }
  279. break;
  280. }
  281. case 39:
  282. case 63235:
  283. keyChange = true;
  284. self.rowObject.indent(self.rtl);
  285. break;
  286. case 40:
  287. case 63233:
  288. {
  289. var $nextRow = $(self.rowObject.group).eq(-1).next('tr').eq(0);
  290. var nextRow = $nextRow.get(0);
  291. while (nextRow && $nextRow.is(':hidden')) {
  292. $nextRow = $(nextRow).next('tr').eq(0);
  293. nextRow = $nextRow.get(0);
  294. }
  295. if (nextRow) {
  296. self.safeBlur = false;
  297. self.rowObject.direction = 'down';
  298. keyChange = true;
  299. if ($(item).is('.tabledrag-root')) {
  300. groupHeight = 0;
  301. var nextGroup = new self.row(nextRow, 'keyboard', self.indentEnabled, self.maxDepth, false);
  302. if (nextGroup) {
  303. $(nextGroup.group).each(function groupIterator() {
  304. groupHeight += $(this).is(':hidden') ? 0 : this.offsetHeight;
  305. });
  306. var nextGroupRow = $(nextGroup.group).eq(-1).get(0);
  307. self.rowObject.swap('after', nextGroupRow);
  308. window.scrollBy(0, parseInt(groupHeight, 10));
  309. }
  310. } else {
  311. self.rowObject.swap('after', nextRow);
  312. self.rowObject.interval = null;
  313. self.rowObject.indent(0);
  314. window.scrollBy(0, parseInt(item.offsetHeight, 10));
  315. }
  316. handle.trigger('focus');
  317. }
  318. break;
  319. }
  320. }
  321. if (self.rowObject && self.rowObject.changed === true) {
  322. $(item).addClass('drag');
  323. if (self.oldRowElement) {
  324. $(self.oldRowElement).removeClass('drag-previous');
  325. }
  326. self.oldRowElement = item;
  327. if (self.striping === true) {
  328. self.restripeTable();
  329. }
  330. self.onDrag();
  331. }
  332. if (keyChange) {
  333. return false;
  334. }
  335. });
  336. handle.on('keypress', function (event) {
  337. switch (event.keyCode) {
  338. case 37:
  339. case 38:
  340. case 39:
  341. case 40:
  342. return false;
  343. }
  344. });
  345. },
  346. dragStart: function dragStart(event, self, item) {
  347. self.dragObject = {};
  348. self.dragObject.initOffset = self.getPointerOffset(item, event);
  349. self.dragObject.initPointerCoords = self.pointerCoords(event);
  350. if (self.indentEnabled) {
  351. self.dragObject.indentPointerPos = self.dragObject.initPointerCoords;
  352. }
  353. if (self.rowObject) {
  354. $(self.rowObject.element).find('.js-tabledrag-handle').trigger('blur');
  355. }
  356. self.rowObject = new self.row(item, 'pointer', self.indentEnabled, self.maxDepth, true);
  357. self.table.topY = $(self.table).offset().top;
  358. self.table.bottomY = self.table.topY + self.table.offsetHeight;
  359. $(item).addClass('drag');
  360. $('body').addClass('drag');
  361. if (self.oldRowElement) {
  362. $(self.oldRowElement).removeClass('drag-previous');
  363. }
  364. self.oldY = self.pointerCoords(event).y;
  365. },
  366. dragRow: function dragRow(event, self) {
  367. if (self.dragObject) {
  368. self.currentPointerCoords = self.pointerCoords(event);
  369. var y = self.currentPointerCoords.y - self.dragObject.initOffset.y;
  370. var x = self.currentPointerCoords.x - self.dragObject.initOffset.x;
  371. if (y !== self.oldY) {
  372. self.rowObject.direction = y > self.oldY ? 'down' : 'up';
  373. self.oldY = y;
  374. var scrollAmount = self.checkScroll(self.currentPointerCoords.y);
  375. clearInterval(self.scrollInterval);
  376. if (scrollAmount > 0 && self.rowObject.direction === 'down' || scrollAmount < 0 && self.rowObject.direction === 'up') {
  377. self.setScroll(scrollAmount);
  378. }
  379. var currentRow = self.findDropTargetRow(x, y);
  380. if (currentRow) {
  381. if (self.rowObject.direction === 'down') {
  382. self.rowObject.swap('after', currentRow, self);
  383. } else {
  384. self.rowObject.swap('before', currentRow, self);
  385. }
  386. if (self.striping === true) {
  387. self.restripeTable();
  388. }
  389. }
  390. }
  391. if (self.indentEnabled) {
  392. var xDiff = self.currentPointerCoords.x - self.dragObject.indentPointerPos.x;
  393. var indentDiff = Math.round(xDiff / self.indentAmount);
  394. var indentChange = self.rowObject.indent(indentDiff);
  395. self.dragObject.indentPointerPos.x += self.indentAmount * indentChange;
  396. self.indentCount = Math.max(self.indentCount, self.rowObject.indents);
  397. }
  398. return false;
  399. }
  400. },
  401. dropRow: function dropRow(event, self) {
  402. var droppedRow = void 0;
  403. var $droppedRow = void 0;
  404. if (self.rowObject !== null) {
  405. droppedRow = self.rowObject.element;
  406. $droppedRow = $(droppedRow);
  407. if (self.rowObject.changed === true) {
  408. self.updateFields(droppedRow);
  409. Object.keys(self.tableSettings || {}).forEach(function (group) {
  410. var rowSettings = self.rowSettings(group, droppedRow);
  411. if (rowSettings.relationship === 'group') {
  412. Object.keys(self.rowObject.children || {}).forEach(function (n) {
  413. self.updateField(self.rowObject.children[n], group);
  414. });
  415. }
  416. });
  417. self.rowObject.markChanged();
  418. if (self.changed === false) {
  419. var $messageTarget = $(self.table).prevAll('.js-tabledrag-toggle-weight-wrapper').length ? $(self.table).prevAll('.js-tabledrag-toggle-weight-wrapper').last() : self.table;
  420. $(Drupal.theme('tableDragChangedWarning')).insertBefore($messageTarget).hide().fadeIn('slow');
  421. self.changed = true;
  422. }
  423. }
  424. if (self.indentEnabled) {
  425. self.rowObject.removeIndentClasses();
  426. }
  427. if (self.oldRowElement) {
  428. $(self.oldRowElement).removeClass('drag-previous');
  429. }
  430. $droppedRow.removeClass('drag').addClass('drag-previous');
  431. self.oldRowElement = droppedRow;
  432. self.onDrop();
  433. self.rowObject = null;
  434. }
  435. if (self.dragObject !== null) {
  436. self.dragObject = null;
  437. $('body').removeClass('drag');
  438. clearInterval(self.scrollInterval);
  439. }
  440. },
  441. pointerCoords: function pointerCoords(event) {
  442. if (event.pageX || event.pageY) {
  443. return { x: event.pageX, y: event.pageY };
  444. }
  445. return {
  446. x: event.clientX + (document.body.scrollLeft - document.body.clientLeft),
  447. y: event.clientY + (document.body.scrollTop - document.body.clientTop)
  448. };
  449. },
  450. getPointerOffset: function getPointerOffset(target, event) {
  451. var docPos = $(target).offset();
  452. var pointerPos = this.pointerCoords(event);
  453. return { x: pointerPos.x - docPos.left, y: pointerPos.y - docPos.top };
  454. },
  455. findDropTargetRow: function findDropTargetRow(x, y) {
  456. var _this3 = this;
  457. var rows = $(this.table.tBodies[0].rows).not(':hidden');
  458. var _loop = function _loop(n) {
  459. var row = rows[n];
  460. var $row = $(row);
  461. var rowY = $row.offset().top;
  462. var rowHeight = void 0;
  463. if (row.offsetHeight === 0) {
  464. rowHeight = parseInt(row.firstChild.offsetHeight, 10) / 2;
  465. } else {
  466. rowHeight = parseInt(row.offsetHeight, 10) / 2;
  467. }
  468. if (y > rowY - rowHeight && y < rowY + rowHeight) {
  469. if (_this3.indentEnabled) {
  470. if (Object.keys(_this3.rowObject.group).some(function (o) {
  471. return _this3.rowObject.group[o] === row;
  472. })) {
  473. return {
  474. v: null
  475. };
  476. }
  477. } else if (row === _this3.rowObject.element) {
  478. return {
  479. v: null
  480. };
  481. }
  482. if (!_this3.rowObject.isValidSwap(row)) {
  483. return {
  484. v: null
  485. };
  486. }
  487. while ($row.is(':hidden') && $row.prev('tr').is(':hidden')) {
  488. $row = $row.prev('tr:first-of-type');
  489. row = $row.get(0);
  490. }
  491. return {
  492. v: row
  493. };
  494. }
  495. };
  496. for (var n = 0; n < rows.length; n++) {
  497. var _ret = _loop(n);
  498. if ((typeof _ret === 'undefined' ? 'undefined' : _typeof(_ret)) === "object") return _ret.v;
  499. }
  500. return null;
  501. },
  502. updateFields: function updateFields(changedRow) {
  503. var _this4 = this;
  504. Object.keys(this.tableSettings || {}).forEach(function (group) {
  505. _this4.updateField(changedRow, group);
  506. });
  507. },
  508. updateField: function updateField(changedRow, group) {
  509. var rowSettings = this.rowSettings(group, changedRow);
  510. var $changedRow = $(changedRow);
  511. var sourceRow = void 0;
  512. var $previousRow = void 0;
  513. var previousRow = void 0;
  514. var useSibling = void 0;
  515. if (rowSettings.relationship === 'self' || rowSettings.relationship === 'group') {
  516. sourceRow = changedRow;
  517. } else if (rowSettings.relationship === 'sibling') {
  518. $previousRow = $changedRow.prev('tr:first-of-type');
  519. previousRow = $previousRow.get(0);
  520. var $nextRow = $changedRow.next('tr:first-of-type');
  521. var nextRow = $nextRow.get(0);
  522. sourceRow = changedRow;
  523. if ($previousRow.is('.draggable') && $previousRow.find('.' + group).length) {
  524. if (this.indentEnabled) {
  525. if ($previousRow.find('.js-indentations').length === $changedRow.find('.js-indentations').length) {
  526. sourceRow = previousRow;
  527. }
  528. } else {
  529. sourceRow = previousRow;
  530. }
  531. } else if ($nextRow.is('.draggable') && $nextRow.find('.' + group).length) {
  532. if (this.indentEnabled) {
  533. if ($nextRow.find('.js-indentations').length === $changedRow.find('.js-indentations').length) {
  534. sourceRow = nextRow;
  535. }
  536. } else {
  537. sourceRow = nextRow;
  538. }
  539. }
  540. } else if (rowSettings.relationship === 'parent') {
  541. $previousRow = $changedRow.prev('tr');
  542. previousRow = $previousRow;
  543. while ($previousRow.length && $previousRow.find('.js-indentation').length >= this.rowObject.indents) {
  544. $previousRow = $previousRow.prev('tr');
  545. previousRow = $previousRow;
  546. }
  547. if ($previousRow.length) {
  548. sourceRow = $previousRow.get(0);
  549. } else {
  550. sourceRow = $(this.table).find('tr.draggable:first-of-type').get(0);
  551. if (sourceRow === this.rowObject.element) {
  552. sourceRow = $(this.rowObject.group[this.rowObject.group.length - 1]).next('tr.draggable').get(0);
  553. }
  554. useSibling = true;
  555. }
  556. }
  557. this.copyDragClasses(sourceRow, changedRow, group);
  558. rowSettings = this.rowSettings(group, changedRow);
  559. if (useSibling) {
  560. rowSettings.relationship = 'sibling';
  561. rowSettings.source = rowSettings.target;
  562. }
  563. var targetClass = '.' + rowSettings.target;
  564. var targetElement = $changedRow.find(targetClass).get(0);
  565. if (targetElement) {
  566. var sourceClass = '.' + rowSettings.source;
  567. var sourceElement = $(sourceClass, sourceRow).get(0);
  568. switch (rowSettings.action) {
  569. case 'depth':
  570. targetElement.value = $(sourceElement).closest('tr').find('.js-indentation').length;
  571. break;
  572. case 'match':
  573. targetElement.value = sourceElement.value;
  574. break;
  575. case 'order':
  576. {
  577. var siblings = this.rowObject.findSiblings(rowSettings);
  578. if ($(targetElement).is('select')) {
  579. var values = [];
  580. $(targetElement).find('option').each(function collectValues() {
  581. values.push(this.value);
  582. });
  583. var maxVal = values[values.length - 1];
  584. $(siblings).find(targetClass).each(function assignValues() {
  585. if (values.length > 0) {
  586. this.value = values.shift();
  587. } else {
  588. this.value = maxVal;
  589. }
  590. });
  591. } else {
  592. var weight = parseInt($(siblings[0]).find(targetClass).val(), 10) || 0;
  593. $(siblings).find(targetClass).each(function assignWeight() {
  594. this.value = weight;
  595. weight += 1;
  596. });
  597. }
  598. break;
  599. }
  600. }
  601. }
  602. },
  603. copyDragClasses: function copyDragClasses(sourceRow, targetRow, group) {
  604. var sourceElement = $(sourceRow).find('.' + group);
  605. var targetElement = $(targetRow).find('.' + group);
  606. if (sourceElement.length && targetElement.length) {
  607. targetElement[0].className = sourceElement[0].className;
  608. }
  609. },
  610. checkScroll: function checkScroll(cursorY) {
  611. var de = document.documentElement;
  612. var b = document.body;
  613. var windowHeight = window.innerHeight || (de.clientHeight && de.clientWidth !== 0 ? de.clientHeight : b.offsetHeight);
  614. this.windowHeight = windowHeight;
  615. var scrollY = void 0;
  616. if (document.all) {
  617. scrollY = !de.scrollTop ? b.scrollTop : de.scrollTop;
  618. } else {
  619. scrollY = window.pageYOffset ? window.pageYOffset : window.scrollY;
  620. }
  621. this.scrollY = scrollY;
  622. var trigger = this.scrollSettings.trigger;
  623. var delta = 0;
  624. if (cursorY - scrollY > windowHeight - trigger) {
  625. delta = trigger / (windowHeight + (scrollY - cursorY));
  626. delta = delta > 0 && delta < trigger ? delta : trigger;
  627. return delta * this.scrollSettings.amount;
  628. }
  629. if (cursorY - scrollY < trigger) {
  630. delta = trigger / (cursorY - scrollY);
  631. delta = delta > 0 && delta < trigger ? delta : trigger;
  632. return -delta * this.scrollSettings.amount;
  633. }
  634. },
  635. setScroll: function setScroll(scrollAmount) {
  636. var self = this;
  637. this.scrollInterval = setInterval(function () {
  638. self.checkScroll(self.currentPointerCoords.y);
  639. var aboveTable = self.scrollY > self.table.topY;
  640. var belowTable = self.scrollY + self.windowHeight < self.table.bottomY;
  641. if (scrollAmount > 0 && belowTable || scrollAmount < 0 && aboveTable) {
  642. window.scrollBy(0, scrollAmount);
  643. }
  644. }, this.scrollSettings.interval);
  645. },
  646. restripeTable: function restripeTable() {
  647. $(this.table).find('> tbody > tr.draggable, > tr.draggable').filter(':visible').filter(':odd').removeClass('odd').addClass('even').end().filter(':even').removeClass('even').addClass('odd');
  648. },
  649. onDrag: function onDrag() {
  650. return null;
  651. },
  652. onDrop: function onDrop() {
  653. return null;
  654. },
  655. row: function row(tableRow, method, indentEnabled, maxDepth, addClasses) {
  656. var $tableRow = $(tableRow);
  657. this.element = tableRow;
  658. this.method = method;
  659. this.group = [tableRow];
  660. this.groupDepth = $tableRow.find('.js-indentation').length;
  661. this.changed = false;
  662. this.table = $tableRow.closest('table')[0];
  663. this.indentEnabled = indentEnabled;
  664. this.maxDepth = maxDepth;
  665. this.direction = '';
  666. if (this.indentEnabled) {
  667. this.indents = $tableRow.find('.js-indentation').length;
  668. this.children = this.findChildren(addClasses);
  669. this.group = $.merge(this.group, this.children);
  670. for (var n = 0; n < this.group.length; n++) {
  671. this.groupDepth = Math.max($(this.group[n]).find('.js-indentation').length, this.groupDepth);
  672. }
  673. }
  674. }
  675. });
  676. $.extend(Drupal.tableDrag.prototype.row.prototype, {
  677. findChildren: function findChildren(addClasses) {
  678. var parentIndentation = this.indents;
  679. var currentRow = $(this.element, this.table).next('tr.draggable');
  680. var rows = [];
  681. var child = 0;
  682. function rowIndentation(indentNum, el) {
  683. var self = $(el);
  684. if (child === 1 && indentNum === parentIndentation) {
  685. self.addClass('tree-child-first');
  686. }
  687. if (indentNum === parentIndentation) {
  688. self.addClass('tree-child');
  689. } else if (indentNum > parentIndentation) {
  690. self.addClass('tree-child-horizontal');
  691. }
  692. }
  693. while (currentRow.length) {
  694. if (currentRow.find('.js-indentation').length > parentIndentation) {
  695. child += 1;
  696. rows.push(currentRow[0]);
  697. if (addClasses) {
  698. currentRow.find('.js-indentation').each(rowIndentation);
  699. }
  700. } else {
  701. break;
  702. }
  703. currentRow = currentRow.next('tr.draggable');
  704. }
  705. if (addClasses && rows.length) {
  706. $(rows[rows.length - 1]).find('.js-indentation:nth-child(' + (parentIndentation + 1) + ')').addClass('tree-child-last');
  707. }
  708. return rows;
  709. },
  710. isValidSwap: function isValidSwap(row) {
  711. var $row = $(row);
  712. if (this.indentEnabled) {
  713. var prevRow = void 0;
  714. var nextRow = void 0;
  715. if (this.direction === 'down') {
  716. prevRow = row;
  717. nextRow = $row.next('tr').get(0);
  718. } else {
  719. prevRow = $row.prev('tr').get(0);
  720. nextRow = row;
  721. }
  722. this.interval = this.validIndentInterval(prevRow, nextRow);
  723. if (this.interval.min > this.interval.max) {
  724. return false;
  725. }
  726. }
  727. if (this.table.tBodies[0].rows[0] === row && $row.is(':not(.draggable)')) {
  728. return false;
  729. }
  730. return true;
  731. },
  732. swap: function swap(position, row) {
  733. this.group.forEach(function (detachedRow) {
  734. Drupal.detachBehaviors(detachedRow, drupalSettings, 'move');
  735. });
  736. $(row)[position](this.group);
  737. this.group.forEach(function (attachedRow) {
  738. Drupal.attachBehaviors(attachedRow, drupalSettings);
  739. });
  740. this.changed = true;
  741. this.onSwap(row);
  742. },
  743. validIndentInterval: function validIndentInterval(prevRow, nextRow) {
  744. var $prevRow = $(prevRow);
  745. var maxIndent = void 0;
  746. var minIndent = nextRow ? $(nextRow).find('.js-indentation').length : 0;
  747. if (!prevRow || $prevRow.is(':not(.draggable)') || $(this.element).is('.tabledrag-root')) {
  748. maxIndent = 0;
  749. } else {
  750. maxIndent = $prevRow.find('.js-indentation').length + ($prevRow.is('.tabledrag-leaf') ? 0 : 1);
  751. if (this.maxDepth) {
  752. maxIndent = Math.min(maxIndent, this.maxDepth - (this.groupDepth - this.indents));
  753. }
  754. }
  755. return { min: minIndent, max: maxIndent };
  756. },
  757. indent: function indent(indentDiff) {
  758. var $group = $(this.group);
  759. if (!this.interval) {
  760. var prevRow = $(this.element).prev('tr').get(0);
  761. var nextRow = $group.eq(-1).next('tr').get(0);
  762. this.interval = this.validIndentInterval(prevRow, nextRow);
  763. }
  764. var indent = this.indents + indentDiff;
  765. indent = Math.max(indent, this.interval.min);
  766. indent = Math.min(indent, this.interval.max);
  767. indentDiff = indent - this.indents;
  768. for (var n = 1; n <= Math.abs(indentDiff); n++) {
  769. if (indentDiff < 0) {
  770. $group.find('.js-indentation:first-of-type').remove();
  771. this.indents -= 1;
  772. } else {
  773. $group.find('.js-tabledrag-cell-content').prepend(Drupal.theme('tableDragIndentation'));
  774. this.indents += 1;
  775. }
  776. }
  777. if (indentDiff) {
  778. this.changed = true;
  779. this.groupDepth += indentDiff;
  780. this.onIndent();
  781. }
  782. return indentDiff;
  783. },
  784. findSiblings: function findSiblings(rowSettings) {
  785. var siblings = [];
  786. var directions = ['prev', 'next'];
  787. var rowIndentation = this.indents;
  788. var checkRowIndentation = void 0;
  789. for (var d = 0; d < directions.length; d++) {
  790. var checkRow = $(this.element)[directions[d]]();
  791. while (checkRow.length) {
  792. if (checkRow.find('.' + rowSettings.target)) {
  793. if (this.indentEnabled) {
  794. checkRowIndentation = checkRow.find('.js-indentation').length;
  795. }
  796. if (!this.indentEnabled || checkRowIndentation === rowIndentation) {
  797. siblings.push(checkRow[0]);
  798. } else if (checkRowIndentation < rowIndentation) {
  799. break;
  800. }
  801. } else {
  802. break;
  803. }
  804. checkRow = checkRow[directions[d]]();
  805. }
  806. if (directions[d] === 'prev') {
  807. siblings.reverse();
  808. siblings.push(this.element);
  809. }
  810. }
  811. return siblings;
  812. },
  813. removeIndentClasses: function removeIndentClasses() {
  814. var _this5 = this;
  815. Object.keys(this.children || {}).forEach(function (n) {
  816. $(_this5.children[n]).find('.js-indentation').removeClass('tree-child').removeClass('tree-child-first').removeClass('tree-child-last').removeClass('tree-child-horizontal');
  817. });
  818. },
  819. markChanged: function markChanged() {
  820. var marker = $(Drupal.theme('tableDragChangedMarker')).addClass('js-tabledrag-changed-marker');
  821. var cell = $(this.element).find('td:first-of-type');
  822. if (cell.find('.js-tabledrag-changed-marker').length === 0) {
  823. cell.find('.js-tabledrag-handle').after(marker);
  824. }
  825. },
  826. onIndent: function onIndent() {
  827. return null;
  828. },
  829. onSwap: function onSwap(swappedRow) {
  830. return null;
  831. }
  832. });
  833. $.extend(Drupal.theme, {
  834. tableDragChangedMarker: function tableDragChangedMarker() {
  835. return '<abbr class="warning tabledrag-changed" title="' + Drupal.t('Changed') + '">*</abbr>';
  836. },
  837. tableDragIndentation: function tableDragIndentation() {
  838. return '<div class="js-indentation indentation"><svg xmlns="http://www.w3.org/2000/svg" class="tree" width="25" height="25" viewBox="0 0 25 25"><path class="tree__item tree__item-child-ltr tree__item-child-last-ltr tree__item-horizontal tree__item-horizontal-right" d="M12,12.5 H25" stroke="#888"/><path class="tree__item tree__item-child-rtl tree__item-child-last-rtl tree__item-horizontal tree__horizontal-left" d="M0,12.5 H13" stroke="#888"/><path class="tree__item tree__item-child-ltr tree__item-child-rtl tree__item-child-last-ltr tree__item-child-last-rtl tree__vertical tree__vertical-top" d="M12.5,12 v-99" stroke="#888"/><path class="tree__item tree__item-child-ltr tree__item-child-rtl tree__vertical tree__vertical-bottom" d="M12.5,12 v99" stroke="#888"/></svg></div>';
  839. },
  840. tableDragChangedWarning: function tableDragChangedWarning() {
  841. return '<div class="tabledrag-changed-warning messages messages--warning" role="alert">' + Drupal.theme('tableDragChangedMarker') + ' ' + Drupal.t('You have unsaved changes.') + '</div>';
  842. },
  843. tableDragHandle: function tableDragHandle() {
  844. return '<a href="#" class="tabledrag-handle"></a>';
  845. },
  846. tableDragCellItemsWrapper: function tableDragCellItemsWrapper() {
  847. return '<div class="tabledrag-cell-content"></div>';
  848. },
  849. tableDragCellContentWrapper: function tableDragCellContentWrapper() {
  850. return '<div class="tabledrag-cell-content__item"></div>';
  851. },
  852. tableDragToggle: function tableDragToggle(action, text) {
  853. var classes = ['action-link', 'action-link--extrasmall', 'tabledrag-toggle-weight'];
  854. switch (action) {
  855. case 'show':
  856. classes.push('action-link--icon-show');
  857. break;
  858. default:
  859. classes.push('action-link--icon-hide');
  860. break;
  861. }
  862. return '<a href="#" class="' + classes.join(' ') + '">' + text + '</a>';
  863. },
  864. tableDragToggleWrapper: function tableDragToggleWrapper() {
  865. return '<div class="tabledrag-toggle-weight-wrapper"></div>';
  866. }
  867. });
  868. })(jQuery, Drupal, drupalSettings);