sortable.esm.js 115 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784
  1. /**!
  2. * Sortable 1.15.0
  3. * @author RubaXa <trash@rubaxa.org>
  4. * @author owenm <owen23355@gmail.com>
  5. * @license MIT
  6. */
  7. function ownKeys(object, enumerableOnly) {
  8. var keys = Object.keys(object);
  9. if (Object.getOwnPropertySymbols) {
  10. var symbols = Object.getOwnPropertySymbols(object);
  11. if (enumerableOnly) {
  12. symbols = symbols.filter(function (sym) {
  13. return Object.getOwnPropertyDescriptor(object, sym).enumerable;
  14. });
  15. }
  16. keys.push.apply(keys, symbols);
  17. }
  18. return keys;
  19. }
  20. function _objectSpread2(target) {
  21. for (var i = 1; i < arguments.length; i++) {
  22. var source = arguments[i] != null ? arguments[i] : {};
  23. if (i % 2) {
  24. ownKeys(Object(source), true).forEach(function (key) {
  25. _defineProperty(target, key, source[key]);
  26. });
  27. } else if (Object.getOwnPropertyDescriptors) {
  28. Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
  29. } else {
  30. ownKeys(Object(source)).forEach(function (key) {
  31. Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
  32. });
  33. }
  34. }
  35. return target;
  36. }
  37. function _typeof(obj) {
  38. "@babel/helpers - typeof";
  39. if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
  40. _typeof = function (obj) {
  41. return typeof obj;
  42. };
  43. } else {
  44. _typeof = function (obj) {
  45. return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
  46. };
  47. }
  48. return _typeof(obj);
  49. }
  50. function _defineProperty(obj, key, value) {
  51. if (key in obj) {
  52. Object.defineProperty(obj, key, {
  53. value: value,
  54. enumerable: true,
  55. configurable: true,
  56. writable: true
  57. });
  58. } else {
  59. obj[key] = value;
  60. }
  61. return obj;
  62. }
  63. function _extends() {
  64. _extends = Object.assign || function (target) {
  65. for (var i = 1; i < arguments.length; i++) {
  66. var source = arguments[i];
  67. for (var key in source) {
  68. if (Object.prototype.hasOwnProperty.call(source, key)) {
  69. target[key] = source[key];
  70. }
  71. }
  72. }
  73. return target;
  74. };
  75. return _extends.apply(this, arguments);
  76. }
  77. function _objectWithoutPropertiesLoose(source, excluded) {
  78. if (source == null) return {};
  79. var target = {};
  80. var sourceKeys = Object.keys(source);
  81. var key, i;
  82. for (i = 0; i < sourceKeys.length; i++) {
  83. key = sourceKeys[i];
  84. if (excluded.indexOf(key) >= 0) continue;
  85. target[key] = source[key];
  86. }
  87. return target;
  88. }
  89. function _objectWithoutProperties(source, excluded) {
  90. if (source == null) return {};
  91. var target = _objectWithoutPropertiesLoose(source, excluded);
  92. var key, i;
  93. if (Object.getOwnPropertySymbols) {
  94. var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
  95. for (i = 0; i < sourceSymbolKeys.length; i++) {
  96. key = sourceSymbolKeys[i];
  97. if (excluded.indexOf(key) >= 0) continue;
  98. if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
  99. target[key] = source[key];
  100. }
  101. }
  102. return target;
  103. }
  104. function _toConsumableArray(arr) {
  105. return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
  106. }
  107. function _arrayWithoutHoles(arr) {
  108. if (Array.isArray(arr)) return _arrayLikeToArray(arr);
  109. }
  110. function _iterableToArray(iter) {
  111. if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
  112. }
  113. function _unsupportedIterableToArray(o, minLen) {
  114. if (!o) return;
  115. if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  116. var n = Object.prototype.toString.call(o).slice(8, -1);
  117. if (n === "Object" && o.constructor) n = o.constructor.name;
  118. if (n === "Map" || n === "Set") return Array.from(o);
  119. if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
  120. }
  121. function _arrayLikeToArray(arr, len) {
  122. if (len == null || len > arr.length) len = arr.length;
  123. for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
  124. return arr2;
  125. }
  126. function _nonIterableSpread() {
  127. throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
  128. }
  129. var version = "1.15.0";
  130. function userAgent(pattern) {
  131. if (typeof window !== 'undefined' && window.navigator) {
  132. return !! /*@__PURE__*/navigator.userAgent.match(pattern);
  133. }
  134. }
  135. var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
  136. var Edge = userAgent(/Edge/i);
  137. var FireFox = userAgent(/firefox/i);
  138. var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
  139. var IOS = userAgent(/iP(ad|od|hone)/i);
  140. var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);
  141. var captureMode = {
  142. capture: false,
  143. passive: false
  144. };
  145. function on(el, event, fn) {
  146. el.addEventListener(event, fn, !IE11OrLess && captureMode);
  147. }
  148. function off(el, event, fn) {
  149. el.removeEventListener(event, fn, !IE11OrLess && captureMode);
  150. }
  151. function matches(
  152. /**HTMLElement*/
  153. el,
  154. /**String*/
  155. selector) {
  156. if (!selector) return;
  157. selector[0] === '>' && (selector = selector.substring(1));
  158. if (el) {
  159. try {
  160. if (el.matches) {
  161. return el.matches(selector);
  162. } else if (el.msMatchesSelector) {
  163. return el.msMatchesSelector(selector);
  164. } else if (el.webkitMatchesSelector) {
  165. return el.webkitMatchesSelector(selector);
  166. }
  167. } catch (_) {
  168. return false;
  169. }
  170. }
  171. return false;
  172. }
  173. function getParentOrHost(el) {
  174. return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode;
  175. }
  176. function closest(
  177. /**HTMLElement*/
  178. el,
  179. /**String*/
  180. selector,
  181. /**HTMLElement*/
  182. ctx, includeCTX) {
  183. if (el) {
  184. ctx = ctx || document;
  185. do {
  186. if (selector != null && (selector[0] === '>' ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
  187. return el;
  188. }
  189. if (el === ctx) break;
  190. /* jshint boss:true */
  191. } while (el = getParentOrHost(el));
  192. }
  193. return null;
  194. }
  195. var R_SPACE = /\s+/g;
  196. function toggleClass(el, name, state) {
  197. if (el && name) {
  198. if (el.classList) {
  199. el.classList[state ? 'add' : 'remove'](name);
  200. } else {
  201. var className = (' ' + el.className + ' ').replace(R_SPACE, ' ').replace(' ' + name + ' ', ' ');
  202. el.className = (className + (state ? ' ' + name : '')).replace(R_SPACE, ' ');
  203. }
  204. }
  205. }
  206. function css(el, prop, val) {
  207. var style = el && el.style;
  208. if (style) {
  209. if (val === void 0) {
  210. if (document.defaultView && document.defaultView.getComputedStyle) {
  211. val = document.defaultView.getComputedStyle(el, '');
  212. } else if (el.currentStyle) {
  213. val = el.currentStyle;
  214. }
  215. return prop === void 0 ? val : val[prop];
  216. } else {
  217. if (!(prop in style) && prop.indexOf('webkit') === -1) {
  218. prop = '-webkit-' + prop;
  219. }
  220. style[prop] = val + (typeof val === 'string' ? '' : 'px');
  221. }
  222. }
  223. }
  224. function matrix(el, selfOnly) {
  225. var appliedTransforms = '';
  226. if (typeof el === 'string') {
  227. appliedTransforms = el;
  228. } else {
  229. do {
  230. var transform = css(el, 'transform');
  231. if (transform && transform !== 'none') {
  232. appliedTransforms = transform + ' ' + appliedTransforms;
  233. }
  234. /* jshint boss:true */
  235. } while (!selfOnly && (el = el.parentNode));
  236. }
  237. var matrixFn = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix;
  238. /*jshint -W056 */
  239. return matrixFn && new matrixFn(appliedTransforms);
  240. }
  241. function find(ctx, tagName, iterator) {
  242. if (ctx) {
  243. var list = ctx.getElementsByTagName(tagName),
  244. i = 0,
  245. n = list.length;
  246. if (iterator) {
  247. for (; i < n; i++) {
  248. iterator(list[i], i);
  249. }
  250. }
  251. return list;
  252. }
  253. return [];
  254. }
  255. function getWindowScrollingElement() {
  256. var scrollingElement = document.scrollingElement;
  257. if (scrollingElement) {
  258. return scrollingElement;
  259. } else {
  260. return document.documentElement;
  261. }
  262. }
  263. /**
  264. * Returns the "bounding client rect" of given element
  265. * @param {HTMLElement} el The element whose boundingClientRect is wanted
  266. * @param {[Boolean]} relativeToContainingBlock Whether the rect should be relative to the containing block of (including) the container
  267. * @param {[Boolean]} relativeToNonStaticParent Whether the rect should be relative to the relative parent of (including) the contaienr
  268. * @param {[Boolean]} undoScale Whether the container's scale() should be undone
  269. * @param {[HTMLElement]} container The parent the element will be placed in
  270. * @return {Object} The boundingClientRect of el, with specified adjustments
  271. */
  272. function getRect(el, relativeToContainingBlock, relativeToNonStaticParent, undoScale, container) {
  273. if (!el.getBoundingClientRect && el !== window) return;
  274. var elRect, top, left, bottom, right, height, width;
  275. if (el !== window && el.parentNode && el !== getWindowScrollingElement()) {
  276. elRect = el.getBoundingClientRect();
  277. top = elRect.top;
  278. left = elRect.left;
  279. bottom = elRect.bottom;
  280. right = elRect.right;
  281. height = elRect.height;
  282. width = elRect.width;
  283. } else {
  284. top = 0;
  285. left = 0;
  286. bottom = window.innerHeight;
  287. right = window.innerWidth;
  288. height = window.innerHeight;
  289. width = window.innerWidth;
  290. }
  291. if ((relativeToContainingBlock || relativeToNonStaticParent) && el !== window) {
  292. // Adjust for translate()
  293. container = container || el.parentNode; // solves #1123 (see: https://stackoverflow.com/a/37953806/6088312)
  294. // Not needed on <= IE11
  295. if (!IE11OrLess) {
  296. do {
  297. if (container && container.getBoundingClientRect && (css(container, 'transform') !== 'none' || relativeToNonStaticParent && css(container, 'position') !== 'static')) {
  298. var containerRect = container.getBoundingClientRect(); // Set relative to edges of padding box of container
  299. top -= containerRect.top + parseInt(css(container, 'border-top-width'));
  300. left -= containerRect.left + parseInt(css(container, 'border-left-width'));
  301. bottom = top + elRect.height;
  302. right = left + elRect.width;
  303. break;
  304. }
  305. /* jshint boss:true */
  306. } while (container = container.parentNode);
  307. }
  308. }
  309. if (undoScale && el !== window) {
  310. // Adjust for scale()
  311. var elMatrix = matrix(container || el),
  312. scaleX = elMatrix && elMatrix.a,
  313. scaleY = elMatrix && elMatrix.d;
  314. if (elMatrix) {
  315. top /= scaleY;
  316. left /= scaleX;
  317. width /= scaleX;
  318. height /= scaleY;
  319. bottom = top + height;
  320. right = left + width;
  321. }
  322. }
  323. return {
  324. top: top,
  325. left: left,
  326. bottom: bottom,
  327. right: right,
  328. width: width,
  329. height: height
  330. };
  331. }
  332. /**
  333. * Checks if a side of an element is scrolled past a side of its parents
  334. * @param {HTMLElement} el The element who's side being scrolled out of view is in question
  335. * @param {String} elSide Side of the element in question ('top', 'left', 'right', 'bottom')
  336. * @param {String} parentSide Side of the parent in question ('top', 'left', 'right', 'bottom')
  337. * @return {HTMLElement} The parent scroll element that the el's side is scrolled past, or null if there is no such element
  338. */
  339. function isScrolledPast(el, elSide, parentSide) {
  340. var parent = getParentAutoScrollElement(el, true),
  341. elSideVal = getRect(el)[elSide];
  342. /* jshint boss:true */
  343. while (parent) {
  344. var parentSideVal = getRect(parent)[parentSide],
  345. visible = void 0;
  346. if (parentSide === 'top' || parentSide === 'left') {
  347. visible = elSideVal >= parentSideVal;
  348. } else {
  349. visible = elSideVal <= parentSideVal;
  350. }
  351. if (!visible) return parent;
  352. if (parent === getWindowScrollingElement()) break;
  353. parent = getParentAutoScrollElement(parent, false);
  354. }
  355. return false;
  356. }
  357. /**
  358. * Gets nth child of el, ignoring hidden children, sortable's elements (does not ignore clone if it's visible)
  359. * and non-draggable elements
  360. * @param {HTMLElement} el The parent element
  361. * @param {Number} childNum The index of the child
  362. * @param {Object} options Parent Sortable's options
  363. * @return {HTMLElement} The child at index childNum, or null if not found
  364. */
  365. function getChild(el, childNum, options, includeDragEl) {
  366. var currentChild = 0,
  367. i = 0,
  368. children = el.children;
  369. while (i < children.length) {
  370. if (children[i].style.display !== 'none' && children[i] !== Sortable.ghost && (includeDragEl || children[i] !== Sortable.dragged) && closest(children[i], options.draggable, el, false)) {
  371. if (currentChild === childNum) {
  372. return children[i];
  373. }
  374. currentChild++;
  375. }
  376. i++;
  377. }
  378. return null;
  379. }
  380. /**
  381. * Gets the last child in the el, ignoring ghostEl or invisible elements (clones)
  382. * @param {HTMLElement} el Parent element
  383. * @param {selector} selector Any other elements that should be ignored
  384. * @return {HTMLElement} The last child, ignoring ghostEl
  385. */
  386. function lastChild(el, selector) {
  387. var last = el.lastElementChild;
  388. while (last && (last === Sortable.ghost || css(last, 'display') === 'none' || selector && !matches(last, selector))) {
  389. last = last.previousElementSibling;
  390. }
  391. return last || null;
  392. }
  393. /**
  394. * Returns the index of an element within its parent for a selected set of
  395. * elements
  396. * @param {HTMLElement} el
  397. * @param {selector} selector
  398. * @return {number}
  399. */
  400. function index(el, selector) {
  401. var index = 0;
  402. if (!el || !el.parentNode) {
  403. return -1;
  404. }
  405. /* jshint boss:true */
  406. while (el = el.previousElementSibling) {
  407. if (el.nodeName.toUpperCase() !== 'TEMPLATE' && el !== Sortable.clone && (!selector || matches(el, selector))) {
  408. index++;
  409. }
  410. }
  411. return index;
  412. }
  413. /**
  414. * Returns the scroll offset of the given element, added with all the scroll offsets of parent elements.
  415. * The value is returned in real pixels.
  416. * @param {HTMLElement} el
  417. * @return {Array} Offsets in the format of [left, top]
  418. */
  419. function getRelativeScrollOffset(el) {
  420. var offsetLeft = 0,
  421. offsetTop = 0,
  422. winScroller = getWindowScrollingElement();
  423. if (el) {
  424. do {
  425. var elMatrix = matrix(el),
  426. scaleX = elMatrix.a,
  427. scaleY = elMatrix.d;
  428. offsetLeft += el.scrollLeft * scaleX;
  429. offsetTop += el.scrollTop * scaleY;
  430. } while (el !== winScroller && (el = el.parentNode));
  431. }
  432. return [offsetLeft, offsetTop];
  433. }
  434. /**
  435. * Returns the index of the object within the given array
  436. * @param {Array} arr Array that may or may not hold the object
  437. * @param {Object} obj An object that has a key-value pair unique to and identical to a key-value pair in the object you want to find
  438. * @return {Number} The index of the object in the array, or -1
  439. */
  440. function indexOfObject(arr, obj) {
  441. for (var i in arr) {
  442. if (!arr.hasOwnProperty(i)) continue;
  443. for (var key in obj) {
  444. if (obj.hasOwnProperty(key) && obj[key] === arr[i][key]) return Number(i);
  445. }
  446. }
  447. return -1;
  448. }
  449. function getParentAutoScrollElement(el, includeSelf) {
  450. // skip to window
  451. if (!el || !el.getBoundingClientRect) return getWindowScrollingElement();
  452. var elem = el;
  453. var gotSelf = false;
  454. do {
  455. // we don't need to get elem css if it isn't even overflowing in the first place (performance)
  456. if (elem.clientWidth < elem.scrollWidth || elem.clientHeight < elem.scrollHeight) {
  457. var elemCSS = css(elem);
  458. if (elem.clientWidth < elem.scrollWidth && (elemCSS.overflowX == 'auto' || elemCSS.overflowX == 'scroll') || elem.clientHeight < elem.scrollHeight && (elemCSS.overflowY == 'auto' || elemCSS.overflowY == 'scroll')) {
  459. if (!elem.getBoundingClientRect || elem === document.body) return getWindowScrollingElement();
  460. if (gotSelf || includeSelf) return elem;
  461. gotSelf = true;
  462. }
  463. }
  464. /* jshint boss:true */
  465. } while (elem = elem.parentNode);
  466. return getWindowScrollingElement();
  467. }
  468. function extend(dst, src) {
  469. if (dst && src) {
  470. for (var key in src) {
  471. if (src.hasOwnProperty(key)) {
  472. dst[key] = src[key];
  473. }
  474. }
  475. }
  476. return dst;
  477. }
  478. function isRectEqual(rect1, rect2) {
  479. return Math.round(rect1.top) === Math.round(rect2.top) && Math.round(rect1.left) === Math.round(rect2.left) && Math.round(rect1.height) === Math.round(rect2.height) && Math.round(rect1.width) === Math.round(rect2.width);
  480. }
  481. var _throttleTimeout;
  482. function throttle(callback, ms) {
  483. return function () {
  484. if (!_throttleTimeout) {
  485. var args = arguments,
  486. _this = this;
  487. if (args.length === 1) {
  488. callback.call(_this, args[0]);
  489. } else {
  490. callback.apply(_this, args);
  491. }
  492. _throttleTimeout = setTimeout(function () {
  493. _throttleTimeout = void 0;
  494. }, ms);
  495. }
  496. };
  497. }
  498. function cancelThrottle() {
  499. clearTimeout(_throttleTimeout);
  500. _throttleTimeout = void 0;
  501. }
  502. function scrollBy(el, x, y) {
  503. el.scrollLeft += x;
  504. el.scrollTop += y;
  505. }
  506. function clone(el) {
  507. var Polymer = window.Polymer;
  508. var $ = window.jQuery || window.Zepto;
  509. if (Polymer && Polymer.dom) {
  510. return Polymer.dom(el).cloneNode(true);
  511. } else if ($) {
  512. return $(el).clone(true)[0];
  513. } else {
  514. return el.cloneNode(true);
  515. }
  516. }
  517. function setRect(el, rect) {
  518. css(el, 'position', 'absolute');
  519. css(el, 'top', rect.top);
  520. css(el, 'left', rect.left);
  521. css(el, 'width', rect.width);
  522. css(el, 'height', rect.height);
  523. }
  524. function unsetRect(el) {
  525. css(el, 'position', '');
  526. css(el, 'top', '');
  527. css(el, 'left', '');
  528. css(el, 'width', '');
  529. css(el, 'height', '');
  530. }
  531. var expando = 'Sortable' + new Date().getTime();
  532. function AnimationStateManager() {
  533. var animationStates = [],
  534. animationCallbackId;
  535. return {
  536. captureAnimationState: function captureAnimationState() {
  537. animationStates = [];
  538. if (!this.options.animation) return;
  539. var children = [].slice.call(this.el.children);
  540. children.forEach(function (child) {
  541. if (css(child, 'display') === 'none' || child === Sortable.ghost) return;
  542. animationStates.push({
  543. target: child,
  544. rect: getRect(child)
  545. });
  546. var fromRect = _objectSpread2({}, animationStates[animationStates.length - 1].rect); // If animating: compensate for current animation
  547. if (child.thisAnimationDuration) {
  548. var childMatrix = matrix(child, true);
  549. if (childMatrix) {
  550. fromRect.top -= childMatrix.f;
  551. fromRect.left -= childMatrix.e;
  552. }
  553. }
  554. child.fromRect = fromRect;
  555. });
  556. },
  557. addAnimationState: function addAnimationState(state) {
  558. animationStates.push(state);
  559. },
  560. removeAnimationState: function removeAnimationState(target) {
  561. animationStates.splice(indexOfObject(animationStates, {
  562. target: target
  563. }), 1);
  564. },
  565. animateAll: function animateAll(callback) {
  566. var _this = this;
  567. if (!this.options.animation) {
  568. clearTimeout(animationCallbackId);
  569. if (typeof callback === 'function') callback();
  570. return;
  571. }
  572. var animating = false,
  573. animationTime = 0;
  574. animationStates.forEach(function (state) {
  575. var time = 0,
  576. target = state.target,
  577. fromRect = target.fromRect,
  578. toRect = getRect(target),
  579. prevFromRect = target.prevFromRect,
  580. prevToRect = target.prevToRect,
  581. animatingRect = state.rect,
  582. targetMatrix = matrix(target, true);
  583. if (targetMatrix) {
  584. // Compensate for current animation
  585. toRect.top -= targetMatrix.f;
  586. toRect.left -= targetMatrix.e;
  587. }
  588. target.toRect = toRect;
  589. if (target.thisAnimationDuration) {
  590. // Could also check if animatingRect is between fromRect and toRect
  591. if (isRectEqual(prevFromRect, toRect) && !isRectEqual(fromRect, toRect) && // Make sure animatingRect is on line between toRect & fromRect
  592. (animatingRect.top - toRect.top) / (animatingRect.left - toRect.left) === (fromRect.top - toRect.top) / (fromRect.left - toRect.left)) {
  593. // If returning to same place as started from animation and on same axis
  594. time = calculateRealTime(animatingRect, prevFromRect, prevToRect, _this.options);
  595. }
  596. } // if fromRect != toRect: animate
  597. if (!isRectEqual(toRect, fromRect)) {
  598. target.prevFromRect = fromRect;
  599. target.prevToRect = toRect;
  600. if (!time) {
  601. time = _this.options.animation;
  602. }
  603. _this.animate(target, animatingRect, toRect, time);
  604. }
  605. if (time) {
  606. animating = true;
  607. animationTime = Math.max(animationTime, time);
  608. clearTimeout(target.animationResetTimer);
  609. target.animationResetTimer = setTimeout(function () {
  610. target.animationTime = 0;
  611. target.prevFromRect = null;
  612. target.fromRect = null;
  613. target.prevToRect = null;
  614. target.thisAnimationDuration = null;
  615. }, time);
  616. target.thisAnimationDuration = time;
  617. }
  618. });
  619. clearTimeout(animationCallbackId);
  620. if (!animating) {
  621. if (typeof callback === 'function') callback();
  622. } else {
  623. animationCallbackId = setTimeout(function () {
  624. if (typeof callback === 'function') callback();
  625. }, animationTime);
  626. }
  627. animationStates = [];
  628. },
  629. animate: function animate(target, currentRect, toRect, duration) {
  630. if (duration) {
  631. css(target, 'transition', '');
  632. css(target, 'transform', '');
  633. var elMatrix = matrix(this.el),
  634. scaleX = elMatrix && elMatrix.a,
  635. scaleY = elMatrix && elMatrix.d,
  636. translateX = (currentRect.left - toRect.left) / (scaleX || 1),
  637. translateY = (currentRect.top - toRect.top) / (scaleY || 1);
  638. target.animatingX = !!translateX;
  639. target.animatingY = !!translateY;
  640. css(target, 'transform', 'translate3d(' + translateX + 'px,' + translateY + 'px,0)');
  641. this.forRepaintDummy = repaint(target); // repaint
  642. css(target, 'transition', 'transform ' + duration + 'ms' + (this.options.easing ? ' ' + this.options.easing : ''));
  643. css(target, 'transform', 'translate3d(0,0,0)');
  644. typeof target.animated === 'number' && clearTimeout(target.animated);
  645. target.animated = setTimeout(function () {
  646. css(target, 'transition', '');
  647. css(target, 'transform', '');
  648. target.animated = false;
  649. target.animatingX = false;
  650. target.animatingY = false;
  651. }, duration);
  652. }
  653. }
  654. };
  655. }
  656. function repaint(target) {
  657. return target.offsetWidth;
  658. }
  659. function calculateRealTime(animatingRect, fromRect, toRect, options) {
  660. return Math.sqrt(Math.pow(fromRect.top - animatingRect.top, 2) + Math.pow(fromRect.left - animatingRect.left, 2)) / Math.sqrt(Math.pow(fromRect.top - toRect.top, 2) + Math.pow(fromRect.left - toRect.left, 2)) * options.animation;
  661. }
  662. var plugins = [];
  663. var defaults = {
  664. initializeByDefault: true
  665. };
  666. var PluginManager = {
  667. mount: function mount(plugin) {
  668. // Set default static properties
  669. for (var option in defaults) {
  670. if (defaults.hasOwnProperty(option) && !(option in plugin)) {
  671. plugin[option] = defaults[option];
  672. }
  673. }
  674. plugins.forEach(function (p) {
  675. if (p.pluginName === plugin.pluginName) {
  676. throw "Sortable: Cannot mount plugin ".concat(plugin.pluginName, " more than once");
  677. }
  678. });
  679. plugins.push(plugin);
  680. },
  681. pluginEvent: function pluginEvent(eventName, sortable, evt) {
  682. var _this = this;
  683. this.eventCanceled = false;
  684. evt.cancel = function () {
  685. _this.eventCanceled = true;
  686. };
  687. var eventNameGlobal = eventName + 'Global';
  688. plugins.forEach(function (plugin) {
  689. if (!sortable[plugin.pluginName]) return; // Fire global events if it exists in this sortable
  690. if (sortable[plugin.pluginName][eventNameGlobal]) {
  691. sortable[plugin.pluginName][eventNameGlobal](_objectSpread2({
  692. sortable: sortable
  693. }, evt));
  694. } // Only fire plugin event if plugin is enabled in this sortable,
  695. // and plugin has event defined
  696. if (sortable.options[plugin.pluginName] && sortable[plugin.pluginName][eventName]) {
  697. sortable[plugin.pluginName][eventName](_objectSpread2({
  698. sortable: sortable
  699. }, evt));
  700. }
  701. });
  702. },
  703. initializePlugins: function initializePlugins(sortable, el, defaults, options) {
  704. plugins.forEach(function (plugin) {
  705. var pluginName = plugin.pluginName;
  706. if (!sortable.options[pluginName] && !plugin.initializeByDefault) return;
  707. var initialized = new plugin(sortable, el, sortable.options);
  708. initialized.sortable = sortable;
  709. initialized.options = sortable.options;
  710. sortable[pluginName] = initialized; // Add default options from plugin
  711. _extends(defaults, initialized.defaults);
  712. });
  713. for (var option in sortable.options) {
  714. if (!sortable.options.hasOwnProperty(option)) continue;
  715. var modified = this.modifyOption(sortable, option, sortable.options[option]);
  716. if (typeof modified !== 'undefined') {
  717. sortable.options[option] = modified;
  718. }
  719. }
  720. },
  721. getEventProperties: function getEventProperties(name, sortable) {
  722. var eventProperties = {};
  723. plugins.forEach(function (plugin) {
  724. if (typeof plugin.eventProperties !== 'function') return;
  725. _extends(eventProperties, plugin.eventProperties.call(sortable[plugin.pluginName], name));
  726. });
  727. return eventProperties;
  728. },
  729. modifyOption: function modifyOption(sortable, name, value) {
  730. var modifiedValue;
  731. plugins.forEach(function (plugin) {
  732. // Plugin must exist on the Sortable
  733. if (!sortable[plugin.pluginName]) return; // If static option listener exists for this option, call in the context of the Sortable's instance of this plugin
  734. if (plugin.optionListeners && typeof plugin.optionListeners[name] === 'function') {
  735. modifiedValue = plugin.optionListeners[name].call(sortable[plugin.pluginName], value);
  736. }
  737. });
  738. return modifiedValue;
  739. }
  740. };
  741. function dispatchEvent(_ref) {
  742. var sortable = _ref.sortable,
  743. rootEl = _ref.rootEl,
  744. name = _ref.name,
  745. targetEl = _ref.targetEl,
  746. cloneEl = _ref.cloneEl,
  747. toEl = _ref.toEl,
  748. fromEl = _ref.fromEl,
  749. oldIndex = _ref.oldIndex,
  750. newIndex = _ref.newIndex,
  751. oldDraggableIndex = _ref.oldDraggableIndex,
  752. newDraggableIndex = _ref.newDraggableIndex,
  753. originalEvent = _ref.originalEvent,
  754. putSortable = _ref.putSortable,
  755. extraEventProperties = _ref.extraEventProperties;
  756. sortable = sortable || rootEl && rootEl[expando];
  757. if (!sortable) return;
  758. var evt,
  759. options = sortable.options,
  760. onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1); // Support for new CustomEvent feature
  761. if (window.CustomEvent && !IE11OrLess && !Edge) {
  762. evt = new CustomEvent(name, {
  763. bubbles: true,
  764. cancelable: true
  765. });
  766. } else {
  767. evt = document.createEvent('Event');
  768. evt.initEvent(name, true, true);
  769. }
  770. evt.to = toEl || rootEl;
  771. evt.from = fromEl || rootEl;
  772. evt.item = targetEl || rootEl;
  773. evt.clone = cloneEl;
  774. evt.oldIndex = oldIndex;
  775. evt.newIndex = newIndex;
  776. evt.oldDraggableIndex = oldDraggableIndex;
  777. evt.newDraggableIndex = newDraggableIndex;
  778. evt.originalEvent = originalEvent;
  779. evt.pullMode = putSortable ? putSortable.lastPutMode : undefined;
  780. var allEventProperties = _objectSpread2(_objectSpread2({}, extraEventProperties), PluginManager.getEventProperties(name, sortable));
  781. for (var option in allEventProperties) {
  782. evt[option] = allEventProperties[option];
  783. }
  784. if (rootEl) {
  785. rootEl.dispatchEvent(evt);
  786. }
  787. if (options[onName]) {
  788. options[onName].call(sortable, evt);
  789. }
  790. }
  791. var _excluded = ["evt"];
  792. var pluginEvent = function pluginEvent(eventName, sortable) {
  793. var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
  794. originalEvent = _ref.evt,
  795. data = _objectWithoutProperties(_ref, _excluded);
  796. PluginManager.pluginEvent.bind(Sortable)(eventName, sortable, _objectSpread2({
  797. dragEl: dragEl,
  798. parentEl: parentEl,
  799. ghostEl: ghostEl,
  800. rootEl: rootEl,
  801. nextEl: nextEl,
  802. lastDownEl: lastDownEl,
  803. cloneEl: cloneEl,
  804. cloneHidden: cloneHidden,
  805. dragStarted: moved,
  806. putSortable: putSortable,
  807. activeSortable: Sortable.active,
  808. originalEvent: originalEvent,
  809. oldIndex: oldIndex,
  810. oldDraggableIndex: oldDraggableIndex,
  811. newIndex: newIndex,
  812. newDraggableIndex: newDraggableIndex,
  813. hideGhostForTarget: _hideGhostForTarget,
  814. unhideGhostForTarget: _unhideGhostForTarget,
  815. cloneNowHidden: function cloneNowHidden() {
  816. cloneHidden = true;
  817. },
  818. cloneNowShown: function cloneNowShown() {
  819. cloneHidden = false;
  820. },
  821. dispatchSortableEvent: function dispatchSortableEvent(name) {
  822. _dispatchEvent({
  823. sortable: sortable,
  824. name: name,
  825. originalEvent: originalEvent
  826. });
  827. }
  828. }, data));
  829. };
  830. function _dispatchEvent(info) {
  831. dispatchEvent(_objectSpread2({
  832. putSortable: putSortable,
  833. cloneEl: cloneEl,
  834. targetEl: dragEl,
  835. rootEl: rootEl,
  836. oldIndex: oldIndex,
  837. oldDraggableIndex: oldDraggableIndex,
  838. newIndex: newIndex,
  839. newDraggableIndex: newDraggableIndex
  840. }, info));
  841. }
  842. var dragEl,
  843. parentEl,
  844. ghostEl,
  845. rootEl,
  846. nextEl,
  847. lastDownEl,
  848. cloneEl,
  849. cloneHidden,
  850. oldIndex,
  851. newIndex,
  852. oldDraggableIndex,
  853. newDraggableIndex,
  854. activeGroup,
  855. putSortable,
  856. awaitingDragStarted = false,
  857. ignoreNextClick = false,
  858. sortables = [],
  859. tapEvt,
  860. touchEvt,
  861. lastDx,
  862. lastDy,
  863. tapDistanceLeft,
  864. tapDistanceTop,
  865. moved,
  866. lastTarget,
  867. lastDirection,
  868. pastFirstInvertThresh = false,
  869. isCircumstantialInvert = false,
  870. targetMoveDistance,
  871. // For positioning ghost absolutely
  872. ghostRelativeParent,
  873. ghostRelativeParentInitialScroll = [],
  874. // (left, top)
  875. _silent = false,
  876. savedInputChecked = [];
  877. /** @const */
  878. var documentExists = typeof document !== 'undefined',
  879. PositionGhostAbsolutely = IOS,
  880. CSSFloatProperty = Edge || IE11OrLess ? 'cssFloat' : 'float',
  881. // This will not pass for IE9, because IE9 DnD only works on anchors
  882. supportDraggable = documentExists && !ChromeForAndroid && !IOS && 'draggable' in document.createElement('div'),
  883. supportCssPointerEvents = function () {
  884. if (!documentExists) return; // false when <= IE11
  885. if (IE11OrLess) {
  886. return false;
  887. }
  888. var el = document.createElement('x');
  889. el.style.cssText = 'pointer-events:auto';
  890. return el.style.pointerEvents === 'auto';
  891. }(),
  892. _detectDirection = function _detectDirection(el, options) {
  893. var elCSS = css(el),
  894. elWidth = parseInt(elCSS.width) - parseInt(elCSS.paddingLeft) - parseInt(elCSS.paddingRight) - parseInt(elCSS.borderLeftWidth) - parseInt(elCSS.borderRightWidth),
  895. child1 = getChild(el, 0, options),
  896. child2 = getChild(el, 1, options),
  897. firstChildCSS = child1 && css(child1),
  898. secondChildCSS = child2 && css(child2),
  899. firstChildWidth = firstChildCSS && parseInt(firstChildCSS.marginLeft) + parseInt(firstChildCSS.marginRight) + getRect(child1).width,
  900. secondChildWidth = secondChildCSS && parseInt(secondChildCSS.marginLeft) + parseInt(secondChildCSS.marginRight) + getRect(child2).width;
  901. if (elCSS.display === 'flex') {
  902. return elCSS.flexDirection === 'column' || elCSS.flexDirection === 'column-reverse' ? 'vertical' : 'horizontal';
  903. }
  904. if (elCSS.display === 'grid') {
  905. return elCSS.gridTemplateColumns.split(' ').length <= 1 ? 'vertical' : 'horizontal';
  906. }
  907. if (child1 && firstChildCSS["float"] && firstChildCSS["float"] !== 'none') {
  908. var touchingSideChild2 = firstChildCSS["float"] === 'left' ? 'left' : 'right';
  909. return child2 && (secondChildCSS.clear === 'both' || secondChildCSS.clear === touchingSideChild2) ? 'vertical' : 'horizontal';
  910. }
  911. return child1 && (firstChildCSS.display === 'block' || firstChildCSS.display === 'flex' || firstChildCSS.display === 'table' || firstChildCSS.display === 'grid' || firstChildWidth >= elWidth && elCSS[CSSFloatProperty] === 'none' || child2 && elCSS[CSSFloatProperty] === 'none' && firstChildWidth + secondChildWidth > elWidth) ? 'vertical' : 'horizontal';
  912. },
  913. _dragElInRowColumn = function _dragElInRowColumn(dragRect, targetRect, vertical) {
  914. var dragElS1Opp = vertical ? dragRect.left : dragRect.top,
  915. dragElS2Opp = vertical ? dragRect.right : dragRect.bottom,
  916. dragElOppLength = vertical ? dragRect.width : dragRect.height,
  917. targetS1Opp = vertical ? targetRect.left : targetRect.top,
  918. targetS2Opp = vertical ? targetRect.right : targetRect.bottom,
  919. targetOppLength = vertical ? targetRect.width : targetRect.height;
  920. return dragElS1Opp === targetS1Opp || dragElS2Opp === targetS2Opp || dragElS1Opp + dragElOppLength / 2 === targetS1Opp + targetOppLength / 2;
  921. },
  922. /**
  923. * Detects first nearest empty sortable to X and Y position using emptyInsertThreshold.
  924. * @param {Number} x X position
  925. * @param {Number} y Y position
  926. * @return {HTMLElement} Element of the first found nearest Sortable
  927. */
  928. _detectNearestEmptySortable = function _detectNearestEmptySortable(x, y) {
  929. var ret;
  930. sortables.some(function (sortable) {
  931. var threshold = sortable[expando].options.emptyInsertThreshold;
  932. if (!threshold || lastChild(sortable)) return;
  933. var rect = getRect(sortable),
  934. insideHorizontally = x >= rect.left - threshold && x <= rect.right + threshold,
  935. insideVertically = y >= rect.top - threshold && y <= rect.bottom + threshold;
  936. if (insideHorizontally && insideVertically) {
  937. return ret = sortable;
  938. }
  939. });
  940. return ret;
  941. },
  942. _prepareGroup = function _prepareGroup(options) {
  943. function toFn(value, pull) {
  944. return function (to, from, dragEl, evt) {
  945. var sameGroup = to.options.group.name && from.options.group.name && to.options.group.name === from.options.group.name;
  946. if (value == null && (pull || sameGroup)) {
  947. // Default pull value
  948. // Default pull and put value if same group
  949. return true;
  950. } else if (value == null || value === false) {
  951. return false;
  952. } else if (pull && value === 'clone') {
  953. return value;
  954. } else if (typeof value === 'function') {
  955. return toFn(value(to, from, dragEl, evt), pull)(to, from, dragEl, evt);
  956. } else {
  957. var otherGroup = (pull ? to : from).options.group.name;
  958. return value === true || typeof value === 'string' && value === otherGroup || value.join && value.indexOf(otherGroup) > -1;
  959. }
  960. };
  961. }
  962. var group = {};
  963. var originalGroup = options.group;
  964. if (!originalGroup || _typeof(originalGroup) != 'object') {
  965. originalGroup = {
  966. name: originalGroup
  967. };
  968. }
  969. group.name = originalGroup.name;
  970. group.checkPull = toFn(originalGroup.pull, true);
  971. group.checkPut = toFn(originalGroup.put);
  972. group.revertClone = originalGroup.revertClone;
  973. options.group = group;
  974. },
  975. _hideGhostForTarget = function _hideGhostForTarget() {
  976. if (!supportCssPointerEvents && ghostEl) {
  977. css(ghostEl, 'display', 'none');
  978. }
  979. },
  980. _unhideGhostForTarget = function _unhideGhostForTarget() {
  981. if (!supportCssPointerEvents && ghostEl) {
  982. css(ghostEl, 'display', '');
  983. }
  984. }; // #1184 fix - Prevent click event on fallback if dragged but item not changed position
  985. if (documentExists && !ChromeForAndroid) {
  986. document.addEventListener('click', function (evt) {
  987. if (ignoreNextClick) {
  988. evt.preventDefault();
  989. evt.stopPropagation && evt.stopPropagation();
  990. evt.stopImmediatePropagation && evt.stopImmediatePropagation();
  991. ignoreNextClick = false;
  992. return false;
  993. }
  994. }, true);
  995. }
  996. var nearestEmptyInsertDetectEvent = function nearestEmptyInsertDetectEvent(evt) {
  997. if (dragEl) {
  998. evt = evt.touches ? evt.touches[0] : evt;
  999. var nearest = _detectNearestEmptySortable(evt.clientX, evt.clientY);
  1000. if (nearest) {
  1001. // Create imitation event
  1002. var event = {};
  1003. for (var i in evt) {
  1004. if (evt.hasOwnProperty(i)) {
  1005. event[i] = evt[i];
  1006. }
  1007. }
  1008. event.target = event.rootEl = nearest;
  1009. event.preventDefault = void 0;
  1010. event.stopPropagation = void 0;
  1011. nearest[expando]._onDragOver(event);
  1012. }
  1013. }
  1014. };
  1015. var _checkOutsideTargetEl = function _checkOutsideTargetEl(evt) {
  1016. if (dragEl) {
  1017. dragEl.parentNode[expando]._isOutsideThisEl(evt.target);
  1018. }
  1019. };
  1020. /**
  1021. * @class Sortable
  1022. * @param {HTMLElement} el
  1023. * @param {Object} [options]
  1024. */
  1025. function Sortable(el, options) {
  1026. if (!(el && el.nodeType && el.nodeType === 1)) {
  1027. throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(el));
  1028. }
  1029. this.el = el; // root element
  1030. this.options = options = _extends({}, options); // Export instance
  1031. el[expando] = this;
  1032. var defaults = {
  1033. group: null,
  1034. sort: true,
  1035. disabled: false,
  1036. store: null,
  1037. handle: null,
  1038. draggable: /^[uo]l$/i.test(el.nodeName) ? '>li' : '>*',
  1039. swapThreshold: 1,
  1040. // percentage; 0 <= x <= 1
  1041. invertSwap: false,
  1042. // invert always
  1043. invertedSwapThreshold: null,
  1044. // will be set to same as swapThreshold if default
  1045. removeCloneOnHide: true,
  1046. direction: function direction() {
  1047. return _detectDirection(el, this.options);
  1048. },
  1049. ghostClass: 'sortable-ghost',
  1050. chosenClass: 'sortable-chosen',
  1051. dragClass: 'sortable-drag',
  1052. ignore: 'a, img',
  1053. filter: null,
  1054. preventOnFilter: true,
  1055. animation: 0,
  1056. easing: null,
  1057. setData: function setData(dataTransfer, dragEl) {
  1058. dataTransfer.setData('Text', dragEl.textContent);
  1059. },
  1060. dropBubble: false,
  1061. dragoverBubble: false,
  1062. dataIdAttr: 'data-id',
  1063. delay: 0,
  1064. delayOnTouchOnly: false,
  1065. touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1,
  1066. forceFallback: false,
  1067. fallbackClass: 'sortable-fallback',
  1068. fallbackOnBody: false,
  1069. fallbackTolerance: 0,
  1070. fallbackOffset: {
  1071. x: 0,
  1072. y: 0
  1073. },
  1074. supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && !Safari,
  1075. emptyInsertThreshold: 5
  1076. };
  1077. PluginManager.initializePlugins(this, el, defaults); // Set default options
  1078. for (var name in defaults) {
  1079. !(name in options) && (options[name] = defaults[name]);
  1080. }
  1081. _prepareGroup(options); // Bind all private methods
  1082. for (var fn in this) {
  1083. if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
  1084. this[fn] = this[fn].bind(this);
  1085. }
  1086. } // Setup drag mode
  1087. this.nativeDraggable = options.forceFallback ? false : supportDraggable;
  1088. if (this.nativeDraggable) {
  1089. // Touch start threshold cannot be greater than the native dragstart threshold
  1090. this.options.touchStartThreshold = 1;
  1091. } // Bind events
  1092. if (options.supportPointer) {
  1093. on(el, 'pointerdown', this._onTapStart);
  1094. } else {
  1095. on(el, 'mousedown', this._onTapStart);
  1096. on(el, 'touchstart', this._onTapStart);
  1097. }
  1098. if (this.nativeDraggable) {
  1099. on(el, 'dragover', this);
  1100. on(el, 'dragenter', this);
  1101. }
  1102. sortables.push(this.el); // Restore sorting
  1103. options.store && options.store.get && this.sort(options.store.get(this) || []); // Add animation state manager
  1104. _extends(this, AnimationStateManager());
  1105. }
  1106. Sortable.prototype =
  1107. /** @lends Sortable.prototype */
  1108. {
  1109. constructor: Sortable,
  1110. _isOutsideThisEl: function _isOutsideThisEl(target) {
  1111. if (!this.el.contains(target) && target !== this.el) {
  1112. lastTarget = null;
  1113. }
  1114. },
  1115. _getDirection: function _getDirection(evt, target) {
  1116. return typeof this.options.direction === 'function' ? this.options.direction.call(this, evt, target, dragEl) : this.options.direction;
  1117. },
  1118. _onTapStart: function _onTapStart(
  1119. /** Event|TouchEvent */
  1120. evt) {
  1121. if (!evt.cancelable) return;
  1122. var _this = this,
  1123. el = this.el,
  1124. options = this.options,
  1125. preventOnFilter = options.preventOnFilter,
  1126. type = evt.type,
  1127. touch = evt.touches && evt.touches[0] || evt.pointerType && evt.pointerType === 'touch' && evt,
  1128. target = (touch || evt).target,
  1129. originalTarget = evt.target.shadowRoot && (evt.path && evt.path[0] || evt.composedPath && evt.composedPath()[0]) || target,
  1130. filter = options.filter;
  1131. _saveInputCheckedState(el); // Don't trigger start event when an element is been dragged, otherwise the evt.oldindex always wrong when set option.group.
  1132. if (dragEl) {
  1133. return;
  1134. }
  1135. if (/mousedown|pointerdown/.test(type) && evt.button !== 0 || options.disabled) {
  1136. return; // only left button and enabled
  1137. } // cancel dnd if original target is content editable
  1138. if (originalTarget.isContentEditable) {
  1139. return;
  1140. } // Safari ignores further event handling after mousedown
  1141. if (!this.nativeDraggable && Safari && target && target.tagName.toUpperCase() === 'SELECT') {
  1142. return;
  1143. }
  1144. target = closest(target, options.draggable, el, false);
  1145. if (target && target.animated) {
  1146. return;
  1147. }
  1148. if (lastDownEl === target) {
  1149. // Ignoring duplicate `down`
  1150. return;
  1151. } // Get the index of the dragged element within its parent
  1152. oldIndex = index(target);
  1153. oldDraggableIndex = index(target, options.draggable); // Check filter
  1154. if (typeof filter === 'function') {
  1155. if (filter.call(this, evt, target, this)) {
  1156. _dispatchEvent({
  1157. sortable: _this,
  1158. rootEl: originalTarget,
  1159. name: 'filter',
  1160. targetEl: target,
  1161. toEl: el,
  1162. fromEl: el
  1163. });
  1164. pluginEvent('filter', _this, {
  1165. evt: evt
  1166. });
  1167. preventOnFilter && evt.cancelable && evt.preventDefault();
  1168. return; // cancel dnd
  1169. }
  1170. } else if (filter) {
  1171. filter = filter.split(',').some(function (criteria) {
  1172. criteria = closest(originalTarget, criteria.trim(), el, false);
  1173. if (criteria) {
  1174. _dispatchEvent({
  1175. sortable: _this,
  1176. rootEl: criteria,
  1177. name: 'filter',
  1178. targetEl: target,
  1179. fromEl: el,
  1180. toEl: el
  1181. });
  1182. pluginEvent('filter', _this, {
  1183. evt: evt
  1184. });
  1185. return true;
  1186. }
  1187. });
  1188. if (filter) {
  1189. preventOnFilter && evt.cancelable && evt.preventDefault();
  1190. return; // cancel dnd
  1191. }
  1192. }
  1193. if (options.handle && !closest(originalTarget, options.handle, el, false)) {
  1194. return;
  1195. } // Prepare `dragstart`
  1196. this._prepareDragStart(evt, touch, target);
  1197. },
  1198. _prepareDragStart: function _prepareDragStart(
  1199. /** Event */
  1200. evt,
  1201. /** Touch */
  1202. touch,
  1203. /** HTMLElement */
  1204. target) {
  1205. var _this = this,
  1206. el = _this.el,
  1207. options = _this.options,
  1208. ownerDocument = el.ownerDocument,
  1209. dragStartFn;
  1210. if (target && !dragEl && target.parentNode === el) {
  1211. var dragRect = getRect(target);
  1212. rootEl = el;
  1213. dragEl = target;
  1214. parentEl = dragEl.parentNode;
  1215. nextEl = dragEl.nextSibling;
  1216. lastDownEl = target;
  1217. activeGroup = options.group;
  1218. Sortable.dragged = dragEl;
  1219. tapEvt = {
  1220. target: dragEl,
  1221. clientX: (touch || evt).clientX,
  1222. clientY: (touch || evt).clientY
  1223. };
  1224. tapDistanceLeft = tapEvt.clientX - dragRect.left;
  1225. tapDistanceTop = tapEvt.clientY - dragRect.top;
  1226. this._lastX = (touch || evt).clientX;
  1227. this._lastY = (touch || evt).clientY;
  1228. dragEl.style['will-change'] = 'all';
  1229. dragStartFn = function dragStartFn() {
  1230. pluginEvent('delayEnded', _this, {
  1231. evt: evt
  1232. });
  1233. if (Sortable.eventCanceled) {
  1234. _this._onDrop();
  1235. return;
  1236. } // Delayed drag has been triggered
  1237. // we can re-enable the events: touchmove/mousemove
  1238. _this._disableDelayedDragEvents();
  1239. if (!FireFox && _this.nativeDraggable) {
  1240. dragEl.draggable = true;
  1241. } // Bind the events: dragstart/dragend
  1242. _this._triggerDragStart(evt, touch); // Drag start event
  1243. _dispatchEvent({
  1244. sortable: _this,
  1245. name: 'choose',
  1246. originalEvent: evt
  1247. }); // Chosen item
  1248. toggleClass(dragEl, options.chosenClass, true);
  1249. }; // Disable "draggable"
  1250. options.ignore.split(',').forEach(function (criteria) {
  1251. find(dragEl, criteria.trim(), _disableDraggable);
  1252. });
  1253. on(ownerDocument, 'dragover', nearestEmptyInsertDetectEvent);
  1254. on(ownerDocument, 'mousemove', nearestEmptyInsertDetectEvent);
  1255. on(ownerDocument, 'touchmove', nearestEmptyInsertDetectEvent);
  1256. on(ownerDocument, 'mouseup', _this._onDrop);
  1257. on(ownerDocument, 'touchend', _this._onDrop);
  1258. on(ownerDocument, 'touchcancel', _this._onDrop); // Make dragEl draggable (must be before delay for FireFox)
  1259. if (FireFox && this.nativeDraggable) {
  1260. this.options.touchStartThreshold = 4;
  1261. dragEl.draggable = true;
  1262. }
  1263. pluginEvent('delayStart', this, {
  1264. evt: evt
  1265. }); // Delay is impossible for native DnD in Edge or IE
  1266. if (options.delay && (!options.delayOnTouchOnly || touch) && (!this.nativeDraggable || !(Edge || IE11OrLess))) {
  1267. if (Sortable.eventCanceled) {
  1268. this._onDrop();
  1269. return;
  1270. } // If the user moves the pointer or let go the click or touch
  1271. // before the delay has been reached:
  1272. // disable the delayed drag
  1273. on(ownerDocument, 'mouseup', _this._disableDelayedDrag);
  1274. on(ownerDocument, 'touchend', _this._disableDelayedDrag);
  1275. on(ownerDocument, 'touchcancel', _this._disableDelayedDrag);
  1276. on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler);
  1277. on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler);
  1278. options.supportPointer && on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler);
  1279. _this._dragStartTimer = setTimeout(dragStartFn, options.delay);
  1280. } else {
  1281. dragStartFn();
  1282. }
  1283. }
  1284. },
  1285. _delayedDragTouchMoveHandler: function _delayedDragTouchMoveHandler(
  1286. /** TouchEvent|PointerEvent **/
  1287. e) {
  1288. var touch = e.touches ? e.touches[0] : e;
  1289. if (Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1))) {
  1290. this._disableDelayedDrag();
  1291. }
  1292. },
  1293. _disableDelayedDrag: function _disableDelayedDrag() {
  1294. dragEl && _disableDraggable(dragEl);
  1295. clearTimeout(this._dragStartTimer);
  1296. this._disableDelayedDragEvents();
  1297. },
  1298. _disableDelayedDragEvents: function _disableDelayedDragEvents() {
  1299. var ownerDocument = this.el.ownerDocument;
  1300. off(ownerDocument, 'mouseup', this._disableDelayedDrag);
  1301. off(ownerDocument, 'touchend', this._disableDelayedDrag);
  1302. off(ownerDocument, 'touchcancel', this._disableDelayedDrag);
  1303. off(ownerDocument, 'mousemove', this._delayedDragTouchMoveHandler);
  1304. off(ownerDocument, 'touchmove', this._delayedDragTouchMoveHandler);
  1305. off(ownerDocument, 'pointermove', this._delayedDragTouchMoveHandler);
  1306. },
  1307. _triggerDragStart: function _triggerDragStart(
  1308. /** Event */
  1309. evt,
  1310. /** Touch */
  1311. touch) {
  1312. touch = touch || evt.pointerType == 'touch' && evt;
  1313. if (!this.nativeDraggable || touch) {
  1314. if (this.options.supportPointer) {
  1315. on(document, 'pointermove', this._onTouchMove);
  1316. } else if (touch) {
  1317. on(document, 'touchmove', this._onTouchMove);
  1318. } else {
  1319. on(document, 'mousemove', this._onTouchMove);
  1320. }
  1321. } else {
  1322. on(dragEl, 'dragend', this);
  1323. on(rootEl, 'dragstart', this._onDragStart);
  1324. }
  1325. try {
  1326. if (document.selection) {
  1327. // Timeout neccessary for IE9
  1328. _nextTick(function () {
  1329. document.selection.empty();
  1330. });
  1331. } else {
  1332. window.getSelection().removeAllRanges();
  1333. }
  1334. } catch (err) {}
  1335. },
  1336. _dragStarted: function _dragStarted(fallback, evt) {
  1337. awaitingDragStarted = false;
  1338. if (rootEl && dragEl) {
  1339. pluginEvent('dragStarted', this, {
  1340. evt: evt
  1341. });
  1342. if (this.nativeDraggable) {
  1343. on(document, 'dragover', _checkOutsideTargetEl);
  1344. }
  1345. var options = this.options; // Apply effect
  1346. !fallback && toggleClass(dragEl, options.dragClass, false);
  1347. toggleClass(dragEl, options.ghostClass, true);
  1348. Sortable.active = this;
  1349. fallback && this._appendGhost(); // Drag start event
  1350. _dispatchEvent({
  1351. sortable: this,
  1352. name: 'start',
  1353. originalEvent: evt
  1354. });
  1355. } else {
  1356. this._nulling();
  1357. }
  1358. },
  1359. _emulateDragOver: function _emulateDragOver() {
  1360. if (touchEvt) {
  1361. this._lastX = touchEvt.clientX;
  1362. this._lastY = touchEvt.clientY;
  1363. _hideGhostForTarget();
  1364. var target = document.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
  1365. var parent = target;
  1366. while (target && target.shadowRoot) {
  1367. target = target.shadowRoot.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
  1368. if (target === parent) break;
  1369. parent = target;
  1370. }
  1371. dragEl.parentNode[expando]._isOutsideThisEl(target);
  1372. if (parent) {
  1373. do {
  1374. if (parent[expando]) {
  1375. var inserted = void 0;
  1376. inserted = parent[expando]._onDragOver({
  1377. clientX: touchEvt.clientX,
  1378. clientY: touchEvt.clientY,
  1379. target: target,
  1380. rootEl: parent
  1381. });
  1382. if (inserted && !this.options.dragoverBubble) {
  1383. break;
  1384. }
  1385. }
  1386. target = parent; // store last element
  1387. }
  1388. /* jshint boss:true */
  1389. while (parent = parent.parentNode);
  1390. }
  1391. _unhideGhostForTarget();
  1392. }
  1393. },
  1394. _onTouchMove: function _onTouchMove(
  1395. /**TouchEvent*/
  1396. evt) {
  1397. if (tapEvt) {
  1398. var options = this.options,
  1399. fallbackTolerance = options.fallbackTolerance,
  1400. fallbackOffset = options.fallbackOffset,
  1401. touch = evt.touches ? evt.touches[0] : evt,
  1402. ghostMatrix = ghostEl && matrix(ghostEl, true),
  1403. scaleX = ghostEl && ghostMatrix && ghostMatrix.a,
  1404. scaleY = ghostEl && ghostMatrix && ghostMatrix.d,
  1405. relativeScrollOffset = PositionGhostAbsolutely && ghostRelativeParent && getRelativeScrollOffset(ghostRelativeParent),
  1406. dx = (touch.clientX - tapEvt.clientX + fallbackOffset.x) / (scaleX || 1) + (relativeScrollOffset ? relativeScrollOffset[0] - ghostRelativeParentInitialScroll[0] : 0) / (scaleX || 1),
  1407. dy = (touch.clientY - tapEvt.clientY + fallbackOffset.y) / (scaleY || 1) + (relativeScrollOffset ? relativeScrollOffset[1] - ghostRelativeParentInitialScroll[1] : 0) / (scaleY || 1); // only set the status to dragging, when we are actually dragging
  1408. if (!Sortable.active && !awaitingDragStarted) {
  1409. if (fallbackTolerance && Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) < fallbackTolerance) {
  1410. return;
  1411. }
  1412. this._onDragStart(evt, true);
  1413. }
  1414. if (ghostEl) {
  1415. if (ghostMatrix) {
  1416. ghostMatrix.e += dx - (lastDx || 0);
  1417. ghostMatrix.f += dy - (lastDy || 0);
  1418. } else {
  1419. ghostMatrix = {
  1420. a: 1,
  1421. b: 0,
  1422. c: 0,
  1423. d: 1,
  1424. e: dx,
  1425. f: dy
  1426. };
  1427. }
  1428. var cssMatrix = "matrix(".concat(ghostMatrix.a, ",").concat(ghostMatrix.b, ",").concat(ghostMatrix.c, ",").concat(ghostMatrix.d, ",").concat(ghostMatrix.e, ",").concat(ghostMatrix.f, ")");
  1429. css(ghostEl, 'webkitTransform', cssMatrix);
  1430. css(ghostEl, 'mozTransform', cssMatrix);
  1431. css(ghostEl, 'msTransform', cssMatrix);
  1432. css(ghostEl, 'transform', cssMatrix);
  1433. lastDx = dx;
  1434. lastDy = dy;
  1435. touchEvt = touch;
  1436. }
  1437. evt.cancelable && evt.preventDefault();
  1438. }
  1439. },
  1440. _appendGhost: function _appendGhost() {
  1441. // Bug if using scale(): https://stackoverflow.com/questions/2637058
  1442. // Not being adjusted for
  1443. if (!ghostEl) {
  1444. var container = this.options.fallbackOnBody ? document.body : rootEl,
  1445. rect = getRect(dragEl, true, PositionGhostAbsolutely, true, container),
  1446. options = this.options; // Position absolutely
  1447. if (PositionGhostAbsolutely) {
  1448. // Get relatively positioned parent
  1449. ghostRelativeParent = container;
  1450. while (css(ghostRelativeParent, 'position') === 'static' && css(ghostRelativeParent, 'transform') === 'none' && ghostRelativeParent !== document) {
  1451. ghostRelativeParent = ghostRelativeParent.parentNode;
  1452. }
  1453. if (ghostRelativeParent !== document.body && ghostRelativeParent !== document.documentElement) {
  1454. if (ghostRelativeParent === document) ghostRelativeParent = getWindowScrollingElement();
  1455. rect.top += ghostRelativeParent.scrollTop;
  1456. rect.left += ghostRelativeParent.scrollLeft;
  1457. } else {
  1458. ghostRelativeParent = getWindowScrollingElement();
  1459. }
  1460. ghostRelativeParentInitialScroll = getRelativeScrollOffset(ghostRelativeParent);
  1461. }
  1462. ghostEl = dragEl.cloneNode(true);
  1463. toggleClass(ghostEl, options.ghostClass, false);
  1464. toggleClass(ghostEl, options.fallbackClass, true);
  1465. toggleClass(ghostEl, options.dragClass, true);
  1466. css(ghostEl, 'transition', '');
  1467. css(ghostEl, 'transform', '');
  1468. css(ghostEl, 'box-sizing', 'border-box');
  1469. css(ghostEl, 'margin', 0);
  1470. css(ghostEl, 'top', rect.top);
  1471. css(ghostEl, 'left', rect.left);
  1472. css(ghostEl, 'width', rect.width);
  1473. css(ghostEl, 'height', rect.height);
  1474. css(ghostEl, 'opacity', '0.8');
  1475. css(ghostEl, 'position', PositionGhostAbsolutely ? 'absolute' : 'fixed');
  1476. css(ghostEl, 'zIndex', '100000');
  1477. css(ghostEl, 'pointerEvents', 'none');
  1478. Sortable.ghost = ghostEl;
  1479. container.appendChild(ghostEl); // Set transform-origin
  1480. css(ghostEl, 'transform-origin', tapDistanceLeft / parseInt(ghostEl.style.width) * 100 + '% ' + tapDistanceTop / parseInt(ghostEl.style.height) * 100 + '%');
  1481. }
  1482. },
  1483. _onDragStart: function _onDragStart(
  1484. /**Event*/
  1485. evt,
  1486. /**boolean*/
  1487. fallback) {
  1488. var _this = this;
  1489. var dataTransfer = evt.dataTransfer;
  1490. var options = _this.options;
  1491. pluginEvent('dragStart', this, {
  1492. evt: evt
  1493. });
  1494. if (Sortable.eventCanceled) {
  1495. this._onDrop();
  1496. return;
  1497. }
  1498. pluginEvent('setupClone', this);
  1499. if (!Sortable.eventCanceled) {
  1500. cloneEl = clone(dragEl);
  1501. cloneEl.removeAttribute("id");
  1502. cloneEl.draggable = false;
  1503. cloneEl.style['will-change'] = '';
  1504. this._hideClone();
  1505. toggleClass(cloneEl, this.options.chosenClass, false);
  1506. Sortable.clone = cloneEl;
  1507. } // #1143: IFrame support workaround
  1508. _this.cloneId = _nextTick(function () {
  1509. pluginEvent('clone', _this);
  1510. if (Sortable.eventCanceled) return;
  1511. if (!_this.options.removeCloneOnHide) {
  1512. rootEl.insertBefore(cloneEl, dragEl);
  1513. }
  1514. _this._hideClone();
  1515. _dispatchEvent({
  1516. sortable: _this,
  1517. name: 'clone'
  1518. });
  1519. });
  1520. !fallback && toggleClass(dragEl, options.dragClass, true); // Set proper drop events
  1521. if (fallback) {
  1522. ignoreNextClick = true;
  1523. _this._loopId = setInterval(_this._emulateDragOver, 50);
  1524. } else {
  1525. // Undo what was set in _prepareDragStart before drag started
  1526. off(document, 'mouseup', _this._onDrop);
  1527. off(document, 'touchend', _this._onDrop);
  1528. off(document, 'touchcancel', _this._onDrop);
  1529. if (dataTransfer) {
  1530. dataTransfer.effectAllowed = 'move';
  1531. options.setData && options.setData.call(_this, dataTransfer, dragEl);
  1532. }
  1533. on(document, 'drop', _this); // #1276 fix:
  1534. css(dragEl, 'transform', 'translateZ(0)');
  1535. }
  1536. awaitingDragStarted = true;
  1537. _this._dragStartId = _nextTick(_this._dragStarted.bind(_this, fallback, evt));
  1538. on(document, 'selectstart', _this);
  1539. moved = true;
  1540. if (Safari) {
  1541. css(document.body, 'user-select', 'none');
  1542. }
  1543. },
  1544. // Returns true - if no further action is needed (either inserted or another condition)
  1545. _onDragOver: function _onDragOver(
  1546. /**Event*/
  1547. evt) {
  1548. var el = this.el,
  1549. target = evt.target,
  1550. dragRect,
  1551. targetRect,
  1552. revert,
  1553. options = this.options,
  1554. group = options.group,
  1555. activeSortable = Sortable.active,
  1556. isOwner = activeGroup === group,
  1557. canSort = options.sort,
  1558. fromSortable = putSortable || activeSortable,
  1559. vertical,
  1560. _this = this,
  1561. completedFired = false;
  1562. if (_silent) return;
  1563. function dragOverEvent(name, extra) {
  1564. pluginEvent(name, _this, _objectSpread2({
  1565. evt: evt,
  1566. isOwner: isOwner,
  1567. axis: vertical ? 'vertical' : 'horizontal',
  1568. revert: revert,
  1569. dragRect: dragRect,
  1570. targetRect: targetRect,
  1571. canSort: canSort,
  1572. fromSortable: fromSortable,
  1573. target: target,
  1574. completed: completed,
  1575. onMove: function onMove(target, after) {
  1576. return _onMove(rootEl, el, dragEl, dragRect, target, getRect(target), evt, after);
  1577. },
  1578. changed: changed
  1579. }, extra));
  1580. } // Capture animation state
  1581. function capture() {
  1582. dragOverEvent('dragOverAnimationCapture');
  1583. _this.captureAnimationState();
  1584. if (_this !== fromSortable) {
  1585. fromSortable.captureAnimationState();
  1586. }
  1587. } // Return invocation when dragEl is inserted (or completed)
  1588. function completed(insertion) {
  1589. dragOverEvent('dragOverCompleted', {
  1590. insertion: insertion
  1591. });
  1592. if (insertion) {
  1593. // Clones must be hidden before folding animation to capture dragRectAbsolute properly
  1594. if (isOwner) {
  1595. activeSortable._hideClone();
  1596. } else {
  1597. activeSortable._showClone(_this);
  1598. }
  1599. if (_this !== fromSortable) {
  1600. // Set ghost class to new sortable's ghost class
  1601. toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : activeSortable.options.ghostClass, false);
  1602. toggleClass(dragEl, options.ghostClass, true);
  1603. }
  1604. if (putSortable !== _this && _this !== Sortable.active) {
  1605. putSortable = _this;
  1606. } else if (_this === Sortable.active && putSortable) {
  1607. putSortable = null;
  1608. } // Animation
  1609. if (fromSortable === _this) {
  1610. _this._ignoreWhileAnimating = target;
  1611. }
  1612. _this.animateAll(function () {
  1613. dragOverEvent('dragOverAnimationComplete');
  1614. _this._ignoreWhileAnimating = null;
  1615. });
  1616. if (_this !== fromSortable) {
  1617. fromSortable.animateAll();
  1618. fromSortable._ignoreWhileAnimating = null;
  1619. }
  1620. } // Null lastTarget if it is not inside a previously swapped element
  1621. if (target === dragEl && !dragEl.animated || target === el && !target.animated) {
  1622. lastTarget = null;
  1623. } // no bubbling and not fallback
  1624. if (!options.dragoverBubble && !evt.rootEl && target !== document) {
  1625. dragEl.parentNode[expando]._isOutsideThisEl(evt.target); // Do not detect for empty insert if already inserted
  1626. !insertion && nearestEmptyInsertDetectEvent(evt);
  1627. }
  1628. !options.dragoverBubble && evt.stopPropagation && evt.stopPropagation();
  1629. return completedFired = true;
  1630. } // Call when dragEl has been inserted
  1631. function changed() {
  1632. newIndex = index(dragEl);
  1633. newDraggableIndex = index(dragEl, options.draggable);
  1634. _dispatchEvent({
  1635. sortable: _this,
  1636. name: 'change',
  1637. toEl: el,
  1638. newIndex: newIndex,
  1639. newDraggableIndex: newDraggableIndex,
  1640. originalEvent: evt
  1641. });
  1642. }
  1643. if (evt.preventDefault !== void 0) {
  1644. evt.cancelable && evt.preventDefault();
  1645. }
  1646. target = closest(target, options.draggable, el, true);
  1647. dragOverEvent('dragOver');
  1648. if (Sortable.eventCanceled) return completedFired;
  1649. if (dragEl.contains(evt.target) || target.animated && target.animatingX && target.animatingY || _this._ignoreWhileAnimating === target) {
  1650. return completed(false);
  1651. }
  1652. ignoreNextClick = false;
  1653. if (activeSortable && !options.disabled && (isOwner ? canSort || (revert = parentEl !== rootEl) // Reverting item into the original list
  1654. : putSortable === this || (this.lastPutMode = activeGroup.checkPull(this, activeSortable, dragEl, evt)) && group.checkPut(this, activeSortable, dragEl, evt))) {
  1655. vertical = this._getDirection(evt, target) === 'vertical';
  1656. dragRect = getRect(dragEl);
  1657. dragOverEvent('dragOverValid');
  1658. if (Sortable.eventCanceled) return completedFired;
  1659. if (revert) {
  1660. parentEl = rootEl; // actualization
  1661. capture();
  1662. this._hideClone();
  1663. dragOverEvent('revert');
  1664. if (!Sortable.eventCanceled) {
  1665. if (nextEl) {
  1666. rootEl.insertBefore(dragEl, nextEl);
  1667. } else {
  1668. rootEl.appendChild(dragEl);
  1669. }
  1670. }
  1671. return completed(true);
  1672. }
  1673. var elLastChild = lastChild(el, options.draggable);
  1674. if (!elLastChild || _ghostIsLast(evt, vertical, this) && !elLastChild.animated) {
  1675. // Insert to end of list
  1676. // If already at end of list: Do not insert
  1677. if (elLastChild === dragEl) {
  1678. return completed(false);
  1679. } // if there is a last element, it is the target
  1680. if (elLastChild && el === evt.target) {
  1681. target = elLastChild;
  1682. }
  1683. if (target) {
  1684. targetRect = getRect(target);
  1685. }
  1686. if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, !!target) !== false) {
  1687. capture();
  1688. if (elLastChild && elLastChild.nextSibling) {
  1689. // the last draggable element is not the last node
  1690. el.insertBefore(dragEl, elLastChild.nextSibling);
  1691. } else {
  1692. el.appendChild(dragEl);
  1693. }
  1694. parentEl = el; // actualization
  1695. changed();
  1696. return completed(true);
  1697. }
  1698. } else if (elLastChild && _ghostIsFirst(evt, vertical, this)) {
  1699. // Insert to start of list
  1700. var firstChild = getChild(el, 0, options, true);
  1701. if (firstChild === dragEl) {
  1702. return completed(false);
  1703. }
  1704. target = firstChild;
  1705. targetRect = getRect(target);
  1706. if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, false) !== false) {
  1707. capture();
  1708. el.insertBefore(dragEl, firstChild);
  1709. parentEl = el; // actualization
  1710. changed();
  1711. return completed(true);
  1712. }
  1713. } else if (target.parentNode === el) {
  1714. targetRect = getRect(target);
  1715. var direction = 0,
  1716. targetBeforeFirstSwap,
  1717. differentLevel = dragEl.parentNode !== el,
  1718. differentRowCol = !_dragElInRowColumn(dragEl.animated && dragEl.toRect || dragRect, target.animated && target.toRect || targetRect, vertical),
  1719. side1 = vertical ? 'top' : 'left',
  1720. scrolledPastTop = isScrolledPast(target, 'top', 'top') || isScrolledPast(dragEl, 'top', 'top'),
  1721. scrollBefore = scrolledPastTop ? scrolledPastTop.scrollTop : void 0;
  1722. if (lastTarget !== target) {
  1723. targetBeforeFirstSwap = targetRect[side1];
  1724. pastFirstInvertThresh = false;
  1725. isCircumstantialInvert = !differentRowCol && options.invertSwap || differentLevel;
  1726. }
  1727. direction = _getSwapDirection(evt, target, targetRect, vertical, differentRowCol ? 1 : options.swapThreshold, options.invertedSwapThreshold == null ? options.swapThreshold : options.invertedSwapThreshold, isCircumstantialInvert, lastTarget === target);
  1728. var sibling;
  1729. if (direction !== 0) {
  1730. // Check if target is beside dragEl in respective direction (ignoring hidden elements)
  1731. var dragIndex = index(dragEl);
  1732. do {
  1733. dragIndex -= direction;
  1734. sibling = parentEl.children[dragIndex];
  1735. } while (sibling && (css(sibling, 'display') === 'none' || sibling === ghostEl));
  1736. } // If dragEl is already beside target: Do not insert
  1737. if (direction === 0 || sibling === target) {
  1738. return completed(false);
  1739. }
  1740. lastTarget = target;
  1741. lastDirection = direction;
  1742. var nextSibling = target.nextElementSibling,
  1743. after = false;
  1744. after = direction === 1;
  1745. var moveVector = _onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, after);
  1746. if (moveVector !== false) {
  1747. if (moveVector === 1 || moveVector === -1) {
  1748. after = moveVector === 1;
  1749. }
  1750. _silent = true;
  1751. setTimeout(_unsilent, 30);
  1752. capture();
  1753. if (after && !nextSibling) {
  1754. el.appendChild(dragEl);
  1755. } else {
  1756. target.parentNode.insertBefore(dragEl, after ? nextSibling : target);
  1757. } // Undo chrome's scroll adjustment (has no effect on other browsers)
  1758. if (scrolledPastTop) {
  1759. scrollBy(scrolledPastTop, 0, scrollBefore - scrolledPastTop.scrollTop);
  1760. }
  1761. parentEl = dragEl.parentNode; // actualization
  1762. // must be done before animation
  1763. if (targetBeforeFirstSwap !== undefined && !isCircumstantialInvert) {
  1764. targetMoveDistance = Math.abs(targetBeforeFirstSwap - getRect(target)[side1]);
  1765. }
  1766. changed();
  1767. return completed(true);
  1768. }
  1769. }
  1770. if (el.contains(dragEl)) {
  1771. return completed(false);
  1772. }
  1773. }
  1774. return false;
  1775. },
  1776. _ignoreWhileAnimating: null,
  1777. _offMoveEvents: function _offMoveEvents() {
  1778. off(document, 'mousemove', this._onTouchMove);
  1779. off(document, 'touchmove', this._onTouchMove);
  1780. off(document, 'pointermove', this._onTouchMove);
  1781. off(document, 'dragover', nearestEmptyInsertDetectEvent);
  1782. off(document, 'mousemove', nearestEmptyInsertDetectEvent);
  1783. off(document, 'touchmove', nearestEmptyInsertDetectEvent);
  1784. },
  1785. _offUpEvents: function _offUpEvents() {
  1786. var ownerDocument = this.el.ownerDocument;
  1787. off(ownerDocument, 'mouseup', this._onDrop);
  1788. off(ownerDocument, 'touchend', this._onDrop);
  1789. off(ownerDocument, 'pointerup', this._onDrop);
  1790. off(ownerDocument, 'touchcancel', this._onDrop);
  1791. off(document, 'selectstart', this);
  1792. },
  1793. _onDrop: function _onDrop(
  1794. /**Event*/
  1795. evt) {
  1796. var el = this.el,
  1797. options = this.options; // Get the index of the dragged element within its parent
  1798. newIndex = index(dragEl);
  1799. newDraggableIndex = index(dragEl, options.draggable);
  1800. pluginEvent('drop', this, {
  1801. evt: evt
  1802. });
  1803. parentEl = dragEl && dragEl.parentNode; // Get again after plugin event
  1804. newIndex = index(dragEl);
  1805. newDraggableIndex = index(dragEl, options.draggable);
  1806. if (Sortable.eventCanceled) {
  1807. this._nulling();
  1808. return;
  1809. }
  1810. awaitingDragStarted = false;
  1811. isCircumstantialInvert = false;
  1812. pastFirstInvertThresh = false;
  1813. clearInterval(this._loopId);
  1814. clearTimeout(this._dragStartTimer);
  1815. _cancelNextTick(this.cloneId);
  1816. _cancelNextTick(this._dragStartId); // Unbind events
  1817. if (this.nativeDraggable) {
  1818. off(document, 'drop', this);
  1819. off(el, 'dragstart', this._onDragStart);
  1820. }
  1821. this._offMoveEvents();
  1822. this._offUpEvents();
  1823. if (Safari) {
  1824. css(document.body, 'user-select', '');
  1825. }
  1826. css(dragEl, 'transform', '');
  1827. if (evt) {
  1828. if (moved) {
  1829. evt.cancelable && evt.preventDefault();
  1830. !options.dropBubble && evt.stopPropagation();
  1831. }
  1832. ghostEl && ghostEl.parentNode && ghostEl.parentNode.removeChild(ghostEl);
  1833. if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
  1834. // Remove clone(s)
  1835. cloneEl && cloneEl.parentNode && cloneEl.parentNode.removeChild(cloneEl);
  1836. }
  1837. if (dragEl) {
  1838. if (this.nativeDraggable) {
  1839. off(dragEl, 'dragend', this);
  1840. }
  1841. _disableDraggable(dragEl);
  1842. dragEl.style['will-change'] = ''; // Remove classes
  1843. // ghostClass is added in dragStarted
  1844. if (moved && !awaitingDragStarted) {
  1845. toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false);
  1846. }
  1847. toggleClass(dragEl, this.options.chosenClass, false); // Drag stop event
  1848. _dispatchEvent({
  1849. sortable: this,
  1850. name: 'unchoose',
  1851. toEl: parentEl,
  1852. newIndex: null,
  1853. newDraggableIndex: null,
  1854. originalEvent: evt
  1855. });
  1856. if (rootEl !== parentEl) {
  1857. if (newIndex >= 0) {
  1858. // Add event
  1859. _dispatchEvent({
  1860. rootEl: parentEl,
  1861. name: 'add',
  1862. toEl: parentEl,
  1863. fromEl: rootEl,
  1864. originalEvent: evt
  1865. }); // Remove event
  1866. _dispatchEvent({
  1867. sortable: this,
  1868. name: 'remove',
  1869. toEl: parentEl,
  1870. originalEvent: evt
  1871. }); // drag from one list and drop into another
  1872. _dispatchEvent({
  1873. rootEl: parentEl,
  1874. name: 'sort',
  1875. toEl: parentEl,
  1876. fromEl: rootEl,
  1877. originalEvent: evt
  1878. });
  1879. _dispatchEvent({
  1880. sortable: this,
  1881. name: 'sort',
  1882. toEl: parentEl,
  1883. originalEvent: evt
  1884. });
  1885. }
  1886. putSortable && putSortable.save();
  1887. } else {
  1888. if (newIndex !== oldIndex) {
  1889. if (newIndex >= 0) {
  1890. // drag & drop within the same list
  1891. _dispatchEvent({
  1892. sortable: this,
  1893. name: 'update',
  1894. toEl: parentEl,
  1895. originalEvent: evt
  1896. });
  1897. _dispatchEvent({
  1898. sortable: this,
  1899. name: 'sort',
  1900. toEl: parentEl,
  1901. originalEvent: evt
  1902. });
  1903. }
  1904. }
  1905. }
  1906. if (Sortable.active) {
  1907. /* jshint eqnull:true */
  1908. if (newIndex == null || newIndex === -1) {
  1909. newIndex = oldIndex;
  1910. newDraggableIndex = oldDraggableIndex;
  1911. }
  1912. _dispatchEvent({
  1913. sortable: this,
  1914. name: 'end',
  1915. toEl: parentEl,
  1916. originalEvent: evt
  1917. }); // Save sorting
  1918. this.save();
  1919. }
  1920. }
  1921. }
  1922. this._nulling();
  1923. },
  1924. _nulling: function _nulling() {
  1925. pluginEvent('nulling', this);
  1926. rootEl = dragEl = parentEl = ghostEl = nextEl = cloneEl = lastDownEl = cloneHidden = tapEvt = touchEvt = moved = newIndex = newDraggableIndex = oldIndex = oldDraggableIndex = lastTarget = lastDirection = putSortable = activeGroup = Sortable.dragged = Sortable.ghost = Sortable.clone = Sortable.active = null;
  1927. savedInputChecked.forEach(function (el) {
  1928. el.checked = true;
  1929. });
  1930. savedInputChecked.length = lastDx = lastDy = 0;
  1931. },
  1932. handleEvent: function handleEvent(
  1933. /**Event*/
  1934. evt) {
  1935. switch (evt.type) {
  1936. case 'drop':
  1937. case 'dragend':
  1938. this._onDrop(evt);
  1939. break;
  1940. case 'dragenter':
  1941. case 'dragover':
  1942. if (dragEl) {
  1943. this._onDragOver(evt);
  1944. _globalDragOver(evt);
  1945. }
  1946. break;
  1947. case 'selectstart':
  1948. evt.preventDefault();
  1949. break;
  1950. }
  1951. },
  1952. /**
  1953. * Serializes the item into an array of string.
  1954. * @returns {String[]}
  1955. */
  1956. toArray: function toArray() {
  1957. var order = [],
  1958. el,
  1959. children = this.el.children,
  1960. i = 0,
  1961. n = children.length,
  1962. options = this.options;
  1963. for (; i < n; i++) {
  1964. el = children[i];
  1965. if (closest(el, options.draggable, this.el, false)) {
  1966. order.push(el.getAttribute(options.dataIdAttr) || _generateId(el));
  1967. }
  1968. }
  1969. return order;
  1970. },
  1971. /**
  1972. * Sorts the elements according to the array.
  1973. * @param {String[]} order order of the items
  1974. */
  1975. sort: function sort(order, useAnimation) {
  1976. var items = {},
  1977. rootEl = this.el;
  1978. this.toArray().forEach(function (id, i) {
  1979. var el = rootEl.children[i];
  1980. if (closest(el, this.options.draggable, rootEl, false)) {
  1981. items[id] = el;
  1982. }
  1983. }, this);
  1984. useAnimation && this.captureAnimationState();
  1985. order.forEach(function (id) {
  1986. if (items[id]) {
  1987. rootEl.removeChild(items[id]);
  1988. rootEl.appendChild(items[id]);
  1989. }
  1990. });
  1991. useAnimation && this.animateAll();
  1992. },
  1993. /**
  1994. * Save the current sorting
  1995. */
  1996. save: function save() {
  1997. var store = this.options.store;
  1998. store && store.set && store.set(this);
  1999. },
  2000. /**
  2001. * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
  2002. * @param {HTMLElement} el
  2003. * @param {String} [selector] default: `options.draggable`
  2004. * @returns {HTMLElement|null}
  2005. */
  2006. closest: function closest$1(el, selector) {
  2007. return closest(el, selector || this.options.draggable, this.el, false);
  2008. },
  2009. /**
  2010. * Set/get option
  2011. * @param {string} name
  2012. * @param {*} [value]
  2013. * @returns {*}
  2014. */
  2015. option: function option(name, value) {
  2016. var options = this.options;
  2017. if (value === void 0) {
  2018. return options[name];
  2019. } else {
  2020. var modifiedValue = PluginManager.modifyOption(this, name, value);
  2021. if (typeof modifiedValue !== 'undefined') {
  2022. options[name] = modifiedValue;
  2023. } else {
  2024. options[name] = value;
  2025. }
  2026. if (name === 'group') {
  2027. _prepareGroup(options);
  2028. }
  2029. }
  2030. },
  2031. /**
  2032. * Destroy
  2033. */
  2034. destroy: function destroy() {
  2035. pluginEvent('destroy', this);
  2036. var el = this.el;
  2037. el[expando] = null;
  2038. off(el, 'mousedown', this._onTapStart);
  2039. off(el, 'touchstart', this._onTapStart);
  2040. off(el, 'pointerdown', this._onTapStart);
  2041. if (this.nativeDraggable) {
  2042. off(el, 'dragover', this);
  2043. off(el, 'dragenter', this);
  2044. } // Remove draggable attributes
  2045. Array.prototype.forEach.call(el.querySelectorAll('[draggable]'), function (el) {
  2046. el.removeAttribute('draggable');
  2047. });
  2048. this._onDrop();
  2049. this._disableDelayedDragEvents();
  2050. sortables.splice(sortables.indexOf(this.el), 1);
  2051. this.el = el = null;
  2052. },
  2053. _hideClone: function _hideClone() {
  2054. if (!cloneHidden) {
  2055. pluginEvent('hideClone', this);
  2056. if (Sortable.eventCanceled) return;
  2057. css(cloneEl, 'display', 'none');
  2058. if (this.options.removeCloneOnHide && cloneEl.parentNode) {
  2059. cloneEl.parentNode.removeChild(cloneEl);
  2060. }
  2061. cloneHidden = true;
  2062. }
  2063. },
  2064. _showClone: function _showClone(putSortable) {
  2065. if (putSortable.lastPutMode !== 'clone') {
  2066. this._hideClone();
  2067. return;
  2068. }
  2069. if (cloneHidden) {
  2070. pluginEvent('showClone', this);
  2071. if (Sortable.eventCanceled) return; // show clone at dragEl or original position
  2072. if (dragEl.parentNode == rootEl && !this.options.group.revertClone) {
  2073. rootEl.insertBefore(cloneEl, dragEl);
  2074. } else if (nextEl) {
  2075. rootEl.insertBefore(cloneEl, nextEl);
  2076. } else {
  2077. rootEl.appendChild(cloneEl);
  2078. }
  2079. if (this.options.group.revertClone) {
  2080. this.animate(dragEl, cloneEl);
  2081. }
  2082. css(cloneEl, 'display', '');
  2083. cloneHidden = false;
  2084. }
  2085. }
  2086. };
  2087. function _globalDragOver(
  2088. /**Event*/
  2089. evt) {
  2090. if (evt.dataTransfer) {
  2091. evt.dataTransfer.dropEffect = 'move';
  2092. }
  2093. evt.cancelable && evt.preventDefault();
  2094. }
  2095. function _onMove(fromEl, toEl, dragEl, dragRect, targetEl, targetRect, originalEvent, willInsertAfter) {
  2096. var evt,
  2097. sortable = fromEl[expando],
  2098. onMoveFn = sortable.options.onMove,
  2099. retVal; // Support for new CustomEvent feature
  2100. if (window.CustomEvent && !IE11OrLess && !Edge) {
  2101. evt = new CustomEvent('move', {
  2102. bubbles: true,
  2103. cancelable: true
  2104. });
  2105. } else {
  2106. evt = document.createEvent('Event');
  2107. evt.initEvent('move', true, true);
  2108. }
  2109. evt.to = toEl;
  2110. evt.from = fromEl;
  2111. evt.dragged = dragEl;
  2112. evt.draggedRect = dragRect;
  2113. evt.related = targetEl || toEl;
  2114. evt.relatedRect = targetRect || getRect(toEl);
  2115. evt.willInsertAfter = willInsertAfter;
  2116. evt.originalEvent = originalEvent;
  2117. fromEl.dispatchEvent(evt);
  2118. if (onMoveFn) {
  2119. retVal = onMoveFn.call(sortable, evt, originalEvent);
  2120. }
  2121. return retVal;
  2122. }
  2123. function _disableDraggable(el) {
  2124. el.draggable = false;
  2125. }
  2126. function _unsilent() {
  2127. _silent = false;
  2128. }
  2129. function _ghostIsFirst(evt, vertical, sortable) {
  2130. var rect = getRect(getChild(sortable.el, 0, sortable.options, true));
  2131. var spacer = 10;
  2132. return vertical ? evt.clientX < rect.left - spacer || evt.clientY < rect.top && evt.clientX < rect.right : evt.clientY < rect.top - spacer || evt.clientY < rect.bottom && evt.clientX < rect.left;
  2133. }
  2134. function _ghostIsLast(evt, vertical, sortable) {
  2135. var rect = getRect(lastChild(sortable.el, sortable.options.draggable));
  2136. var spacer = 10;
  2137. return vertical ? evt.clientX > rect.right + spacer || evt.clientX <= rect.right && evt.clientY > rect.bottom && evt.clientX >= rect.left : evt.clientX > rect.right && evt.clientY > rect.top || evt.clientX <= rect.right && evt.clientY > rect.bottom + spacer;
  2138. }
  2139. function _getSwapDirection(evt, target, targetRect, vertical, swapThreshold, invertedSwapThreshold, invertSwap, isLastTarget) {
  2140. var mouseOnAxis = vertical ? evt.clientY : evt.clientX,
  2141. targetLength = vertical ? targetRect.height : targetRect.width,
  2142. targetS1 = vertical ? targetRect.top : targetRect.left,
  2143. targetS2 = vertical ? targetRect.bottom : targetRect.right,
  2144. invert = false;
  2145. if (!invertSwap) {
  2146. // Never invert or create dragEl shadow when target movemenet causes mouse to move past the end of regular swapThreshold
  2147. if (isLastTarget && targetMoveDistance < targetLength * swapThreshold) {
  2148. // multiplied only by swapThreshold because mouse will already be inside target by (1 - threshold) * targetLength / 2
  2149. // check if past first invert threshold on side opposite of lastDirection
  2150. if (!pastFirstInvertThresh && (lastDirection === 1 ? mouseOnAxis > targetS1 + targetLength * invertedSwapThreshold / 2 : mouseOnAxis < targetS2 - targetLength * invertedSwapThreshold / 2)) {
  2151. // past first invert threshold, do not restrict inverted threshold to dragEl shadow
  2152. pastFirstInvertThresh = true;
  2153. }
  2154. if (!pastFirstInvertThresh) {
  2155. // dragEl shadow (target move distance shadow)
  2156. if (lastDirection === 1 ? mouseOnAxis < targetS1 + targetMoveDistance // over dragEl shadow
  2157. : mouseOnAxis > targetS2 - targetMoveDistance) {
  2158. return -lastDirection;
  2159. }
  2160. } else {
  2161. invert = true;
  2162. }
  2163. } else {
  2164. // Regular
  2165. if (mouseOnAxis > targetS1 + targetLength * (1 - swapThreshold) / 2 && mouseOnAxis < targetS2 - targetLength * (1 - swapThreshold) / 2) {
  2166. return _getInsertDirection(target);
  2167. }
  2168. }
  2169. }
  2170. invert = invert || invertSwap;
  2171. if (invert) {
  2172. // Invert of regular
  2173. if (mouseOnAxis < targetS1 + targetLength * invertedSwapThreshold / 2 || mouseOnAxis > targetS2 - targetLength * invertedSwapThreshold / 2) {
  2174. return mouseOnAxis > targetS1 + targetLength / 2 ? 1 : -1;
  2175. }
  2176. }
  2177. return 0;
  2178. }
  2179. /**
  2180. * Gets the direction dragEl must be swapped relative to target in order to make it
  2181. * seem that dragEl has been "inserted" into that element's position
  2182. * @param {HTMLElement} target The target whose position dragEl is being inserted at
  2183. * @return {Number} Direction dragEl must be swapped
  2184. */
  2185. function _getInsertDirection(target) {
  2186. if (index(dragEl) < index(target)) {
  2187. return 1;
  2188. } else {
  2189. return -1;
  2190. }
  2191. }
  2192. /**
  2193. * Generate id
  2194. * @param {HTMLElement} el
  2195. * @returns {String}
  2196. * @private
  2197. */
  2198. function _generateId(el) {
  2199. var str = el.tagName + el.className + el.src + el.href + el.textContent,
  2200. i = str.length,
  2201. sum = 0;
  2202. while (i--) {
  2203. sum += str.charCodeAt(i);
  2204. }
  2205. return sum.toString(36);
  2206. }
  2207. function _saveInputCheckedState(root) {
  2208. savedInputChecked.length = 0;
  2209. var inputs = root.getElementsByTagName('input');
  2210. var idx = inputs.length;
  2211. while (idx--) {
  2212. var el = inputs[idx];
  2213. el.checked && savedInputChecked.push(el);
  2214. }
  2215. }
  2216. function _nextTick(fn) {
  2217. return setTimeout(fn, 0);
  2218. }
  2219. function _cancelNextTick(id) {
  2220. return clearTimeout(id);
  2221. } // Fixed #973:
  2222. if (documentExists) {
  2223. on(document, 'touchmove', function (evt) {
  2224. if ((Sortable.active || awaitingDragStarted) && evt.cancelable) {
  2225. evt.preventDefault();
  2226. }
  2227. });
  2228. } // Export utils
  2229. Sortable.utils = {
  2230. on: on,
  2231. off: off,
  2232. css: css,
  2233. find: find,
  2234. is: function is(el, selector) {
  2235. return !!closest(el, selector, el, false);
  2236. },
  2237. extend: extend,
  2238. throttle: throttle,
  2239. closest: closest,
  2240. toggleClass: toggleClass,
  2241. clone: clone,
  2242. index: index,
  2243. nextTick: _nextTick,
  2244. cancelNextTick: _cancelNextTick,
  2245. detectDirection: _detectDirection,
  2246. getChild: getChild
  2247. };
  2248. /**
  2249. * Get the Sortable instance of an element
  2250. * @param {HTMLElement} element The element
  2251. * @return {Sortable|undefined} The instance of Sortable
  2252. */
  2253. Sortable.get = function (element) {
  2254. return element[expando];
  2255. };
  2256. /**
  2257. * Mount a plugin to Sortable
  2258. * @param {...SortablePlugin|SortablePlugin[]} plugins Plugins being mounted
  2259. */
  2260. Sortable.mount = function () {
  2261. for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) {
  2262. plugins[_key] = arguments[_key];
  2263. }
  2264. if (plugins[0].constructor === Array) plugins = plugins[0];
  2265. plugins.forEach(function (plugin) {
  2266. if (!plugin.prototype || !plugin.prototype.constructor) {
  2267. throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(plugin));
  2268. }
  2269. if (plugin.utils) Sortable.utils = _objectSpread2(_objectSpread2({}, Sortable.utils), plugin.utils);
  2270. PluginManager.mount(plugin);
  2271. });
  2272. };
  2273. /**
  2274. * Create sortable instance
  2275. * @param {HTMLElement} el
  2276. * @param {Object} [options]
  2277. */
  2278. Sortable.create = function (el, options) {
  2279. return new Sortable(el, options);
  2280. }; // Export
  2281. Sortable.version = version;
  2282. var autoScrolls = [],
  2283. scrollEl,
  2284. scrollRootEl,
  2285. scrolling = false,
  2286. lastAutoScrollX,
  2287. lastAutoScrollY,
  2288. touchEvt$1,
  2289. pointerElemChangedInterval;
  2290. function AutoScrollPlugin() {
  2291. function AutoScroll() {
  2292. this.defaults = {
  2293. scroll: true,
  2294. forceAutoScrollFallback: false,
  2295. scrollSensitivity: 30,
  2296. scrollSpeed: 10,
  2297. bubbleScroll: true
  2298. }; // Bind all private methods
  2299. for (var fn in this) {
  2300. if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
  2301. this[fn] = this[fn].bind(this);
  2302. }
  2303. }
  2304. }
  2305. AutoScroll.prototype = {
  2306. dragStarted: function dragStarted(_ref) {
  2307. var originalEvent = _ref.originalEvent;
  2308. if (this.sortable.nativeDraggable) {
  2309. on(document, 'dragover', this._handleAutoScroll);
  2310. } else {
  2311. if (this.options.supportPointer) {
  2312. on(document, 'pointermove', this._handleFallbackAutoScroll);
  2313. } else if (originalEvent.touches) {
  2314. on(document, 'touchmove', this._handleFallbackAutoScroll);
  2315. } else {
  2316. on(document, 'mousemove', this._handleFallbackAutoScroll);
  2317. }
  2318. }
  2319. },
  2320. dragOverCompleted: function dragOverCompleted(_ref2) {
  2321. var originalEvent = _ref2.originalEvent;
  2322. // For when bubbling is canceled and using fallback (fallback 'touchmove' always reached)
  2323. if (!this.options.dragOverBubble && !originalEvent.rootEl) {
  2324. this._handleAutoScroll(originalEvent);
  2325. }
  2326. },
  2327. drop: function drop() {
  2328. if (this.sortable.nativeDraggable) {
  2329. off(document, 'dragover', this._handleAutoScroll);
  2330. } else {
  2331. off(document, 'pointermove', this._handleFallbackAutoScroll);
  2332. off(document, 'touchmove', this._handleFallbackAutoScroll);
  2333. off(document, 'mousemove', this._handleFallbackAutoScroll);
  2334. }
  2335. clearPointerElemChangedInterval();
  2336. clearAutoScrolls();
  2337. cancelThrottle();
  2338. },
  2339. nulling: function nulling() {
  2340. touchEvt$1 = scrollRootEl = scrollEl = scrolling = pointerElemChangedInterval = lastAutoScrollX = lastAutoScrollY = null;
  2341. autoScrolls.length = 0;
  2342. },
  2343. _handleFallbackAutoScroll: function _handleFallbackAutoScroll(evt) {
  2344. this._handleAutoScroll(evt, true);
  2345. },
  2346. _handleAutoScroll: function _handleAutoScroll(evt, fallback) {
  2347. var _this = this;
  2348. var x = (evt.touches ? evt.touches[0] : evt).clientX,
  2349. y = (evt.touches ? evt.touches[0] : evt).clientY,
  2350. elem = document.elementFromPoint(x, y);
  2351. touchEvt$1 = evt; // IE does not seem to have native autoscroll,
  2352. // Edge's autoscroll seems too conditional,
  2353. // MACOS Safari does not have autoscroll,
  2354. // Firefox and Chrome are good
  2355. if (fallback || this.options.forceAutoScrollFallback || Edge || IE11OrLess || Safari) {
  2356. autoScroll(evt, this.options, elem, fallback); // Listener for pointer element change
  2357. var ogElemScroller = getParentAutoScrollElement(elem, true);
  2358. if (scrolling && (!pointerElemChangedInterval || x !== lastAutoScrollX || y !== lastAutoScrollY)) {
  2359. pointerElemChangedInterval && clearPointerElemChangedInterval(); // Detect for pointer elem change, emulating native DnD behaviour
  2360. pointerElemChangedInterval = setInterval(function () {
  2361. var newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true);
  2362. if (newElem !== ogElemScroller) {
  2363. ogElemScroller = newElem;
  2364. clearAutoScrolls();
  2365. }
  2366. autoScroll(evt, _this.options, newElem, fallback);
  2367. }, 10);
  2368. lastAutoScrollX = x;
  2369. lastAutoScrollY = y;
  2370. }
  2371. } else {
  2372. // if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll
  2373. if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) {
  2374. clearAutoScrolls();
  2375. return;
  2376. }
  2377. autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false);
  2378. }
  2379. }
  2380. };
  2381. return _extends(AutoScroll, {
  2382. pluginName: 'scroll',
  2383. initializeByDefault: true
  2384. });
  2385. }
  2386. function clearAutoScrolls() {
  2387. autoScrolls.forEach(function (autoScroll) {
  2388. clearInterval(autoScroll.pid);
  2389. });
  2390. autoScrolls = [];
  2391. }
  2392. function clearPointerElemChangedInterval() {
  2393. clearInterval(pointerElemChangedInterval);
  2394. }
  2395. var autoScroll = throttle(function (evt, options, rootEl, isFallback) {
  2396. // Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521
  2397. if (!options.scroll) return;
  2398. var x = (evt.touches ? evt.touches[0] : evt).clientX,
  2399. y = (evt.touches ? evt.touches[0] : evt).clientY,
  2400. sens = options.scrollSensitivity,
  2401. speed = options.scrollSpeed,
  2402. winScroller = getWindowScrollingElement();
  2403. var scrollThisInstance = false,
  2404. scrollCustomFn; // New scroll root, set scrollEl
  2405. if (scrollRootEl !== rootEl) {
  2406. scrollRootEl = rootEl;
  2407. clearAutoScrolls();
  2408. scrollEl = options.scroll;
  2409. scrollCustomFn = options.scrollFn;
  2410. if (scrollEl === true) {
  2411. scrollEl = getParentAutoScrollElement(rootEl, true);
  2412. }
  2413. }
  2414. var layersOut = 0;
  2415. var currentParent = scrollEl;
  2416. do {
  2417. var el = currentParent,
  2418. rect = getRect(el),
  2419. top = rect.top,
  2420. bottom = rect.bottom,
  2421. left = rect.left,
  2422. right = rect.right,
  2423. width = rect.width,
  2424. height = rect.height,
  2425. canScrollX = void 0,
  2426. canScrollY = void 0,
  2427. scrollWidth = el.scrollWidth,
  2428. scrollHeight = el.scrollHeight,
  2429. elCSS = css(el),
  2430. scrollPosX = el.scrollLeft,
  2431. scrollPosY = el.scrollTop;
  2432. if (el === winScroller) {
  2433. canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible');
  2434. canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible');
  2435. } else {
  2436. canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll');
  2437. canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll');
  2438. }
  2439. var vx = canScrollX && (Math.abs(right - x) <= sens && scrollPosX + width < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX);
  2440. var vy = canScrollY && (Math.abs(bottom - y) <= sens && scrollPosY + height < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY);
  2441. if (!autoScrolls[layersOut]) {
  2442. for (var i = 0; i <= layersOut; i++) {
  2443. if (!autoScrolls[i]) {
  2444. autoScrolls[i] = {};
  2445. }
  2446. }
  2447. }
  2448. if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) {
  2449. autoScrolls[layersOut].el = el;
  2450. autoScrolls[layersOut].vx = vx;
  2451. autoScrolls[layersOut].vy = vy;
  2452. clearInterval(autoScrolls[layersOut].pid);
  2453. if (vx != 0 || vy != 0) {
  2454. scrollThisInstance = true;
  2455. /* jshint loopfunc:true */
  2456. autoScrolls[layersOut].pid = setInterval(function () {
  2457. // emulate drag over during autoscroll (fallback), emulating native DnD behaviour
  2458. if (isFallback && this.layer === 0) {
  2459. Sortable.active._onTouchMove(touchEvt$1); // To move ghost if it is positioned absolutely
  2460. }
  2461. var scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0;
  2462. var scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0;
  2463. if (typeof scrollCustomFn === 'function') {
  2464. if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt$1, autoScrolls[this.layer].el) !== 'continue') {
  2465. return;
  2466. }
  2467. }
  2468. scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY);
  2469. }.bind({
  2470. layer: layersOut
  2471. }), 24);
  2472. }
  2473. }
  2474. layersOut++;
  2475. } while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false)));
  2476. scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not
  2477. }, 30);
  2478. var drop = function drop(_ref) {
  2479. var originalEvent = _ref.originalEvent,
  2480. putSortable = _ref.putSortable,
  2481. dragEl = _ref.dragEl,
  2482. activeSortable = _ref.activeSortable,
  2483. dispatchSortableEvent = _ref.dispatchSortableEvent,
  2484. hideGhostForTarget = _ref.hideGhostForTarget,
  2485. unhideGhostForTarget = _ref.unhideGhostForTarget;
  2486. if (!originalEvent) return;
  2487. var toSortable = putSortable || activeSortable;
  2488. hideGhostForTarget();
  2489. var touch = originalEvent.changedTouches && originalEvent.changedTouches.length ? originalEvent.changedTouches[0] : originalEvent;
  2490. var target = document.elementFromPoint(touch.clientX, touch.clientY);
  2491. unhideGhostForTarget();
  2492. if (toSortable && !toSortable.el.contains(target)) {
  2493. dispatchSortableEvent('spill');
  2494. this.onSpill({
  2495. dragEl: dragEl,
  2496. putSortable: putSortable
  2497. });
  2498. }
  2499. };
  2500. function Revert() {}
  2501. Revert.prototype = {
  2502. startIndex: null,
  2503. dragStart: function dragStart(_ref2) {
  2504. var oldDraggableIndex = _ref2.oldDraggableIndex;
  2505. this.startIndex = oldDraggableIndex;
  2506. },
  2507. onSpill: function onSpill(_ref3) {
  2508. var dragEl = _ref3.dragEl,
  2509. putSortable = _ref3.putSortable;
  2510. this.sortable.captureAnimationState();
  2511. if (putSortable) {
  2512. putSortable.captureAnimationState();
  2513. }
  2514. var nextSibling = getChild(this.sortable.el, this.startIndex, this.options);
  2515. if (nextSibling) {
  2516. this.sortable.el.insertBefore(dragEl, nextSibling);
  2517. } else {
  2518. this.sortable.el.appendChild(dragEl);
  2519. }
  2520. this.sortable.animateAll();
  2521. if (putSortable) {
  2522. putSortable.animateAll();
  2523. }
  2524. },
  2525. drop: drop
  2526. };
  2527. _extends(Revert, {
  2528. pluginName: 'revertOnSpill'
  2529. });
  2530. function Remove() {}
  2531. Remove.prototype = {
  2532. onSpill: function onSpill(_ref4) {
  2533. var dragEl = _ref4.dragEl,
  2534. putSortable = _ref4.putSortable;
  2535. var parentSortable = putSortable || this.sortable;
  2536. parentSortable.captureAnimationState();
  2537. dragEl.parentNode && dragEl.parentNode.removeChild(dragEl);
  2538. parentSortable.animateAll();
  2539. },
  2540. drop: drop
  2541. };
  2542. _extends(Remove, {
  2543. pluginName: 'removeOnSpill'
  2544. });
  2545. var lastSwapEl;
  2546. function SwapPlugin() {
  2547. function Swap() {
  2548. this.defaults = {
  2549. swapClass: 'sortable-swap-highlight'
  2550. };
  2551. }
  2552. Swap.prototype = {
  2553. dragStart: function dragStart(_ref) {
  2554. var dragEl = _ref.dragEl;
  2555. lastSwapEl = dragEl;
  2556. },
  2557. dragOverValid: function dragOverValid(_ref2) {
  2558. var completed = _ref2.completed,
  2559. target = _ref2.target,
  2560. onMove = _ref2.onMove,
  2561. activeSortable = _ref2.activeSortable,
  2562. changed = _ref2.changed,
  2563. cancel = _ref2.cancel;
  2564. if (!activeSortable.options.swap) return;
  2565. var el = this.sortable.el,
  2566. options = this.options;
  2567. if (target && target !== el) {
  2568. var prevSwapEl = lastSwapEl;
  2569. if (onMove(target) !== false) {
  2570. toggleClass(target, options.swapClass, true);
  2571. lastSwapEl = target;
  2572. } else {
  2573. lastSwapEl = null;
  2574. }
  2575. if (prevSwapEl && prevSwapEl !== lastSwapEl) {
  2576. toggleClass(prevSwapEl, options.swapClass, false);
  2577. }
  2578. }
  2579. changed();
  2580. completed(true);
  2581. cancel();
  2582. },
  2583. drop: function drop(_ref3) {
  2584. var activeSortable = _ref3.activeSortable,
  2585. putSortable = _ref3.putSortable,
  2586. dragEl = _ref3.dragEl;
  2587. var toSortable = putSortable || this.sortable;
  2588. var options = this.options;
  2589. lastSwapEl && toggleClass(lastSwapEl, options.swapClass, false);
  2590. if (lastSwapEl && (options.swap || putSortable && putSortable.options.swap)) {
  2591. if (dragEl !== lastSwapEl) {
  2592. toSortable.captureAnimationState();
  2593. if (toSortable !== activeSortable) activeSortable.captureAnimationState();
  2594. swapNodes(dragEl, lastSwapEl);
  2595. toSortable.animateAll();
  2596. if (toSortable !== activeSortable) activeSortable.animateAll();
  2597. }
  2598. }
  2599. },
  2600. nulling: function nulling() {
  2601. lastSwapEl = null;
  2602. }
  2603. };
  2604. return _extends(Swap, {
  2605. pluginName: 'swap',
  2606. eventProperties: function eventProperties() {
  2607. return {
  2608. swapItem: lastSwapEl
  2609. };
  2610. }
  2611. });
  2612. }
  2613. function swapNodes(n1, n2) {
  2614. var p1 = n1.parentNode,
  2615. p2 = n2.parentNode,
  2616. i1,
  2617. i2;
  2618. if (!p1 || !p2 || p1.isEqualNode(n2) || p2.isEqualNode(n1)) return;
  2619. i1 = index(n1);
  2620. i2 = index(n2);
  2621. if (p1.isEqualNode(p2) && i1 < i2) {
  2622. i2++;
  2623. }
  2624. p1.insertBefore(n2, p1.children[i1]);
  2625. p2.insertBefore(n1, p2.children[i2]);
  2626. }
  2627. var multiDragElements = [],
  2628. multiDragClones = [],
  2629. lastMultiDragSelect,
  2630. // for selection with modifier key down (SHIFT)
  2631. multiDragSortable,
  2632. initialFolding = false,
  2633. // Initial multi-drag fold when drag started
  2634. folding = false,
  2635. // Folding any other time
  2636. dragStarted = false,
  2637. dragEl$1,
  2638. clonesFromRect,
  2639. clonesHidden;
  2640. function MultiDragPlugin() {
  2641. function MultiDrag(sortable) {
  2642. // Bind all private methods
  2643. for (var fn in this) {
  2644. if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
  2645. this[fn] = this[fn].bind(this);
  2646. }
  2647. }
  2648. if (!sortable.options.avoidImplicitDeselect) {
  2649. if (sortable.options.supportPointer) {
  2650. on(document, 'pointerup', this._deselectMultiDrag);
  2651. } else {
  2652. on(document, 'mouseup', this._deselectMultiDrag);
  2653. on(document, 'touchend', this._deselectMultiDrag);
  2654. }
  2655. }
  2656. on(document, 'keydown', this._checkKeyDown);
  2657. on(document, 'keyup', this._checkKeyUp);
  2658. this.defaults = {
  2659. selectedClass: 'sortable-selected',
  2660. multiDragKey: null,
  2661. avoidImplicitDeselect: false,
  2662. setData: function setData(dataTransfer, dragEl) {
  2663. var data = '';
  2664. if (multiDragElements.length && multiDragSortable === sortable) {
  2665. multiDragElements.forEach(function (multiDragElement, i) {
  2666. data += (!i ? '' : ', ') + multiDragElement.textContent;
  2667. });
  2668. } else {
  2669. data = dragEl.textContent;
  2670. }
  2671. dataTransfer.setData('Text', data);
  2672. }
  2673. };
  2674. }
  2675. MultiDrag.prototype = {
  2676. multiDragKeyDown: false,
  2677. isMultiDrag: false,
  2678. delayStartGlobal: function delayStartGlobal(_ref) {
  2679. var dragged = _ref.dragEl;
  2680. dragEl$1 = dragged;
  2681. },
  2682. delayEnded: function delayEnded() {
  2683. this.isMultiDrag = ~multiDragElements.indexOf(dragEl$1);
  2684. },
  2685. setupClone: function setupClone(_ref2) {
  2686. var sortable = _ref2.sortable,
  2687. cancel = _ref2.cancel;
  2688. if (!this.isMultiDrag) return;
  2689. for (var i = 0; i < multiDragElements.length; i++) {
  2690. multiDragClones.push(clone(multiDragElements[i]));
  2691. multiDragClones[i].sortableIndex = multiDragElements[i].sortableIndex;
  2692. multiDragClones[i].draggable = false;
  2693. multiDragClones[i].style['will-change'] = '';
  2694. toggleClass(multiDragClones[i], this.options.selectedClass, false);
  2695. multiDragElements[i] === dragEl$1 && toggleClass(multiDragClones[i], this.options.chosenClass, false);
  2696. }
  2697. sortable._hideClone();
  2698. cancel();
  2699. },
  2700. clone: function clone(_ref3) {
  2701. var sortable = _ref3.sortable,
  2702. rootEl = _ref3.rootEl,
  2703. dispatchSortableEvent = _ref3.dispatchSortableEvent,
  2704. cancel = _ref3.cancel;
  2705. if (!this.isMultiDrag) return;
  2706. if (!this.options.removeCloneOnHide) {
  2707. if (multiDragElements.length && multiDragSortable === sortable) {
  2708. insertMultiDragClones(true, rootEl);
  2709. dispatchSortableEvent('clone');
  2710. cancel();
  2711. }
  2712. }
  2713. },
  2714. showClone: function showClone(_ref4) {
  2715. var cloneNowShown = _ref4.cloneNowShown,
  2716. rootEl = _ref4.rootEl,
  2717. cancel = _ref4.cancel;
  2718. if (!this.isMultiDrag) return;
  2719. insertMultiDragClones(false, rootEl);
  2720. multiDragClones.forEach(function (clone) {
  2721. css(clone, 'display', '');
  2722. });
  2723. cloneNowShown();
  2724. clonesHidden = false;
  2725. cancel();
  2726. },
  2727. hideClone: function hideClone(_ref5) {
  2728. var _this = this;
  2729. var sortable = _ref5.sortable,
  2730. cloneNowHidden = _ref5.cloneNowHidden,
  2731. cancel = _ref5.cancel;
  2732. if (!this.isMultiDrag) return;
  2733. multiDragClones.forEach(function (clone) {
  2734. css(clone, 'display', 'none');
  2735. if (_this.options.removeCloneOnHide && clone.parentNode) {
  2736. clone.parentNode.removeChild(clone);
  2737. }
  2738. });
  2739. cloneNowHidden();
  2740. clonesHidden = true;
  2741. cancel();
  2742. },
  2743. dragStartGlobal: function dragStartGlobal(_ref6) {
  2744. var sortable = _ref6.sortable;
  2745. if (!this.isMultiDrag && multiDragSortable) {
  2746. multiDragSortable.multiDrag._deselectMultiDrag();
  2747. }
  2748. multiDragElements.forEach(function (multiDragElement) {
  2749. multiDragElement.sortableIndex = index(multiDragElement);
  2750. }); // Sort multi-drag elements
  2751. multiDragElements = multiDragElements.sort(function (a, b) {
  2752. return a.sortableIndex - b.sortableIndex;
  2753. });
  2754. dragStarted = true;
  2755. },
  2756. dragStarted: function dragStarted(_ref7) {
  2757. var _this2 = this;
  2758. var sortable = _ref7.sortable;
  2759. if (!this.isMultiDrag) return;
  2760. if (this.options.sort) {
  2761. // Capture rects,
  2762. // hide multi drag elements (by positioning them absolute),
  2763. // set multi drag elements rects to dragRect,
  2764. // show multi drag elements,
  2765. // animate to rects,
  2766. // unset rects & remove from DOM
  2767. sortable.captureAnimationState();
  2768. if (this.options.animation) {
  2769. multiDragElements.forEach(function (multiDragElement) {
  2770. if (multiDragElement === dragEl$1) return;
  2771. css(multiDragElement, 'position', 'absolute');
  2772. });
  2773. var dragRect = getRect(dragEl$1, false, true, true);
  2774. multiDragElements.forEach(function (multiDragElement) {
  2775. if (multiDragElement === dragEl$1) return;
  2776. setRect(multiDragElement, dragRect);
  2777. });
  2778. folding = true;
  2779. initialFolding = true;
  2780. }
  2781. }
  2782. sortable.animateAll(function () {
  2783. folding = false;
  2784. initialFolding = false;
  2785. if (_this2.options.animation) {
  2786. multiDragElements.forEach(function (multiDragElement) {
  2787. unsetRect(multiDragElement);
  2788. });
  2789. } // Remove all auxiliary multidrag items from el, if sorting enabled
  2790. if (_this2.options.sort) {
  2791. removeMultiDragElements();
  2792. }
  2793. });
  2794. },
  2795. dragOver: function dragOver(_ref8) {
  2796. var target = _ref8.target,
  2797. completed = _ref8.completed,
  2798. cancel = _ref8.cancel;
  2799. if (folding && ~multiDragElements.indexOf(target)) {
  2800. completed(false);
  2801. cancel();
  2802. }
  2803. },
  2804. revert: function revert(_ref9) {
  2805. var fromSortable = _ref9.fromSortable,
  2806. rootEl = _ref9.rootEl,
  2807. sortable = _ref9.sortable,
  2808. dragRect = _ref9.dragRect;
  2809. if (multiDragElements.length > 1) {
  2810. // Setup unfold animation
  2811. multiDragElements.forEach(function (multiDragElement) {
  2812. sortable.addAnimationState({
  2813. target: multiDragElement,
  2814. rect: folding ? getRect(multiDragElement) : dragRect
  2815. });
  2816. unsetRect(multiDragElement);
  2817. multiDragElement.fromRect = dragRect;
  2818. fromSortable.removeAnimationState(multiDragElement);
  2819. });
  2820. folding = false;
  2821. insertMultiDragElements(!this.options.removeCloneOnHide, rootEl);
  2822. }
  2823. },
  2824. dragOverCompleted: function dragOverCompleted(_ref10) {
  2825. var sortable = _ref10.sortable,
  2826. isOwner = _ref10.isOwner,
  2827. insertion = _ref10.insertion,
  2828. activeSortable = _ref10.activeSortable,
  2829. parentEl = _ref10.parentEl,
  2830. putSortable = _ref10.putSortable;
  2831. var options = this.options;
  2832. if (insertion) {
  2833. // Clones must be hidden before folding animation to capture dragRectAbsolute properly
  2834. if (isOwner) {
  2835. activeSortable._hideClone();
  2836. }
  2837. initialFolding = false; // If leaving sort:false root, or already folding - Fold to new location
  2838. if (options.animation && multiDragElements.length > 1 && (folding || !isOwner && !activeSortable.options.sort && !putSortable)) {
  2839. // Fold: Set all multi drag elements's rects to dragEl's rect when multi-drag elements are invisible
  2840. var dragRectAbsolute = getRect(dragEl$1, false, true, true);
  2841. multiDragElements.forEach(function (multiDragElement) {
  2842. if (multiDragElement === dragEl$1) return;
  2843. setRect(multiDragElement, dragRectAbsolute); // Move element(s) to end of parentEl so that it does not interfere with multi-drag clones insertion if they are inserted
  2844. // while folding, and so that we can capture them again because old sortable will no longer be fromSortable
  2845. parentEl.appendChild(multiDragElement);
  2846. });
  2847. folding = true;
  2848. } // Clones must be shown (and check to remove multi drags) after folding when interfering multiDragElements are moved out
  2849. if (!isOwner) {
  2850. // Only remove if not folding (folding will remove them anyways)
  2851. if (!folding) {
  2852. removeMultiDragElements();
  2853. }
  2854. if (multiDragElements.length > 1) {
  2855. var clonesHiddenBefore = clonesHidden;
  2856. activeSortable._showClone(sortable); // Unfold animation for clones if showing from hidden
  2857. if (activeSortable.options.animation && !clonesHidden && clonesHiddenBefore) {
  2858. multiDragClones.forEach(function (clone) {
  2859. activeSortable.addAnimationState({
  2860. target: clone,
  2861. rect: clonesFromRect
  2862. });
  2863. clone.fromRect = clonesFromRect;
  2864. clone.thisAnimationDuration = null;
  2865. });
  2866. }
  2867. } else {
  2868. activeSortable._showClone(sortable);
  2869. }
  2870. }
  2871. }
  2872. },
  2873. dragOverAnimationCapture: function dragOverAnimationCapture(_ref11) {
  2874. var dragRect = _ref11.dragRect,
  2875. isOwner = _ref11.isOwner,
  2876. activeSortable = _ref11.activeSortable;
  2877. multiDragElements.forEach(function (multiDragElement) {
  2878. multiDragElement.thisAnimationDuration = null;
  2879. });
  2880. if (activeSortable.options.animation && !isOwner && activeSortable.multiDrag.isMultiDrag) {
  2881. clonesFromRect = _extends({}, dragRect);
  2882. var dragMatrix = matrix(dragEl$1, true);
  2883. clonesFromRect.top -= dragMatrix.f;
  2884. clonesFromRect.left -= dragMatrix.e;
  2885. }
  2886. },
  2887. dragOverAnimationComplete: function dragOverAnimationComplete() {
  2888. if (folding) {
  2889. folding = false;
  2890. removeMultiDragElements();
  2891. }
  2892. },
  2893. drop: function drop(_ref12) {
  2894. var evt = _ref12.originalEvent,
  2895. rootEl = _ref12.rootEl,
  2896. parentEl = _ref12.parentEl,
  2897. sortable = _ref12.sortable,
  2898. dispatchSortableEvent = _ref12.dispatchSortableEvent,
  2899. oldIndex = _ref12.oldIndex,
  2900. putSortable = _ref12.putSortable;
  2901. var toSortable = putSortable || this.sortable;
  2902. if (!evt) return;
  2903. var options = this.options,
  2904. children = parentEl.children; // Multi-drag selection
  2905. if (!dragStarted) {
  2906. if (options.multiDragKey && !this.multiDragKeyDown) {
  2907. this._deselectMultiDrag();
  2908. }
  2909. toggleClass(dragEl$1, options.selectedClass, !~multiDragElements.indexOf(dragEl$1));
  2910. if (!~multiDragElements.indexOf(dragEl$1)) {
  2911. multiDragElements.push(dragEl$1);
  2912. dispatchEvent({
  2913. sortable: sortable,
  2914. rootEl: rootEl,
  2915. name: 'select',
  2916. targetEl: dragEl$1,
  2917. originalEvent: evt
  2918. }); // Modifier activated, select from last to dragEl
  2919. if (evt.shiftKey && lastMultiDragSelect && sortable.el.contains(lastMultiDragSelect)) {
  2920. var lastIndex = index(lastMultiDragSelect),
  2921. currentIndex = index(dragEl$1);
  2922. if (~lastIndex && ~currentIndex && lastIndex !== currentIndex) {
  2923. // Must include lastMultiDragSelect (select it), in case modified selection from no selection
  2924. // (but previous selection existed)
  2925. var n, i;
  2926. if (currentIndex > lastIndex) {
  2927. i = lastIndex;
  2928. n = currentIndex;
  2929. } else {
  2930. i = currentIndex;
  2931. n = lastIndex + 1;
  2932. }
  2933. for (; i < n; i++) {
  2934. if (~multiDragElements.indexOf(children[i])) continue;
  2935. toggleClass(children[i], options.selectedClass, true);
  2936. multiDragElements.push(children[i]);
  2937. dispatchEvent({
  2938. sortable: sortable,
  2939. rootEl: rootEl,
  2940. name: 'select',
  2941. targetEl: children[i],
  2942. originalEvent: evt
  2943. });
  2944. }
  2945. }
  2946. } else {
  2947. lastMultiDragSelect = dragEl$1;
  2948. }
  2949. multiDragSortable = toSortable;
  2950. } else {
  2951. multiDragElements.splice(multiDragElements.indexOf(dragEl$1), 1);
  2952. lastMultiDragSelect = null;
  2953. dispatchEvent({
  2954. sortable: sortable,
  2955. rootEl: rootEl,
  2956. name: 'deselect',
  2957. targetEl: dragEl$1,
  2958. originalEvent: evt
  2959. });
  2960. }
  2961. } // Multi-drag drop
  2962. if (dragStarted && this.isMultiDrag) {
  2963. folding = false; // Do not "unfold" after around dragEl if reverted
  2964. if ((parentEl[expando].options.sort || parentEl !== rootEl) && multiDragElements.length > 1) {
  2965. var dragRect = getRect(dragEl$1),
  2966. multiDragIndex = index(dragEl$1, ':not(.' + this.options.selectedClass + ')');
  2967. if (!initialFolding && options.animation) dragEl$1.thisAnimationDuration = null;
  2968. toSortable.captureAnimationState();
  2969. if (!initialFolding) {
  2970. if (options.animation) {
  2971. dragEl$1.fromRect = dragRect;
  2972. multiDragElements.forEach(function (multiDragElement) {
  2973. multiDragElement.thisAnimationDuration = null;
  2974. if (multiDragElement !== dragEl$1) {
  2975. var rect = folding ? getRect(multiDragElement) : dragRect;
  2976. multiDragElement.fromRect = rect; // Prepare unfold animation
  2977. toSortable.addAnimationState({
  2978. target: multiDragElement,
  2979. rect: rect
  2980. });
  2981. }
  2982. });
  2983. } // Multi drag elements are not necessarily removed from the DOM on drop, so to reinsert
  2984. // properly they must all be removed
  2985. removeMultiDragElements();
  2986. multiDragElements.forEach(function (multiDragElement) {
  2987. if (children[multiDragIndex]) {
  2988. parentEl.insertBefore(multiDragElement, children[multiDragIndex]);
  2989. } else {
  2990. parentEl.appendChild(multiDragElement);
  2991. }
  2992. multiDragIndex++;
  2993. }); // If initial folding is done, the elements may have changed position because they are now
  2994. // unfolding around dragEl, even though dragEl may not have his index changed, so update event
  2995. // must be fired here as Sortable will not.
  2996. if (oldIndex === index(dragEl$1)) {
  2997. var update = false;
  2998. multiDragElements.forEach(function (multiDragElement) {
  2999. if (multiDragElement.sortableIndex !== index(multiDragElement)) {
  3000. update = true;
  3001. return;
  3002. }
  3003. });
  3004. if (update) {
  3005. dispatchSortableEvent('update');
  3006. }
  3007. }
  3008. } // Must be done after capturing individual rects (scroll bar)
  3009. multiDragElements.forEach(function (multiDragElement) {
  3010. unsetRect(multiDragElement);
  3011. });
  3012. toSortable.animateAll();
  3013. }
  3014. multiDragSortable = toSortable;
  3015. } // Remove clones if necessary
  3016. if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
  3017. multiDragClones.forEach(function (clone) {
  3018. clone.parentNode && clone.parentNode.removeChild(clone);
  3019. });
  3020. }
  3021. },
  3022. nullingGlobal: function nullingGlobal() {
  3023. this.isMultiDrag = dragStarted = false;
  3024. multiDragClones.length = 0;
  3025. },
  3026. destroyGlobal: function destroyGlobal() {
  3027. this._deselectMultiDrag();
  3028. off(document, 'pointerup', this._deselectMultiDrag);
  3029. off(document, 'mouseup', this._deselectMultiDrag);
  3030. off(document, 'touchend', this._deselectMultiDrag);
  3031. off(document, 'keydown', this._checkKeyDown);
  3032. off(document, 'keyup', this._checkKeyUp);
  3033. },
  3034. _deselectMultiDrag: function _deselectMultiDrag(evt) {
  3035. if (typeof dragStarted !== "undefined" && dragStarted) return; // Only deselect if selection is in this sortable
  3036. if (multiDragSortable !== this.sortable) return; // Only deselect if target is not item in this sortable
  3037. if (evt && closest(evt.target, this.options.draggable, this.sortable.el, false)) return; // Only deselect if left click
  3038. if (evt && evt.button !== 0) return;
  3039. while (multiDragElements.length) {
  3040. var el = multiDragElements[0];
  3041. toggleClass(el, this.options.selectedClass, false);
  3042. multiDragElements.shift();
  3043. dispatchEvent({
  3044. sortable: this.sortable,
  3045. rootEl: this.sortable.el,
  3046. name: 'deselect',
  3047. targetEl: el,
  3048. originalEvent: evt
  3049. });
  3050. }
  3051. },
  3052. _checkKeyDown: function _checkKeyDown(evt) {
  3053. if (evt.key === this.options.multiDragKey) {
  3054. this.multiDragKeyDown = true;
  3055. }
  3056. },
  3057. _checkKeyUp: function _checkKeyUp(evt) {
  3058. if (evt.key === this.options.multiDragKey) {
  3059. this.multiDragKeyDown = false;
  3060. }
  3061. }
  3062. };
  3063. return _extends(MultiDrag, {
  3064. // Static methods & properties
  3065. pluginName: 'multiDrag',
  3066. utils: {
  3067. /**
  3068. * Selects the provided multi-drag item
  3069. * @param {HTMLElement} el The element to be selected
  3070. */
  3071. select: function select(el) {
  3072. var sortable = el.parentNode[expando];
  3073. if (!sortable || !sortable.options.multiDrag || ~multiDragElements.indexOf(el)) return;
  3074. if (multiDragSortable && multiDragSortable !== sortable) {
  3075. multiDragSortable.multiDrag._deselectMultiDrag();
  3076. multiDragSortable = sortable;
  3077. }
  3078. toggleClass(el, sortable.options.selectedClass, true);
  3079. multiDragElements.push(el);
  3080. },
  3081. /**
  3082. * Deselects the provided multi-drag item
  3083. * @param {HTMLElement} el The element to be deselected
  3084. */
  3085. deselect: function deselect(el) {
  3086. var sortable = el.parentNode[expando],
  3087. index = multiDragElements.indexOf(el);
  3088. if (!sortable || !sortable.options.multiDrag || !~index) return;
  3089. toggleClass(el, sortable.options.selectedClass, false);
  3090. multiDragElements.splice(index, 1);
  3091. }
  3092. },
  3093. eventProperties: function eventProperties() {
  3094. var _this3 = this;
  3095. var oldIndicies = [],
  3096. newIndicies = [];
  3097. multiDragElements.forEach(function (multiDragElement) {
  3098. oldIndicies.push({
  3099. multiDragElement: multiDragElement,
  3100. index: multiDragElement.sortableIndex
  3101. }); // multiDragElements will already be sorted if folding
  3102. var newIndex;
  3103. if (folding && multiDragElement !== dragEl$1) {
  3104. newIndex = -1;
  3105. } else if (folding) {
  3106. newIndex = index(multiDragElement, ':not(.' + _this3.options.selectedClass + ')');
  3107. } else {
  3108. newIndex = index(multiDragElement);
  3109. }
  3110. newIndicies.push({
  3111. multiDragElement: multiDragElement,
  3112. index: newIndex
  3113. });
  3114. });
  3115. return {
  3116. items: _toConsumableArray(multiDragElements),
  3117. clones: [].concat(multiDragClones),
  3118. oldIndicies: oldIndicies,
  3119. newIndicies: newIndicies
  3120. };
  3121. },
  3122. optionListeners: {
  3123. multiDragKey: function multiDragKey(key) {
  3124. key = key.toLowerCase();
  3125. if (key === 'ctrl') {
  3126. key = 'Control';
  3127. } else if (key.length > 1) {
  3128. key = key.charAt(0).toUpperCase() + key.substr(1);
  3129. }
  3130. return key;
  3131. }
  3132. }
  3133. });
  3134. }
  3135. function insertMultiDragElements(clonesInserted, rootEl) {
  3136. multiDragElements.forEach(function (multiDragElement, i) {
  3137. var target = rootEl.children[multiDragElement.sortableIndex + (clonesInserted ? Number(i) : 0)];
  3138. if (target) {
  3139. rootEl.insertBefore(multiDragElement, target);
  3140. } else {
  3141. rootEl.appendChild(multiDragElement);
  3142. }
  3143. });
  3144. }
  3145. /**
  3146. * Insert multi-drag clones
  3147. * @param {[Boolean]} elementsInserted Whether the multi-drag elements are inserted
  3148. * @param {HTMLElement} rootEl
  3149. */
  3150. function insertMultiDragClones(elementsInserted, rootEl) {
  3151. multiDragClones.forEach(function (clone, i) {
  3152. var target = rootEl.children[clone.sortableIndex + (elementsInserted ? Number(i) : 0)];
  3153. if (target) {
  3154. rootEl.insertBefore(clone, target);
  3155. } else {
  3156. rootEl.appendChild(clone);
  3157. }
  3158. });
  3159. }
  3160. function removeMultiDragElements() {
  3161. multiDragElements.forEach(function (multiDragElement) {
  3162. if (multiDragElement === dragEl$1) return;
  3163. multiDragElement.parentNode && multiDragElement.parentNode.removeChild(multiDragElement);
  3164. });
  3165. }
  3166. Sortable.mount(new AutoScrollPlugin());
  3167. Sortable.mount(Remove, Revert);
  3168. export default Sortable;
  3169. export { MultiDragPlugin as MultiDrag, Sortable, SwapPlugin as Swap };