splide.esm.js 137 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254525552565257525852595260526152625263526452655266526752685269527052715272527352745275527652775278527952805281528252835284528552865287528852895290529152925293529452955296529752985299530053015302530353045305530653075308530953105311531253135314531553165317531853195320532153225323532453255326532753285329533053315332533353345335533653375338533953405341534253435344534553465347534853495350535153525353535453555356535753585359536053615362536353645365536653675368536953705371537253735374537553765377537853795380538153825383538453855386538753885389539053915392539353945395539653975398539954005401540254035404540554065407540854095410541154125413541454155416541754185419542054215422542354245425542654275428542954305431543254335434543554365437543854395440544154425443544454455446544754485449545054515452545354545455545654575458545954605461546254635464546554665467546854695470547154725473547454755476547754785479548054815482548354845485548654875488548954905491549254935494549554965497549854995500550155025503550455055506550755085509551055115512551355145515551655175518551955205521552255235524552555265527552855295530553155325533553455355536553755385539554055415542554355445545554655475548554955505551555255535554555555565557555855595560556155625563556455655566556755685569557055715572557355745575557655775578557955805581558255835584558555865587558855895590559155925593559455955596559755985599560056015602560356045605560656075608560956105611561256135614561556165617561856195620562156225623562456255626562756285629563056315632563356345635563656375638563956405641564256435644564556465647564856495650565156525653565456555656565756585659566056615662566356645665566656675668566956705671567256735674567556765677567856795680568156825683568456855686568756885689569056915692569356945695569656975698569957005701570257035704570557065707570857095710571157125713571457155716571757185719572057215722572357245725572657275728572957305731573257335734573557365737573857395740574157425743574457455746574757485749575057515752575357545755575657575758575957605761576257635764576557665767576857695770577157725773577457755776577757785779578057815782578357845785578657875788578957905791579257935794579557965797579857995800580158025803580458055806580758085809581058115812581358145815581658175818581958205821582258235824582558265827582858295830583158325833583458355836583758385839584058415842584358445845584658475848584958505851585258535854585558565857585858595860586158625863586458655866586758685869587058715872587358745875587658775878587958805881588258835884588558865887588858895890589158925893589458955896589758985899590059015902590359045905590659075908590959105911591259135914591559165917591859195920592159225923
  1. /*!
  2. * Splide.js
  3. * Version : 2.4.13
  4. * License : MIT
  5. * Copyright: 2020 Naotoshi Fujita
  6. */
  7. (function webpackUniversalModuleDefinition(root, factory) {
  8. if(typeof exports === 'object' && typeof module === 'object')
  9. module.exports = factory();
  10. else if(typeof define === 'function' && define.amd)
  11. define([], factory);
  12. else if(typeof exports === 'object')
  13. exports["Splide"] = factory();
  14. else
  15. root["Splide"] = factory();
  16. })(window, function() {
  17. return /******/ (function(modules) { // webpackBootstrap
  18. /******/ // The module cache
  19. /******/ var installedModules = {};
  20. /******/
  21. /******/ // The require function
  22. /******/ function __webpack_require__(moduleId) {
  23. /******/
  24. /******/ // Check if module is in cache
  25. /******/ if(installedModules[moduleId]) {
  26. /******/ return installedModules[moduleId].exports;
  27. /******/ }
  28. /******/ // Create a new module (and put it into the cache)
  29. /******/ var module = installedModules[moduleId] = {
  30. /******/ i: moduleId,
  31. /******/ l: false,
  32. /******/ exports: {}
  33. /******/ };
  34. /******/
  35. /******/ // Execute the module function
  36. /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
  37. /******/
  38. /******/ // Flag the module as loaded
  39. /******/ module.l = true;
  40. /******/
  41. /******/ // Return the exports of the module
  42. /******/ return module.exports;
  43. /******/ }
  44. /******/
  45. /******/
  46. /******/ // expose the modules object (__webpack_modules__)
  47. /******/ __webpack_require__.m = modules;
  48. /******/
  49. /******/ // expose the module cache
  50. /******/ __webpack_require__.c = installedModules;
  51. /******/
  52. /******/ // define getter function for harmony exports
  53. /******/ __webpack_require__.d = function(exports, name, getter) {
  54. /******/ if(!__webpack_require__.o(exports, name)) {
  55. /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
  56. /******/ }
  57. /******/ };
  58. /******/
  59. /******/ // define __esModule on exports
  60. /******/ __webpack_require__.r = function(exports) {
  61. /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
  62. /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
  63. /******/ }
  64. /******/ Object.defineProperty(exports, '__esModule', { value: true });
  65. /******/ };
  66. /******/
  67. /******/ // create a fake namespace object
  68. /******/ // mode & 1: value is a module id, require it
  69. /******/ // mode & 2: merge all properties of value into the ns
  70. /******/ // mode & 4: return value when already ns object
  71. /******/ // mode & 8|1: behave like require
  72. /******/ __webpack_require__.t = function(value, mode) {
  73. /******/ if(mode & 1) value = __webpack_require__(value);
  74. /******/ if(mode & 8) return value;
  75. /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
  76. /******/ var ns = Object.create(null);
  77. /******/ __webpack_require__.r(ns);
  78. /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
  79. /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
  80. /******/ return ns;
  81. /******/ };
  82. /******/
  83. /******/ // getDefaultExport function for compatibility with non-harmony modules
  84. /******/ __webpack_require__.n = function(module) {
  85. /******/ var getter = module && module.__esModule ?
  86. /******/ function getDefault() { return module['default']; } :
  87. /******/ function getModuleExports() { return module; };
  88. /******/ __webpack_require__.d(getter, 'a', getter);
  89. /******/ return getter;
  90. /******/ };
  91. /******/
  92. /******/ // Object.prototype.hasOwnProperty.call
  93. /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
  94. /******/
  95. /******/ // __webpack_public_path__
  96. /******/ __webpack_require__.p = "";
  97. /******/
  98. /******/
  99. /******/ // Load entry module and return exports
  100. /******/ return __webpack_require__(__webpack_require__.s = 0);
  101. /******/ })
  102. /************************************************************************/
  103. /******/ ([
  104. /* 0 */
  105. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  106. "use strict";
  107. // ESM COMPAT FLAG
  108. __webpack_require__.r(__webpack_exports__);
  109. // EXPORTS
  110. __webpack_require__.d(__webpack_exports__, "default", function() { return /* binding */ module_Splide; });
  111. // NAMESPACE OBJECT: ./src/js/constants/states.js
  112. var states_namespaceObject = {};
  113. __webpack_require__.r(states_namespaceObject);
  114. __webpack_require__.d(states_namespaceObject, "CREATED", function() { return CREATED; });
  115. __webpack_require__.d(states_namespaceObject, "MOUNTED", function() { return MOUNTED; });
  116. __webpack_require__.d(states_namespaceObject, "IDLE", function() { return IDLE; });
  117. __webpack_require__.d(states_namespaceObject, "MOVING", function() { return MOVING; });
  118. __webpack_require__.d(states_namespaceObject, "DESTROYED", function() { return DESTROYED; });
  119. // CONCATENATED MODULE: ./src/js/core/event.js
  120. /**
  121. * The function for providing an Event object simply managing events.
  122. *
  123. * @author Naotoshi Fujita
  124. * @copyright Naotoshi Fujita. All rights reserved.
  125. */
  126. /**
  127. * The function for providing an Event object simply managing events.
  128. */
  129. /* harmony default export */ var core_event = (function () {
  130. /**
  131. * Store all event data.
  132. *
  133. * @type {Array}
  134. */
  135. var data = [];
  136. var Event = {
  137. /**
  138. * Subscribe the given event(s).
  139. *
  140. * @param {string} events - An event name. Use space to separate multiple events.
  141. * Also, namespace is accepted by dot, such as 'resize.{namespace}'.
  142. * @param {function} handler - A callback function.
  143. * @param {Element} elm - Optional. Native event will be listened to when this arg is provided.
  144. * @param {Object} options - Optional. Options for addEventListener.
  145. */
  146. on: function on(events, handler, elm, options) {
  147. if (elm === void 0) {
  148. elm = null;
  149. }
  150. if (options === void 0) {
  151. options = {};
  152. }
  153. events.split(' ').forEach(function (event) {
  154. if (elm) {
  155. elm.addEventListener(event, handler, options);
  156. }
  157. data.push({
  158. event: event,
  159. handler: handler,
  160. elm: elm,
  161. options: options
  162. });
  163. });
  164. },
  165. /**
  166. * Unsubscribe the given event(s).
  167. *
  168. * @param {string} events - A event name or names split by space.
  169. * @param {Element} elm - Optional. removeEventListener() will be called when this arg is provided.
  170. */
  171. off: function off(events, elm) {
  172. if (elm === void 0) {
  173. elm = null;
  174. }
  175. events.split(' ').forEach(function (event) {
  176. data = data.filter(function (item) {
  177. if (item && item.event === event && item.elm === elm) {
  178. unsubscribe(item);
  179. return false;
  180. }
  181. return true;
  182. });
  183. });
  184. },
  185. /**
  186. * Emit an event.
  187. * This method is only for custom events.
  188. *
  189. * @param {string} event - An event name.
  190. * @param {*} args - Any number of arguments passed to handlers.
  191. */
  192. emit: function emit(event) {
  193. for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
  194. args[_key - 1] = arguments[_key];
  195. }
  196. data.forEach(function (item) {
  197. if (!item.elm && item.event.split('.')[0] === event) {
  198. item.handler.apply(item, args);
  199. }
  200. });
  201. },
  202. /**
  203. * Clear event data.
  204. */
  205. destroy: function destroy() {
  206. data.forEach(unsubscribe);
  207. data = [];
  208. }
  209. };
  210. /**
  211. * Remove the registered event listener.
  212. *
  213. * @param {Object} item - An object containing event data.
  214. */
  215. function unsubscribe(item) {
  216. if (item.elm) {
  217. item.elm.removeEventListener(item.event, item.handler, item.options);
  218. }
  219. }
  220. return Event;
  221. });
  222. // CONCATENATED MODULE: ./src/js/core/state.js
  223. /**
  224. * The function providing a super simple state system.
  225. *
  226. * @author Naotoshi Fujita
  227. * @copyright Naotoshi Fujita. All rights reserved.
  228. */
  229. /**
  230. * The function providing a super simple state system.
  231. *
  232. * @param {string|number} initialState - Provide the initial state value.
  233. */
  234. /* harmony default export */ var state = (function (initialState) {
  235. /**
  236. * Store the current state.
  237. *
  238. * @type {string|number}
  239. */
  240. var curr = initialState;
  241. return {
  242. /**
  243. * Change state.
  244. *
  245. * @param {string|number} state - A new state.
  246. */
  247. set: function set(state) {
  248. curr = state;
  249. },
  250. /**
  251. * Verify if the current state is given one or not.
  252. *
  253. * @param {string|number} state - A state name to be verified.
  254. *
  255. * @return {boolean} - True if the current state is the given one.
  256. */
  257. is: function is(state) {
  258. return state === curr;
  259. }
  260. };
  261. });
  262. // CONCATENATED MODULE: ./src/js/utils/object.js
  263. function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
  264. /**
  265. * Some utility functions related with Object, supporting IE.
  266. *
  267. * @author Naotoshi Fujita
  268. * @copyright Naotoshi Fujita. All rights reserved.
  269. */
  270. var keys = Object.keys;
  271. /**
  272. * Iterate an object like Array.forEach.
  273. * IE doesn't support forEach of HTMLCollection.
  274. *
  275. * @param {Object} obj - An object.
  276. * @param {function} callback - A function handling each value. Arguments are value, property and index.
  277. */
  278. function each(obj, callback) {
  279. keys(obj).some(function (key, index) {
  280. return callback(obj[key], key, index);
  281. });
  282. }
  283. /**
  284. * Return values of the given object as an array.
  285. * IE doesn't support Object.values.
  286. *
  287. * @param {Object} obj - An object.
  288. *
  289. * @return {Array} - An array containing all values of the given object.
  290. */
  291. function values(obj) {
  292. return keys(obj).map(function (key) {
  293. return obj[key];
  294. });
  295. }
  296. /**
  297. * Check if the given subject is object or not.
  298. *
  299. * @param {*} subject - A subject to be verified.
  300. *
  301. * @return {boolean} - True if object, false otherwise.
  302. */
  303. function isObject(subject) {
  304. return typeof subject === 'object';
  305. }
  306. /**
  307. * Merge two objects deeply.
  308. *
  309. * @param {Object} to - An object where "from" is merged.
  310. * @param {Object} from - An object merged to "to".
  311. *
  312. * @return {Object} - A merged object.
  313. */
  314. function merge(_ref, from) {
  315. var to = _extends({}, _ref);
  316. each(from, function (value, key) {
  317. if (isObject(value)) {
  318. if (!isObject(to[key])) {
  319. to[key] = {};
  320. }
  321. to[key] = merge(to[key], value);
  322. } else {
  323. to[key] = value;
  324. }
  325. });
  326. return to;
  327. }
  328. /**
  329. * Assign all properties "from" to "to" object.
  330. *
  331. * @param {Object} to - An object where properties are assigned.
  332. * @param {Object} from - An object whose properties are assigned to "to".
  333. *
  334. * @return {Object} - An assigned object.
  335. */
  336. function object_assign(to, from) {
  337. keys(from).forEach(function (key) {
  338. if (!to[key]) {
  339. Object.defineProperty(to, key, Object.getOwnPropertyDescriptor(from, key));
  340. }
  341. });
  342. return to;
  343. }
  344. // CONCATENATED MODULE: ./src/js/utils/utils.js
  345. /**
  346. * A package of some miscellaneous utility functions.
  347. *
  348. * @author Naotoshi Fujita
  349. * @copyright Naotoshi Fujita. All rights reserved.
  350. */
  351. /**
  352. * Convert the given value to array.
  353. *
  354. * @param {*} value - Any value.
  355. *
  356. * @return {*[]} - Array containing the given value.
  357. */
  358. function toArray(value) {
  359. return Array.isArray(value) ? value : [value];
  360. }
  361. /**
  362. * Check if the given value is between min and max.
  363. * Min will be returned when the value is less than min or max will do when greater than max.
  364. *
  365. * @param {number} value - A number to be checked.
  366. * @param {number} m1 - Minimum or maximum number.
  367. * @param {number} m2 - Maximum or minimum number.
  368. *
  369. * @return {number} - A value itself, min or max.
  370. */
  371. function between(value, m1, m2) {
  372. return Math.min(Math.max(value, m1 > m2 ? m2 : m1), m1 > m2 ? m1 : m2);
  373. }
  374. /**
  375. * The sprintf method with minimum functionality.
  376. *
  377. * @param {string} format - The string format.
  378. * @param {string|Array} replacements - Replacements accepting multiple arguments.
  379. *
  380. * @returns {string} - Converted string.
  381. */
  382. function sprintf(format, replacements) {
  383. var i = 0;
  384. return format.replace(/%s/g, function () {
  385. return toArray(replacements)[i++];
  386. });
  387. }
  388. /**
  389. * Append px unit to the given subject if necessary.
  390. *
  391. * @param {number|string} value - A value that may not include an unit.
  392. *
  393. * @return {string} - If the value is string, return itself.
  394. * If number, do value + "px". An empty string, otherwise.
  395. */
  396. function unit(value) {
  397. var type = typeof value;
  398. if (type === 'number' && value > 0) {
  399. return parseFloat(value) + 'px';
  400. }
  401. return type === 'string' ? value : '';
  402. }
  403. /**
  404. * Pad start with 0.
  405. *
  406. * @param {number} number - A number to be filled with 0.
  407. *
  408. * @return {string|number} - Padded number.
  409. */
  410. function pad(number) {
  411. return number < 10 ? '0' + number : number;
  412. }
  413. /**
  414. * Convert the given value to pixel.
  415. *
  416. * @param {Element} root - Root element where a dummy div is appended.
  417. * @param {string|number} value - CSS value to be converted, such as 10rem.
  418. *
  419. * @return {number} - Pixel.
  420. */
  421. function toPixel(root, value) {
  422. if (typeof value === 'string') {
  423. var div = create('div', {});
  424. applyStyle(div, {
  425. position: 'absolute',
  426. width: value
  427. });
  428. append(root, div);
  429. value = div.clientWidth;
  430. dom_remove(div);
  431. }
  432. return +value || 0;
  433. }
  434. // CONCATENATED MODULE: ./src/js/utils/dom.js
  435. /**
  436. * Some utility functions related with DOM.
  437. *
  438. * @author Naotoshi Fujita
  439. * @copyright Naotoshi Fujita. All rights reserved.
  440. */
  441. /**
  442. * Find the first element matching the given selector.
  443. * Be aware that all selectors after a space are ignored.
  444. *
  445. * @param {Element|Node} elm - An ancestor element.
  446. * @param {string} selector - DOMString.
  447. *
  448. * @return {Element|null} - A found element or null.
  449. */
  450. function find(elm, selector) {
  451. return elm ? elm.querySelector(selector.split(' ')[0]) : null;
  452. }
  453. /**
  454. * Find a first child having the given tag or class name.
  455. *
  456. * @param {Element} parent - A parent element.
  457. * @param {string} tagOrClassName - A tag or class name.
  458. *
  459. * @return {Element|undefined} - A found element on success or undefined on failure.
  460. */
  461. function child(parent, tagOrClassName) {
  462. return children(parent, tagOrClassName)[0];
  463. }
  464. /**
  465. * Return chile elements that matches the provided tag or class name.
  466. *
  467. * @param {Element} parent - A parent element.
  468. * @param {string} tagOrClassName - A tag or class name.
  469. *
  470. * @return {Element[]} - Found elements.
  471. */
  472. function children(parent, tagOrClassName) {
  473. if (parent) {
  474. return values(parent.children).filter(function (child) {
  475. return hasClass(child, tagOrClassName.split(' ')[0]) || child.tagName === tagOrClassName;
  476. });
  477. }
  478. return [];
  479. }
  480. /**
  481. * Create an element with some optional attributes.
  482. *
  483. * @param {string} tag - A tag name.
  484. * @param {Object} attrs - An object any attribute pairs of name and value.
  485. *
  486. * @return {Element} - A created element.
  487. */
  488. function create(tag, attrs) {
  489. var elm = document.createElement(tag);
  490. each(attrs, function (value, key) {
  491. return setAttribute(elm, key, value);
  492. });
  493. return elm;
  494. }
  495. /**
  496. * Convert HTML string to DOM node.
  497. *
  498. * @param {string} html - HTML string.
  499. *
  500. * @return {Node} - A created node.
  501. */
  502. function domify(html) {
  503. var div = create('div', {});
  504. div.innerHTML = html;
  505. return div.firstChild;
  506. }
  507. /**
  508. * Remove a given element from a DOM tree.
  509. *
  510. * @param {Element|Element[]} elms - Element(s) to be removed.
  511. */
  512. function dom_remove(elms) {
  513. toArray(elms).forEach(function (elm) {
  514. if (elm) {
  515. var parent = elm.parentElement;
  516. parent && parent.removeChild(elm);
  517. }
  518. });
  519. }
  520. /**
  521. * Append a child to a given element.
  522. *
  523. * @param {Element} parent - A parent element.
  524. * @param {Element} child - An element to be appended.
  525. */
  526. function append(parent, child) {
  527. if (parent) {
  528. parent.appendChild(child);
  529. }
  530. }
  531. /**
  532. * Insert an element before the reference element.
  533. *
  534. * @param {Element|Node} ref - A reference element.
  535. * @param {Element} elm - An element to be inserted.
  536. */
  537. function before(elm, ref) {
  538. if (elm && ref) {
  539. var parent = ref.parentElement;
  540. parent && parent.insertBefore(elm, ref);
  541. }
  542. }
  543. /**
  544. * Apply styles to the given element.
  545. *
  546. * @param {Element} elm - An element where styles are applied.
  547. * @param {Object} styles - Object containing styles.
  548. */
  549. function applyStyle(elm, styles) {
  550. if (elm) {
  551. each(styles, function (value, prop) {
  552. if (value !== null) {
  553. elm.style[prop] = value;
  554. }
  555. });
  556. }
  557. }
  558. /**
  559. * Add or remove classes to/from the element.
  560. * This function is for internal usage.
  561. *
  562. * @param {Element} elm - An element where classes are added.
  563. * @param {string|string[]} classes - Class names being added.
  564. * @param {boolean} remove - Whether to remove or add classes.
  565. */
  566. function addOrRemoveClasses(elm, classes, remove) {
  567. if (elm) {
  568. toArray(classes).forEach(function (name) {
  569. if (name) {
  570. elm.classList[remove ? 'remove' : 'add'](name);
  571. }
  572. });
  573. }
  574. }
  575. /**
  576. * Add classes to the element.
  577. *
  578. * @param {Element} elm - An element where classes are added.
  579. * @param {string|string[]} classes - Class names being added.
  580. */
  581. function addClass(elm, classes) {
  582. addOrRemoveClasses(elm, classes, false);
  583. }
  584. /**
  585. * Remove a class from the element.
  586. *
  587. * @param {Element} elm - An element where classes are removed.
  588. * @param {string|string[]} classes - A class name being removed.
  589. */
  590. function removeClass(elm, classes) {
  591. addOrRemoveClasses(elm, classes, true);
  592. }
  593. /**
  594. * Verify if the provided element has the class or not.
  595. *
  596. * @param {Element} elm - An element.
  597. * @param {string} className - A class name.
  598. *
  599. * @return {boolean} - True if the element has the class or false if not.
  600. */
  601. function hasClass(elm, className) {
  602. return !!elm && elm.classList.contains(className);
  603. }
  604. /**
  605. * Set attribute to the given element.
  606. *
  607. * @param {Element} elm - An element where an attribute is assigned.
  608. * @param {string} name - Attribute name.
  609. * @param {string|number|boolean} value - Attribute value.
  610. */
  611. function setAttribute(elm, name, value) {
  612. if (elm) {
  613. elm.setAttribute(name, value);
  614. }
  615. }
  616. /**
  617. * Get attribute from the given element.
  618. *
  619. * @param {Element} elm - An element where an attribute is assigned.
  620. * @param {string} name - Attribute name.
  621. *
  622. * @return {string} - The value of the given attribute if available. An empty string if not.
  623. */
  624. function getAttribute(elm, name) {
  625. return elm ? elm.getAttribute(name) : '';
  626. }
  627. /**
  628. * Remove attribute from the given element.
  629. *
  630. * @param {Element|Element[]} elms - An element where an attribute is removed.
  631. * @param {string|string[]} names - Attribute name.
  632. */
  633. function removeAttribute(elms, names) {
  634. toArray(names).forEach(function (name) {
  635. toArray(elms).forEach(function (elm) {
  636. return elm && elm.removeAttribute(name);
  637. });
  638. });
  639. }
  640. /**
  641. * Return the Rect object of the provided object.
  642. *
  643. * @param {Element} elm - An element.
  644. *
  645. * @return {ClientRect|DOMRect} - A rect object.
  646. */
  647. function getRect(elm) {
  648. return elm.getBoundingClientRect();
  649. }
  650. /**
  651. * Trigger the given callback after all images contained by the element are loaded.
  652. *
  653. * @param {Element} elm - Element that may contain images.
  654. * @param {Function} callback - Callback function fired right after all images are loaded.
  655. */
  656. function dom_loaded(elm, callback) {
  657. var images = elm.querySelectorAll('img');
  658. var length = images.length;
  659. if (length) {
  660. var count = 0;
  661. each(images, function (img) {
  662. img.onload = img.onerror = function () {
  663. if (++count === length) {
  664. callback();
  665. }
  666. };
  667. });
  668. } else {
  669. // Trigger the callback immediately if there is no image.
  670. callback();
  671. }
  672. }
  673. // CONCATENATED MODULE: ./src/js/constants/types.js
  674. /**
  675. * Export slider types.
  676. *
  677. * @author Naotoshi Fujita
  678. * @copyright Naotoshi Fujita. All rights reserved.
  679. */
  680. /**
  681. * Normal slider.
  682. *
  683. * @type {string}
  684. */
  685. var SLIDE = 'slide';
  686. /**
  687. * Loop after the last slide and before the first one.
  688. *
  689. * @type {string}
  690. */
  691. var LOOP = 'loop';
  692. /**
  693. * The track doesn't move.
  694. *
  695. * @type {string}
  696. */
  697. var FADE = 'fade';
  698. // CONCATENATED MODULE: ./src/js/transitions/slide/index.js
  699. /**
  700. * The component for general slide effect transition.
  701. *
  702. * @author Naotoshi Fujita
  703. * @copyright Naotoshi Fujita. All rights reserved.
  704. */
  705. /**
  706. * The component for general slide effect transition.
  707. *
  708. * @param {Splide} Splide - A Splide instance.
  709. * @param {Object} Components - An object containing components.
  710. *
  711. * @return {Object} - The component object.
  712. */
  713. /* harmony default export */ var transitions_slide = (function (Splide, Components) {
  714. /**
  715. * Hold the list element.
  716. *
  717. * @type {Element}
  718. */
  719. var list;
  720. /**
  721. * Hold the onEnd callback function.
  722. *
  723. * @type {function}
  724. */
  725. var endCallback;
  726. return {
  727. /**
  728. * Called when the component is mounted.
  729. */
  730. mount: function mount() {
  731. list = Components.Elements.list;
  732. Splide.on('transitionend', function (e) {
  733. if (e.target === list && endCallback) {
  734. endCallback();
  735. }
  736. }, list);
  737. },
  738. /**
  739. * Start transition.
  740. *
  741. * @param {number} destIndex - Destination slide index that might be clone's.
  742. * @param {number} newIndex - New index.
  743. * @param {number} prevIndex - Previous index.
  744. * @param {Object} coord - Destination coordinates.
  745. * @param {function} done - Callback function must be invoked when transition is completed.
  746. */
  747. start: function start(destIndex, newIndex, prevIndex, coord, done) {
  748. var options = Splide.options;
  749. var edgeIndex = Components.Controller.edgeIndex;
  750. var speed = options.speed;
  751. endCallback = done;
  752. if (Splide.is(SLIDE)) {
  753. if (prevIndex === 0 && newIndex >= edgeIndex || prevIndex >= edgeIndex && newIndex === 0) {
  754. speed = options.rewindSpeed || speed;
  755. }
  756. }
  757. applyStyle(list, {
  758. transition: "transform " + speed + "ms " + options.easing,
  759. transform: "translate(" + coord.x + "px," + coord.y + "px)"
  760. });
  761. }
  762. };
  763. });
  764. // CONCATENATED MODULE: ./src/js/transitions/fade/index.js
  765. /**
  766. * The component for fade transition.
  767. *
  768. * @author Naotoshi Fujita
  769. * @copyright Naotoshi Fujita. All rights reserved.
  770. */
  771. /**
  772. * The component for fade transition.
  773. *
  774. * @param {Splide} Splide - A Splide instance.
  775. * @param {Object} Components - An object containing components.
  776. *
  777. * @return {Object} - The component object.
  778. */
  779. /* harmony default export */ var fade = (function (Splide, Components) {
  780. var Fade = {
  781. /**
  782. * Called when the component is mounted.
  783. * Apply transition style to the first slide.
  784. */
  785. mount: function mount() {
  786. apply(Splide.index);
  787. },
  788. /**
  789. * Start transition.
  790. *
  791. * @param {number} destIndex - Destination slide index that might be clone's.
  792. * @param {number} newIndex - New index.
  793. * @param {number} prevIndex - Previous index.
  794. * @param {Object} coord - Destination coordinates.
  795. * @param {function} done - Callback function must be invoked when transition is completed.
  796. */
  797. start: function start(destIndex, newIndex, prevIndex, coord, done) {
  798. var track = Components.Elements.track;
  799. applyStyle(track, {
  800. height: unit(track.clientHeight)
  801. });
  802. apply(newIndex);
  803. setTimeout(function () {
  804. done();
  805. applyStyle(track, {
  806. height: ''
  807. });
  808. });
  809. }
  810. };
  811. /**
  812. * Apply transition style to the slide specified by the given index.
  813. *
  814. * @param {number} index - A slide index.
  815. */
  816. function apply(index) {
  817. var options = Splide.options;
  818. applyStyle(Components.Elements.slides[index], {
  819. transition: "opacity " + options.speed + "ms " + options.easing
  820. });
  821. }
  822. return Fade;
  823. });
  824. // CONCATENATED MODULE: ./src/js/transitions/index.js
  825. /**
  826. * Export transition components.
  827. *
  828. * @author Naotoshi Fujita
  829. * @copyright Naotoshi Fujita. All rights reserved.
  830. */
  831. // CONCATENATED MODULE: ./src/js/core/composer.js
  832. /**
  833. * Provide a function for composing components.
  834. *
  835. * @author Naotoshi Fujita
  836. * @copyright Naotoshi Fujita. All rights reserved.
  837. */
  838. /**
  839. * Compose components.
  840. *
  841. * @param {Splide} Splide - Splide instance.
  842. * @param {Object} Components - Additional components.
  843. * @param {function} Transition - Change component for transition.
  844. *
  845. * @return {Object} - An object containing all components.
  846. */
  847. function compose(Splide, Components, Transition) {
  848. var components = {};
  849. each(Components, function (Component, name) {
  850. components[name] = Component(Splide, components, name.toLowerCase());
  851. });
  852. if (!Transition) {
  853. Transition = Splide.is(FADE) ? fade : transitions_slide;
  854. }
  855. components.Transition = Transition(Splide, components);
  856. return components;
  857. }
  858. // CONCATENATED MODULE: ./src/js/utils/error.js
  859. /**
  860. * Utility functions for outputting logs.
  861. *
  862. * @author Naotoshi Fujita
  863. * @copyright Naotoshi Fujita. All rights reserved.
  864. */
  865. /**
  866. * Prefix of an error massage.
  867. *
  868. * @type {string}
  869. */
  870. var MESSAGE_PREFIX = '[SPLIDE]';
  871. /**
  872. * Display an error message on the browser console.
  873. *
  874. * @param {string} message - An error message.
  875. */
  876. function error_error(message) {
  877. console.error(MESSAGE_PREFIX + " " + message);
  878. }
  879. /**
  880. * Check existence of the given object and throw an error if it doesn't.
  881. *
  882. * @throws {Error}
  883. *
  884. * @param {*} subject - A subject to be confirmed.
  885. * @param {string} message - An error message.
  886. */
  887. function exist(subject, message) {
  888. if (!subject) {
  889. throw new Error(message);
  890. }
  891. }
  892. // CONCATENATED MODULE: ./src/js/constants/classes.js
  893. /**
  894. * Export class names.
  895. *
  896. * @author Naotoshi Fujita
  897. * @copyright Naotoshi Fujita. All rights reserved.
  898. */
  899. /**
  900. * A root class name.
  901. *
  902. * @type {string}
  903. */
  904. var ROOT = 'splide';
  905. /**
  906. * The definition table of all classes for elements.
  907. * They might be modified by options.
  908. *
  909. * @type {Object}
  910. */
  911. var ELEMENT_CLASSES = {
  912. root: ROOT,
  913. slider: ROOT + "__slider",
  914. track: ROOT + "__track",
  915. list: ROOT + "__list",
  916. slide: ROOT + "__slide",
  917. container: ROOT + "__slide__container",
  918. arrows: ROOT + "__arrows",
  919. arrow: ROOT + "__arrow",
  920. prev: ROOT + "__arrow--prev",
  921. next: ROOT + "__arrow--next",
  922. pagination: ROOT + "__pagination",
  923. page: ROOT + "__pagination__page",
  924. clone: ROOT + "__slide--clone",
  925. progress: ROOT + "__progress",
  926. bar: ROOT + "__progress__bar",
  927. autoplay: ROOT + "__autoplay",
  928. play: ROOT + "__play",
  929. pause: ROOT + "__pause",
  930. spinner: ROOT + "__spinner",
  931. sr: ROOT + "__sr"
  932. };
  933. /**
  934. * Definitions of status classes.
  935. *
  936. * @type {Object}
  937. */
  938. var STATUS_CLASSES = {
  939. active: 'is-active',
  940. visible: 'is-visible',
  941. loading: 'is-loading'
  942. };
  943. // CONCATENATED MODULE: ./src/js/constants/i18n.js
  944. /**
  945. * Export i18n texts as object.
  946. *
  947. * @author Naotoshi Fujita
  948. * @copyright Naotoshi Fujita. All rights reserved.
  949. */
  950. /**
  951. * Texts for i18n.
  952. *
  953. * @type {Object}
  954. */
  955. var I18N = {
  956. prev: 'Previous slide',
  957. next: 'Next slide',
  958. first: 'Go to first slide',
  959. last: 'Go to last slide',
  960. slideX: 'Go to slide %s',
  961. pageX: 'Go to page %s',
  962. play: 'Start autoplay',
  963. pause: 'Pause autoplay'
  964. };
  965. // CONCATENATED MODULE: ./src/js/constants/defaults.js
  966. /**
  967. * Export default options.
  968. *
  969. * @author Naotoshi Fujita
  970. * @copyright Naotoshi Fujita. All rights reserved.
  971. */
  972. var DEFAULTS = {
  973. /**
  974. * Determine a slider type.
  975. * - 'slide': Regular slider.
  976. * - 'loop' : Carousel slider.
  977. * - 'fade' : Change slides with fade transition. perPage, drag options are ignored.
  978. *
  979. * @type {string}
  980. */
  981. type: 'slide',
  982. /**
  983. * Whether to rewind a slider before the first slide or after the last one.
  984. * In "loop" mode, this option is ignored.
  985. *
  986. * @type {boolean}
  987. */
  988. rewind: false,
  989. /**
  990. * Transition speed in milliseconds.
  991. *
  992. * @type {number}
  993. */
  994. speed: 400,
  995. /**
  996. * Transition speed on rewind in milliseconds.
  997. *
  998. * @type {number}
  999. */
  1000. rewindSpeed: 0,
  1001. /**
  1002. * Whether to prevent any actions while a slider is transitioning.
  1003. * If false, navigation, drag and swipe work while the slider is running.
  1004. * Even so, it will be forced to wait for transition in some cases in the loop mode to shift a slider.
  1005. *
  1006. * @type {boolean}
  1007. */
  1008. waitForTransition: true,
  1009. /**
  1010. * Define slider max width.
  1011. *
  1012. * @type {number}
  1013. */
  1014. width: 0,
  1015. /**
  1016. * Define slider height.
  1017. *
  1018. * @type {number}
  1019. */
  1020. height: 0,
  1021. /**
  1022. * Fix width of slides. CSS format is allowed such as 10em, 80% or 80vw.
  1023. * perPage number will be ignored when this option is falsy.
  1024. *
  1025. * @type {number|string}
  1026. */
  1027. fixedWidth: 0,
  1028. /**
  1029. * Fix height of slides. CSS format is allowed such as 10em, 80vh but % unit is not accepted.
  1030. * heightRatio option will be ignored when this option is falsy.
  1031. *
  1032. * @type {number|string}
  1033. */
  1034. fixedHeight: 0,
  1035. /**
  1036. * Determine height of slides by ratio to a slider width.
  1037. * This will be ignored when the fixedHeight is provided.
  1038. *
  1039. * @type {number}
  1040. */
  1041. heightRatio: 0,
  1042. /**
  1043. * If true, slide width will be determined by the element width itself.
  1044. * - perPage/perMove should be 1.
  1045. *
  1046. * @type {boolean}
  1047. */
  1048. autoWidth: false,
  1049. /**
  1050. * If true, slide height will be determined by the element width itself.
  1051. * - perPage/perMove should be 1.
  1052. *
  1053. * @type {boolean}
  1054. */
  1055. autoHeight: false,
  1056. /**
  1057. * Determine how many slides should be displayed per page.
  1058. *
  1059. * @type {number}
  1060. */
  1061. perPage: 1,
  1062. /**
  1063. * Determine how many slides should be moved when a slider goes to next or perv.
  1064. *
  1065. * @type {number}
  1066. */
  1067. perMove: 0,
  1068. /**
  1069. * Determine manually how many clones should be generated on the left and right side.
  1070. * The total number of clones will be twice of this number.
  1071. *
  1072. * @type {number}
  1073. */
  1074. clones: 0,
  1075. /**
  1076. * Start index.
  1077. *
  1078. * @type {number}
  1079. */
  1080. start: 0,
  1081. /**
  1082. * Determine which slide should be focused if there are multiple slides in a page.
  1083. * A string "center" is acceptable for centering slides.
  1084. *
  1085. * @type {boolean|number|string}
  1086. */
  1087. focus: false,
  1088. /**
  1089. * Gap between slides. CSS format is allowed such as 1em.
  1090. *
  1091. * @type {number|string}
  1092. */
  1093. gap: 0,
  1094. /**
  1095. * Set padding-left/right in horizontal mode or padding-top/bottom in vertical one.
  1096. * Give a single value to set a same size for both sides or
  1097. * do an object for different sizes.
  1098. * Also, CSS format is allowed such as 1em.
  1099. *
  1100. * @example
  1101. * - 10: Number
  1102. * - '1em': CSS format.
  1103. * - { left: 0, right: 20 }: Object for different sizes in horizontal mode.
  1104. * - { top: 0, bottom: 20 }: Object for different sizes in vertical mode.
  1105. *
  1106. * @type {number|string|Object}
  1107. */
  1108. padding: 0,
  1109. /**
  1110. * Whether to append arrows.
  1111. *
  1112. * @type {boolean}
  1113. */
  1114. arrows: true,
  1115. /**
  1116. * Change the arrow SVG path like 'm7.61 0.807-2.12...'.
  1117. *
  1118. * @type {string}
  1119. */
  1120. arrowPath: '',
  1121. /**
  1122. * Whether to append pagination(indicator dots) or not.
  1123. *
  1124. * @type {boolean}
  1125. */
  1126. pagination: true,
  1127. /**
  1128. * Activate autoplay.
  1129. *
  1130. * @type {boolean}
  1131. */
  1132. autoplay: false,
  1133. /**
  1134. * Autoplay interval in milliseconds.
  1135. *
  1136. * @type {number}
  1137. */
  1138. interval: 5000,
  1139. /**
  1140. * Whether to stop autoplay when a slider is hovered.
  1141. *
  1142. * @type {boolean}
  1143. */
  1144. pauseOnHover: true,
  1145. /**
  1146. * Whether to stop autoplay when a slider elements are focused.
  1147. * True is recommended for accessibility.
  1148. *
  1149. * @type {boolean}
  1150. */
  1151. pauseOnFocus: true,
  1152. /**
  1153. * Whether to reset progress of the autoplay timer when resumed.
  1154. *
  1155. * @type {boolean}
  1156. */
  1157. resetProgress: true,
  1158. /**
  1159. * Loading images lazily.
  1160. * Image src must be provided by a data-splide-lazy attribute.
  1161. *
  1162. * - false: Do nothing.
  1163. * - 'nearby': Only images around an active slide will be loaded.
  1164. * - 'sequential': All images will be sequentially loaded.
  1165. *
  1166. * @type {boolean|string}
  1167. */
  1168. lazyLoad: false,
  1169. /**
  1170. * This option works only when a lazyLoad option is "nearby".
  1171. * Determine how many pages(not slides) around an active slide should be loaded beforehand.
  1172. *
  1173. * @type {number}
  1174. */
  1175. preloadPages: 1,
  1176. /**
  1177. * Easing for CSS transition. For example, linear, ease or cubic-bezier().
  1178. *
  1179. * @type {string}
  1180. */
  1181. easing: 'cubic-bezier(.42,.65,.27,.99)',
  1182. /**
  1183. * Whether to enable keyboard shortcuts
  1184. * - true or 'global': Listen to keydown event of the document.
  1185. * - 'focused': Listen to the keydown event of the slider root element. tabindex="0" will be added to the element.
  1186. * - false: Disable keyboard shortcuts.
  1187. *
  1188. * @type {boolean|string}
  1189. */
  1190. keyboard: 'global',
  1191. /**
  1192. * Whether to allow mouse drag and touch swipe.
  1193. *
  1194. * @type {boolean}
  1195. */
  1196. drag: true,
  1197. /**
  1198. * The angle threshold for drag.
  1199. * The slider starts moving only when the drag angle is less than this threshold.
  1200. *
  1201. * @type {number}
  1202. */
  1203. dragAngleThreshold: 30,
  1204. /**
  1205. * Distance threshold for determining if the action is "flick" or "swipe".
  1206. * When a drag distance is over this value, the action will be treated as "swipe", not "flick".
  1207. *
  1208. * @type {number}
  1209. */
  1210. swipeDistanceThreshold: 150,
  1211. /**
  1212. * Velocity threshold for determining if the action is "flick" or "swipe".
  1213. * Around 0.5 is recommended.
  1214. *
  1215. * @type {number}
  1216. */
  1217. flickVelocityThreshold: .6,
  1218. /**
  1219. * Determine power of flick. The larger number this is, the farther a slider runs by flick.
  1220. * Around 500 is recommended.
  1221. *
  1222. * @type {number}
  1223. */
  1224. flickPower: 600,
  1225. /**
  1226. * Limit a number of pages to move by flick.
  1227. *
  1228. * @type {number}
  1229. */
  1230. flickMaxPages: 1,
  1231. /**
  1232. * Slider direction.
  1233. * - 'ltr': Left to right.
  1234. * - 'rtl': Right to left.
  1235. * - 'ttb': Top to bottom.
  1236. *
  1237. * @type {string}
  1238. */
  1239. direction: 'ltr',
  1240. /**
  1241. * Set img src to background-image of its parent element.
  1242. * Images with various sizes can be displayed as same dimension without cropping work.
  1243. * fixedHeight or heightRatio is required.
  1244. *
  1245. * @type {boolean}
  1246. */
  1247. cover: false,
  1248. /**
  1249. * Whether to enable accessibility(aria and screen reader texts) or not.
  1250. *
  1251. * @type {boolean}
  1252. */
  1253. accessibility: true,
  1254. /**
  1255. * Whether to add tabindex="0" to visible slides or not.
  1256. *
  1257. * @type {boolean}
  1258. */
  1259. slideFocus: true,
  1260. /**
  1261. * Determine if a slider is navigation for another.
  1262. * Use "sync" API to synchronize two sliders.
  1263. *
  1264. * @type {boolean}
  1265. */
  1266. isNavigation: false,
  1267. /**
  1268. * Whether to trim spaces before the fist slide or after the last one when "focus" is not 0.
  1269. *
  1270. * @type {boolean}
  1271. */
  1272. trimSpace: true,
  1273. /**
  1274. * The "is-active" class is added after transition as default.
  1275. * If true, it will be added before move.
  1276. *
  1277. * @type {boolean}
  1278. */
  1279. updateOnMove: false,
  1280. /**
  1281. * Throttle duration in milliseconds for the resize event.
  1282. *
  1283. * @type {number}
  1284. */
  1285. throttle: 100,
  1286. /**
  1287. * Whether to destroy a slider or not.
  1288. *
  1289. * @type {boolean}
  1290. */
  1291. destroy: false,
  1292. /**
  1293. * Options for specific breakpoints.
  1294. *
  1295. * @example
  1296. * {
  1297. * 1000: {
  1298. * perPage: 3,
  1299. * gap: 20
  1300. * },
  1301. * 600: {
  1302. * perPage: 1,
  1303. * gap: 5,
  1304. * }
  1305. * }
  1306. *
  1307. * @type {boolean|Object}
  1308. */
  1309. breakpoints: false,
  1310. /**
  1311. * Collection of class names.
  1312. *
  1313. * @see ./classes.js
  1314. *
  1315. * @type {Object}
  1316. */
  1317. classes: ELEMENT_CLASSES,
  1318. /**
  1319. * Collection of i18n texts.
  1320. *
  1321. * @see ./i18n.js
  1322. *
  1323. * @type {Object}
  1324. */
  1325. i18n: I18N
  1326. };
  1327. // CONCATENATED MODULE: ./src/js/constants/states.js
  1328. /**
  1329. * Export state constants.
  1330. *
  1331. * @author Naotoshi Fujita
  1332. * @copyright Naotoshi Fujita. All rights reserved.
  1333. */
  1334. /**
  1335. * Splide has been just created.
  1336. *
  1337. * @type {number}
  1338. */
  1339. var CREATED = 1;
  1340. /**
  1341. * All components have been mounted and initialized.
  1342. *
  1343. * @type {number}
  1344. */
  1345. var MOUNTED = 2;
  1346. /**
  1347. * Splide is ready for transition.
  1348. *
  1349. * @type {number}
  1350. */
  1351. var IDLE = 3;
  1352. /**
  1353. * Splide is moving.
  1354. *
  1355. * @type {number}
  1356. */
  1357. var MOVING = 4;
  1358. /**
  1359. * Splide is moving.
  1360. *
  1361. * @type {number}
  1362. */
  1363. var DESTROYED = 5;
  1364. // CONCATENATED MODULE: ./src/js/splide.js
  1365. function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
  1366. function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
  1367. /**
  1368. * The main class for applying Splide to an element.
  1369. *
  1370. * @author Naotoshi Fujita
  1371. * @copyright Naotoshi Fujita. All rights reserved.
  1372. */
  1373. /**
  1374. * The main class for applying Splide to an element,
  1375. * providing some APIs to control the behavior.
  1376. */
  1377. var splide_Splide = /*#__PURE__*/function () {
  1378. /**
  1379. * Splide constructor.
  1380. *
  1381. * @throws {Error} When the given root element or selector is invalid.
  1382. *
  1383. * @param {Element|string} root - A selector for a root element or an element itself.
  1384. * @param {Object} options - Optional. Options to change default behaviour.
  1385. * @param {Object} Components - Optional. Components.
  1386. */
  1387. function Splide(root, options, Components) {
  1388. if (options === void 0) {
  1389. options = {};
  1390. }
  1391. if (Components === void 0) {
  1392. Components = {};
  1393. }
  1394. this.root = root instanceof Element ? root : document.querySelector(root);
  1395. exist(this.root, 'An invalid element/selector was given.');
  1396. this.Components = null;
  1397. this.Event = core_event();
  1398. this.State = state(CREATED);
  1399. this.STATES = states_namespaceObject;
  1400. this._o = merge(DEFAULTS, options);
  1401. this._i = 0;
  1402. this._c = Components;
  1403. this._e = {}; // Extensions
  1404. this._t = null; // Transition
  1405. }
  1406. /**
  1407. * Compose and mount components.
  1408. *
  1409. * @param {Object} Extensions - Optional. Additional components.
  1410. * @param {function} Transition - Optional. Set a custom transition component.
  1411. *
  1412. * @return {Splide|undefined} - This instance or undefined if an exception occurred.
  1413. */
  1414. var _proto = Splide.prototype;
  1415. _proto.mount = function mount(Extensions, Transition) {
  1416. var _this = this;
  1417. if (Extensions === void 0) {
  1418. Extensions = this._e;
  1419. }
  1420. if (Transition === void 0) {
  1421. Transition = this._t;
  1422. }
  1423. // Reset the state.
  1424. this.State.set(CREATED);
  1425. this._e = Extensions;
  1426. this._t = Transition;
  1427. this.Components = compose(this, merge(this._c, Extensions), Transition);
  1428. try {
  1429. each(this.Components, function (component, key) {
  1430. var required = component.required;
  1431. if (required === undefined || required) {
  1432. component.mount && component.mount();
  1433. } else {
  1434. delete _this.Components[key];
  1435. }
  1436. });
  1437. } catch (e) {
  1438. error_error(e.message);
  1439. return;
  1440. }
  1441. var State = this.State;
  1442. State.set(MOUNTED);
  1443. each(this.Components, function (component) {
  1444. component.mounted && component.mounted();
  1445. });
  1446. this.emit('mounted');
  1447. State.set(IDLE);
  1448. this.emit('ready');
  1449. applyStyle(this.root, {
  1450. visibility: 'visible'
  1451. });
  1452. this.on('move drag', function () {
  1453. return State.set(MOVING);
  1454. }).on('moved dragged', function () {
  1455. return State.set(IDLE);
  1456. });
  1457. return this;
  1458. }
  1459. /**
  1460. * Set sync target.
  1461. *
  1462. * @param {Splide} splide - A Splide instance.
  1463. *
  1464. * @return {Splide} - This instance.
  1465. */
  1466. ;
  1467. _proto.sync = function sync(splide) {
  1468. this.sibling = splide;
  1469. return this;
  1470. }
  1471. /**
  1472. * Register callback fired on the given event(s).
  1473. *
  1474. * @param {string} events - An event name. Use space to separate multiple events.
  1475. * Also, namespace is accepted by dot, such as 'resize.{namespace}'.
  1476. * @param {function} handler - A callback function.
  1477. * @param {Element} elm - Optional. Native event will be listened to when this arg is provided.
  1478. * @param {Object} options - Optional. Options for addEventListener.
  1479. *
  1480. * @return {Splide} - This instance.
  1481. */
  1482. ;
  1483. _proto.on = function on(events, handler, elm, options) {
  1484. if (elm === void 0) {
  1485. elm = null;
  1486. }
  1487. if (options === void 0) {
  1488. options = {};
  1489. }
  1490. this.Event.on(events, handler, elm, options);
  1491. return this;
  1492. }
  1493. /**
  1494. * Unsubscribe the given event.
  1495. *
  1496. * @param {string} events - A event name.
  1497. * @param {Element} elm - Optional. removeEventListener() will be called when this arg is provided.
  1498. *
  1499. * @return {Splide} - This instance.
  1500. */
  1501. ;
  1502. _proto.off = function off(events, elm) {
  1503. if (elm === void 0) {
  1504. elm = null;
  1505. }
  1506. this.Event.off(events, elm);
  1507. return this;
  1508. }
  1509. /**
  1510. * Emit an event.
  1511. *
  1512. * @param {string} event - An event name.
  1513. * @param {*} args - Any number of arguments passed to handlers.
  1514. */
  1515. ;
  1516. _proto.emit = function emit(event) {
  1517. var _this$Event;
  1518. for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
  1519. args[_key - 1] = arguments[_key];
  1520. }
  1521. (_this$Event = this.Event).emit.apply(_this$Event, [event].concat(args));
  1522. return this;
  1523. }
  1524. /**
  1525. * Go to the slide specified by the given control.
  1526. *
  1527. * @param {string|number} control - A control pattern.
  1528. * @param {boolean} wait - Optional. Whether to wait for transition.
  1529. */
  1530. ;
  1531. _proto.go = function go(control, wait) {
  1532. if (wait === void 0) {
  1533. wait = this.options.waitForTransition;
  1534. }
  1535. if (this.State.is(IDLE) || this.State.is(MOVING) && !wait) {
  1536. this.Components.Controller.go(control, false);
  1537. }
  1538. return this;
  1539. }
  1540. /**
  1541. * Verify whether the slider type is the given one or not.
  1542. *
  1543. * @param {string} type - A slider type.
  1544. *
  1545. * @return {boolean} - True if the slider type is the provided type or false if not.
  1546. */
  1547. ;
  1548. _proto.is = function is(type) {
  1549. return type === this._o.type;
  1550. }
  1551. /**
  1552. * Insert a slide.
  1553. *
  1554. * @param {Element|string} slide - A slide element to be added.
  1555. * @param {number} index - A slide will be added at the position.
  1556. */
  1557. ;
  1558. _proto.add = function add(slide, index) {
  1559. if (index === void 0) {
  1560. index = -1;
  1561. }
  1562. this.Components.Elements.add(slide, index, this.refresh.bind(this));
  1563. return this;
  1564. }
  1565. /**
  1566. * Remove the slide designated by the index.
  1567. *
  1568. * @param {number} index - A slide index.
  1569. */
  1570. ;
  1571. _proto.remove = function remove(index) {
  1572. this.Components.Elements.remove(index);
  1573. this.refresh();
  1574. return this;
  1575. }
  1576. /**
  1577. * Destroy all Slide objects and clones and recreate them again.
  1578. */
  1579. ;
  1580. _proto.refresh = function refresh() {
  1581. this.emit('refresh').emit('resize');
  1582. return this;
  1583. }
  1584. /**
  1585. * Destroy the Splide.
  1586. * "Completely" boolean is mainly for breakpoints.
  1587. *
  1588. * @param {boolean} completely - Destroy completely.
  1589. */
  1590. ;
  1591. _proto.destroy = function destroy(completely) {
  1592. var _this2 = this;
  1593. if (completely === void 0) {
  1594. completely = true;
  1595. }
  1596. // Postpone destroy because it should be done after mount.
  1597. if (this.State.is(CREATED)) {
  1598. this.on('ready', function () {
  1599. return _this2.destroy(completely);
  1600. });
  1601. return;
  1602. }
  1603. values(this.Components).reverse().forEach(function (component) {
  1604. component.destroy && component.destroy(completely);
  1605. });
  1606. this.emit('destroy', completely); // Destroy all event handlers, including ones for native events.
  1607. this.Event.destroy();
  1608. this.State.set(DESTROYED);
  1609. return this;
  1610. }
  1611. /**
  1612. * Return the current slide index.
  1613. *
  1614. * @return {number} - The current slide index.
  1615. // */
  1616. ;
  1617. _createClass(Splide, [{
  1618. key: "index",
  1619. get: function get() {
  1620. return this._i;
  1621. }
  1622. /**
  1623. * Set the current slide index.
  1624. *
  1625. * @param {number|string} index - A new index.
  1626. */
  1627. ,
  1628. set: function set(index) {
  1629. this._i = parseInt(index);
  1630. }
  1631. /**
  1632. * Return length of slides.
  1633. * This is an alias of Elements.length.
  1634. *
  1635. * @return {number} - A number of slides.
  1636. */
  1637. }, {
  1638. key: "length",
  1639. get: function get() {
  1640. return this.Components.Elements.length;
  1641. }
  1642. /**
  1643. * Return options.
  1644. *
  1645. * @return {Object} - Options object.
  1646. */
  1647. }, {
  1648. key: "options",
  1649. get: function get() {
  1650. return this._o;
  1651. }
  1652. /**
  1653. * Set options with merging the given object to the current one.
  1654. *
  1655. * @param {Object} options - New options.
  1656. */
  1657. ,
  1658. set: function set(options) {
  1659. var created = this.State.is(CREATED);
  1660. if (!created) {
  1661. this.emit('update');
  1662. }
  1663. this._o = merge(this._o, options);
  1664. if (!created) {
  1665. this.emit('updated', this._o);
  1666. }
  1667. }
  1668. /**
  1669. * Return the class list.
  1670. * This is an alias of Splide.options.classList.
  1671. *
  1672. * @return {Object} - An object containing all class list.
  1673. */
  1674. }, {
  1675. key: "classes",
  1676. get: function get() {
  1677. return this._o.classes;
  1678. }
  1679. /**
  1680. * Return the i18n strings.
  1681. * This is an alias of Splide.options.i18n.
  1682. *
  1683. * @return {Object} - An object containing all i18n strings.
  1684. */
  1685. }, {
  1686. key: "i18n",
  1687. get: function get() {
  1688. return this._o.i18n;
  1689. }
  1690. }]);
  1691. return Splide;
  1692. }();
  1693. // CONCATENATED MODULE: ./src/js/components/options/index.js
  1694. /**
  1695. * The component for initializing options.
  1696. *
  1697. * @author Naotoshi Fujita
  1698. * @copyright Naotoshi Fujita. All rights reserved.
  1699. */
  1700. /**
  1701. * The component for initializing options.
  1702. *
  1703. * @param {Splide} Splide - A Splide instance.
  1704. *
  1705. * @return {Object} - The component object.
  1706. */
  1707. /* harmony default export */ var components_options = (function (Splide) {
  1708. /**
  1709. * Retrieve options from the data attribute.
  1710. * Note that IE10 doesn't support dataset property.
  1711. *
  1712. * @type {string}
  1713. */
  1714. var options = getAttribute(Splide.root, 'data-splide');
  1715. if (options) {
  1716. try {
  1717. Splide.options = JSON.parse(options);
  1718. } catch (e) {
  1719. error_error(e.message);
  1720. }
  1721. }
  1722. return {
  1723. /**
  1724. * Called when the component is mounted.
  1725. */
  1726. mount: function mount() {
  1727. if (Splide.State.is(CREATED)) {
  1728. Splide.index = Splide.options.start;
  1729. }
  1730. }
  1731. };
  1732. });
  1733. // CONCATENATED MODULE: ./src/js/constants/directions.js
  1734. /**
  1735. * Export layout modes.
  1736. *
  1737. * @author Naotoshi Fujita
  1738. * @copyright Naotoshi Fujita. All rights reserved.
  1739. */
  1740. /**
  1741. * Enumerate slides from left to right.
  1742. *
  1743. * @type {string}
  1744. */
  1745. var LTR = 'ltr';
  1746. /**
  1747. * Enumerate slides from right to left.
  1748. *
  1749. * @type {string}
  1750. */
  1751. var RTL = 'rtl';
  1752. /**
  1753. * Enumerate slides in a col.
  1754. *
  1755. * @type {string}
  1756. */
  1757. var TTB = 'ttb';
  1758. // CONCATENATED MODULE: ./src/js/components/elements/slide.js
  1759. /**
  1760. * The sub component for handling each slide.
  1761. *
  1762. * @author Naotoshi Fujita
  1763. * @copyright Naotoshi Fujita. All rights reserved.
  1764. */
  1765. /**
  1766. * Events for restoring original styles.
  1767. *
  1768. * @type {string}
  1769. */
  1770. var STYLE_RESTORE_EVENTS = 'update.slide';
  1771. /**
  1772. * The sub component for handling each slide.
  1773. *
  1774. * @param {Splide} Splide - A Splide instance.
  1775. * @param {number} index - An unique slide index.
  1776. * @param {number} realIndex - Clones should pass a real slide index.
  1777. * @param {Element} slide - A slide element.
  1778. *
  1779. * @return {Object} - The sub component object.
  1780. */
  1781. /* harmony default export */ var elements_slide = (function (Splide, index, realIndex, slide) {
  1782. /**
  1783. * Whether to update "is-active" class before or after transition.
  1784. *
  1785. * @type {boolean}
  1786. */
  1787. var updateOnMove = Splide.options.updateOnMove;
  1788. /**
  1789. * Events when the slide status is updated.
  1790. * Append a namespace to remove listeners later.
  1791. *
  1792. * @type {string}
  1793. */
  1794. var STATUS_UPDATE_EVENTS = 'ready.slide updated.slide resize.slide moved.slide' + (updateOnMove ? ' move.slide' : '');
  1795. /**
  1796. * Slide sub component object.
  1797. *
  1798. * @type {Object}
  1799. */
  1800. var Slide = {
  1801. /**
  1802. * Slide element.
  1803. *
  1804. * @type {Element}
  1805. */
  1806. slide: slide,
  1807. /**
  1808. * Slide index.
  1809. *
  1810. * @type {number}
  1811. */
  1812. index: index,
  1813. /**
  1814. * Real index for clones.
  1815. *
  1816. * @type {number}
  1817. */
  1818. realIndex: realIndex,
  1819. /**
  1820. * Container element if available.
  1821. *
  1822. * @type {Element|undefined}
  1823. */
  1824. container: child(slide, Splide.classes.container),
  1825. /**
  1826. * Whether this is a cloned slide or not.
  1827. *
  1828. * @type {boolean}
  1829. */
  1830. isClone: realIndex > -1,
  1831. /**
  1832. * Called when the component is mounted.
  1833. */
  1834. mount: function mount() {
  1835. var _this = this;
  1836. if (!this.isClone) {
  1837. slide.id = Splide.root.id + "-slide" + pad(index + 1);
  1838. }
  1839. Splide.on(STATUS_UPDATE_EVENTS, function () {
  1840. return _this.update();
  1841. }).on(STYLE_RESTORE_EVENTS, restoreStyles).on('click', function () {
  1842. return Splide.emit('click', _this);
  1843. }, slide);
  1844. /*
  1845. * Add "is-active" class to a clone element temporarily
  1846. * and it will be removed on "moved" event.
  1847. */
  1848. if (updateOnMove) {
  1849. Splide.on('move.slide', function (newIndex) {
  1850. if (newIndex === realIndex) {
  1851. _update(true, false);
  1852. }
  1853. });
  1854. } // Make sure the slide is shown.
  1855. applyStyle(slide, {
  1856. display: ''
  1857. }); // Hold the original styles.
  1858. this.styles = getAttribute(slide, 'style') || '';
  1859. },
  1860. /**
  1861. * Destroy.
  1862. */
  1863. destroy: function destroy() {
  1864. Splide.off(STATUS_UPDATE_EVENTS).off(STYLE_RESTORE_EVENTS).off('click', slide);
  1865. removeClass(slide, values(STATUS_CLASSES));
  1866. restoreStyles();
  1867. removeAttribute(this.container, 'style');
  1868. },
  1869. /**
  1870. * Update active and visible status.
  1871. */
  1872. update: function update() {
  1873. _update(this.isActive(), false);
  1874. _update(this.isVisible(), true);
  1875. },
  1876. /**
  1877. * Check whether this slide is active or not.
  1878. *
  1879. * @return {boolean} - True if the slide is active or false if not.
  1880. */
  1881. isActive: function isActive() {
  1882. return Splide.index === index;
  1883. },
  1884. /**
  1885. * Check whether this slide is visible in the viewport or not.
  1886. *
  1887. * @return {boolean} - True if the slide is visible or false if not.
  1888. */
  1889. isVisible: function isVisible() {
  1890. var active = this.isActive();
  1891. if (Splide.is(FADE) || active) {
  1892. return active;
  1893. }
  1894. var trackRect = getRect(Splide.Components.Elements.track);
  1895. var slideRect = getRect(slide);
  1896. if (Splide.options.direction === TTB) {
  1897. return trackRect.top <= slideRect.top && slideRect.bottom <= trackRect.bottom;
  1898. }
  1899. return trackRect.left <= slideRect.left && slideRect.right <= trackRect.right;
  1900. },
  1901. /**
  1902. * Calculate how far this slide is from another slide and
  1903. * return true if the distance is within the given number.
  1904. *
  1905. * @param {number} from - Index of a target slide.
  1906. * @param {number} within - True if the slide is within this number.
  1907. *
  1908. * @return {boolean} - True if the slide is within the number or false otherwise.
  1909. */
  1910. isWithin: function isWithin(from, within) {
  1911. var diff = Math.abs(from - index);
  1912. if (!Splide.is(SLIDE) && !this.isClone) {
  1913. diff = Math.min(diff, Splide.length - diff);
  1914. }
  1915. return diff < within;
  1916. }
  1917. };
  1918. /**
  1919. * Update classes for activity or visibility.
  1920. *
  1921. * @param {boolean} active - Is active/visible or not.
  1922. * @param {boolean} forVisibility - Toggle classes for activity or visibility.
  1923. */
  1924. function _update(active, forVisibility) {
  1925. var type = forVisibility ? 'visible' : 'active';
  1926. var className = STATUS_CLASSES[type];
  1927. if (active) {
  1928. addClass(slide, className);
  1929. Splide.emit("" + type, Slide);
  1930. } else {
  1931. if (hasClass(slide, className)) {
  1932. removeClass(slide, className);
  1933. Splide.emit("" + (forVisibility ? 'hidden' : 'inactive'), Slide);
  1934. }
  1935. }
  1936. }
  1937. /**
  1938. * Restore the original styles.
  1939. */
  1940. function restoreStyles() {
  1941. setAttribute(slide, 'style', Slide.styles);
  1942. }
  1943. return Slide;
  1944. });
  1945. // CONCATENATED MODULE: ./src/js/components/elements/index.js
  1946. /**
  1947. * The component for main elements.
  1948. *
  1949. * @author Naotoshi Fujita
  1950. * @copyright Naotoshi Fujita. All rights reserved.
  1951. */
  1952. /**
  1953. * The property name for UID stored in a window object.
  1954. *
  1955. * @type {string}
  1956. */
  1957. var UID_NAME = 'uid';
  1958. /**
  1959. * The component for main elements.
  1960. *
  1961. * @param {Splide} Splide - A Splide instance.
  1962. * @param {Object} Components - An object containing components.
  1963. *
  1964. * @return {Object} - The component object.
  1965. */
  1966. /* harmony default export */ var components_elements = (function (Splide, Components) {
  1967. /**
  1968. * Hold the root element.
  1969. *
  1970. * @type {Element}
  1971. */
  1972. var root = Splide.root;
  1973. /**
  1974. * Hold the class list.
  1975. *
  1976. * @type {Object}
  1977. */
  1978. var classes = Splide.classes;
  1979. /**
  1980. * Store Slide objects.
  1981. *
  1982. * @type {Array}
  1983. */
  1984. var Slides = [];
  1985. /*
  1986. * Assign unique ID to the root element if it doesn't have the one.
  1987. * Note that IE doesn't support padStart() to fill the uid by 0.
  1988. */
  1989. if (!root.id) {
  1990. window.splide = window.splide || {};
  1991. var uid = window.splide[UID_NAME] || 0;
  1992. window.splide[UID_NAME] = ++uid;
  1993. root.id = "splide" + pad(uid);
  1994. }
  1995. /**
  1996. * Elements component object.
  1997. *
  1998. * @type {Object}
  1999. */
  2000. var Elements = {
  2001. /**
  2002. * Called when the component is mounted.
  2003. * Collect main elements and store them as member properties.
  2004. */
  2005. mount: function mount() {
  2006. var _this = this;
  2007. this.init();
  2008. Splide.on('refresh', function () {
  2009. _this.destroy();
  2010. _this.init();
  2011. }).on('updated', function () {
  2012. removeClass(root, getClasses());
  2013. addClass(root, getClasses());
  2014. });
  2015. },
  2016. /**
  2017. * Destroy.
  2018. */
  2019. destroy: function destroy() {
  2020. Slides.forEach(function (Slide) {
  2021. Slide.destroy();
  2022. });
  2023. Slides = [];
  2024. removeClass(root, getClasses());
  2025. },
  2026. /**
  2027. * Initialization.
  2028. */
  2029. init: function init() {
  2030. var _this2 = this;
  2031. collect();
  2032. addClass(root, getClasses());
  2033. this.slides.forEach(function (slide, index) {
  2034. _this2.register(slide, index, -1);
  2035. });
  2036. },
  2037. /**
  2038. * Register a slide to create a Slide object and handle its behavior.
  2039. *
  2040. * @param {Element} slide - A slide element.
  2041. * @param {number} index - A unique index. This can be negative.
  2042. * @param {number} realIndex - A real index for clones. Set -1 for real slides.
  2043. */
  2044. register: function register(slide, index, realIndex) {
  2045. var SlideObject = elements_slide(Splide, index, realIndex, slide);
  2046. SlideObject.mount();
  2047. Slides.push(SlideObject);
  2048. },
  2049. /**
  2050. * Return the Slide object designated by the index.
  2051. * Note that "find" is not supported by IE.
  2052. *
  2053. * @return {Object|undefined} - A Slide object if available. Undefined if not.
  2054. */
  2055. getSlide: function getSlide(index) {
  2056. return Slides.filter(function (Slide) {
  2057. return Slide.index === index;
  2058. })[0];
  2059. },
  2060. /**
  2061. * Return all Slide objects.
  2062. *
  2063. * @param {boolean} includeClones - Whether to include cloned slides or not.
  2064. *
  2065. * @return {Object[]} - Slide objects.
  2066. */
  2067. getSlides: function getSlides(includeClones) {
  2068. return includeClones ? Slides : Slides.filter(function (Slide) {
  2069. return !Slide.isClone;
  2070. });
  2071. },
  2072. /**
  2073. * Return Slide objects belonging to the given page.
  2074. *
  2075. * @param {number} page - A page number.
  2076. *
  2077. * @return {Object[]} - An array containing Slide objects.
  2078. */
  2079. getSlidesByPage: function getSlidesByPage(page) {
  2080. var idx = Components.Controller.toIndex(page);
  2081. var options = Splide.options;
  2082. var max = options.focus !== false ? 1 : options.perPage;
  2083. return Slides.filter(function (_ref) {
  2084. var index = _ref.index;
  2085. return idx <= index && index < idx + max;
  2086. });
  2087. },
  2088. /**
  2089. * Insert a slide to a slider.
  2090. * Need to refresh Splide after adding a slide.
  2091. *
  2092. * @param {Node|string} slide - A slide element to be added.
  2093. * @param {number} index - A slide will be added at the position.
  2094. * @param {Function} callback - Called right after the slide is added to the DOM tree.
  2095. */
  2096. add: function add(slide, index, callback) {
  2097. if (typeof slide === 'string') {
  2098. slide = domify(slide);
  2099. }
  2100. if (slide instanceof Element) {
  2101. var ref = this.slides[index]; // This will be removed in mount() of a Slide component.
  2102. applyStyle(slide, {
  2103. display: 'none'
  2104. });
  2105. if (ref) {
  2106. before(slide, ref);
  2107. this.slides.splice(index, 0, slide);
  2108. } else {
  2109. append(this.list, slide);
  2110. this.slides.push(slide);
  2111. }
  2112. dom_loaded(slide, function () {
  2113. callback && callback(slide);
  2114. });
  2115. }
  2116. },
  2117. /**
  2118. * Remove a slide from a slider.
  2119. * Need to refresh Splide after removing a slide.
  2120. *
  2121. * @param index - Slide index.
  2122. */
  2123. remove: function remove(index) {
  2124. dom_remove(this.slides.splice(index, 1)[0]);
  2125. },
  2126. /**
  2127. * Trigger the provided callback for each Slide object.
  2128. *
  2129. * @param {Function} callback - A callback function. The first argument will be the Slide object.
  2130. */
  2131. each: function each(callback) {
  2132. Slides.forEach(callback);
  2133. },
  2134. /**
  2135. * Return slides length without clones.
  2136. *
  2137. * @return {number} - Slide length.
  2138. */
  2139. get length() {
  2140. return this.slides.length;
  2141. },
  2142. /**
  2143. * Return "SlideObjects" length including clones.
  2144. *
  2145. * @return {number} - Slide length including clones.
  2146. */
  2147. get total() {
  2148. return Slides.length;
  2149. }
  2150. };
  2151. /**
  2152. * Collect elements.
  2153. */
  2154. function collect() {
  2155. Elements.slider = child(root, classes.slider);
  2156. Elements.track = find(root, "." + classes.track);
  2157. Elements.list = child(Elements.track, classes.list);
  2158. exist(Elements.track && Elements.list, 'Track or list was not found.');
  2159. Elements.slides = children(Elements.list, classes.slide);
  2160. var arrows = findParts(classes.arrows);
  2161. Elements.arrows = {
  2162. prev: find(arrows, "." + classes.prev),
  2163. next: find(arrows, "." + classes.next)
  2164. };
  2165. var autoplay = findParts(classes.autoplay);
  2166. Elements.bar = find(findParts(classes.progress), "." + classes.bar);
  2167. Elements.play = find(autoplay, "." + classes.play);
  2168. Elements.pause = find(autoplay, "." + classes.pause);
  2169. Elements.track.id = Elements.track.id || root.id + "-track";
  2170. Elements.list.id = Elements.list.id || root.id + "-list";
  2171. }
  2172. /**
  2173. * Return class names for the root element.
  2174. */
  2175. function getClasses() {
  2176. var rootClass = classes.root;
  2177. var options = Splide.options;
  2178. return [rootClass + "--" + options.type, rootClass + "--" + options.direction, options.drag ? rootClass + "--draggable" : '', options.isNavigation ? rootClass + "--nav" : '', STATUS_CLASSES.active];
  2179. }
  2180. /**
  2181. * Find parts only from children of the root or track.
  2182. *
  2183. * @return {Element} - A found element or undefined.
  2184. */
  2185. function findParts(className) {
  2186. return child(root, className) || child(Elements.slider, className);
  2187. }
  2188. return Elements;
  2189. });
  2190. // CONCATENATED MODULE: ./src/js/components/controller/index.js
  2191. /**
  2192. * The component for controlling the track.
  2193. *
  2194. * @author Naotoshi Fujita
  2195. * @copyright Naotoshi Fujita. All rights reserved.
  2196. */
  2197. var floor = Math.floor;
  2198. /**
  2199. * The component for controlling the track.
  2200. *
  2201. * @param {Splide} Splide - A Splide instance.
  2202. * @param {Object} Components - An object containing components.
  2203. *
  2204. * @return {Object} - The component object.
  2205. */
  2206. /* harmony default export */ var controller = (function (Splide, Components) {
  2207. /**
  2208. * Store current options.
  2209. *
  2210. * @type {Object}
  2211. */
  2212. var options;
  2213. /**
  2214. * True if the slide is LOOP mode.
  2215. *
  2216. * @type {boolean}
  2217. */
  2218. var isLoop;
  2219. /**
  2220. * Controller component object.
  2221. *
  2222. * @type {Object}
  2223. */
  2224. var Controller = {
  2225. /**
  2226. * Called when the component is mounted.
  2227. */
  2228. mount: function mount() {
  2229. options = Splide.options;
  2230. isLoop = Splide.is(LOOP);
  2231. bind();
  2232. },
  2233. /**
  2234. * Make track run by the given control.
  2235. * - "+{i}" : Increment the slide index by i.
  2236. * - "-{i}" : Decrement the slide index by i.
  2237. * - "{i}" : Go to the slide whose index is i.
  2238. * - ">" : Go to next page.
  2239. * - "<" : Go to prev page.
  2240. * - ">{i}" : Go to page i.
  2241. *
  2242. * @param {string|number} control - A control pattern.
  2243. * @param {boolean} silently - Go to the destination without event emission.
  2244. */
  2245. go: function go(control, silently) {
  2246. var destIndex = this.trim(this.parse(control));
  2247. Components.Track.go(destIndex, this.rewind(destIndex), silently);
  2248. },
  2249. /**
  2250. * Parse the given control and return the destination index for the track.
  2251. *
  2252. * @param {string} control - A control target pattern.
  2253. *
  2254. * @return {number} - A parsed target.
  2255. */
  2256. parse: function parse(control) {
  2257. var index = Splide.index;
  2258. var matches = String(control).match(/([+\-<>]+)(\d+)?/);
  2259. var indicator = matches ? matches[1] : '';
  2260. var number = matches ? parseInt(matches[2]) : 0;
  2261. switch (indicator) {
  2262. case '+':
  2263. index += number || 1;
  2264. break;
  2265. case '-':
  2266. index -= number || 1;
  2267. break;
  2268. case '>':
  2269. case '<':
  2270. index = parsePage(number, index, indicator === '<');
  2271. break;
  2272. default:
  2273. index = parseInt(control);
  2274. }
  2275. return index;
  2276. },
  2277. /**
  2278. * Compute index from the given page number.
  2279. *
  2280. * @param {number} page - Page number.
  2281. *
  2282. * @return {number} - A computed page number.
  2283. */
  2284. toIndex: function toIndex(page) {
  2285. if (hasFocus()) {
  2286. return page;
  2287. }
  2288. var length = Splide.length;
  2289. var perPage = options.perPage;
  2290. var index = page * perPage;
  2291. index = index - (this.pageLength * perPage - length) * floor(index / length); // Adjustment for the last page.
  2292. if (length - perPage <= index && index < length) {
  2293. index = length - perPage;
  2294. }
  2295. return index;
  2296. },
  2297. /**
  2298. * Compute page number from the given slide index.
  2299. *
  2300. * @param {number} index - Slide index.
  2301. *
  2302. * @return {number} - A computed page number.
  2303. */
  2304. toPage: function toPage(index) {
  2305. if (hasFocus()) {
  2306. return index;
  2307. }
  2308. var length = Splide.length;
  2309. var perPage = options.perPage; // Make the last "perPage" number of slides belong to the last page.
  2310. if (length - perPage <= index && index < length) {
  2311. return floor((length - 1) / perPage);
  2312. }
  2313. return floor(index / perPage);
  2314. },
  2315. /**
  2316. * Trim the given index according to the current mode.
  2317. * Index being returned could be less than 0 or greater than the length in Loop mode.
  2318. *
  2319. * @param {number} index - An index being trimmed.
  2320. *
  2321. * @return {number} - A trimmed index.
  2322. */
  2323. trim: function trim(index) {
  2324. if (!isLoop) {
  2325. index = options.rewind ? this.rewind(index) : between(index, 0, this.edgeIndex);
  2326. }
  2327. return index;
  2328. },
  2329. /**
  2330. * Rewind the given index if it's out of range.
  2331. *
  2332. * @param {number} index - An index.
  2333. *
  2334. * @return {number} - A rewound index.
  2335. */
  2336. rewind: function rewind(index) {
  2337. var edge = this.edgeIndex;
  2338. if (isLoop) {
  2339. while (index > edge) {
  2340. index -= edge + 1;
  2341. }
  2342. while (index < 0) {
  2343. index += edge + 1;
  2344. }
  2345. } else {
  2346. if (index > edge) {
  2347. index = 0;
  2348. } else if (index < 0) {
  2349. index = edge;
  2350. }
  2351. }
  2352. return index;
  2353. },
  2354. /**
  2355. * Check if the direction is "rtl" or not.
  2356. *
  2357. * @return {boolean} - True if "rtl" or false if not.
  2358. */
  2359. isRtl: function isRtl() {
  2360. return options.direction === RTL;
  2361. },
  2362. /**
  2363. * Return the page length.
  2364. *
  2365. * @return {number} - Max page number.
  2366. */
  2367. get pageLength() {
  2368. var length = Splide.length;
  2369. return hasFocus() ? length : Math.ceil(length / options.perPage);
  2370. },
  2371. /**
  2372. * Return the edge index.
  2373. *
  2374. * @return {number} - Edge index.
  2375. */
  2376. get edgeIndex() {
  2377. var length = Splide.length;
  2378. if (!length) {
  2379. return 0;
  2380. }
  2381. if (hasFocus() || options.isNavigation || isLoop) {
  2382. return length - 1;
  2383. }
  2384. return length - options.perPage;
  2385. },
  2386. /**
  2387. * Return the index of the previous slide.
  2388. *
  2389. * @return {number} - The index of the previous slide if available. -1 otherwise.
  2390. */
  2391. get prevIndex() {
  2392. var prev = Splide.index - 1;
  2393. if (isLoop || options.rewind) {
  2394. prev = this.rewind(prev);
  2395. }
  2396. return prev > -1 ? prev : -1;
  2397. },
  2398. /**
  2399. * Return the index of the next slide.
  2400. *
  2401. * @return {number} - The index of the next slide if available. -1 otherwise.
  2402. */
  2403. get nextIndex() {
  2404. var next = Splide.index + 1;
  2405. if (isLoop || options.rewind) {
  2406. next = this.rewind(next);
  2407. }
  2408. return Splide.index < next && next <= this.edgeIndex || next === 0 ? next : -1;
  2409. }
  2410. };
  2411. /**
  2412. * Listen to some events.
  2413. */
  2414. function bind() {
  2415. Splide.on('move', function (newIndex) {
  2416. Splide.index = newIndex;
  2417. }).on('updated refresh', function (newOptions) {
  2418. options = newOptions || options;
  2419. Splide.index = between(Splide.index, 0, Controller.edgeIndex);
  2420. });
  2421. }
  2422. /**
  2423. * Verify if the focus option is available or not.
  2424. *
  2425. * @return {boolean} - True if a slider has the focus option.
  2426. */
  2427. function hasFocus() {
  2428. return options.focus !== false;
  2429. }
  2430. /**
  2431. * Return the next or previous page index computed by the page number and current index.
  2432. *
  2433. * @param {number} number - Specify the page number.
  2434. * @param {number} index - Current index.
  2435. * @param {boolean} prev - Prev or next.
  2436. *
  2437. * @return {number} - Slide index.
  2438. */
  2439. function parsePage(number, index, prev) {
  2440. if (number > -1) {
  2441. return Controller.toIndex(number);
  2442. }
  2443. var perMove = options.perMove;
  2444. var sign = prev ? -1 : 1;
  2445. if (perMove) {
  2446. return index + perMove * sign;
  2447. }
  2448. return Controller.toIndex(Controller.toPage(index) + sign);
  2449. }
  2450. return Controller;
  2451. });
  2452. // CONCATENATED MODULE: ./src/js/components/track/index.js
  2453. /**
  2454. * The component for moving list in the track.
  2455. *
  2456. * @author Naotoshi Fujita
  2457. * @copyright Naotoshi Fujita. All rights reserved.
  2458. */
  2459. var abs = Math.abs;
  2460. /**
  2461. * The component for moving list in the track.
  2462. *
  2463. * @param {Splide} Splide - A Splide instance.
  2464. * @param {Object} Components - An object containing components.
  2465. *
  2466. * @return {Object} - The component object.
  2467. */
  2468. /* harmony default export */ var components_track = (function (Splide, Components) {
  2469. /**
  2470. * Hold the Layout component.
  2471. *
  2472. * @type {Object}
  2473. */
  2474. var Layout;
  2475. /**
  2476. * Hold the Layout component.
  2477. *
  2478. * @type {Object}
  2479. */
  2480. var Elements;
  2481. /**
  2482. * Store the list element.
  2483. *
  2484. * @type {Element}
  2485. */
  2486. var list;
  2487. /**
  2488. * Whether the current direction is vertical or not.
  2489. *
  2490. * @type {boolean}
  2491. */
  2492. var isVertical = Splide.options.direction === TTB;
  2493. /**
  2494. * Whether the slider type is FADE or not.
  2495. *
  2496. * @type {boolean}
  2497. */
  2498. var isFade = Splide.is(FADE);
  2499. /**
  2500. * Whether the slider direction is RTL or not.
  2501. *
  2502. * @type {boolean}
  2503. */
  2504. var isRTL = Splide.options.direction === RTL;
  2505. /**
  2506. * This will be true while transitioning from the last index to the first one.
  2507. *
  2508. * @type {boolean}
  2509. */
  2510. var isLoopPending = false;
  2511. /**
  2512. * Sign for the direction. Only RTL mode uses the positive sign.
  2513. *
  2514. * @type {number}
  2515. */
  2516. var sign = isRTL ? 1 : -1;
  2517. /**
  2518. * Track component object.
  2519. *
  2520. * @type {Object}
  2521. */
  2522. var Track = {
  2523. /**
  2524. * Make public the sign defined locally.
  2525. *
  2526. * @type {number}
  2527. */
  2528. sign: sign,
  2529. /**
  2530. * Called when the component is mounted.
  2531. */
  2532. mount: function mount() {
  2533. Elements = Components.Elements;
  2534. Layout = Components.Layout;
  2535. list = Elements.list;
  2536. },
  2537. /**
  2538. * Called after the component is mounted.
  2539. * The resize event must be registered after the Layout's one is done.
  2540. */
  2541. mounted: function mounted() {
  2542. var _this = this;
  2543. if (!isFade) {
  2544. this.jump(0);
  2545. Splide.on('mounted resize updated', function () {
  2546. _this.jump(Splide.index);
  2547. });
  2548. }
  2549. },
  2550. /**
  2551. * Go to the given destination index.
  2552. * After arriving there, the track is jump to the new index without animation, mainly for loop mode.
  2553. *
  2554. * @param {number} destIndex - A destination index.
  2555. * This can be negative or greater than slides length for reaching clones.
  2556. * @param {number} newIndex - An actual new index. They are always same in Slide and Rewind mode.
  2557. * @param {boolean} silently - If true, suppress emitting events.
  2558. */
  2559. go: function go(destIndex, newIndex, silently) {
  2560. var newPosition = getTrimmedPosition(destIndex);
  2561. var prevIndex = Splide.index; // Prevent any actions while transitioning from the last index to the first one for jump.
  2562. if (Splide.State.is(MOVING) && isLoopPending) {
  2563. return;
  2564. }
  2565. isLoopPending = destIndex !== newIndex;
  2566. if (!silently) {
  2567. Splide.emit('move', newIndex, prevIndex, destIndex);
  2568. }
  2569. if (Math.abs(newPosition - this.position) >= 1 || isFade) {
  2570. Components.Transition.start(destIndex, newIndex, prevIndex, this.toCoord(newPosition), function () {
  2571. onTransitionEnd(destIndex, newIndex, prevIndex, silently);
  2572. });
  2573. } else {
  2574. if (destIndex !== prevIndex && Splide.options.trimSpace === 'move') {
  2575. Components.Controller.go(destIndex + destIndex - prevIndex, silently);
  2576. } else {
  2577. onTransitionEnd(destIndex, newIndex, prevIndex, silently);
  2578. }
  2579. }
  2580. },
  2581. /**
  2582. * Move the track to the specified index.
  2583. *
  2584. * @param {number} index - A destination index where the track jumps.
  2585. */
  2586. jump: function jump(index) {
  2587. this.translate(getTrimmedPosition(index));
  2588. },
  2589. /**
  2590. * Set the list position by CSS translate property.
  2591. *
  2592. * @param {number} position - A new position value.
  2593. */
  2594. translate: function translate(position) {
  2595. applyStyle(list, {
  2596. transform: "translate" + (isVertical ? 'Y' : 'X') + "(" + position + "px)"
  2597. });
  2598. },
  2599. /**
  2600. * Cancel the transition and set the list position.
  2601. * Also, loop the slider if necessary.
  2602. */
  2603. cancel: function cancel() {
  2604. if (Splide.is(LOOP)) {
  2605. this.shift();
  2606. } else {
  2607. // Ensure the current position.
  2608. this.translate(this.position);
  2609. }
  2610. applyStyle(list, {
  2611. transition: ''
  2612. });
  2613. },
  2614. /**
  2615. * Shift the slider if it exceeds borders on the edge.
  2616. */
  2617. shift: function shift() {
  2618. var position = abs(this.position);
  2619. var left = abs(this.toPosition(0));
  2620. var right = abs(this.toPosition(Splide.length));
  2621. var innerSize = right - left;
  2622. if (position < left) {
  2623. position += innerSize;
  2624. } else if (position > right) {
  2625. position -= innerSize;
  2626. }
  2627. this.translate(sign * position);
  2628. },
  2629. /**
  2630. * Trim redundant spaces on the left or right edge if necessary.
  2631. *
  2632. * @param {number} position - Position value to be trimmed.
  2633. *
  2634. * @return {number} - Trimmed position.
  2635. */
  2636. trim: function trim(position) {
  2637. if (!Splide.options.trimSpace || Splide.is(LOOP)) {
  2638. return position;
  2639. }
  2640. var edge = sign * (Layout.totalSize() - Layout.size - Layout.gap);
  2641. return between(position, edge, 0);
  2642. },
  2643. /**
  2644. * Calculate the closest slide index from the given position.
  2645. *
  2646. * @param {number} position - A position converted to an slide index.
  2647. *
  2648. * @return {number} - The closest slide index.
  2649. */
  2650. toIndex: function toIndex(position) {
  2651. var _this2 = this;
  2652. var index = 0;
  2653. var minDistance = Infinity;
  2654. Elements.getSlides(true).forEach(function (Slide) {
  2655. var slideIndex = Slide.index;
  2656. var distance = abs(_this2.toPosition(slideIndex) - position);
  2657. if (distance < minDistance) {
  2658. minDistance = distance;
  2659. index = slideIndex;
  2660. }
  2661. });
  2662. return index;
  2663. },
  2664. /**
  2665. * Return coordinates object by the given position.
  2666. *
  2667. * @param {number} position - A position value.
  2668. *
  2669. * @return {Object} - A coordinates object.
  2670. */
  2671. toCoord: function toCoord(position) {
  2672. return {
  2673. x: isVertical ? 0 : position,
  2674. y: isVertical ? position : 0
  2675. };
  2676. },
  2677. /**
  2678. * Calculate the track position by a slide index.
  2679. *
  2680. * @param {number} index - Slide index.
  2681. *
  2682. * @return {Object} - Calculated position.
  2683. */
  2684. toPosition: function toPosition(index) {
  2685. var position = Layout.totalSize(index) - Layout.slideSize(index) - Layout.gap;
  2686. return sign * (position + this.offset(index));
  2687. },
  2688. /**
  2689. * Return the current offset value, considering direction.
  2690. *
  2691. * @return {number} - Offset amount.
  2692. */
  2693. offset: function offset(index) {
  2694. var focus = Splide.options.focus;
  2695. var slideSize = Layout.slideSize(index);
  2696. if (focus === 'center') {
  2697. return -(Layout.size - slideSize) / 2;
  2698. }
  2699. return -(parseInt(focus) || 0) * (slideSize + Layout.gap);
  2700. },
  2701. /**
  2702. * Return the current position.
  2703. * This returns the correct position even while transitioning by CSS.
  2704. *
  2705. * @return {number} - Current position.
  2706. */
  2707. get position() {
  2708. var prop = isVertical ? 'top' : isRTL ? 'right' : 'left';
  2709. return getRect(list)[prop] - (getRect(Elements.track)[prop] - Layout.padding[prop] * sign);
  2710. }
  2711. };
  2712. /**
  2713. * Called whenever slides arrive at a destination.
  2714. *
  2715. * @param {number} destIndex - A destination index.
  2716. * @param {number} newIndex - A new index.
  2717. * @param {number} prevIndex - A previous index.
  2718. * @param {boolean} silently - If true, suppress emitting events.
  2719. */
  2720. function onTransitionEnd(destIndex, newIndex, prevIndex, silently) {
  2721. applyStyle(list, {
  2722. transition: ''
  2723. });
  2724. isLoopPending = false;
  2725. if (!isFade) {
  2726. Track.jump(newIndex);
  2727. }
  2728. if (!silently) {
  2729. Splide.emit('moved', newIndex, prevIndex, destIndex);
  2730. }
  2731. }
  2732. /**
  2733. * Convert index to the trimmed position.
  2734. *
  2735. * @return {number} - Trimmed position.
  2736. */
  2737. function getTrimmedPosition(index) {
  2738. return Track.trim(Track.toPosition(index));
  2739. }
  2740. return Track;
  2741. });
  2742. // CONCATENATED MODULE: ./src/js/components/clones/index.js
  2743. /**
  2744. * The component for cloning some slides for "loop" mode of the track.
  2745. *
  2746. * @author Naotoshi Fujita
  2747. * @copyright Naotoshi Fujita. All rights reserved.
  2748. */
  2749. /**
  2750. * The component for cloning some slides for "loop" mode of the track.
  2751. *
  2752. * @param {Splide} Splide - A Splide instance.
  2753. * @param {Object} Components - An object containing components.
  2754. *
  2755. * @return {Object} - The component object.
  2756. */
  2757. /* harmony default export */ var components_clones = (function (Splide, Components) {
  2758. /**
  2759. * Store information of all clones.
  2760. *
  2761. * @type {Array}
  2762. */
  2763. var clones = [];
  2764. /**
  2765. * Store the current clone count on one side.
  2766. *
  2767. * @type {number}
  2768. */
  2769. var cloneCount = 0;
  2770. /**
  2771. * Keep Elements component.
  2772. *
  2773. * @type {Object}
  2774. */
  2775. var Elements = Components.Elements;
  2776. /**
  2777. * Clones component object.
  2778. *
  2779. * @type {Object}
  2780. */
  2781. var Clones = {
  2782. /**
  2783. * Called when the component is mounted.
  2784. */
  2785. mount: function mount() {
  2786. var _this = this;
  2787. if (Splide.is(LOOP)) {
  2788. init();
  2789. Splide.on('refresh', init).on('resize', function () {
  2790. if (cloneCount !== getCloneCount()) {
  2791. // Destroy before refresh not to collect clones by the Elements component.
  2792. _this.destroy();
  2793. Splide.refresh();
  2794. }
  2795. });
  2796. }
  2797. },
  2798. /**
  2799. * Destroy.
  2800. */
  2801. destroy: function destroy() {
  2802. dom_remove(clones);
  2803. clones = [];
  2804. },
  2805. /**
  2806. * Return all clones.
  2807. *
  2808. * @return {Element[]} - Cloned elements.
  2809. */
  2810. get clones() {
  2811. return clones;
  2812. },
  2813. /**
  2814. * Return clone length.
  2815. *
  2816. * @return {number} - A length of clones.
  2817. */
  2818. get length() {
  2819. return clones.length;
  2820. }
  2821. };
  2822. /**
  2823. * Initialization.
  2824. */
  2825. function init() {
  2826. Clones.destroy();
  2827. cloneCount = getCloneCount();
  2828. generateClones(cloneCount);
  2829. }
  2830. /**
  2831. * Generate and append/prepend clones.
  2832. *
  2833. * @param {number} count - The half number of clones.
  2834. */
  2835. function generateClones(count) {
  2836. var length = Elements.length,
  2837. register = Elements.register;
  2838. if (length) {
  2839. var slides = Elements.slides;
  2840. while (slides.length < count) {
  2841. slides = slides.concat(slides);
  2842. } // Clones after the last element.
  2843. slides.slice(0, count).forEach(function (elm, index) {
  2844. var clone = cloneDeeply(elm);
  2845. append(Elements.list, clone);
  2846. clones.push(clone);
  2847. register(clone, index + length, index % length);
  2848. }); // Clones before the first element.
  2849. slides.slice(-count).forEach(function (elm, index) {
  2850. var clone = cloneDeeply(elm);
  2851. before(clone, slides[0]);
  2852. clones.push(clone);
  2853. register(clone, index - count, (length + index - count % length) % length);
  2854. });
  2855. }
  2856. }
  2857. /**
  2858. * Return half count of clones to be generated.
  2859. * Clone count is determined by:
  2860. * - "clones" value in the options.
  2861. * - Number of slides that can be placed in a view in "fixed" mode.
  2862. * - Max pages a flick action can move.
  2863. * - Whether the slide length is enough for perPage.
  2864. *
  2865. * @return {number} - Count for clones.
  2866. */
  2867. function getCloneCount() {
  2868. var options = Splide.options;
  2869. if (options.clones) {
  2870. return options.clones;
  2871. } // Use the slide length in autoWidth mode because the number cannot be calculated.
  2872. var baseCount = options.autoWidth || options.autoHeight ? Elements.length : options.perPage;
  2873. var dimension = options.direction === TTB ? 'Height' : 'Width';
  2874. var fixedSize = toPixel(Splide.root, options["fixed" + dimension]);
  2875. if (fixedSize) {
  2876. // Roughly calculate the count. This needs not to be strict.
  2877. baseCount = Math.ceil(Elements.track["client" + dimension] / fixedSize);
  2878. }
  2879. return baseCount * (options.drag ? options.flickMaxPages + 1 : 1);
  2880. }
  2881. /**
  2882. * Clone deeply the given element.
  2883. *
  2884. * @param {Element} elm - An element being duplicated.
  2885. *
  2886. * @return {Node} - A cloned node(element).
  2887. */
  2888. function cloneDeeply(elm) {
  2889. var clone = elm.cloneNode(true);
  2890. addClass(clone, Splide.classes.clone); // ID should not be duplicated.
  2891. removeAttribute(clone, 'id');
  2892. return clone;
  2893. }
  2894. return Clones;
  2895. });
  2896. // CONCATENATED MODULE: ./src/js/components/layout/directions/horizontal.js
  2897. /**
  2898. * The resolver component for horizontal layout.
  2899. *
  2900. * @author Naotoshi Fujita
  2901. * @copyright Naotoshi Fujita. All rights reserved.
  2902. */
  2903. /**
  2904. * The resolver component for horizontal layout.
  2905. *
  2906. * @param {Splide} Splide - A Splide instance.
  2907. * @param {Object} Components - An object containing components.
  2908. *
  2909. * @return {Object} - The resolver object.
  2910. */
  2911. /* harmony default export */ var horizontal = (function (Splide, Components) {
  2912. /**
  2913. * Keep the Elements component.
  2914. *
  2915. * @type {string}
  2916. */
  2917. var Elements = Components.Elements;
  2918. /**
  2919. * Keep the root element.
  2920. *
  2921. * @type {Element}
  2922. */
  2923. var root = Splide.root;
  2924. /**
  2925. * Keep the track element.
  2926. *
  2927. * @type {Element}
  2928. */
  2929. var track;
  2930. /**
  2931. * Keep the latest options.
  2932. *
  2933. * @type {Element}
  2934. */
  2935. var options = Splide.options;
  2936. return {
  2937. /**
  2938. * Margin property name.
  2939. *
  2940. * @type {string}
  2941. */
  2942. margin: 'margin' + (options.direction === RTL ? 'Left' : 'Right'),
  2943. /**
  2944. * Always 0 because the height will be determined by inner contents.
  2945. *
  2946. * @type {number}
  2947. */
  2948. height: 0,
  2949. /**
  2950. * Initialization.
  2951. */
  2952. init: function init() {
  2953. this.resize();
  2954. },
  2955. /**
  2956. * Resize gap and padding.
  2957. * This must be called on init.
  2958. */
  2959. resize: function resize() {
  2960. options = Splide.options;
  2961. track = Elements.track;
  2962. this.gap = toPixel(root, options.gap);
  2963. var padding = options.padding;
  2964. var left = toPixel(root, padding.left || padding);
  2965. var right = toPixel(root, padding.right || padding);
  2966. this.padding = {
  2967. left: left,
  2968. right: right
  2969. };
  2970. applyStyle(track, {
  2971. paddingLeft: unit(left),
  2972. paddingRight: unit(right)
  2973. });
  2974. },
  2975. /**
  2976. * Return total width from the left of the list to the right of the slide specified by the provided index.
  2977. *
  2978. * @param {number} index - Optional. A slide index. If undefined, total width of the slider will be returned.
  2979. *
  2980. * @return {number} - Total width to the right side of the specified slide, or 0 for an invalid index.
  2981. */
  2982. totalWidth: function totalWidth(index) {
  2983. if (index === void 0) {
  2984. index = Splide.length - 1;
  2985. }
  2986. var Slide = Elements.getSlide(index);
  2987. var width = 0;
  2988. if (Slide) {
  2989. var slideRect = getRect(Slide.slide);
  2990. var listRect = getRect(Elements.list);
  2991. if (options.direction === RTL) {
  2992. width = listRect.right - slideRect.left;
  2993. } else {
  2994. width = slideRect.right - listRect.left;
  2995. }
  2996. width += this.gap;
  2997. }
  2998. return width;
  2999. },
  3000. /**
  3001. * Return the slide width in px.
  3002. *
  3003. * @param {number} index - Slide index.
  3004. *
  3005. * @return {number} - The slide width.
  3006. */
  3007. slideWidth: function slideWidth(index) {
  3008. if (options.autoWidth) {
  3009. var Slide = Elements.getSlide(index);
  3010. return Slide ? Slide.slide.offsetWidth : 0;
  3011. }
  3012. var width = options.fixedWidth || (this.width + this.gap) / options.perPage - this.gap;
  3013. return toPixel(root, width);
  3014. },
  3015. /**
  3016. * Return the slide height in px.
  3017. *
  3018. * @return {number} - The slide height.
  3019. */
  3020. slideHeight: function slideHeight() {
  3021. var height = options.height || options.fixedHeight || this.width * options.heightRatio;
  3022. return toPixel(root, height);
  3023. },
  3024. /**
  3025. * Return slider width without padding.
  3026. *
  3027. * @return {number} - Current slider width.
  3028. */
  3029. get width() {
  3030. return track.clientWidth - this.padding.left - this.padding.right;
  3031. }
  3032. };
  3033. });
  3034. // CONCATENATED MODULE: ./src/js/components/layout/directions/vertical.js
  3035. /**
  3036. * The resolver component for vertical layout.
  3037. *
  3038. * @author Naotoshi Fujita
  3039. * @copyright Naotoshi Fujita. All rights reserved.
  3040. */
  3041. /**
  3042. * The resolver component for vertical layout.
  3043. *
  3044. * @param {Splide} Splide - A Splide instance.
  3045. * @param {Object} Components - An object containing components.
  3046. *
  3047. * @return {Object} - The resolver object.
  3048. */
  3049. /* harmony default export */ var vertical = (function (Splide, Components) {
  3050. /**
  3051. * Keep the Elements component.
  3052. *
  3053. * @type {string}
  3054. */
  3055. var Elements = Components.Elements;
  3056. /**
  3057. * Keep the root element.
  3058. *
  3059. * @type {Element}
  3060. */
  3061. var root = Splide.root;
  3062. /**
  3063. * Keep the track element.
  3064. *
  3065. * @type {Element}
  3066. */
  3067. var track;
  3068. /**
  3069. * Keep the latest options.
  3070. *
  3071. * @type {Element}
  3072. */
  3073. var options;
  3074. return {
  3075. /**
  3076. * Margin property name.
  3077. *
  3078. * @type {string}
  3079. */
  3080. margin: 'marginBottom',
  3081. /**
  3082. * Initialization.
  3083. */
  3084. init: function init() {
  3085. this.resize();
  3086. },
  3087. /**
  3088. * Resize gap and padding.
  3089. * This must be called on init.
  3090. */
  3091. resize: function resize() {
  3092. options = Splide.options;
  3093. track = Elements.track;
  3094. this.gap = toPixel(root, options.gap);
  3095. var padding = options.padding;
  3096. var top = toPixel(root, padding.top || padding);
  3097. var bottom = toPixel(root, padding.bottom || padding);
  3098. this.padding = {
  3099. top: top,
  3100. bottom: bottom
  3101. };
  3102. applyStyle(track, {
  3103. paddingTop: unit(top),
  3104. paddingBottom: unit(bottom)
  3105. });
  3106. },
  3107. /**
  3108. * Return total height from the top of the list to the bottom of the slide specified by the provided index.
  3109. *
  3110. * @param {number} index - Optional. A slide index. If undefined, total height of the slider will be returned.
  3111. *
  3112. * @return {number} - Total height to the bottom of the specified slide, or 0 for an invalid index.
  3113. */
  3114. totalHeight: function totalHeight(index) {
  3115. if (index === void 0) {
  3116. index = Splide.length - 1;
  3117. }
  3118. var Slide = Elements.getSlide(index);
  3119. if (Slide) {
  3120. return getRect(Slide.slide).bottom - getRect(Elements.list).top + this.gap;
  3121. }
  3122. return 0;
  3123. },
  3124. /**
  3125. * Return the slide width in px.
  3126. *
  3127. * @return {number} - The slide width.
  3128. */
  3129. slideWidth: function slideWidth() {
  3130. return toPixel(root, options.fixedWidth || this.width);
  3131. },
  3132. /**
  3133. * Return the slide height in px.
  3134. *
  3135. * @param {number} index - Slide index.
  3136. *
  3137. * @return {number} - The slide height.
  3138. */
  3139. slideHeight: function slideHeight(index) {
  3140. if (options.autoHeight) {
  3141. var Slide = Elements.getSlide(index);
  3142. return Slide ? Slide.slide.offsetHeight : 0;
  3143. }
  3144. var height = options.fixedHeight || (this.height + this.gap) / options.perPage - this.gap;
  3145. return toPixel(root, height);
  3146. },
  3147. /**
  3148. * Return slider width without padding.
  3149. *
  3150. * @return {number} - Current slider width.
  3151. */
  3152. get width() {
  3153. return track.clientWidth;
  3154. },
  3155. /**
  3156. * Return slide height without padding.
  3157. *
  3158. * @return {number} - Slider height.
  3159. */
  3160. get height() {
  3161. var height = options.height || this.width * options.heightRatio;
  3162. exist(height, '"height" or "heightRatio" is missing.');
  3163. return toPixel(root, height) - this.padding.top - this.padding.bottom;
  3164. }
  3165. };
  3166. });
  3167. // CONCATENATED MODULE: ./src/js/utils/time.js
  3168. /**
  3169. * A package of utility functions related with time.
  3170. *
  3171. * @author Naotoshi Fujita
  3172. * @copyright Naotoshi Fujita. All rights reserved.
  3173. */
  3174. /**
  3175. * Simple throttle function that controls how often the given function is executed.
  3176. *
  3177. * @param {function} func - A function to be throttled.
  3178. * @param {number} wait - Time in millisecond for interval of execution.
  3179. *
  3180. * @return {Function} - A debounced function.
  3181. */
  3182. function throttle(func, wait) {
  3183. var timeout; // Declare function by the "function" keyword to prevent "this" from being inherited.
  3184. return function () {
  3185. if (!timeout) {
  3186. timeout = setTimeout(function () {
  3187. func();
  3188. timeout = null;
  3189. }, wait);
  3190. }
  3191. };
  3192. }
  3193. /**
  3194. * Custom setInterval function that provides progress rate as callback.
  3195. *
  3196. * @param {function} callback - A callback function fired every time the interval time passes.
  3197. * @param {number} interval - Interval duration in milliseconds.
  3198. * @param {function} progress - A callback function fired whenever the progress goes.
  3199. *
  3200. * @return {Object} - An object containing play() and pause() functions.
  3201. */
  3202. function createInterval(callback, interval, progress) {
  3203. var _window = window,
  3204. requestAnimationFrame = _window.requestAnimationFrame;
  3205. var start,
  3206. elapse,
  3207. rate,
  3208. _pause = true;
  3209. var step = function step(timestamp) {
  3210. if (!_pause) {
  3211. if (!start) {
  3212. start = timestamp;
  3213. if (rate && rate < 1) {
  3214. start -= rate * interval;
  3215. }
  3216. }
  3217. elapse = timestamp - start;
  3218. rate = elapse / interval;
  3219. if (elapse >= interval) {
  3220. start = 0;
  3221. rate = 1;
  3222. callback();
  3223. }
  3224. if (progress) {
  3225. progress(rate);
  3226. }
  3227. requestAnimationFrame(step);
  3228. }
  3229. };
  3230. return {
  3231. pause: function pause() {
  3232. _pause = true;
  3233. start = 0;
  3234. },
  3235. play: function play(reset) {
  3236. start = 0;
  3237. if (_pause) {
  3238. _pause = false;
  3239. if (reset) {
  3240. rate = 0;
  3241. }
  3242. requestAnimationFrame(step);
  3243. }
  3244. }
  3245. };
  3246. }
  3247. // CONCATENATED MODULE: ./src/js/components/layout/index.js
  3248. /**
  3249. * The component for handing slide layouts and their sizes.
  3250. *
  3251. * @author Naotoshi Fujita
  3252. * @copyright Naotoshi Fujita. All rights reserved.
  3253. */
  3254. /**
  3255. * The component for handing slide layouts and their sizes.
  3256. *
  3257. * @param {Splide} Splide - A Splide instance.
  3258. * @param {Object} Components - An object containing components.
  3259. *
  3260. * @return {Object} - The component object.
  3261. */
  3262. /* harmony default export */ var layout = (function (Splide, Components) {
  3263. /**
  3264. * Keep the Elements component.
  3265. *
  3266. * @type {string}
  3267. */
  3268. var Elements = Components.Elements;
  3269. /**
  3270. * Whether the slider is vertical or not.
  3271. *
  3272. * @type {boolean}
  3273. */
  3274. var isVertical = Splide.options.direction === TTB;
  3275. /**
  3276. * Layout component object.
  3277. *
  3278. * @type {Object}
  3279. */
  3280. var Layout = object_assign({
  3281. /**
  3282. * Called when the component is mounted.
  3283. */
  3284. mount: function mount() {
  3285. bind();
  3286. init(); // The word "size" means width for a horizontal slider and height for a vertical slider.
  3287. this.totalSize = isVertical ? this.totalHeight : this.totalWidth;
  3288. this.slideSize = isVertical ? this.slideHeight : this.slideWidth;
  3289. },
  3290. /**
  3291. * Destroy the component.
  3292. */
  3293. destroy: function destroy() {
  3294. removeAttribute([Elements.list, Elements.track], 'style');
  3295. },
  3296. /**
  3297. * Return the slider height on the vertical mode or width on the horizontal mode.
  3298. *
  3299. * @return {number}
  3300. */
  3301. get size() {
  3302. return isVertical ? this.height : this.width;
  3303. }
  3304. }, isVertical ? vertical(Splide, Components) : horizontal(Splide, Components));
  3305. /**
  3306. * Init slider styles according to options.
  3307. */
  3308. function init() {
  3309. Layout.init();
  3310. applyStyle(Splide.root, {
  3311. maxWidth: unit(Splide.options.width)
  3312. });
  3313. Elements.each(function (Slide) {
  3314. Slide.slide.style[Layout.margin] = unit(Layout.gap);
  3315. });
  3316. resize();
  3317. }
  3318. /**
  3319. * Listen the resize native event with throttle.
  3320. * Initialize when the component is mounted or options are updated.
  3321. */
  3322. function bind() {
  3323. Splide.on('resize load', throttle(function () {
  3324. Splide.emit('resize');
  3325. }, Splide.options.throttle), window).on('resize', resize).on('updated refresh', init);
  3326. }
  3327. /**
  3328. * Resize the track and slide elements.
  3329. */
  3330. function resize() {
  3331. var options = Splide.options;
  3332. Layout.resize();
  3333. applyStyle(Elements.track, {
  3334. height: unit(Layout.height)
  3335. });
  3336. var slideHeight = options.autoHeight ? null : unit(Layout.slideHeight());
  3337. Elements.each(function (Slide) {
  3338. applyStyle(Slide.container, {
  3339. height: slideHeight
  3340. });
  3341. applyStyle(Slide.slide, {
  3342. width: options.autoWidth ? null : unit(Layout.slideWidth(Slide.index)),
  3343. height: Slide.container ? null : slideHeight
  3344. });
  3345. });
  3346. }
  3347. return Layout;
  3348. });
  3349. // CONCATENATED MODULE: ./src/js/components/drag/index.js
  3350. /**
  3351. * The component for supporting mouse drag and swipe.
  3352. *
  3353. * @author Naotoshi Fujita
  3354. * @copyright Naotoshi Fujita. All rights reserved.
  3355. */
  3356. var drag_abs = Math.abs;
  3357. /**
  3358. * If the absolute velocity is greater thant this value,
  3359. * a slider always goes to a different slide after drag, not allowed to stay on a current slide.
  3360. */
  3361. var MIN_VELOCITY = 0.1;
  3362. /**
  3363. * Adjust how much the track can be pulled on the first or last page.
  3364. * The larger number this is, the farther the track moves.
  3365. * This should be around 5 - 9.
  3366. *
  3367. * @type {number}
  3368. */
  3369. var FRICTION_REDUCER = 7;
  3370. /**
  3371. * The component supporting mouse drag and swipe.
  3372. *
  3373. * @param {Splide} Splide - A Splide instance.
  3374. * @param {Object} Components - An object containing components.
  3375. *
  3376. * @return {Object} - The component object.
  3377. */
  3378. /* harmony default export */ var drag = (function (Splide, Components) {
  3379. /**
  3380. * Store the Move component.
  3381. *
  3382. * @type {Object}
  3383. */
  3384. var Track = Components.Track;
  3385. /**
  3386. * Store the Controller component.
  3387. *
  3388. * @type {Object}
  3389. */
  3390. var Controller = Components.Controller;
  3391. /**
  3392. * Coordinate of the track on starting drag.
  3393. *
  3394. * @type {Object}
  3395. */
  3396. var startCoord;
  3397. /**
  3398. * Analyzed info on starting drag.
  3399. *
  3400. * @type {Object|null}
  3401. */
  3402. var startInfo;
  3403. /**
  3404. * Analyzed info being updated while dragging/swiping.
  3405. *
  3406. * @type {Object}
  3407. */
  3408. var currentInfo;
  3409. /**
  3410. * Determine whether slides are being dragged or not.
  3411. *
  3412. * @type {boolean}
  3413. */
  3414. var isDragging;
  3415. /**
  3416. * Whether the slider direction is vertical or not.
  3417. *
  3418. * @type {boolean}
  3419. */
  3420. var isVertical = Splide.options.direction === TTB;
  3421. /**
  3422. * Axis for the direction.
  3423. *
  3424. * @type {string}
  3425. */
  3426. var axis = isVertical ? 'y' : 'x';
  3427. /**
  3428. * Drag component object.
  3429. *
  3430. * @type {Object}
  3431. */
  3432. var Drag = {
  3433. /**
  3434. * Whether dragging is disabled or not.
  3435. *
  3436. * @type {boolean}
  3437. */
  3438. disabled: false,
  3439. /**
  3440. * Called when the component is mounted.
  3441. */
  3442. mount: function mount() {
  3443. var _this = this;
  3444. var Elements = Components.Elements;
  3445. var track = Elements.track;
  3446. Splide.on('touchstart mousedown', start, track).on('touchmove mousemove', move, track, {
  3447. passive: false
  3448. }).on('touchend touchcancel mouseleave mouseup dragend', end, track).on('mounted refresh', function () {
  3449. // Prevent dragging an image or anchor itself.
  3450. each(Elements.list.querySelectorAll('img, a'), function (elm) {
  3451. Splide.off('dragstart', elm).on('dragstart', function (e) {
  3452. e.preventDefault();
  3453. }, elm, {
  3454. passive: false
  3455. });
  3456. });
  3457. }).on('mounted updated', function () {
  3458. _this.disabled = !Splide.options.drag;
  3459. });
  3460. }
  3461. };
  3462. /**
  3463. * Called when the track starts to be dragged.
  3464. *
  3465. * @param {TouchEvent|MouseEvent} e - TouchEvent or MouseEvent object.
  3466. */
  3467. function start(e) {
  3468. if (!Drag.disabled && !isDragging) {
  3469. // These prams are used to evaluate whether the slider should start moving.
  3470. init(e);
  3471. }
  3472. }
  3473. /**
  3474. * Initialize parameters.
  3475. *
  3476. * @param {TouchEvent|MouseEvent} e - TouchEvent or MouseEvent object.
  3477. */
  3478. function init(e) {
  3479. startCoord = Track.toCoord(Track.position);
  3480. startInfo = analyze(e, {});
  3481. currentInfo = startInfo;
  3482. }
  3483. /**
  3484. * Called while the track being dragged.
  3485. *
  3486. * @param {TouchEvent|MouseEvent} e - TouchEvent or MouseEvent object.
  3487. */
  3488. function move(e) {
  3489. if (startInfo) {
  3490. currentInfo = analyze(e, startInfo);
  3491. if (isDragging) {
  3492. if (e.cancelable) {
  3493. e.preventDefault();
  3494. }
  3495. if (!Splide.is(FADE)) {
  3496. var position = startCoord[axis] + currentInfo.offset[axis];
  3497. Track.translate(resist(position));
  3498. }
  3499. } else {
  3500. if (shouldMove(currentInfo)) {
  3501. Splide.emit('drag', startInfo);
  3502. isDragging = true;
  3503. Track.cancel(); // These params are actual drag data.
  3504. init(e);
  3505. }
  3506. }
  3507. }
  3508. }
  3509. /**
  3510. * Determine whether to start moving the track or not by drag angle.
  3511. *
  3512. * @param {Object} info - An information object.
  3513. *
  3514. * @return {boolean} - True if the track should be moved or false if not.
  3515. */
  3516. function shouldMove(_ref) {
  3517. var offset = _ref.offset;
  3518. if (Splide.State.is(MOVING) && Splide.options.waitForTransition) {
  3519. return false;
  3520. }
  3521. var angle = Math.atan(drag_abs(offset.y) / drag_abs(offset.x)) * 180 / Math.PI;
  3522. if (isVertical) {
  3523. angle = 90 - angle;
  3524. }
  3525. return angle < Splide.options.dragAngleThreshold;
  3526. }
  3527. /**
  3528. * Resist dragging the track on the first/last page because there is no more.
  3529. *
  3530. * @param {number} position - A position being applied to the track.
  3531. *
  3532. * @return {Object} - Adjusted position.
  3533. */
  3534. function resist(position) {
  3535. if (Splide.is(SLIDE)) {
  3536. var sign = Track.sign;
  3537. var _start = sign * Track.trim(Track.toPosition(0));
  3538. var _end = sign * Track.trim(Track.toPosition(Controller.edgeIndex));
  3539. position *= sign;
  3540. if (position < _start) {
  3541. position = _start - FRICTION_REDUCER * Math.log(_start - position);
  3542. } else if (position > _end) {
  3543. position = _end + FRICTION_REDUCER * Math.log(position - _end);
  3544. }
  3545. position *= sign;
  3546. }
  3547. return position;
  3548. }
  3549. /**
  3550. * Called when dragging ends.
  3551. */
  3552. function end() {
  3553. startInfo = null;
  3554. if (isDragging) {
  3555. Splide.emit('dragged', currentInfo);
  3556. go(currentInfo);
  3557. isDragging = false;
  3558. }
  3559. }
  3560. /**
  3561. * Go to the slide determined by the analyzed data.
  3562. *
  3563. * @param {Object} info - An info object.
  3564. */
  3565. function go(info) {
  3566. var velocity = info.velocity[axis];
  3567. var absV = drag_abs(velocity);
  3568. if (absV > 0) {
  3569. var options = Splide.options;
  3570. var index = Splide.index;
  3571. var sign = velocity < 0 ? -1 : 1;
  3572. var destIndex = index;
  3573. if (!Splide.is(FADE)) {
  3574. var destination = Track.position;
  3575. if (absV > options.flickVelocityThreshold && drag_abs(info.offset[axis]) < options.swipeDistanceThreshold) {
  3576. destination += sign * Math.min(absV * options.flickPower, Components.Layout.size * (options.flickMaxPages || 1));
  3577. }
  3578. destIndex = Track.toIndex(destination);
  3579. }
  3580. /*
  3581. * Do not allow the track to go to a previous position if there is enough velocity.
  3582. * Always use the adjacent index for the fade mode.
  3583. */
  3584. if (destIndex === index && absV > MIN_VELOCITY) {
  3585. destIndex = index + sign * Track.sign;
  3586. }
  3587. if (Splide.is(SLIDE)) {
  3588. destIndex = between(destIndex, 0, Controller.edgeIndex);
  3589. }
  3590. Controller.go(destIndex, options.isNavigation);
  3591. }
  3592. }
  3593. /**
  3594. * Analyze the given event object and return important information for handling swipe behavior.
  3595. *
  3596. * @param {Event} e - Touch or Mouse event object.
  3597. * @param {Object} startInfo - Information analyzed on start for calculating difference from the current one.
  3598. *
  3599. * @return {Object} - An object containing analyzed information, such as offset, velocity, etc.
  3600. */
  3601. function analyze(e, startInfo) {
  3602. var timeStamp = e.timeStamp,
  3603. touches = e.touches;
  3604. var _ref2 = touches ? touches[0] : e,
  3605. clientX = _ref2.clientX,
  3606. clientY = _ref2.clientY;
  3607. var _ref3 = startInfo.to || {},
  3608. _ref3$x = _ref3.x,
  3609. fromX = _ref3$x === void 0 ? clientX : _ref3$x,
  3610. _ref3$y = _ref3.y,
  3611. fromY = _ref3$y === void 0 ? clientY : _ref3$y;
  3612. var startTime = startInfo.time || 0;
  3613. var offset = {
  3614. x: clientX - fromX,
  3615. y: clientY - fromY
  3616. };
  3617. var duration = timeStamp - startTime;
  3618. var velocity = {
  3619. x: offset.x / duration,
  3620. y: offset.y / duration
  3621. };
  3622. return {
  3623. to: {
  3624. x: clientX,
  3625. y: clientY
  3626. },
  3627. offset: offset,
  3628. time: timeStamp,
  3629. velocity: velocity
  3630. };
  3631. }
  3632. return Drag;
  3633. });
  3634. // CONCATENATED MODULE: ./src/js/components/click/index.js
  3635. /**
  3636. * The component for handling a click event.
  3637. *
  3638. * @author Naotoshi Fujita
  3639. * @copyright Naotoshi Fujita. All rights reserved.
  3640. */
  3641. /**
  3642. * The component for handling a click event.
  3643. * Click should be disabled during drag/swipe.
  3644. *
  3645. * @param {Splide} Splide - A Splide instance.
  3646. * @param {Object} Components - An object containing components.
  3647. *
  3648. * @return {Object} - The component object.
  3649. */
  3650. /* harmony default export */ var click = (function (Splide, Components) {
  3651. /**
  3652. * Whether click is disabled or not.
  3653. *
  3654. * @type {boolean}
  3655. */
  3656. var disabled = false;
  3657. /**
  3658. * Click component object.
  3659. *
  3660. * @type {Object}
  3661. */
  3662. var Click = {
  3663. /**
  3664. * Mount only when the drag is activated and the slide type is not "fade".
  3665. *
  3666. * @type {boolean}
  3667. */
  3668. required: Splide.options.drag,
  3669. /**
  3670. * Called when the component is mounted.
  3671. */
  3672. mount: function mount() {
  3673. Splide.on('click', onClick, Components.Elements.track, {
  3674. capture: true
  3675. }).on('drag', function () {
  3676. disabled = true;
  3677. }).on('moved', function () {
  3678. disabled = false;
  3679. });
  3680. }
  3681. };
  3682. /**
  3683. * Called when a track element is clicked.
  3684. *
  3685. * @param {Event} e - A click event.
  3686. */
  3687. function onClick(e) {
  3688. if (disabled) {
  3689. e.preventDefault();
  3690. e.stopPropagation();
  3691. e.stopImmediatePropagation();
  3692. }
  3693. }
  3694. return Click;
  3695. });
  3696. // CONCATENATED MODULE: ./src/js/components/autoplay/index.js
  3697. /**
  3698. * The component for playing slides automatically.
  3699. *
  3700. * @author Naotoshi Fujita
  3701. * @copyright Naotoshi Fujita. All rights reserved.
  3702. */
  3703. /**
  3704. * Set of pause flags.
  3705. */
  3706. var PAUSE_FLAGS = {
  3707. HOVER: 1,
  3708. FOCUS: 2,
  3709. MANUAL: 3
  3710. };
  3711. /**
  3712. * The component for playing slides automatically.
  3713. *
  3714. * @param {Splide} Splide - A Splide instance.
  3715. * @param {Object} Components - An object containing components.
  3716. * @param {string} name - A component name as a lowercase string.
  3717. *
  3718. * @return {Object} - The component object.
  3719. */
  3720. /* harmony default export */ var components_autoplay = (function (Splide, Components, name) {
  3721. /**
  3722. * Store pause flags.
  3723. *
  3724. * @type {Array}
  3725. */
  3726. var flags = [];
  3727. /**
  3728. * Store an interval object.
  3729. *
  3730. * @type {Object};
  3731. */
  3732. var interval;
  3733. /**
  3734. * Keep the Elements component.
  3735. *
  3736. * @type {string}
  3737. */
  3738. var Elements = Components.Elements;
  3739. /**
  3740. * Autoplay component object.
  3741. *
  3742. * @type {Object}
  3743. */
  3744. var Autoplay = {
  3745. /**
  3746. * Required only when the autoplay option is true.
  3747. *
  3748. * @type {boolean}
  3749. */
  3750. required: Splide.options.autoplay,
  3751. /**
  3752. * Called when the component is mounted.
  3753. * Note that autoplay starts only if there are slides over perPage number.
  3754. */
  3755. mount: function mount() {
  3756. var options = Splide.options;
  3757. if (Elements.slides.length > options.perPage) {
  3758. interval = createInterval(function () {
  3759. Splide.go('>');
  3760. }, options.interval, function (rate) {
  3761. Splide.emit(name + ":playing", rate);
  3762. if (Elements.bar) {
  3763. applyStyle(Elements.bar, {
  3764. width: rate * 100 + "%"
  3765. });
  3766. }
  3767. });
  3768. bind();
  3769. this.play();
  3770. }
  3771. },
  3772. /**
  3773. * Start autoplay.
  3774. *
  3775. * @param {number} flag - A pause flag to be removed.
  3776. */
  3777. play: function play(flag) {
  3778. if (flag === void 0) {
  3779. flag = 0;
  3780. }
  3781. flags = flags.filter(function (f) {
  3782. return f !== flag;
  3783. });
  3784. if (!flags.length) {
  3785. Splide.emit(name + ":play");
  3786. interval.play(Splide.options.resetProgress);
  3787. }
  3788. },
  3789. /**
  3790. * Pause autoplay.
  3791. * Note that Array.includes is not supported by IE.
  3792. *
  3793. * @param {number} flag - A pause flag to be added.
  3794. */
  3795. pause: function pause(flag) {
  3796. if (flag === void 0) {
  3797. flag = 0;
  3798. }
  3799. interval.pause();
  3800. if (flags.indexOf(flag) === -1) {
  3801. flags.push(flag);
  3802. }
  3803. if (flags.length === 1) {
  3804. Splide.emit(name + ":pause");
  3805. }
  3806. }
  3807. };
  3808. /**
  3809. * Listen some events.
  3810. */
  3811. function bind() {
  3812. var options = Splide.options;
  3813. var sibling = Splide.sibling;
  3814. var elms = [Splide.root, sibling ? sibling.root : null];
  3815. if (options.pauseOnHover) {
  3816. switchOn(elms, 'mouseleave', PAUSE_FLAGS.HOVER, true);
  3817. switchOn(elms, 'mouseenter', PAUSE_FLAGS.HOVER, false);
  3818. }
  3819. if (options.pauseOnFocus) {
  3820. switchOn(elms, 'focusout', PAUSE_FLAGS.FOCUS, true);
  3821. switchOn(elms, 'focusin', PAUSE_FLAGS.FOCUS, false);
  3822. }
  3823. if (Elements.play) {
  3824. Splide.on('click', function () {
  3825. // Need to be removed a focus flag at first.
  3826. Autoplay.play(PAUSE_FLAGS.FOCUS);
  3827. Autoplay.play(PAUSE_FLAGS.MANUAL);
  3828. }, Elements.play);
  3829. }
  3830. if (Elements.pause) {
  3831. switchOn([Elements.pause], 'click', PAUSE_FLAGS.MANUAL, false);
  3832. }
  3833. Splide.on('move refresh', function () {
  3834. Autoplay.play();
  3835. }) // Rewind the timer.
  3836. .on('destroy', function () {
  3837. Autoplay.pause();
  3838. });
  3839. }
  3840. /**
  3841. * Play or pause on the given event.
  3842. *
  3843. * @param {Element[]} elms - Elements.
  3844. * @param {string} event - An event name or names.
  3845. * @param {number} flag - A pause flag defined on the top.
  3846. * @param {boolean} play - Determine whether to play or pause.
  3847. */
  3848. function switchOn(elms, event, flag, play) {
  3849. elms.forEach(function (elm) {
  3850. Splide.on(event, function () {
  3851. Autoplay[play ? 'play' : 'pause'](flag);
  3852. }, elm);
  3853. });
  3854. }
  3855. return Autoplay;
  3856. });
  3857. // CONCATENATED MODULE: ./src/js/components/cover/index.js
  3858. /**
  3859. * The component for change an img element to background image of its wrapper.
  3860. *
  3861. * @author Naotoshi Fujita
  3862. * @copyright Naotoshi Fujita. All rights reserved.
  3863. */
  3864. /**
  3865. * The component for change an img element to background image of its wrapper.
  3866. *
  3867. * @param {Splide} Splide - A Splide instance.
  3868. * @param {Object} Components - An object containing components.
  3869. *
  3870. * @return {Object} - The component object.
  3871. */
  3872. /* harmony default export */ var components_cover = (function (Splide, Components) {
  3873. /**
  3874. * Hold options.
  3875. *
  3876. * @type {Object}
  3877. */
  3878. var options = Splide.options;
  3879. /**
  3880. * Cover component object.
  3881. *
  3882. * @type {Object}
  3883. */
  3884. var Cover = {
  3885. /**
  3886. * Required only when "cover" option is true.
  3887. *
  3888. * @type {boolean}
  3889. */
  3890. required: options.cover,
  3891. /**
  3892. * Called when the component is mounted.
  3893. */
  3894. mount: function mount() {
  3895. Splide.on('lazyload:loaded', function (img) {
  3896. cover(img, false);
  3897. });
  3898. Splide.on('mounted updated refresh', function () {
  3899. return apply(false);
  3900. });
  3901. },
  3902. /**
  3903. * Destroy.
  3904. */
  3905. destroy: function destroy() {
  3906. apply(true);
  3907. }
  3908. };
  3909. /**
  3910. * Apply "cover" to all slides.
  3911. *
  3912. * @param {boolean} uncover - If true, "cover" will be clear.
  3913. */
  3914. function apply(uncover) {
  3915. Components.Elements.each(function (Slide) {
  3916. var img = child(Slide.slide, 'IMG') || child(Slide.container, 'IMG');
  3917. if (img && img.src) {
  3918. cover(img, uncover);
  3919. }
  3920. });
  3921. }
  3922. /**
  3923. * Set background image of the parent element, using source of the given image element.
  3924. *
  3925. * @param {Element} img - An image element.
  3926. * @param {boolean} uncover - Reset "cover".
  3927. */
  3928. function cover(img, uncover) {
  3929. applyStyle(img.parentElement, {
  3930. background: uncover ? '' : "center/cover no-repeat url(\"" + img.src + "\")"
  3931. });
  3932. applyStyle(img, {
  3933. display: uncover ? '' : 'none'
  3934. });
  3935. }
  3936. return Cover;
  3937. });
  3938. // CONCATENATED MODULE: ./src/js/components/arrows/path.js
  3939. /**
  3940. * Export vector path for an arrow.
  3941. *
  3942. * @author Naotoshi Fujita
  3943. * @copyright Naotoshi Fujita. All rights reserved.
  3944. */
  3945. /**
  3946. * Namespace definition for SVG element.
  3947. *
  3948. * @type {string}
  3949. */
  3950. var XML_NAME_SPACE = 'http://www.w3.org/2000/svg';
  3951. /**
  3952. * The arrow vector path.
  3953. *
  3954. * @type {number}
  3955. */
  3956. var PATH = 'm15.5 0.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4-14.6-14.6z';
  3957. /**
  3958. * SVG width and height.
  3959. *
  3960. * @type {number}
  3961. */
  3962. var SIZE = 40;
  3963. // CONCATENATED MODULE: ./src/js/components/arrows/index.js
  3964. /**
  3965. * The component for appending prev/next arrows.
  3966. *
  3967. * @author Naotoshi Fujita
  3968. * @copyright Naotoshi Fujita. All rights reserved.
  3969. */
  3970. /**
  3971. * The component for appending prev/next arrows.
  3972. *
  3973. * @param {Splide} Splide - A Splide instance.
  3974. * @param {Object} Components - An object containing components.
  3975. * @param {string} name - A component name as a lowercase string.
  3976. *
  3977. * @return {Object} - The component object.
  3978. */
  3979. /* harmony default export */ var components_arrows = (function (Splide, Components, name) {
  3980. /**
  3981. * Previous arrow element.
  3982. *
  3983. * @type {Element|undefined}
  3984. */
  3985. var prev;
  3986. /**
  3987. * Next arrow element.
  3988. *
  3989. * @type {Element|undefined}
  3990. */
  3991. var next;
  3992. /**
  3993. * Store the class list.
  3994. *
  3995. * @type {Object}
  3996. */
  3997. var classes = Splide.classes;
  3998. /**
  3999. * Hold the root element.
  4000. *
  4001. * @type {Element}
  4002. */
  4003. var root = Splide.root;
  4004. /**
  4005. * Whether arrows are created programmatically or not.
  4006. *
  4007. * @type {boolean}
  4008. */
  4009. var created;
  4010. /**
  4011. * Hold the Elements component.
  4012. *
  4013. * @type {Object}
  4014. */
  4015. var Elements = Components.Elements;
  4016. /**
  4017. * Arrows component object.
  4018. *
  4019. * @type {Object}
  4020. */
  4021. var Arrows = {
  4022. /**
  4023. * Required when the arrows option is true.
  4024. *
  4025. * @type {boolean}
  4026. */
  4027. required: Splide.options.arrows,
  4028. /**
  4029. * Called when the component is mounted.
  4030. */
  4031. mount: function mount() {
  4032. // Attempt to get arrows from HTML source.
  4033. prev = Elements.arrows.prev;
  4034. next = Elements.arrows.next; // If arrows were not found in HTML, let's generate them.
  4035. if ((!prev || !next) && Splide.options.arrows) {
  4036. prev = createArrow(true);
  4037. next = createArrow(false);
  4038. created = true;
  4039. appendArrows();
  4040. }
  4041. if (prev && next) {
  4042. bind();
  4043. }
  4044. this.arrows = {
  4045. prev: prev,
  4046. next: next
  4047. };
  4048. },
  4049. /**
  4050. * Called after all components are mounted.
  4051. */
  4052. mounted: function mounted() {
  4053. Splide.emit(name + ":mounted", prev, next);
  4054. },
  4055. /**
  4056. * Destroy.
  4057. */
  4058. destroy: function destroy() {
  4059. removeAttribute([prev, next], 'disabled');
  4060. if (created) {
  4061. dom_remove(prev.parentElement);
  4062. }
  4063. }
  4064. };
  4065. /**
  4066. * Listen to native and custom events.
  4067. */
  4068. function bind() {
  4069. Splide.on('click', function () {
  4070. Splide.go('<');
  4071. }, prev).on('click', function () {
  4072. Splide.go('>');
  4073. }, next).on('mounted move updated refresh', updateDisabled);
  4074. }
  4075. /**
  4076. * Update a disabled attribute.
  4077. */
  4078. function updateDisabled() {
  4079. var _Components$Controlle = Components.Controller,
  4080. prevIndex = _Components$Controlle.prevIndex,
  4081. nextIndex = _Components$Controlle.nextIndex;
  4082. var isEnough = Splide.length > Splide.options.perPage || Splide.is(LOOP);
  4083. prev.disabled = prevIndex < 0 || !isEnough;
  4084. next.disabled = nextIndex < 0 || !isEnough;
  4085. Splide.emit(name + ":updated", prev, next, prevIndex, nextIndex);
  4086. }
  4087. /**
  4088. * Create a wrapper element and append arrows.
  4089. */
  4090. function appendArrows() {
  4091. var wrapper = create('div', {
  4092. "class": classes.arrows
  4093. });
  4094. append(wrapper, prev);
  4095. append(wrapper, next);
  4096. var slider = Elements.slider;
  4097. var parent = Splide.options.arrows === 'slider' && slider ? slider : root;
  4098. before(wrapper, parent.firstElementChild);
  4099. }
  4100. /**
  4101. * Create an arrow element.
  4102. *
  4103. * @param {boolean} prev - Determine to create a prev arrow or next arrow.
  4104. *
  4105. * @return {Element} - A created arrow element.
  4106. */
  4107. function createArrow(prev) {
  4108. var arrow = "<button class=\"" + classes.arrow + " " + (prev ? classes.prev : classes.next) + "\" type=\"button\">" + ("<svg xmlns=\"" + XML_NAME_SPACE + "\"\tviewBox=\"0 0 " + SIZE + " " + SIZE + "\"\twidth=\"" + SIZE + "\"\theight=\"" + SIZE + "\">") + ("<path d=\"" + (Splide.options.arrowPath || PATH) + "\" />");
  4109. return domify(arrow);
  4110. }
  4111. return Arrows;
  4112. });
  4113. // CONCATENATED MODULE: ./src/js/components/pagination/index.js
  4114. /**
  4115. * The component for handling pagination
  4116. *
  4117. * @author Naotoshi Fujita
  4118. * @copyright Naotoshi Fujita. All rights reserved.
  4119. */
  4120. /**
  4121. * The event name for updating some attributes of pagination nodes.
  4122. *
  4123. * @type {string}
  4124. */
  4125. var ATTRIBUTES_UPDATE_EVENT = 'move.page';
  4126. /**
  4127. * The event name for recreating pagination.
  4128. *
  4129. * @type {string}
  4130. */
  4131. var UPDATE_EVENT = 'updated.page refresh.page';
  4132. /**
  4133. * The component for handling pagination
  4134. *
  4135. * @param {Splide} Splide - A Splide instance.
  4136. * @param {Object} Components - An object containing components.
  4137. * @param {string} name - A component name as a lowercase string.
  4138. *
  4139. * @return {Object} - The component object.
  4140. */
  4141. /* harmony default export */ var components_pagination = (function (Splide, Components, name) {
  4142. /**
  4143. * Store all data for pagination.
  4144. * - list: A list element.
  4145. * - items: An array that contains objects(li, button, index, page).
  4146. *
  4147. * @type {Object}
  4148. */
  4149. var data = {};
  4150. /**
  4151. * Hold the Elements component.
  4152. *
  4153. * @type {Object}
  4154. */
  4155. var Elements = Components.Elements;
  4156. /**
  4157. * Pagination component object.
  4158. *
  4159. * @type {Object}
  4160. */
  4161. var Pagination = {
  4162. /**
  4163. * Called when the component is mounted.
  4164. */
  4165. mount: function mount() {
  4166. var pagination = Splide.options.pagination;
  4167. if (pagination) {
  4168. data = createPagination();
  4169. var slider = Elements.slider;
  4170. var parent = pagination === 'slider' && slider ? slider : Splide.root;
  4171. append(parent, data.list);
  4172. Splide.on(ATTRIBUTES_UPDATE_EVENT, updateAttributes);
  4173. }
  4174. Splide.off(UPDATE_EVENT).on(UPDATE_EVENT, function () {
  4175. Pagination.destroy();
  4176. if (Splide.options.pagination) {
  4177. Pagination.mount();
  4178. Pagination.mounted();
  4179. }
  4180. });
  4181. },
  4182. /**
  4183. * Called after all components are mounted.
  4184. */
  4185. mounted: function mounted() {
  4186. if (Splide.options.pagination) {
  4187. var index = Splide.index;
  4188. Splide.emit(name + ":mounted", data, this.getItem(index));
  4189. updateAttributes(index, -1);
  4190. }
  4191. },
  4192. /**
  4193. * Destroy the pagination.
  4194. * Be aware that node.remove() is not supported by IE.
  4195. */
  4196. destroy: function destroy() {
  4197. dom_remove(data.list);
  4198. if (data.items) {
  4199. data.items.forEach(function (item) {
  4200. Splide.off('click', item.button);
  4201. });
  4202. } // Do not remove UPDATE_EVENT to recreate pagination if needed.
  4203. Splide.off(ATTRIBUTES_UPDATE_EVENT);
  4204. data = {};
  4205. },
  4206. /**
  4207. * Return an item by index.
  4208. *
  4209. * @param {number} index - A slide index.
  4210. *
  4211. * @return {Object|undefined} - An item object on success or undefined on failure.
  4212. */
  4213. getItem: function getItem(index) {
  4214. return data.items[Components.Controller.toPage(index)];
  4215. },
  4216. /**
  4217. * Return object containing pagination data.
  4218. *
  4219. * @return {Object} - Pagination data including list and items.
  4220. */
  4221. get data() {
  4222. return data;
  4223. }
  4224. };
  4225. /**
  4226. * Update attributes.
  4227. *
  4228. * @param {number} index - Active index.
  4229. * @param {number} prevIndex - Prev index.
  4230. */
  4231. function updateAttributes(index, prevIndex) {
  4232. var prev = Pagination.getItem(prevIndex);
  4233. var curr = Pagination.getItem(index);
  4234. var active = STATUS_CLASSES.active;
  4235. if (prev) {
  4236. removeClass(prev.button, active);
  4237. }
  4238. if (curr) {
  4239. addClass(curr.button, active);
  4240. }
  4241. Splide.emit(name + ":updated", data, prev, curr);
  4242. }
  4243. /**
  4244. * Create a wrapper and button elements.
  4245. *
  4246. * @return {Object} - An object contains all data.
  4247. */
  4248. function createPagination() {
  4249. var options = Splide.options;
  4250. var classes = Splide.classes;
  4251. var list = create('ul', {
  4252. "class": classes.pagination
  4253. });
  4254. var items = Elements.getSlides(false).filter(function (Slide) {
  4255. return options.focus !== false || Slide.index % options.perPage === 0;
  4256. }).map(function (Slide, page) {
  4257. var li = create('li', {});
  4258. var button = create('button', {
  4259. "class": classes.page,
  4260. type: 'button'
  4261. });
  4262. append(li, button);
  4263. append(list, li);
  4264. Splide.on('click', function () {
  4265. Splide.go(">" + page);
  4266. }, button);
  4267. return {
  4268. li: li,
  4269. button: button,
  4270. page: page,
  4271. Slides: Elements.getSlidesByPage(page)
  4272. };
  4273. });
  4274. return {
  4275. list: list,
  4276. items: items
  4277. };
  4278. }
  4279. return Pagination;
  4280. });
  4281. // CONCATENATED MODULE: ./src/js/components/lazyload/index.js
  4282. /**
  4283. * The component for loading slider images lazily.
  4284. *
  4285. * @author Naotoshi Fujita
  4286. * @copyright Naotoshi Fujita. All rights reserved.
  4287. */
  4288. /**
  4289. * The name for a data attribute of src.
  4290. *
  4291. * @type {string}
  4292. */
  4293. var SRC_DATA_NAME = 'data-splide-lazy';
  4294. /**
  4295. * The name for a data attribute of srcset.
  4296. *
  4297. * @type {string}
  4298. */
  4299. var SRCSET_DATA_NAME = 'data-splide-lazy-srcset';
  4300. /**
  4301. * The component for loading slider images lazily.
  4302. *
  4303. * @param {Splide} Splide - A Splide instance.
  4304. * @param {Object} Components - An object containing components.
  4305. * @param {string} name - A component name as a lowercase string.
  4306. *
  4307. * @return {Object} - The component object.
  4308. */
  4309. /* harmony default export */ var lazyload = (function (Splide, Components, name) {
  4310. /**
  4311. * Next index for sequential loading.
  4312. *
  4313. * @type {number}
  4314. */
  4315. var nextIndex;
  4316. /**
  4317. * Store objects containing an img element and a Slide object.
  4318. *
  4319. * @type {Object[]}
  4320. */
  4321. var images;
  4322. /**
  4323. * Store the options.
  4324. *
  4325. * @type {Object}
  4326. */
  4327. var options = Splide.options;
  4328. /**
  4329. * Whether to load images sequentially or not.
  4330. *
  4331. * @type {boolean}
  4332. */
  4333. var isSequential = options.lazyLoad === 'sequential';
  4334. /**
  4335. * Lazyload component object.
  4336. *
  4337. * @type {Object}
  4338. */
  4339. var Lazyload = {
  4340. /**
  4341. * Mount only when the lazyload option is provided.
  4342. *
  4343. * @type {boolean}
  4344. */
  4345. required: options.lazyLoad,
  4346. /**
  4347. * Called when the component is mounted.
  4348. */
  4349. mount: function mount() {
  4350. Splide.on('mounted refresh', function () {
  4351. init();
  4352. Components.Elements.each(function (Slide) {
  4353. each(Slide.slide.querySelectorAll("[" + SRC_DATA_NAME + "], [" + SRCSET_DATA_NAME + "]"), function (img) {
  4354. if (!img.src && !img.srcset) {
  4355. images.push({
  4356. img: img,
  4357. Slide: Slide
  4358. });
  4359. applyStyle(img, {
  4360. display: 'none'
  4361. });
  4362. }
  4363. });
  4364. });
  4365. if (isSequential) {
  4366. loadNext();
  4367. }
  4368. });
  4369. if (!isSequential) {
  4370. Splide.on("mounted refresh moved." + name, check);
  4371. }
  4372. },
  4373. /**
  4374. * Destroy.
  4375. */
  4376. destroy: init
  4377. };
  4378. /**
  4379. * Initialize parameters.
  4380. */
  4381. function init() {
  4382. images = [];
  4383. nextIndex = 0;
  4384. }
  4385. /**
  4386. * Check how close each image is from the active slide and
  4387. * determine whether to start loading or not, according to the distance.
  4388. *
  4389. * @param {number} index - Current index.
  4390. */
  4391. function check(index) {
  4392. index = isNaN(index) ? Splide.index : index;
  4393. images = images.filter(function (image) {
  4394. if (image.Slide.isWithin(index, options.perPage * (options.preloadPages + 1))) {
  4395. load(image.img, image.Slide);
  4396. return false;
  4397. }
  4398. return true;
  4399. }); // Unbind if all images are loaded.
  4400. if (!images[0]) {
  4401. Splide.off("moved." + name);
  4402. }
  4403. }
  4404. /**
  4405. * Start loading an image.
  4406. * Creating a clone of the image element since setting src attribute directly to it
  4407. * often occurs 'hitch', blocking some other processes of a browser.
  4408. *
  4409. * @param {Element} img - An image element.
  4410. * @param {Object} Slide - A Slide object.
  4411. */
  4412. function load(img, Slide) {
  4413. addClass(Slide.slide, STATUS_CLASSES.loading);
  4414. var spinner = create('span', {
  4415. "class": Splide.classes.spinner
  4416. });
  4417. append(img.parentElement, spinner);
  4418. img.onload = function () {
  4419. loaded(img, spinner, Slide, false);
  4420. };
  4421. img.onerror = function () {
  4422. loaded(img, spinner, Slide, true);
  4423. };
  4424. setAttribute(img, 'srcset', getAttribute(img, SRCSET_DATA_NAME) || '');
  4425. setAttribute(img, 'src', getAttribute(img, SRC_DATA_NAME) || '');
  4426. }
  4427. /**
  4428. * Start loading a next image in images array.
  4429. */
  4430. function loadNext() {
  4431. if (nextIndex < images.length) {
  4432. var image = images[nextIndex];
  4433. load(image.img, image.Slide);
  4434. }
  4435. nextIndex++;
  4436. }
  4437. /**
  4438. * Called just after the image was loaded or loading was aborted by some error.
  4439. *
  4440. * @param {Element} img - An image element.
  4441. * @param {Element} spinner - A spinner element.
  4442. * @param {Object} Slide - A Slide object.
  4443. * @param {boolean} error - True if the image was loaded successfully or false on error.
  4444. */
  4445. function loaded(img, spinner, Slide, error) {
  4446. removeClass(Slide.slide, STATUS_CLASSES.loading);
  4447. if (!error) {
  4448. dom_remove(spinner);
  4449. applyStyle(img, {
  4450. display: ''
  4451. });
  4452. Splide.emit(name + ":loaded", img).emit('resize');
  4453. }
  4454. if (isSequential) {
  4455. loadNext();
  4456. }
  4457. }
  4458. return Lazyload;
  4459. });
  4460. // CONCATENATED MODULE: ./src/js/constants/a11y.js
  4461. /**
  4462. * Export aria attribute names.
  4463. *
  4464. * @author Naotoshi Fujita
  4465. * @copyright Naotoshi Fujita. All rights reserved.
  4466. */
  4467. /**
  4468. * Attribute name for aria-current.
  4469. *
  4470. * @type {string}
  4471. */
  4472. var ARIA_CURRENRT = 'aria-current';
  4473. /**
  4474. * Attribute name for aria-control.
  4475. *
  4476. * @type {string}
  4477. */
  4478. var ARIA_CONTROLS = 'aria-controls';
  4479. /**
  4480. * Attribute name for aria-control.
  4481. *
  4482. * @type {string}
  4483. */
  4484. var ARIA_LABEL = 'aria-label';
  4485. /**
  4486. * Attribute name for aria-labelledby.
  4487. *
  4488. * @type {string}
  4489. */
  4490. var ARIA_LABELLEDBY = 'aria-labelledby';
  4491. /**
  4492. * Attribute name for aria-hidden.
  4493. *
  4494. * @type {string}
  4495. */
  4496. var ARIA_HIDDEN = 'aria-hidden';
  4497. /**
  4498. * Attribute name for tab-index.
  4499. *
  4500. * @type {string}
  4501. */
  4502. var TAB_INDEX = 'tabindex';
  4503. // CONCATENATED MODULE: ./src/js/components/keyboard/index.js
  4504. /**
  4505. * The component for controlling slides via keyboard.
  4506. *
  4507. * @author Naotoshi Fujita
  4508. * @copyright Naotoshi Fujita. All rights reserved.
  4509. */
  4510. /**
  4511. * Map a key to a slide control.
  4512. *
  4513. * @type {Object}
  4514. */
  4515. var KEY_MAP = {
  4516. ltr: {
  4517. ArrowLeft: '<',
  4518. ArrowRight: '>',
  4519. // For IE.
  4520. Left: '<',
  4521. Right: '>'
  4522. },
  4523. rtl: {
  4524. ArrowLeft: '>',
  4525. ArrowRight: '<',
  4526. // For IE.
  4527. Left: '>',
  4528. Right: '<'
  4529. },
  4530. ttb: {
  4531. ArrowUp: '<',
  4532. ArrowDown: '>',
  4533. // For IE.
  4534. Up: '<',
  4535. Down: '>'
  4536. }
  4537. };
  4538. /**
  4539. * The component for controlling slides via keyboard.
  4540. *
  4541. * @param {Splide} Splide - A Splide instance.
  4542. *
  4543. * @return {Object} - The component object.
  4544. */
  4545. /* harmony default export */ var components_keyboard = (function (Splide) {
  4546. /**
  4547. * Hold the target element.
  4548. *
  4549. * @type {Element|Document|undefined}
  4550. */
  4551. var target;
  4552. return {
  4553. /**
  4554. * Called when the component is mounted.
  4555. */
  4556. mount: function mount() {
  4557. Splide.on('mounted updated', function () {
  4558. var options = Splide.options;
  4559. var root = Splide.root;
  4560. var map = KEY_MAP[options.direction];
  4561. var keyboard = options.keyboard;
  4562. if (target) {
  4563. Splide.off('keydown', target);
  4564. removeAttribute(root, TAB_INDEX);
  4565. }
  4566. if (keyboard) {
  4567. if (keyboard === 'focused') {
  4568. target = root;
  4569. setAttribute(root, TAB_INDEX, 0);
  4570. } else {
  4571. target = document;
  4572. }
  4573. Splide.on('keydown', function (e) {
  4574. if (map[e.key]) {
  4575. Splide.go(map[e.key]);
  4576. }
  4577. }, target);
  4578. }
  4579. });
  4580. }
  4581. };
  4582. });
  4583. // CONCATENATED MODULE: ./src/js/components/a11y/index.js
  4584. /**
  4585. * The component for enhancing accessibility.
  4586. *
  4587. * @author Naotoshi Fujita
  4588. * @copyright Naotoshi Fujita. All rights reserved.
  4589. */
  4590. /**
  4591. * The component for enhancing accessibility.
  4592. *
  4593. * @param {Splide} Splide - A Splide instance.
  4594. * @param {Object} Components - An object containing components.
  4595. *
  4596. * @return {Object} - The component object.
  4597. */
  4598. /* harmony default export */ var a11y = (function (Splide, Components) {
  4599. /**
  4600. * Hold a i18n object.
  4601. *
  4602. * @type {Object}
  4603. */
  4604. var i18n = Splide.i18n;
  4605. /**
  4606. * Hold the Elements component.
  4607. *
  4608. * @type {Object}
  4609. */
  4610. var Elements = Components.Elements;
  4611. /**
  4612. * All attributes related with A11y.
  4613. *
  4614. * @type {string[]}
  4615. */
  4616. var allAttributes = [ARIA_HIDDEN, TAB_INDEX, ARIA_CONTROLS, ARIA_LABEL, ARIA_CURRENRT, 'role'];
  4617. /**
  4618. * A11y component object.
  4619. *
  4620. * @type {Object}
  4621. */
  4622. var A11y = {
  4623. /**
  4624. * Required only when the accessibility option is true.
  4625. *
  4626. * @type {boolean}
  4627. */
  4628. required: Splide.options.accessibility,
  4629. /**
  4630. * Called when the component is mounted.
  4631. */
  4632. mount: function mount() {
  4633. Splide.on('visible', function (Slide) {
  4634. updateSlide(Slide.slide, true);
  4635. }).on('hidden', function (Slide) {
  4636. updateSlide(Slide.slide, false);
  4637. }).on('arrows:mounted', initArrows).on('arrows:updated', updateArrows).on('pagination:mounted', initPagination).on('pagination:updated', updatePagination).on('refresh', function () {
  4638. removeAttribute(Components.Clones.clones, allAttributes);
  4639. });
  4640. if (Splide.options.isNavigation) {
  4641. Splide.on('navigation:mounted navigation:updated', initNavigation).on('active', function (Slide) {
  4642. updateNavigation(Slide, true);
  4643. }).on('inactive', function (Slide) {
  4644. updateNavigation(Slide, false);
  4645. });
  4646. }
  4647. initAutoplay();
  4648. },
  4649. /**
  4650. * Destroy.
  4651. */
  4652. destroy: function destroy() {
  4653. var Arrows = Components.Arrows;
  4654. var arrows = Arrows ? Arrows.arrows : {};
  4655. removeAttribute(Elements.slides.concat([arrows.prev, arrows.next, Elements.play, Elements.pause]), allAttributes);
  4656. }
  4657. };
  4658. /**
  4659. * Update slide attributes when it gets visible or hidden.
  4660. *
  4661. * @param {Element} slide - A slide element.
  4662. * @param {Boolean} visible - True when the slide gets visible, or false when hidden.
  4663. */
  4664. function updateSlide(slide, visible) {
  4665. setAttribute(slide, ARIA_HIDDEN, !visible);
  4666. if (Splide.options.slideFocus) {
  4667. setAttribute(slide, TAB_INDEX, visible ? 0 : -1);
  4668. }
  4669. }
  4670. /**
  4671. * Initialize arrows if they are available.
  4672. * Append screen reader elements and add aria-controls attribute.
  4673. *
  4674. * @param {Element} prev - Previous arrow element.
  4675. * @param {Element} next - Next arrow element.
  4676. */
  4677. function initArrows(prev, next) {
  4678. var controls = Elements.track.id;
  4679. setAttribute(prev, ARIA_CONTROLS, controls);
  4680. setAttribute(next, ARIA_CONTROLS, controls);
  4681. }
  4682. /**
  4683. * Update arrow attributes.
  4684. *
  4685. * @param {Element} prev - Previous arrow element.
  4686. * @param {Element} next - Next arrow element.
  4687. * @param {number} prevIndex - Previous slide index or -1 when there is no precede slide.
  4688. * @param {number} nextIndex - Next slide index or -1 when there is no next slide.
  4689. */
  4690. function updateArrows(prev, next, prevIndex, nextIndex) {
  4691. var index = Splide.index;
  4692. var prevLabel = prevIndex > -1 && index < prevIndex ? i18n.last : i18n.prev;
  4693. var nextLabel = nextIndex > -1 && index > nextIndex ? i18n.first : i18n.next;
  4694. setAttribute(prev, ARIA_LABEL, prevLabel);
  4695. setAttribute(next, ARIA_LABEL, nextLabel);
  4696. }
  4697. /**
  4698. * Initialize pagination if it's available.
  4699. * Append a screen reader element and add aria-controls/label attribute to each item.
  4700. *
  4701. * @param {Object} data - Data object containing all items.
  4702. * @param {Object} activeItem - An initial active item.
  4703. */
  4704. function initPagination(data, activeItem) {
  4705. if (activeItem) {
  4706. setAttribute(activeItem.button, ARIA_CURRENRT, true);
  4707. }
  4708. data.items.forEach(function (item) {
  4709. var options = Splide.options;
  4710. var text = options.focus === false && options.perPage > 1 ? i18n.pageX : i18n.slideX;
  4711. var label = sprintf(text, item.page + 1);
  4712. var button = item.button;
  4713. var controls = item.Slides.map(function (Slide) {
  4714. return Slide.slide.id;
  4715. });
  4716. setAttribute(button, ARIA_CONTROLS, controls.join(' '));
  4717. setAttribute(button, ARIA_LABEL, label);
  4718. });
  4719. }
  4720. /**
  4721. * Update pagination attributes.
  4722. *
  4723. * @param {Object} data - Data object containing all items.
  4724. * @param {Element} prev - A previous active element.
  4725. * @param {Element} curr - A current active element.
  4726. */
  4727. function updatePagination(data, prev, curr) {
  4728. if (prev) {
  4729. removeAttribute(prev.button, ARIA_CURRENRT);
  4730. }
  4731. if (curr) {
  4732. setAttribute(curr.button, ARIA_CURRENRT, true);
  4733. }
  4734. }
  4735. /**
  4736. * Initialize autoplay buttons.
  4737. */
  4738. function initAutoplay() {
  4739. ['play', 'pause'].forEach(function (name) {
  4740. var elm = Elements[name];
  4741. if (elm) {
  4742. if (!isButton(elm)) {
  4743. setAttribute(elm, 'role', 'button');
  4744. }
  4745. setAttribute(elm, ARIA_CONTROLS, Elements.track.id);
  4746. setAttribute(elm, ARIA_LABEL, i18n[name]);
  4747. }
  4748. });
  4749. }
  4750. /**
  4751. * Initialize navigation slider.
  4752. * Add button role, aria-label, aria-controls to slide elements and append screen reader text to them.
  4753. *
  4754. * @param {Splide} main - A main Splide instance.
  4755. */
  4756. function initNavigation(main) {
  4757. Elements.each(function (Slide) {
  4758. var slide = Slide.slide;
  4759. var realIndex = Slide.realIndex;
  4760. if (!isButton(slide)) {
  4761. setAttribute(slide, 'role', 'button');
  4762. }
  4763. var slideIndex = realIndex > -1 ? realIndex : Slide.index;
  4764. var label = sprintf(i18n.slideX, slideIndex + 1);
  4765. var mainSlide = main.Components.Elements.getSlide(slideIndex);
  4766. setAttribute(slide, ARIA_LABEL, label);
  4767. if (mainSlide) {
  4768. setAttribute(slide, ARIA_CONTROLS, mainSlide.slide.id);
  4769. }
  4770. });
  4771. }
  4772. /**
  4773. * Update navigation attributes.
  4774. *
  4775. * @param {Object} Slide - A target Slide object.
  4776. * @param {boolean} active - True if the slide is active or false if inactive.
  4777. */
  4778. function updateNavigation(_ref, active) {
  4779. var slide = _ref.slide;
  4780. if (active) {
  4781. setAttribute(slide, ARIA_CURRENRT, true);
  4782. } else {
  4783. removeAttribute(slide, ARIA_CURRENRT);
  4784. }
  4785. }
  4786. /**
  4787. * Check if the given element is button or not.
  4788. *
  4789. * @param {Element} elm - An element to be checked.
  4790. *
  4791. * @return {boolean} - True if the given element is button.
  4792. */
  4793. function isButton(elm) {
  4794. return elm.tagName === 'BUTTON';
  4795. }
  4796. return A11y;
  4797. });
  4798. // CONCATENATED MODULE: ./src/js/components/sync/index.js
  4799. /**
  4800. * The component for synchronizing a slider with another.
  4801. *
  4802. * @author Naotoshi Fujita
  4803. * @copyright Naotoshi Fujita. All rights reserved.
  4804. */
  4805. /**
  4806. * The event name for sync.
  4807. *
  4808. * @type {string}
  4809. */
  4810. var SYNC_EVENT = 'move.sync';
  4811. /**
  4812. * The event names for click navigation.
  4813. * @type {string}
  4814. */
  4815. var CLICK_EVENTS = 'mouseup touchend';
  4816. /**
  4817. * The keys for triggering the navigation button.
  4818. *
  4819. * @type {String[]}
  4820. */
  4821. var TRIGGER_KEYS = [' ', 'Enter', 'Spacebar'];
  4822. /**
  4823. * The component for synchronizing a slider with another.
  4824. *
  4825. * @param {Splide} Splide - A Splide instance.
  4826. *
  4827. * @return {Object} - The component object.
  4828. */
  4829. /* harmony default export */ var sync = (function (Splide) {
  4830. /**
  4831. * Keep the sibling Splide instance.
  4832. *
  4833. * @type {Splide}
  4834. */
  4835. var sibling = Splide.sibling;
  4836. /**
  4837. * Whether the sibling slider is navigation or not.
  4838. *
  4839. * @type {Splide|boolean}
  4840. */
  4841. var isNavigation = sibling && sibling.options.isNavigation;
  4842. /**
  4843. * Layout component object.
  4844. *
  4845. * @type {Object}
  4846. */
  4847. var Sync = {
  4848. /**
  4849. * Required only when the sub slider is available.
  4850. *
  4851. * @type {boolean}
  4852. */
  4853. required: !!sibling,
  4854. /**
  4855. * Called when the component is mounted.
  4856. */
  4857. mount: function mount() {
  4858. syncMain();
  4859. syncSibling();
  4860. if (isNavigation) {
  4861. bind();
  4862. Splide.on('refresh', function () {
  4863. setTimeout(function () {
  4864. bind();
  4865. sibling.emit('navigation:updated', Splide);
  4866. });
  4867. });
  4868. }
  4869. },
  4870. /**
  4871. * Called after all components are mounted.
  4872. */
  4873. mounted: function mounted() {
  4874. if (isNavigation) {
  4875. sibling.emit('navigation:mounted', Splide);
  4876. }
  4877. }
  4878. };
  4879. /**
  4880. * Listen the primary slider event to move secondary one.
  4881. * Must unbind a handler at first to avoid infinite loop.
  4882. */
  4883. function syncMain() {
  4884. Splide.on(SYNC_EVENT, function (newIndex, prevIndex, destIndex) {
  4885. sibling.off(SYNC_EVENT).go(sibling.is(LOOP) ? destIndex : newIndex, false);
  4886. syncSibling();
  4887. });
  4888. }
  4889. /**
  4890. * Listen the secondary slider event to move primary one.
  4891. * Must unbind a handler at first to avoid infinite loop.
  4892. */
  4893. function syncSibling() {
  4894. sibling.on(SYNC_EVENT, function (newIndex, prevIndex, destIndex) {
  4895. Splide.off(SYNC_EVENT).go(Splide.is(LOOP) ? destIndex : newIndex, false);
  4896. syncMain();
  4897. });
  4898. }
  4899. /**
  4900. * Listen some events on each slide.
  4901. */
  4902. function bind() {
  4903. sibling.Components.Elements.each(function (_ref) {
  4904. var slide = _ref.slide,
  4905. index = _ref.index;
  4906. /*
  4907. * Listen mouseup and touchend events to handle click.
  4908. */
  4909. Splide.off(CLICK_EVENTS, slide).on(CLICK_EVENTS, function (e) {
  4910. // Ignore a middle or right click.
  4911. if (!e.button || e.button === 0) {
  4912. moveSibling(index);
  4913. }
  4914. }, slide);
  4915. /*
  4916. * Subscribe keyup to handle Enter and Space key.
  4917. * Note that Array.includes is not supported by IE.
  4918. */
  4919. Splide.off('keyup', slide).on('keyup', function (e) {
  4920. if (TRIGGER_KEYS.indexOf(e.key) > -1) {
  4921. e.preventDefault();
  4922. moveSibling(index);
  4923. }
  4924. }, slide, {
  4925. passive: false
  4926. });
  4927. });
  4928. }
  4929. /**
  4930. * Move the sibling to the given index.
  4931. * Need to check "IDLE" status because slides can be moving by Drag component.
  4932. *
  4933. * @param {number} index - Target index.
  4934. */
  4935. function moveSibling(index) {
  4936. if (Splide.State.is(IDLE)) {
  4937. sibling.go(index);
  4938. }
  4939. }
  4940. return Sync;
  4941. });
  4942. // CONCATENATED MODULE: ./src/js/components/breakpoints/index.js
  4943. /**
  4944. * The component for updating options according to a current window width.
  4945. *
  4946. * @author Naotoshi Fujita
  4947. * @copyright Naotoshi Fujita. All rights reserved.
  4948. */
  4949. /**
  4950. * Interval time for throttle.
  4951. *
  4952. * @type {number}
  4953. */
  4954. var THROTTLE = 50;
  4955. /**
  4956. * The component for updating options according to a current window width.
  4957. *
  4958. * @param {Splide} Splide - A Splide instance.
  4959. *
  4960. * @return {Object} - The component object.
  4961. */
  4962. /* harmony default export */ var components_breakpoints = (function (Splide) {
  4963. /**
  4964. * Store breakpoints.
  4965. *
  4966. * @type {Object|boolean}
  4967. */
  4968. var breakpoints = Splide.options.breakpoints;
  4969. /**
  4970. * The check function whose frequency of call is reduced.
  4971. *
  4972. * @type {Function}
  4973. */
  4974. var throttledCheck = throttle(check, THROTTLE);
  4975. /**
  4976. * Keep initial options.
  4977. *
  4978. * @type {Object}
  4979. */
  4980. var initialOptions;
  4981. /**
  4982. * An array containing objects of point and MediaQueryList.
  4983. *
  4984. * @type {Object[]}
  4985. */
  4986. var map = [];
  4987. /**
  4988. * Hold the previous breakpoint.
  4989. *
  4990. * @type {number|undefined}
  4991. */
  4992. var prevPoint;
  4993. /**
  4994. * Breakpoints component object.
  4995. *
  4996. * @type {Object}
  4997. */
  4998. var Breakpoints = {
  4999. /**
  5000. * Required only when the breakpoints definition is provided and browser supports matchMedia.
  5001. *
  5002. * @type {boolean}
  5003. */
  5004. required: breakpoints && matchMedia,
  5005. /**
  5006. * Called when the component is mounted.
  5007. */
  5008. mount: function mount() {
  5009. map = Object.keys(breakpoints).sort(function (n, m) {
  5010. return +n - +m;
  5011. }).map(function (point) {
  5012. return {
  5013. point: point,
  5014. mql: matchMedia("(max-width:" + point + "px)")
  5015. };
  5016. });
  5017. /*
  5018. * To keep monitoring resize event after destruction without "completely",
  5019. * use native addEventListener instead of Splide.on.
  5020. */
  5021. this.destroy(true);
  5022. addEventListener('resize', throttledCheck); // Keep initial options to apply them when no breakpoint matches.
  5023. initialOptions = Splide.options;
  5024. check();
  5025. },
  5026. /**
  5027. * Destroy.
  5028. *
  5029. * @param {boolean} completely - Whether to destroy Splide completely.
  5030. */
  5031. destroy: function destroy(completely) {
  5032. if (completely) {
  5033. removeEventListener('resize', throttledCheck);
  5034. }
  5035. }
  5036. };
  5037. /**
  5038. * Check the breakpoint.
  5039. */
  5040. function check() {
  5041. var point = getPoint();
  5042. if (point !== prevPoint) {
  5043. prevPoint = point;
  5044. var State = Splide.State;
  5045. var options = breakpoints[point] || initialOptions;
  5046. var destroy = options.destroy;
  5047. if (destroy) {
  5048. Splide.options = initialOptions;
  5049. Splide.destroy(destroy === 'completely');
  5050. } else {
  5051. if (State.is(DESTROYED)) {
  5052. Splide.mount();
  5053. }
  5054. Splide.options = options;
  5055. }
  5056. }
  5057. }
  5058. /**
  5059. * Return the breakpoint matching current window width.
  5060. * Note that Array.prototype.find is not supported by IE.
  5061. *
  5062. * @return {number|string} - A breakpoint as number or string. -1 if no point matches.
  5063. */
  5064. function getPoint() {
  5065. var item = map.filter(function (item) {
  5066. return item.mql.matches;
  5067. })[0];
  5068. return item ? item.point : -1;
  5069. }
  5070. return Breakpoints;
  5071. });
  5072. // CONCATENATED MODULE: ./src/js/components/index.js
  5073. /**
  5074. * Export components.
  5075. *
  5076. * @author Naotoshi Fujita
  5077. * @copyright Naotoshi Fujita. All rights reserved.
  5078. */
  5079. var COMPLETE = {
  5080. Options: components_options,
  5081. Breakpoints: components_breakpoints,
  5082. Controller: controller,
  5083. Elements: components_elements,
  5084. Track: components_track,
  5085. Clones: components_clones,
  5086. Layout: layout,
  5087. Drag: drag,
  5088. Click: click,
  5089. Autoplay: components_autoplay,
  5090. Cover: components_cover,
  5091. Arrows: components_arrows,
  5092. Pagination: components_pagination,
  5093. LazyLoad: lazyload,
  5094. Keyboard: components_keyboard,
  5095. Sync: sync,
  5096. A11y: a11y
  5097. };
  5098. var LIGHT = {
  5099. Options: components_options,
  5100. Controller: controller,
  5101. Elements: components_elements,
  5102. Track: components_track,
  5103. Clones: components_clones,
  5104. Layout: layout,
  5105. Drag: drag,
  5106. Click: click,
  5107. Arrows: components_arrows,
  5108. Pagination: components_pagination,
  5109. A11y: a11y
  5110. };
  5111. // CONCATENATED MODULE: ./build/module/module.js
  5112. function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
  5113. /**
  5114. * Export Splide class for import.
  5115. *
  5116. * @author Naotoshi Fujita
  5117. * @copyright Naotoshi Fujita. All rights reserved.
  5118. */
  5119. /**
  5120. * Export Splide class for import from other projects.
  5121. */
  5122. var module_Splide = /*#__PURE__*/function (_Core) {
  5123. _inheritsLoose(Splide, _Core);
  5124. function Splide(root, options) {
  5125. return _Core.call(this, root, options, COMPLETE) || this;
  5126. }
  5127. return Splide;
  5128. }(splide_Splide);
  5129. /***/ })
  5130. /******/ ]);
  5131. });