flickity.pkgd.js 116 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043404440454046404740484049405040514052405340544055405640574058405940604061406240634064406540664067406840694070407140724073407440754076407740784079408040814082408340844085408640874088408940904091409240934094409540964097409840994100410141024103410441054106410741084109411041114112411341144115411641174118411941204121412241234124412541264127412841294130413141324133413441354136413741384139414041414142414341444145414641474148414941504151415241534154415541564157415841594160416141624163416441654166416741684169417041714172417341744175417641774178417941804181418241834184418541864187418841894190419141924193419441954196419741984199420042014202420342044205420642074208420942104211421242134214421542164217421842194220422142224223422442254226422742284229423042314232423342344235423642374238423942404241424242434244424542464247424842494250425142524253425442554256425742584259426042614262426342644265426642674268426942704271427242734274427542764277427842794280428142824283428442854286428742884289429042914292429342944295429642974298429943004301430243034304430543064307430843094310431143124313431443154316431743184319432043214322432343244325432643274328432943304331433243334334433543364337433843394340434143424343434443454346434743484349435043514352435343544355435643574358435943604361436243634364436543664367436843694370437143724373437443754376437743784379438043814382438343844385438643874388438943904391439243934394439543964397439843994400440144024403440444054406440744084409441044114412441344144415441644174418441944204421442244234424442544264427442844294430443144324433443444354436443744384439444044414442444344444445444644474448444944504451445244534454445544564457445844594460446144624463446444654466446744684469447044714472447344744475447644774478447944804481448244834484448544864487448844894490449144924493449444954496449744984499450045014502450345044505450645074508450945104511451245134514451545164517451845194520452145224523452445254526452745284529453045314532453345344535453645374538453945404541454245434544454545464547454845494550455145524553455445554556455745584559456045614562456345644565456645674568456945704571457245734574457545764577457845794580458145824583458445854586
  1. /*!
  2. * Flickity PACKAGED v2.2.1
  3. * Touch, responsive, flickable carousels
  4. *
  5. * Licensed GPLv3 for open source use
  6. * or Flickity Commercial License for commercial use
  7. *
  8. * https://flickity.metafizzy.co
  9. * Copyright 2015-2019 Metafizzy
  10. */
  11. /**
  12. * Bridget makes jQuery widgets
  13. * v2.0.1
  14. * MIT license
  15. */
  16. /* jshint browser: true, strict: true, undef: true, unused: true */
  17. ( function( window, factory ) {
  18. // universal module definition
  19. /*jshint strict: false */ /* globals define, module, require */
  20. if ( typeof define == 'function' && define.amd ) {
  21. // AMD
  22. define( 'jquery-bridget/jquery-bridget',[ 'jquery' ], function( jQuery ) {
  23. return factory( window, jQuery );
  24. });
  25. } else if ( typeof module == 'object' && module.exports ) {
  26. // CommonJS
  27. module.exports = factory(
  28. window,
  29. require('jquery')
  30. );
  31. } else {
  32. // browser global
  33. window.jQueryBridget = factory(
  34. window,
  35. window.jQuery
  36. );
  37. }
  38. }( window, function factory( window, jQuery ) {
  39. 'use strict';
  40. // ----- utils ----- //
  41. var arraySlice = Array.prototype.slice;
  42. // helper function for logging errors
  43. // $.error breaks jQuery chaining
  44. var console = window.console;
  45. var logError = typeof console == 'undefined' ? function() {} :
  46. function( message ) {
  47. console.error( message );
  48. };
  49. // ----- jQueryBridget ----- //
  50. function jQueryBridget( namespace, PluginClass, $ ) {
  51. $ = $ || jQuery || window.jQuery;
  52. if ( !$ ) {
  53. return;
  54. }
  55. // add option method -> $().plugin('option', {...})
  56. if ( !PluginClass.prototype.option ) {
  57. // option setter
  58. PluginClass.prototype.option = function( opts ) {
  59. // bail out if not an object
  60. if ( !$.isPlainObject( opts ) ){
  61. return;
  62. }
  63. this.options = $.extend( true, this.options, opts );
  64. };
  65. }
  66. // make jQuery plugin
  67. $.fn[ namespace ] = function( arg0 /*, arg1 */ ) {
  68. if ( typeof arg0 == 'string' ) {
  69. // method call $().plugin( 'methodName', { options } )
  70. // shift arguments by 1
  71. var args = arraySlice.call( arguments, 1 );
  72. return methodCall( this, arg0, args );
  73. }
  74. // just $().plugin({ options })
  75. plainCall( this, arg0 );
  76. return this;
  77. };
  78. // $().plugin('methodName')
  79. function methodCall( $elems, methodName, args ) {
  80. var returnValue;
  81. var pluginMethodStr = '$().' + namespace + '("' + methodName + '")';
  82. $elems.each( function( i, elem ) {
  83. // get instance
  84. var instance = $.data( elem, namespace );
  85. if ( !instance ) {
  86. logError( namespace + ' not initialized. Cannot call methods, i.e. ' +
  87. pluginMethodStr );
  88. return;
  89. }
  90. var method = instance[ methodName ];
  91. if ( !method || methodName.charAt(0) == '_' ) {
  92. logError( pluginMethodStr + ' is not a valid method' );
  93. return;
  94. }
  95. // apply method, get return value
  96. var value = method.apply( instance, args );
  97. // set return value if value is returned, use only first value
  98. returnValue = returnValue === undefined ? value : returnValue;
  99. });
  100. return returnValue !== undefined ? returnValue : $elems;
  101. }
  102. function plainCall( $elems, options ) {
  103. $elems.each( function( i, elem ) {
  104. var instance = $.data( elem, namespace );
  105. if ( instance ) {
  106. // set options & init
  107. instance.option( options );
  108. instance._init();
  109. } else {
  110. // initialize new instance
  111. instance = new PluginClass( elem, options );
  112. $.data( elem, namespace, instance );
  113. }
  114. });
  115. }
  116. updateJQuery( $ );
  117. }
  118. // ----- updateJQuery ----- //
  119. // set $.bridget for v1 backwards compatibility
  120. function updateJQuery( $ ) {
  121. if ( !$ || ( $ && $.bridget ) ) {
  122. return;
  123. }
  124. $.bridget = jQueryBridget;
  125. }
  126. updateJQuery( jQuery || window.jQuery );
  127. // ----- ----- //
  128. return jQueryBridget;
  129. }));
  130. /**
  131. * EvEmitter v1.1.0
  132. * Lil' event emitter
  133. * MIT License
  134. */
  135. /* jshint unused: true, undef: true, strict: true */
  136. ( function( global, factory ) {
  137. // universal module definition
  138. /* jshint strict: false */ /* globals define, module, window */
  139. if ( typeof define == 'function' && define.amd ) {
  140. // AMD - RequireJS
  141. define( 'ev-emitter/ev-emitter',factory );
  142. } else if ( typeof module == 'object' && module.exports ) {
  143. // CommonJS - Browserify, Webpack
  144. module.exports = factory();
  145. } else {
  146. // Browser globals
  147. global.EvEmitter = factory();
  148. }
  149. }( typeof window != 'undefined' ? window : this, function() {
  150. function EvEmitter() {}
  151. var proto = EvEmitter.prototype;
  152. proto.on = function( eventName, listener ) {
  153. if ( !eventName || !listener ) {
  154. return;
  155. }
  156. // set events hash
  157. var events = this._events = this._events || {};
  158. // set listeners array
  159. var listeners = events[ eventName ] = events[ eventName ] || [];
  160. // only add once
  161. if ( listeners.indexOf( listener ) == -1 ) {
  162. listeners.push( listener );
  163. }
  164. return this;
  165. };
  166. proto.once = function( eventName, listener ) {
  167. if ( !eventName || !listener ) {
  168. return;
  169. }
  170. // add event
  171. this.on( eventName, listener );
  172. // set once flag
  173. // set onceEvents hash
  174. var onceEvents = this._onceEvents = this._onceEvents || {};
  175. // set onceListeners object
  176. var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
  177. // set flag
  178. onceListeners[ listener ] = true;
  179. return this;
  180. };
  181. proto.off = function( eventName, listener ) {
  182. var listeners = this._events && this._events[ eventName ];
  183. if ( !listeners || !listeners.length ) {
  184. return;
  185. }
  186. var index = listeners.indexOf( listener );
  187. if ( index != -1 ) {
  188. listeners.splice( index, 1 );
  189. }
  190. return this;
  191. };
  192. proto.emitEvent = function( eventName, args ) {
  193. var listeners = this._events && this._events[ eventName ];
  194. if ( !listeners || !listeners.length ) {
  195. return;
  196. }
  197. // copy over to avoid interference if .off() in listener
  198. listeners = listeners.slice(0);
  199. args = args || [];
  200. // once stuff
  201. var onceListeners = this._onceEvents && this._onceEvents[ eventName ];
  202. for ( var i=0; i < listeners.length; i++ ) {
  203. var listener = listeners[i]
  204. var isOnce = onceListeners && onceListeners[ listener ];
  205. if ( isOnce ) {
  206. // remove listener
  207. // remove before trigger to prevent recursion
  208. this.off( eventName, listener );
  209. // unset once flag
  210. delete onceListeners[ listener ];
  211. }
  212. // trigger listener
  213. listener.apply( this, args );
  214. }
  215. return this;
  216. };
  217. proto.allOff = function() {
  218. delete this._events;
  219. delete this._onceEvents;
  220. };
  221. return EvEmitter;
  222. }));
  223. /*!
  224. * getSize v2.0.3
  225. * measure size of elements
  226. * MIT license
  227. */
  228. /* jshint browser: true, strict: true, undef: true, unused: true */
  229. /* globals console: false */
  230. ( function( window, factory ) {
  231. /* jshint strict: false */ /* globals define, module */
  232. if ( typeof define == 'function' && define.amd ) {
  233. // AMD
  234. define( 'get-size/get-size',factory );
  235. } else if ( typeof module == 'object' && module.exports ) {
  236. // CommonJS
  237. module.exports = factory();
  238. } else {
  239. // browser global
  240. window.getSize = factory();
  241. }
  242. })( window, function factory() {
  243. 'use strict';
  244. // -------------------------- helpers -------------------------- //
  245. // get a number from a string, not a percentage
  246. function getStyleSize( value ) {
  247. var num = parseFloat( value );
  248. // not a percent like '100%', and a number
  249. var isValid = value.indexOf('%') == -1 && !isNaN( num );
  250. return isValid && num;
  251. }
  252. function noop() {}
  253. var logError = typeof console == 'undefined' ? noop :
  254. function( message ) {
  255. console.error( message );
  256. };
  257. // -------------------------- measurements -------------------------- //
  258. var measurements = [
  259. 'paddingLeft',
  260. 'paddingRight',
  261. 'paddingTop',
  262. 'paddingBottom',
  263. 'marginLeft',
  264. 'marginRight',
  265. 'marginTop',
  266. 'marginBottom',
  267. 'borderLeftWidth',
  268. 'borderRightWidth',
  269. 'borderTopWidth',
  270. 'borderBottomWidth'
  271. ];
  272. var measurementsLength = measurements.length;
  273. function getZeroSize() {
  274. var size = {
  275. width: 0,
  276. height: 0,
  277. innerWidth: 0,
  278. innerHeight: 0,
  279. outerWidth: 0,
  280. outerHeight: 0
  281. };
  282. for ( var i=0; i < measurementsLength; i++ ) {
  283. var measurement = measurements[i];
  284. size[ measurement ] = 0;
  285. }
  286. return size;
  287. }
  288. // -------------------------- getStyle -------------------------- //
  289. /**
  290. * getStyle, get style of element, check for Firefox bug
  291. * https://bugzilla.mozilla.org/show_bug.cgi?id=548397
  292. */
  293. function getStyle( elem ) {
  294. var style = getComputedStyle( elem );
  295. if ( !style ) {
  296. logError( 'Style returned ' + style +
  297. '. Are you running this code in a hidden iframe on Firefox? ' +
  298. 'See https://bit.ly/getsizebug1' );
  299. }
  300. return style;
  301. }
  302. // -------------------------- setup -------------------------- //
  303. var isSetup = false;
  304. var isBoxSizeOuter;
  305. /**
  306. * setup
  307. * check isBoxSizerOuter
  308. * do on first getSize() rather than on page load for Firefox bug
  309. */
  310. function setup() {
  311. // setup once
  312. if ( isSetup ) {
  313. return;
  314. }
  315. isSetup = true;
  316. // -------------------------- box sizing -------------------------- //
  317. /**
  318. * Chrome & Safari measure the outer-width on style.width on border-box elems
  319. * IE11 & Firefox<29 measures the inner-width
  320. */
  321. var div = document.createElement('div');
  322. div.style.width = '200px';
  323. div.style.padding = '1px 2px 3px 4px';
  324. div.style.borderStyle = 'solid';
  325. div.style.borderWidth = '1px 2px 3px 4px';
  326. div.style.boxSizing = 'border-box';
  327. var body = document.body || document.documentElement;
  328. body.appendChild( div );
  329. var style = getStyle( div );
  330. // round value for browser zoom. desandro/masonry#928
  331. isBoxSizeOuter = Math.round( getStyleSize( style.width ) ) == 200;
  332. getSize.isBoxSizeOuter = isBoxSizeOuter;
  333. body.removeChild( div );
  334. }
  335. // -------------------------- getSize -------------------------- //
  336. function getSize( elem ) {
  337. setup();
  338. // use querySeletor if elem is string
  339. if ( typeof elem == 'string' ) {
  340. elem = document.querySelector( elem );
  341. }
  342. // do not proceed on non-objects
  343. if ( !elem || typeof elem != 'object' || !elem.nodeType ) {
  344. return;
  345. }
  346. var style = getStyle( elem );
  347. // if hidden, everything is 0
  348. if ( style.display == 'none' ) {
  349. return getZeroSize();
  350. }
  351. var size = {};
  352. size.width = elem.offsetWidth;
  353. size.height = elem.offsetHeight;
  354. var isBorderBox = size.isBorderBox = style.boxSizing == 'border-box';
  355. // get all measurements
  356. for ( var i=0; i < measurementsLength; i++ ) {
  357. var measurement = measurements[i];
  358. var value = style[ measurement ];
  359. var num = parseFloat( value );
  360. // any 'auto', 'medium' value will be 0
  361. size[ measurement ] = !isNaN( num ) ? num : 0;
  362. }
  363. var paddingWidth = size.paddingLeft + size.paddingRight;
  364. var paddingHeight = size.paddingTop + size.paddingBottom;
  365. var marginWidth = size.marginLeft + size.marginRight;
  366. var marginHeight = size.marginTop + size.marginBottom;
  367. var borderWidth = size.borderLeftWidth + size.borderRightWidth;
  368. var borderHeight = size.borderTopWidth + size.borderBottomWidth;
  369. var isBorderBoxSizeOuter = isBorderBox && isBoxSizeOuter;
  370. // overwrite width and height if we can get it from style
  371. var styleWidth = getStyleSize( style.width );
  372. if ( styleWidth !== false ) {
  373. size.width = styleWidth +
  374. // add padding and border unless it's already including it
  375. ( isBorderBoxSizeOuter ? 0 : paddingWidth + borderWidth );
  376. }
  377. var styleHeight = getStyleSize( style.height );
  378. if ( styleHeight !== false ) {
  379. size.height = styleHeight +
  380. // add padding and border unless it's already including it
  381. ( isBorderBoxSizeOuter ? 0 : paddingHeight + borderHeight );
  382. }
  383. size.innerWidth = size.width - ( paddingWidth + borderWidth );
  384. size.innerHeight = size.height - ( paddingHeight + borderHeight );
  385. size.outerWidth = size.width + marginWidth;
  386. size.outerHeight = size.height + marginHeight;
  387. return size;
  388. }
  389. return getSize;
  390. });
  391. /**
  392. * matchesSelector v2.0.2
  393. * matchesSelector( element, '.selector' )
  394. * MIT license
  395. */
  396. /*jshint browser: true, strict: true, undef: true, unused: true */
  397. ( function( window, factory ) {
  398. /*global define: false, module: false */
  399. 'use strict';
  400. // universal module definition
  401. if ( typeof define == 'function' && define.amd ) {
  402. // AMD
  403. define( 'desandro-matches-selector/matches-selector',factory );
  404. } else if ( typeof module == 'object' && module.exports ) {
  405. // CommonJS
  406. module.exports = factory();
  407. } else {
  408. // browser global
  409. window.matchesSelector = factory();
  410. }
  411. }( window, function factory() {
  412. 'use strict';
  413. var matchesMethod = ( function() {
  414. var ElemProto = window.Element.prototype;
  415. // check for the standard method name first
  416. if ( ElemProto.matches ) {
  417. return 'matches';
  418. }
  419. // check un-prefixed
  420. if ( ElemProto.matchesSelector ) {
  421. return 'matchesSelector';
  422. }
  423. // check vendor prefixes
  424. var prefixes = [ 'webkit', 'moz', 'ms', 'o' ];
  425. for ( var i=0; i < prefixes.length; i++ ) {
  426. var prefix = prefixes[i];
  427. var method = prefix + 'MatchesSelector';
  428. if ( ElemProto[ method ] ) {
  429. return method;
  430. }
  431. }
  432. })();
  433. return function matchesSelector( elem, selector ) {
  434. return elem[ matchesMethod ]( selector );
  435. };
  436. }));
  437. /**
  438. * Fizzy UI utils v2.0.7
  439. * MIT license
  440. */
  441. /*jshint browser: true, undef: true, unused: true, strict: true */
  442. ( function( window, factory ) {
  443. // universal module definition
  444. /*jshint strict: false */ /*globals define, module, require */
  445. if ( typeof define == 'function' && define.amd ) {
  446. // AMD
  447. define( 'fizzy-ui-utils/utils',[
  448. 'desandro-matches-selector/matches-selector'
  449. ], function( matchesSelector ) {
  450. return factory( window, matchesSelector );
  451. });
  452. } else if ( typeof module == 'object' && module.exports ) {
  453. // CommonJS
  454. module.exports = factory(
  455. window,
  456. require('desandro-matches-selector')
  457. );
  458. } else {
  459. // browser global
  460. window.fizzyUIUtils = factory(
  461. window,
  462. window.matchesSelector
  463. );
  464. }
  465. }( window, function factory( window, matchesSelector ) {
  466. var utils = {};
  467. // ----- extend ----- //
  468. // extends objects
  469. utils.extend = function( a, b ) {
  470. for ( var prop in b ) {
  471. a[ prop ] = b[ prop ];
  472. }
  473. return a;
  474. };
  475. // ----- modulo ----- //
  476. utils.modulo = function( num, div ) {
  477. return ( ( num % div ) + div ) % div;
  478. };
  479. // ----- makeArray ----- //
  480. var arraySlice = Array.prototype.slice;
  481. // turn element or nodeList into an array
  482. utils.makeArray = function( obj ) {
  483. if ( Array.isArray( obj ) ) {
  484. // use object if already an array
  485. return obj;
  486. }
  487. // return empty array if undefined or null. #6
  488. if ( obj === null || obj === undefined ) {
  489. return [];
  490. }
  491. var isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
  492. if ( isArrayLike ) {
  493. // convert nodeList to array
  494. return arraySlice.call( obj );
  495. }
  496. // array of single index
  497. return [ obj ];
  498. };
  499. // ----- removeFrom ----- //
  500. utils.removeFrom = function( ary, obj ) {
  501. var index = ary.indexOf( obj );
  502. if ( index != -1 ) {
  503. ary.splice( index, 1 );
  504. }
  505. };
  506. // ----- getParent ----- //
  507. utils.getParent = function( elem, selector ) {
  508. while ( elem.parentNode && elem != document.body ) {
  509. elem = elem.parentNode;
  510. if ( matchesSelector( elem, selector ) ) {
  511. return elem;
  512. }
  513. }
  514. };
  515. // ----- getQueryElement ----- //
  516. // use element as selector string
  517. utils.getQueryElement = function( elem ) {
  518. if ( typeof elem == 'string' ) {
  519. return document.querySelector( elem );
  520. }
  521. return elem;
  522. };
  523. // ----- handleEvent ----- //
  524. // enable .ontype to trigger from .addEventListener( elem, 'type' )
  525. utils.handleEvent = function( event ) {
  526. var method = 'on' + event.type;
  527. if ( this[ method ] ) {
  528. this[ method ]( event );
  529. }
  530. };
  531. // ----- filterFindElements ----- //
  532. utils.filterFindElements = function( elems, selector ) {
  533. // make array of elems
  534. elems = utils.makeArray( elems );
  535. var ffElems = [];
  536. elems.forEach( function( elem ) {
  537. // check that elem is an actual element
  538. if ( !( elem instanceof HTMLElement ) ) {
  539. return;
  540. }
  541. // add elem if no selector
  542. if ( !selector ) {
  543. ffElems.push( elem );
  544. return;
  545. }
  546. // filter & find items if we have a selector
  547. // filter
  548. if ( matchesSelector( elem, selector ) ) {
  549. ffElems.push( elem );
  550. }
  551. // find children
  552. var childElems = elem.querySelectorAll( selector );
  553. // concat childElems to filterFound array
  554. for ( var i=0; i < childElems.length; i++ ) {
  555. ffElems.push( childElems[i] );
  556. }
  557. });
  558. return ffElems;
  559. };
  560. // ----- debounceMethod ----- //
  561. utils.debounceMethod = function( _class, methodName, threshold ) {
  562. threshold = threshold || 100;
  563. // original method
  564. var method = _class.prototype[ methodName ];
  565. var timeoutName = methodName + 'Timeout';
  566. _class.prototype[ methodName ] = function() {
  567. var timeout = this[ timeoutName ];
  568. clearTimeout( timeout );
  569. var args = arguments;
  570. var _this = this;
  571. this[ timeoutName ] = setTimeout( function() {
  572. method.apply( _this, args );
  573. delete _this[ timeoutName ];
  574. }, threshold );
  575. };
  576. };
  577. // ----- docReady ----- //
  578. utils.docReady = function( callback ) {
  579. var readyState = document.readyState;
  580. if ( readyState == 'complete' || readyState == 'interactive' ) {
  581. // do async to allow for other scripts to run. metafizzy/flickity#441
  582. setTimeout( callback );
  583. } else {
  584. document.addEventListener( 'DOMContentLoaded', callback );
  585. }
  586. };
  587. // ----- htmlInit ----- //
  588. // http://jamesroberts.name/blog/2010/02/22/string-functions-for-javascript-trim-to-camel-case-to-dashed-and-to-underscore/
  589. utils.toDashed = function( str ) {
  590. return str.replace( /(.)([A-Z])/g, function( match, $1, $2 ) {
  591. return $1 + '-' + $2;
  592. }).toLowerCase();
  593. };
  594. var console = window.console;
  595. /**
  596. * allow user to initialize classes via [data-namespace] or .js-namespace class
  597. * htmlInit( Widget, 'widgetName' )
  598. * options are parsed from data-namespace-options
  599. */
  600. utils.htmlInit = function( WidgetClass, namespace ) {
  601. utils.docReady( function() {
  602. var dashedNamespace = utils.toDashed( namespace );
  603. var dataAttr = 'data-' + dashedNamespace;
  604. var dataAttrElems = document.querySelectorAll( '[' + dataAttr + ']' );
  605. var jsDashElems = document.querySelectorAll( '.js-' + dashedNamespace );
  606. var elems = utils.makeArray( dataAttrElems )
  607. .concat( utils.makeArray( jsDashElems ) );
  608. var dataOptionsAttr = dataAttr + '-options';
  609. var jQuery = window.jQuery;
  610. elems.forEach( function( elem ) {
  611. var attr = elem.getAttribute( dataAttr ) ||
  612. elem.getAttribute( dataOptionsAttr );
  613. var options;
  614. try {
  615. options = attr && JSON.parse( attr );
  616. } catch ( error ) {
  617. // log error, do not initialize
  618. if ( console ) {
  619. console.error( 'Error parsing ' + dataAttr + ' on ' + elem.className +
  620. ': ' + error );
  621. }
  622. return;
  623. }
  624. // initialize
  625. var instance = new WidgetClass( elem, options );
  626. // make available via $().data('namespace')
  627. if ( jQuery ) {
  628. jQuery.data( elem, namespace, instance );
  629. }
  630. });
  631. });
  632. };
  633. // ----- ----- //
  634. return utils;
  635. }));
  636. // Flickity.Cell
  637. ( function( window, factory ) {
  638. // universal module definition
  639. /* jshint strict: false */
  640. if ( typeof define == 'function' && define.amd ) {
  641. // AMD
  642. define( 'flickity/js/cell',[
  643. 'get-size/get-size'
  644. ], function( getSize ) {
  645. return factory( window, getSize );
  646. });
  647. } else if ( typeof module == 'object' && module.exports ) {
  648. // CommonJS
  649. module.exports = factory(
  650. window,
  651. require('get-size')
  652. );
  653. } else {
  654. // browser global
  655. window.Flickity = window.Flickity || {};
  656. window.Flickity.Cell = factory(
  657. window,
  658. window.getSize
  659. );
  660. }
  661. }( window, function factory( window, getSize ) {
  662. function Cell( elem, parent ) {
  663. this.element = elem;
  664. this.parent = parent;
  665. this.create();
  666. }
  667. var proto = Cell.prototype;
  668. proto.create = function() {
  669. this.element.style.position = 'absolute';
  670. this.element.setAttribute( 'aria-hidden', 'true' );
  671. this.x = 0;
  672. this.shift = 0;
  673. };
  674. proto.destroy = function() {
  675. // reset style
  676. this.unselect();
  677. this.element.style.position = '';
  678. var side = this.parent.originSide;
  679. this.element.style[ side ] = '';
  680. };
  681. proto.getSize = function() {
  682. this.size = getSize( this.element );
  683. };
  684. proto.setPosition = function( x ) {
  685. this.x = x;
  686. this.updateTarget();
  687. this.renderPosition( x );
  688. };
  689. // setDefaultTarget v1 method, backwards compatibility, remove in v3
  690. proto.updateTarget = proto.setDefaultTarget = function() {
  691. var marginProperty = this.parent.originSide == 'left' ? 'marginLeft' : 'marginRight';
  692. this.target = this.x + this.size[ marginProperty ] +
  693. this.size.width * this.parent.cellAlign;
  694. };
  695. proto.renderPosition = function( x ) {
  696. // render position of cell with in slider
  697. var side = this.parent.originSide;
  698. this.element.style[ side ] = this.parent.getPositionValue( x );
  699. };
  700. proto.select = function() {
  701. this.element.classList.add('is-selected');
  702. this.element.removeAttribute('aria-hidden');
  703. };
  704. proto.unselect = function() {
  705. this.element.classList.remove('is-selected');
  706. this.element.setAttribute( 'aria-hidden', 'true' );
  707. };
  708. /**
  709. * @param {Integer} factor - 0, 1, or -1
  710. **/
  711. proto.wrapShift = function( shift ) {
  712. this.shift = shift;
  713. this.renderPosition( this.x + this.parent.slideableWidth * shift );
  714. };
  715. proto.remove = function() {
  716. this.element.parentNode.removeChild( this.element );
  717. };
  718. return Cell;
  719. }));
  720. // slide
  721. ( function( window, factory ) {
  722. // universal module definition
  723. /* jshint strict: false */
  724. if ( typeof define == 'function' && define.amd ) {
  725. // AMD
  726. define( 'flickity/js/slide',factory );
  727. } else if ( typeof module == 'object' && module.exports ) {
  728. // CommonJS
  729. module.exports = factory();
  730. } else {
  731. // browser global
  732. window.Flickity = window.Flickity || {};
  733. window.Flickity.Slide = factory();
  734. }
  735. }( window, function factory() {
  736. 'use strict';
  737. function Slide( parent ) {
  738. this.parent = parent;
  739. this.isOriginLeft = parent.originSide == 'left';
  740. this.cells = [];
  741. this.outerWidth = 0;
  742. this.height = 0;
  743. }
  744. var proto = Slide.prototype;
  745. proto.addCell = function( cell ) {
  746. this.cells.push( cell );
  747. this.outerWidth += cell.size.outerWidth;
  748. this.height = Math.max( cell.size.outerHeight, this.height );
  749. // first cell stuff
  750. if ( this.cells.length == 1 ) {
  751. this.x = cell.x; // x comes from first cell
  752. var beginMargin = this.isOriginLeft ? 'marginLeft' : 'marginRight';
  753. this.firstMargin = cell.size[ beginMargin ];
  754. }
  755. };
  756. proto.updateTarget = function() {
  757. var endMargin = this.isOriginLeft ? 'marginRight' : 'marginLeft';
  758. var lastCell = this.getLastCell();
  759. var lastMargin = lastCell ? lastCell.size[ endMargin ] : 0;
  760. var slideWidth = this.outerWidth - ( this.firstMargin + lastMargin );
  761. this.target = this.x + this.firstMargin + slideWidth * this.parent.cellAlign;
  762. };
  763. proto.getLastCell = function() {
  764. return this.cells[ this.cells.length - 1 ];
  765. };
  766. proto.select = function() {
  767. this.cells.forEach( function( cell ) {
  768. cell.select();
  769. });
  770. };
  771. proto.unselect = function() {
  772. this.cells.forEach( function( cell ) {
  773. cell.unselect();
  774. });
  775. };
  776. proto.getCellElements = function() {
  777. return this.cells.map( function( cell ) {
  778. return cell.element;
  779. });
  780. };
  781. return Slide;
  782. }));
  783. // animate
  784. ( function( window, factory ) {
  785. // universal module definition
  786. /* jshint strict: false */
  787. if ( typeof define == 'function' && define.amd ) {
  788. // AMD
  789. define( 'flickity/js/animate',[
  790. 'fizzy-ui-utils/utils'
  791. ], function( utils ) {
  792. return factory( window, utils );
  793. });
  794. } else if ( typeof module == 'object' && module.exports ) {
  795. // CommonJS
  796. module.exports = factory(
  797. window,
  798. require('fizzy-ui-utils')
  799. );
  800. } else {
  801. // browser global
  802. window.Flickity = window.Flickity || {};
  803. window.Flickity.animatePrototype = factory(
  804. window,
  805. window.fizzyUIUtils
  806. );
  807. }
  808. }( window, function factory( window, utils ) {
  809. // -------------------------- animate -------------------------- //
  810. var proto = {};
  811. proto.startAnimation = function() {
  812. if ( this.isAnimating ) {
  813. return;
  814. }
  815. this.isAnimating = true;
  816. this.restingFrames = 0;
  817. this.animate();
  818. };
  819. proto.animate = function() {
  820. this.applyDragForce();
  821. this.applySelectedAttraction();
  822. var previousX = this.x;
  823. this.integratePhysics();
  824. this.positionSlider();
  825. this.settle( previousX );
  826. // animate next frame
  827. if ( this.isAnimating ) {
  828. var _this = this;
  829. requestAnimationFrame( function animateFrame() {
  830. _this.animate();
  831. });
  832. }
  833. };
  834. proto.positionSlider = function() {
  835. var x = this.x;
  836. // wrap position around
  837. if ( this.options.wrapAround && this.cells.length > 1 ) {
  838. x = utils.modulo( x, this.slideableWidth );
  839. x = x - this.slideableWidth;
  840. this.shiftWrapCells( x );
  841. }
  842. this.setTranslateX( x, this.isAnimating );
  843. this.dispatchScrollEvent();
  844. };
  845. proto.setTranslateX = function( x, is3d ) {
  846. x += this.cursorPosition;
  847. // reverse if right-to-left and using transform
  848. x = this.options.rightToLeft ? -x : x;
  849. var translateX = this.getPositionValue( x );
  850. // use 3D tranforms for hardware acceleration on iOS
  851. // but use 2D when settled, for better font-rendering
  852. this.slider.style.transform = is3d ?
  853. 'translate3d(' + translateX + ',0,0)' : 'translateX(' + translateX + ')';
  854. };
  855. proto.dispatchScrollEvent = function() {
  856. var firstSlide = this.slides[0];
  857. if ( !firstSlide ) {
  858. return;
  859. }
  860. var positionX = -this.x - firstSlide.target;
  861. var progress = positionX / this.slidesWidth;
  862. this.dispatchEvent( 'scroll', null, [ progress, positionX ] );
  863. };
  864. proto.positionSliderAtSelected = function() {
  865. if ( !this.cells.length ) {
  866. return;
  867. }
  868. this.x = -this.selectedSlide.target;
  869. this.velocity = 0; // stop wobble
  870. this.positionSlider();
  871. };
  872. proto.getPositionValue = function( position ) {
  873. if ( this.options.percentPosition ) {
  874. // percent position, round to 2 digits, like 12.34%
  875. return ( Math.round( ( position / this.size.innerWidth ) * 10000 ) * 0.01 )+ '%';
  876. } else {
  877. // pixel positioning
  878. return Math.round( position ) + 'px';
  879. }
  880. };
  881. proto.settle = function( previousX ) {
  882. // keep track of frames where x hasn't moved
  883. if ( !this.isPointerDown && Math.round( this.x * 100 ) == Math.round( previousX * 100 ) ) {
  884. this.restingFrames++;
  885. }
  886. // stop animating if resting for 3 or more frames
  887. if ( this.restingFrames > 2 ) {
  888. this.isAnimating = false;
  889. delete this.isFreeScrolling;
  890. // render position with translateX when settled
  891. this.positionSlider();
  892. this.dispatchEvent( 'settle', null, [ this.selectedIndex ] );
  893. }
  894. };
  895. proto.shiftWrapCells = function( x ) {
  896. // shift before cells
  897. var beforeGap = this.cursorPosition + x;
  898. this._shiftCells( this.beforeShiftCells, beforeGap, -1 );
  899. // shift after cells
  900. var afterGap = this.size.innerWidth - ( x + this.slideableWidth + this.cursorPosition );
  901. this._shiftCells( this.afterShiftCells, afterGap, 1 );
  902. };
  903. proto._shiftCells = function( cells, gap, shift ) {
  904. for ( var i=0; i < cells.length; i++ ) {
  905. var cell = cells[i];
  906. var cellShift = gap > 0 ? shift : 0;
  907. cell.wrapShift( cellShift );
  908. gap -= cell.size.outerWidth;
  909. }
  910. };
  911. proto._unshiftCells = function( cells ) {
  912. if ( !cells || !cells.length ) {
  913. return;
  914. }
  915. for ( var i=0; i < cells.length; i++ ) {
  916. cells[i].wrapShift( 0 );
  917. }
  918. };
  919. // -------------------------- physics -------------------------- //
  920. proto.integratePhysics = function() {
  921. this.x += this.velocity;
  922. this.velocity *= this.getFrictionFactor();
  923. };
  924. proto.applyForce = function( force ) {
  925. this.velocity += force;
  926. };
  927. proto.getFrictionFactor = function() {
  928. return 1 - this.options[ this.isFreeScrolling ? 'freeScrollFriction' : 'friction' ];
  929. };
  930. proto.getRestingPosition = function() {
  931. // my thanks to Steven Wittens, who simplified this math greatly
  932. return this.x + this.velocity / ( 1 - this.getFrictionFactor() );
  933. };
  934. proto.applyDragForce = function() {
  935. if ( !this.isDraggable || !this.isPointerDown ) {
  936. return;
  937. }
  938. // change the position to drag position by applying force
  939. var dragVelocity = this.dragX - this.x;
  940. var dragForce = dragVelocity - this.velocity;
  941. this.applyForce( dragForce );
  942. };
  943. proto.applySelectedAttraction = function() {
  944. // do not attract if pointer down or no slides
  945. var dragDown = this.isDraggable && this.isPointerDown;
  946. if ( dragDown || this.isFreeScrolling || !this.slides.length ) {
  947. return;
  948. }
  949. var distance = this.selectedSlide.target * -1 - this.x;
  950. var force = distance * this.options.selectedAttraction;
  951. this.applyForce( force );
  952. };
  953. return proto;
  954. }));
  955. // Flickity main
  956. ( function( window, factory ) {
  957. // universal module definition
  958. /* jshint strict: false */
  959. if ( typeof define == 'function' && define.amd ) {
  960. // AMD
  961. define( 'flickity/js/flickity',[
  962. 'ev-emitter/ev-emitter',
  963. 'get-size/get-size',
  964. 'fizzy-ui-utils/utils',
  965. './cell',
  966. './slide',
  967. './animate'
  968. ], function( EvEmitter, getSize, utils, Cell, Slide, animatePrototype ) {
  969. return factory( window, EvEmitter, getSize, utils, Cell, Slide, animatePrototype );
  970. });
  971. } else if ( typeof module == 'object' && module.exports ) {
  972. // CommonJS
  973. module.exports = factory(
  974. window,
  975. require('ev-emitter'),
  976. require('get-size'),
  977. require('fizzy-ui-utils'),
  978. require('./cell'),
  979. require('./slide'),
  980. require('./animate')
  981. );
  982. } else {
  983. // browser global
  984. var _Flickity = window.Flickity;
  985. window.Flickity = factory(
  986. window,
  987. window.EvEmitter,
  988. window.getSize,
  989. window.fizzyUIUtils,
  990. _Flickity.Cell,
  991. _Flickity.Slide,
  992. _Flickity.animatePrototype
  993. );
  994. }
  995. }( window, function factory( window, EvEmitter, getSize,
  996. utils, Cell, Slide, animatePrototype ) {
  997. // vars
  998. var jQuery = window.jQuery;
  999. var getComputedStyle = window.getComputedStyle;
  1000. var console = window.console;
  1001. function moveElements( elems, toElem ) {
  1002. elems = utils.makeArray( elems );
  1003. while ( elems.length ) {
  1004. toElem.appendChild( elems.shift() );
  1005. }
  1006. }
  1007. // -------------------------- Flickity -------------------------- //
  1008. // globally unique identifiers
  1009. var GUID = 0;
  1010. // internal store of all Flickity intances
  1011. var instances = {};
  1012. function Flickity( element, options ) {
  1013. var queryElement = utils.getQueryElement( element );
  1014. if ( !queryElement ) {
  1015. if ( console ) {
  1016. console.error( 'Bad element for Flickity: ' + ( queryElement || element ) );
  1017. }
  1018. return;
  1019. }
  1020. this.element = queryElement;
  1021. // do not initialize twice on same element
  1022. if ( this.element.flickityGUID ) {
  1023. var instance = instances[ this.element.flickityGUID ];
  1024. instance.option( options );
  1025. return instance;
  1026. }
  1027. // add jQuery
  1028. if ( jQuery ) {
  1029. this.$element = jQuery( this.element );
  1030. }
  1031. // options
  1032. this.options = utils.extend( {}, this.constructor.defaults );
  1033. this.option( options );
  1034. // kick things off
  1035. this._create();
  1036. }
  1037. Flickity.defaults = {
  1038. accessibility: true,
  1039. // adaptiveHeight: false,
  1040. cellAlign: 'center',
  1041. // cellSelector: undefined,
  1042. // contain: false,
  1043. freeScrollFriction: 0.075, // friction when free-scrolling
  1044. friction: 0.28, // friction when selecting
  1045. namespaceJQueryEvents: true,
  1046. // initialIndex: 0,
  1047. percentPosition: true,
  1048. resize: true,
  1049. selectedAttraction: 0.025,
  1050. setGallerySize: true
  1051. // watchCSS: false,
  1052. // wrapAround: false
  1053. };
  1054. // hash of methods triggered on _create()
  1055. Flickity.createMethods = [];
  1056. var proto = Flickity.prototype;
  1057. // inherit EventEmitter
  1058. utils.extend( proto, EvEmitter.prototype );
  1059. proto._create = function() {
  1060. // add id for Flickity.data
  1061. var id = this.guid = ++GUID;
  1062. this.element.flickityGUID = id; // expando
  1063. instances[ id ] = this; // associate via id
  1064. // initial properties
  1065. this.selectedIndex = 0;
  1066. // how many frames slider has been in same position
  1067. this.restingFrames = 0;
  1068. // initial physics properties
  1069. this.x = 0;
  1070. this.velocity = 0;
  1071. this.originSide = this.options.rightToLeft ? 'right' : 'left';
  1072. // create viewport & slider
  1073. this.viewport = document.createElement('div');
  1074. this.viewport.className = 'flickity-viewport';
  1075. this._createSlider();
  1076. if ( this.options.resize || this.options.watchCSS ) {
  1077. window.addEventListener( 'resize', this );
  1078. }
  1079. // add listeners from on option
  1080. for ( var eventName in this.options.on ) {
  1081. var listener = this.options.on[ eventName ];
  1082. this.on( eventName, listener );
  1083. }
  1084. Flickity.createMethods.forEach( function( method ) {
  1085. this[ method ]();
  1086. }, this );
  1087. if ( this.options.watchCSS ) {
  1088. this.watchCSS();
  1089. } else {
  1090. this.activate();
  1091. }
  1092. };
  1093. /**
  1094. * set options
  1095. * @param {Object} opts
  1096. */
  1097. proto.option = function( opts ) {
  1098. utils.extend( this.options, opts );
  1099. };
  1100. proto.activate = function() {
  1101. if ( this.isActive ) {
  1102. return;
  1103. }
  1104. this.isActive = true;
  1105. this.element.classList.add('flickity-enabled');
  1106. if ( this.options.rightToLeft ) {
  1107. this.element.classList.add('flickity-rtl');
  1108. }
  1109. this.getSize();
  1110. // move initial cell elements so they can be loaded as cells
  1111. var cellElems = this._filterFindCellElements( this.element.children );
  1112. moveElements( cellElems, this.slider );
  1113. this.viewport.appendChild( this.slider );
  1114. this.element.appendChild( this.viewport );
  1115. // get cells from children
  1116. this.reloadCells();
  1117. if ( this.options.accessibility ) {
  1118. // allow element to focusable
  1119. this.element.tabIndex = 0;
  1120. // listen for key presses
  1121. this.element.addEventListener( 'keydown', this );
  1122. }
  1123. this.emitEvent('activate');
  1124. this.selectInitialIndex();
  1125. // flag for initial activation, for using initialIndex
  1126. this.isInitActivated = true;
  1127. // ready event. #493
  1128. this.dispatchEvent('ready');
  1129. };
  1130. // slider positions the cells
  1131. proto._createSlider = function() {
  1132. // slider element does all the positioning
  1133. var slider = document.createElement('div');
  1134. slider.className = 'flickity-slider';
  1135. slider.style[ this.originSide ] = 0;
  1136. this.slider = slider;
  1137. };
  1138. proto._filterFindCellElements = function( elems ) {
  1139. return utils.filterFindElements( elems, this.options.cellSelector );
  1140. };
  1141. // goes through all children
  1142. proto.reloadCells = function() {
  1143. // collection of item elements
  1144. this.cells = this._makeCells( this.slider.children );
  1145. this.positionCells();
  1146. this._getWrapShiftCells();
  1147. this.setGallerySize();
  1148. };
  1149. /**
  1150. * turn elements into Flickity.Cells
  1151. * @param {Array or NodeList or HTMLElement} elems
  1152. * @returns {Array} items - collection of new Flickity Cells
  1153. */
  1154. proto._makeCells = function( elems ) {
  1155. var cellElems = this._filterFindCellElements( elems );
  1156. // create new Flickity for collection
  1157. var cells = cellElems.map( function( cellElem ) {
  1158. return new Cell( cellElem, this );
  1159. }, this );
  1160. return cells;
  1161. };
  1162. proto.getLastCell = function() {
  1163. return this.cells[ this.cells.length - 1 ];
  1164. };
  1165. proto.getLastSlide = function() {
  1166. return this.slides[ this.slides.length - 1 ];
  1167. };
  1168. // positions all cells
  1169. proto.positionCells = function() {
  1170. // size all cells
  1171. this._sizeCells( this.cells );
  1172. // position all cells
  1173. this._positionCells( 0 );
  1174. };
  1175. /**
  1176. * position certain cells
  1177. * @param {Integer} index - which cell to start with
  1178. */
  1179. proto._positionCells = function( index ) {
  1180. index = index || 0;
  1181. // also measure maxCellHeight
  1182. // start 0 if positioning all cells
  1183. this.maxCellHeight = index ? this.maxCellHeight || 0 : 0;
  1184. var cellX = 0;
  1185. // get cellX
  1186. if ( index > 0 ) {
  1187. var startCell = this.cells[ index - 1 ];
  1188. cellX = startCell.x + startCell.size.outerWidth;
  1189. }
  1190. var len = this.cells.length;
  1191. for ( var i=index; i < len; i++ ) {
  1192. var cell = this.cells[i];
  1193. cell.setPosition( cellX );
  1194. cellX += cell.size.outerWidth;
  1195. this.maxCellHeight = Math.max( cell.size.outerHeight, this.maxCellHeight );
  1196. }
  1197. // keep track of cellX for wrap-around
  1198. this.slideableWidth = cellX;
  1199. // slides
  1200. this.updateSlides();
  1201. // contain slides target
  1202. this._containSlides();
  1203. // update slidesWidth
  1204. this.slidesWidth = len ? this.getLastSlide().target - this.slides[0].target : 0;
  1205. };
  1206. /**
  1207. * cell.getSize() on multiple cells
  1208. * @param {Array} cells
  1209. */
  1210. proto._sizeCells = function( cells ) {
  1211. cells.forEach( function( cell ) {
  1212. cell.getSize();
  1213. });
  1214. };
  1215. // -------------------------- -------------------------- //
  1216. proto.updateSlides = function() {
  1217. this.slides = [];
  1218. if ( !this.cells.length ) {
  1219. return;
  1220. }
  1221. var slide = new Slide( this );
  1222. this.slides.push( slide );
  1223. var isOriginLeft = this.originSide == 'left';
  1224. var nextMargin = isOriginLeft ? 'marginRight' : 'marginLeft';
  1225. var canCellFit = this._getCanCellFit();
  1226. this.cells.forEach( function( cell, i ) {
  1227. // just add cell if first cell in slide
  1228. if ( !slide.cells.length ) {
  1229. slide.addCell( cell );
  1230. return;
  1231. }
  1232. var slideWidth = ( slide.outerWidth - slide.firstMargin ) +
  1233. ( cell.size.outerWidth - cell.size[ nextMargin ] );
  1234. if ( canCellFit.call( this, i, slideWidth ) ) {
  1235. slide.addCell( cell );
  1236. } else {
  1237. // doesn't fit, new slide
  1238. slide.updateTarget();
  1239. slide = new Slide( this );
  1240. this.slides.push( slide );
  1241. slide.addCell( cell );
  1242. }
  1243. }, this );
  1244. // last slide
  1245. slide.updateTarget();
  1246. // update .selectedSlide
  1247. this.updateSelectedSlide();
  1248. };
  1249. proto._getCanCellFit = function() {
  1250. var groupCells = this.options.groupCells;
  1251. if ( !groupCells ) {
  1252. return function() {
  1253. return false;
  1254. };
  1255. } else if ( typeof groupCells == 'number' ) {
  1256. // group by number. 3 -> [0,1,2], [3,4,5], ...
  1257. var number = parseInt( groupCells, 10 );
  1258. return function( i ) {
  1259. return ( i % number ) !== 0;
  1260. };
  1261. }
  1262. // default, group by width of slide
  1263. // parse '75%
  1264. var percentMatch = typeof groupCells == 'string' &&
  1265. groupCells.match(/^(\d+)%$/);
  1266. var percent = percentMatch ? parseInt( percentMatch[1], 10 ) / 100 : 1;
  1267. return function( i, slideWidth ) {
  1268. return slideWidth <= ( this.size.innerWidth + 1 ) * percent;
  1269. };
  1270. };
  1271. // alias _init for jQuery plugin .flickity()
  1272. proto._init =
  1273. proto.reposition = function() {
  1274. this.positionCells();
  1275. this.positionSliderAtSelected();
  1276. };
  1277. proto.getSize = function() {
  1278. this.size = getSize( this.element );
  1279. this.setCellAlign();
  1280. this.cursorPosition = this.size.innerWidth * this.cellAlign;
  1281. };
  1282. var cellAlignShorthands = {
  1283. // cell align, then based on origin side
  1284. center: {
  1285. left: 0.5,
  1286. right: 0.5
  1287. },
  1288. left: {
  1289. left: 0,
  1290. right: 1
  1291. },
  1292. right: {
  1293. right: 0,
  1294. left: 1
  1295. }
  1296. };
  1297. proto.setCellAlign = function() {
  1298. var shorthand = cellAlignShorthands[ this.options.cellAlign ];
  1299. this.cellAlign = shorthand ? shorthand[ this.originSide ] : this.options.cellAlign;
  1300. };
  1301. proto.setGallerySize = function() {
  1302. if ( this.options.setGallerySize ) {
  1303. var height = this.options.adaptiveHeight && this.selectedSlide ?
  1304. this.selectedSlide.height : this.maxCellHeight;
  1305. this.viewport.style.height = height + 'px';
  1306. }
  1307. };
  1308. proto._getWrapShiftCells = function() {
  1309. // only for wrap-around
  1310. if ( !this.options.wrapAround ) {
  1311. return;
  1312. }
  1313. // unshift previous cells
  1314. this._unshiftCells( this.beforeShiftCells );
  1315. this._unshiftCells( this.afterShiftCells );
  1316. // get before cells
  1317. // initial gap
  1318. var gapX = this.cursorPosition;
  1319. var cellIndex = this.cells.length - 1;
  1320. this.beforeShiftCells = this._getGapCells( gapX, cellIndex, -1 );
  1321. // get after cells
  1322. // ending gap between last cell and end of gallery viewport
  1323. gapX = this.size.innerWidth - this.cursorPosition;
  1324. // start cloning at first cell, working forwards
  1325. this.afterShiftCells = this._getGapCells( gapX, 0, 1 );
  1326. };
  1327. proto._getGapCells = function( gapX, cellIndex, increment ) {
  1328. // keep adding cells until the cover the initial gap
  1329. var cells = [];
  1330. while ( gapX > 0 ) {
  1331. var cell = this.cells[ cellIndex ];
  1332. if ( !cell ) {
  1333. break;
  1334. }
  1335. cells.push( cell );
  1336. cellIndex += increment;
  1337. gapX -= cell.size.outerWidth;
  1338. }
  1339. return cells;
  1340. };
  1341. // ----- contain ----- //
  1342. // contain cell targets so no excess sliding
  1343. proto._containSlides = function() {
  1344. if ( !this.options.contain || this.options.wrapAround || !this.cells.length ) {
  1345. return;
  1346. }
  1347. var isRightToLeft = this.options.rightToLeft;
  1348. var beginMargin = isRightToLeft ? 'marginRight' : 'marginLeft';
  1349. var endMargin = isRightToLeft ? 'marginLeft' : 'marginRight';
  1350. var contentWidth = this.slideableWidth - this.getLastCell().size[ endMargin ];
  1351. // content is less than gallery size
  1352. var isContentSmaller = contentWidth < this.size.innerWidth;
  1353. // bounds
  1354. var beginBound = this.cursorPosition + this.cells[0].size[ beginMargin ];
  1355. var endBound = contentWidth - this.size.innerWidth * ( 1 - this.cellAlign );
  1356. // contain each cell target
  1357. this.slides.forEach( function( slide ) {
  1358. if ( isContentSmaller ) {
  1359. // all cells fit inside gallery
  1360. slide.target = contentWidth * this.cellAlign;
  1361. } else {
  1362. // contain to bounds
  1363. slide.target = Math.max( slide.target, beginBound );
  1364. slide.target = Math.min( slide.target, endBound );
  1365. }
  1366. }, this );
  1367. };
  1368. // ----- ----- //
  1369. /**
  1370. * emits events via eventEmitter and jQuery events
  1371. * @param {String} type - name of event
  1372. * @param {Event} event - original event
  1373. * @param {Array} args - extra arguments
  1374. */
  1375. proto.dispatchEvent = function( type, event, args ) {
  1376. var emitArgs = event ? [ event ].concat( args ) : args;
  1377. this.emitEvent( type, emitArgs );
  1378. if ( jQuery && this.$element ) {
  1379. // default trigger with type if no event
  1380. type += this.options.namespaceJQueryEvents ? '.flickity' : '';
  1381. var $event = type;
  1382. if ( event ) {
  1383. // create jQuery event
  1384. var jQEvent = jQuery.Event( event );
  1385. jQEvent.type = type;
  1386. $event = jQEvent;
  1387. }
  1388. this.$element.trigger( $event, args );
  1389. }
  1390. };
  1391. // -------------------------- select -------------------------- //
  1392. /**
  1393. * @param {Integer} index - index of the slide
  1394. * @param {Boolean} isWrap - will wrap-around to last/first if at the end
  1395. * @param {Boolean} isInstant - will immediately set position at selected cell
  1396. */
  1397. proto.select = function( index, isWrap, isInstant ) {
  1398. if ( !this.isActive ) {
  1399. return;
  1400. }
  1401. index = parseInt( index, 10 );
  1402. this._wrapSelect( index );
  1403. if ( this.options.wrapAround || isWrap ) {
  1404. index = utils.modulo( index, this.slides.length );
  1405. }
  1406. // bail if invalid index
  1407. if ( !this.slides[ index ] ) {
  1408. return;
  1409. }
  1410. var prevIndex = this.selectedIndex;
  1411. this.selectedIndex = index;
  1412. this.updateSelectedSlide();
  1413. if ( isInstant ) {
  1414. this.positionSliderAtSelected();
  1415. } else {
  1416. this.startAnimation();
  1417. }
  1418. if ( this.options.adaptiveHeight ) {
  1419. this.setGallerySize();
  1420. }
  1421. // events
  1422. this.dispatchEvent( 'select', null, [ index ] );
  1423. // change event if new index
  1424. if ( index != prevIndex ) {
  1425. this.dispatchEvent( 'change', null, [ index ] );
  1426. }
  1427. // old v1 event name, remove in v3
  1428. this.dispatchEvent('cellSelect');
  1429. };
  1430. // wraps position for wrapAround, to move to closest slide. #113
  1431. proto._wrapSelect = function( index ) {
  1432. var len = this.slides.length;
  1433. var isWrapping = this.options.wrapAround && len > 1;
  1434. if ( !isWrapping ) {
  1435. return index;
  1436. }
  1437. var wrapIndex = utils.modulo( index, len );
  1438. // go to shortest
  1439. var delta = Math.abs( wrapIndex - this.selectedIndex );
  1440. var backWrapDelta = Math.abs( ( wrapIndex + len ) - this.selectedIndex );
  1441. var forewardWrapDelta = Math.abs( ( wrapIndex - len ) - this.selectedIndex );
  1442. if ( !this.isDragSelect && backWrapDelta < delta ) {
  1443. index += len;
  1444. } else if ( !this.isDragSelect && forewardWrapDelta < delta ) {
  1445. index -= len;
  1446. }
  1447. // wrap position so slider is within normal area
  1448. if ( index < 0 ) {
  1449. this.x -= this.slideableWidth;
  1450. } else if ( index >= len ) {
  1451. this.x += this.slideableWidth;
  1452. }
  1453. };
  1454. proto.previous = function( isWrap, isInstant ) {
  1455. this.select( this.selectedIndex - 1, isWrap, isInstant );
  1456. };
  1457. proto.next = function( isWrap, isInstant ) {
  1458. this.select( this.selectedIndex + 1, isWrap, isInstant );
  1459. };
  1460. proto.updateSelectedSlide = function() {
  1461. var slide = this.slides[ this.selectedIndex ];
  1462. // selectedIndex could be outside of slides, if triggered before resize()
  1463. if ( !slide ) {
  1464. return;
  1465. }
  1466. // unselect previous selected slide
  1467. this.unselectSelectedSlide();
  1468. // update new selected slide
  1469. this.selectedSlide = slide;
  1470. slide.select();
  1471. this.selectedCells = slide.cells;
  1472. this.selectedElements = slide.getCellElements();
  1473. // HACK: selectedCell & selectedElement is first cell in slide, backwards compatibility
  1474. // Remove in v3?
  1475. this.selectedCell = slide.cells[0];
  1476. this.selectedElement = this.selectedElements[0];
  1477. };
  1478. proto.unselectSelectedSlide = function() {
  1479. if ( this.selectedSlide ) {
  1480. this.selectedSlide.unselect();
  1481. }
  1482. };
  1483. proto.selectInitialIndex = function() {
  1484. var initialIndex = this.options.initialIndex;
  1485. // already activated, select previous selectedIndex
  1486. if ( this.isInitActivated ) {
  1487. this.select( this.selectedIndex, false, true );
  1488. return;
  1489. }
  1490. // select with selector string
  1491. if ( initialIndex && typeof initialIndex == 'string' ) {
  1492. var cell = this.queryCell( initialIndex );
  1493. if ( cell ) {
  1494. this.selectCell( initialIndex, false, true );
  1495. return;
  1496. }
  1497. }
  1498. var index = 0;
  1499. // select with number
  1500. if ( initialIndex && this.slides[ initialIndex ] ) {
  1501. index = initialIndex;
  1502. }
  1503. // select instantly
  1504. this.select( index, false, true );
  1505. };
  1506. /**
  1507. * select slide from number or cell element
  1508. * @param {Element or Number} elem
  1509. */
  1510. proto.selectCell = function( value, isWrap, isInstant ) {
  1511. // get cell
  1512. var cell = this.queryCell( value );
  1513. if ( !cell ) {
  1514. return;
  1515. }
  1516. var index = this.getCellSlideIndex( cell );
  1517. this.select( index, isWrap, isInstant );
  1518. };
  1519. proto.getCellSlideIndex = function( cell ) {
  1520. // get index of slides that has cell
  1521. for ( var i=0; i < this.slides.length; i++ ) {
  1522. var slide = this.slides[i];
  1523. var index = slide.cells.indexOf( cell );
  1524. if ( index != -1 ) {
  1525. return i;
  1526. }
  1527. }
  1528. };
  1529. // -------------------------- get cells -------------------------- //
  1530. /**
  1531. * get Flickity.Cell, given an Element
  1532. * @param {Element} elem
  1533. * @returns {Flickity.Cell} item
  1534. */
  1535. proto.getCell = function( elem ) {
  1536. // loop through cells to get the one that matches
  1537. for ( var i=0; i < this.cells.length; i++ ) {
  1538. var cell = this.cells[i];
  1539. if ( cell.element == elem ) {
  1540. return cell;
  1541. }
  1542. }
  1543. };
  1544. /**
  1545. * get collection of Flickity.Cells, given Elements
  1546. * @param {Element, Array, NodeList} elems
  1547. * @returns {Array} cells - Flickity.Cells
  1548. */
  1549. proto.getCells = function( elems ) {
  1550. elems = utils.makeArray( elems );
  1551. var cells = [];
  1552. elems.forEach( function( elem ) {
  1553. var cell = this.getCell( elem );
  1554. if ( cell ) {
  1555. cells.push( cell );
  1556. }
  1557. }, this );
  1558. return cells;
  1559. };
  1560. /**
  1561. * get cell elements
  1562. * @returns {Array} cellElems
  1563. */
  1564. proto.getCellElements = function() {
  1565. return this.cells.map( function( cell ) {
  1566. return cell.element;
  1567. });
  1568. };
  1569. /**
  1570. * get parent cell from an element
  1571. * @param {Element} elem
  1572. * @returns {Flickit.Cell} cell
  1573. */
  1574. proto.getParentCell = function( elem ) {
  1575. // first check if elem is cell
  1576. var cell = this.getCell( elem );
  1577. if ( cell ) {
  1578. return cell;
  1579. }
  1580. // try to get parent cell elem
  1581. elem = utils.getParent( elem, '.flickity-slider > *' );
  1582. return this.getCell( elem );
  1583. };
  1584. /**
  1585. * get cells adjacent to a slide
  1586. * @param {Integer} adjCount - number of adjacent slides
  1587. * @param {Integer} index - index of slide to start
  1588. * @returns {Array} cells - array of Flickity.Cells
  1589. */
  1590. proto.getAdjacentCellElements = function( adjCount, index ) {
  1591. if ( !adjCount ) {
  1592. return this.selectedSlide.getCellElements();
  1593. }
  1594. index = index === undefined ? this.selectedIndex : index;
  1595. var len = this.slides.length;
  1596. if ( 1 + ( adjCount * 2 ) >= len ) {
  1597. return this.getCellElements();
  1598. }
  1599. var cellElems = [];
  1600. for ( var i = index - adjCount; i <= index + adjCount ; i++ ) {
  1601. var slideIndex = this.options.wrapAround ? utils.modulo( i, len ) : i;
  1602. var slide = this.slides[ slideIndex ];
  1603. if ( slide ) {
  1604. cellElems = cellElems.concat( slide.getCellElements() );
  1605. }
  1606. }
  1607. return cellElems;
  1608. };
  1609. /**
  1610. * select slide from number or cell element
  1611. * @param {Element, Selector String, or Number} selector
  1612. */
  1613. proto.queryCell = function( selector ) {
  1614. if ( typeof selector == 'number' ) {
  1615. // use number as index
  1616. return this.cells[ selector ];
  1617. }
  1618. if ( typeof selector == 'string' ) {
  1619. // do not select invalid selectors from hash: #123, #/. #791
  1620. if ( selector.match(/^[#\.]?[\d\/]/) ) {
  1621. return;
  1622. }
  1623. // use string as selector, get element
  1624. selector = this.element.querySelector( selector );
  1625. }
  1626. // get cell from element
  1627. return this.getCell( selector );
  1628. };
  1629. // -------------------------- events -------------------------- //
  1630. proto.uiChange = function() {
  1631. this.emitEvent('uiChange');
  1632. };
  1633. // keep focus on element when child UI elements are clicked
  1634. proto.childUIPointerDown = function( event ) {
  1635. // HACK iOS does not allow touch events to bubble up?!
  1636. if ( event.type != 'touchstart' ) {
  1637. event.preventDefault();
  1638. }
  1639. this.focus();
  1640. };
  1641. // ----- resize ----- //
  1642. proto.onresize = function() {
  1643. this.watchCSS();
  1644. this.resize();
  1645. };
  1646. utils.debounceMethod( Flickity, 'onresize', 150 );
  1647. proto.resize = function() {
  1648. if ( !this.isActive ) {
  1649. return;
  1650. }
  1651. this.getSize();
  1652. // wrap values
  1653. if ( this.options.wrapAround ) {
  1654. this.x = utils.modulo( this.x, this.slideableWidth );
  1655. }
  1656. this.positionCells();
  1657. this._getWrapShiftCells();
  1658. this.setGallerySize();
  1659. this.emitEvent('resize');
  1660. // update selected index for group slides, instant
  1661. // TODO: position can be lost between groups of various numbers
  1662. var selectedElement = this.selectedElements && this.selectedElements[0];
  1663. this.selectCell( selectedElement, false, true );
  1664. };
  1665. // watches the :after property, activates/deactivates
  1666. proto.watchCSS = function() {
  1667. var watchOption = this.options.watchCSS;
  1668. if ( !watchOption ) {
  1669. return;
  1670. }
  1671. var afterContent = getComputedStyle( this.element, ':after' ).content;
  1672. // activate if :after { content: 'flickity' }
  1673. if ( afterContent.indexOf('flickity') != -1 ) {
  1674. this.activate();
  1675. } else {
  1676. this.deactivate();
  1677. }
  1678. };
  1679. // ----- keydown ----- //
  1680. // go previous/next if left/right keys pressed
  1681. proto.onkeydown = function( event ) {
  1682. // only work if element is in focus
  1683. var isNotFocused = document.activeElement && document.activeElement != this.element;
  1684. if ( !this.options.accessibility ||isNotFocused ) {
  1685. return;
  1686. }
  1687. var handler = Flickity.keyboardHandlers[ event.keyCode ];
  1688. if ( handler ) {
  1689. handler.call( this );
  1690. }
  1691. };
  1692. Flickity.keyboardHandlers = {
  1693. // left arrow
  1694. 37: function() {
  1695. var leftMethod = this.options.rightToLeft ? 'next' : 'previous';
  1696. this.uiChange();
  1697. this[ leftMethod ]();
  1698. },
  1699. // right arrow
  1700. 39: function() {
  1701. var rightMethod = this.options.rightToLeft ? 'previous' : 'next';
  1702. this.uiChange();
  1703. this[ rightMethod ]();
  1704. },
  1705. };
  1706. // ----- focus ----- //
  1707. proto.focus = function() {
  1708. // TODO remove scrollTo once focus options gets more support
  1709. // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus#Browser_compatibility
  1710. var prevScrollY = window.pageYOffset;
  1711. this.element.focus({ preventScroll: true });
  1712. // hack to fix scroll jump after focus, #76
  1713. if ( window.pageYOffset != prevScrollY ) {
  1714. window.scrollTo( window.pageXOffset, prevScrollY );
  1715. }
  1716. };
  1717. // -------------------------- destroy -------------------------- //
  1718. // deactivate all Flickity functionality, but keep stuff available
  1719. proto.deactivate = function() {
  1720. if ( !this.isActive ) {
  1721. return;
  1722. }
  1723. this.element.classList.remove('flickity-enabled');
  1724. this.element.classList.remove('flickity-rtl');
  1725. this.unselectSelectedSlide();
  1726. // destroy cells
  1727. this.cells.forEach( function( cell ) {
  1728. cell.destroy();
  1729. });
  1730. this.element.removeChild( this.viewport );
  1731. // move child elements back into element
  1732. moveElements( this.slider.children, this.element );
  1733. if ( this.options.accessibility ) {
  1734. this.element.removeAttribute('tabIndex');
  1735. this.element.removeEventListener( 'keydown', this );
  1736. }
  1737. // set flags
  1738. this.isActive = false;
  1739. this.emitEvent('deactivate');
  1740. };
  1741. proto.destroy = function() {
  1742. this.deactivate();
  1743. window.removeEventListener( 'resize', this );
  1744. this.allOff();
  1745. this.emitEvent('destroy');
  1746. if ( jQuery && this.$element ) {
  1747. jQuery.removeData( this.element, 'flickity' );
  1748. }
  1749. delete this.element.flickityGUID;
  1750. delete instances[ this.guid ];
  1751. };
  1752. // -------------------------- prototype -------------------------- //
  1753. utils.extend( proto, animatePrototype );
  1754. // -------------------------- extras -------------------------- //
  1755. /**
  1756. * get Flickity instance from element
  1757. * @param {Element} elem
  1758. * @returns {Flickity}
  1759. */
  1760. Flickity.data = function( elem ) {
  1761. elem = utils.getQueryElement( elem );
  1762. var id = elem && elem.flickityGUID;
  1763. return id && instances[ id ];
  1764. };
  1765. utils.htmlInit( Flickity, 'flickity' );
  1766. if ( jQuery && jQuery.bridget ) {
  1767. jQuery.bridget( 'flickity', Flickity );
  1768. }
  1769. // set internal jQuery, for Webpack + jQuery v3, #478
  1770. Flickity.setJQuery = function( jq ) {
  1771. jQuery = jq;
  1772. };
  1773. Flickity.Cell = Cell;
  1774. Flickity.Slide = Slide;
  1775. return Flickity;
  1776. }));
  1777. /*!
  1778. * Unipointer v2.3.0
  1779. * base class for doing one thing with pointer event
  1780. * MIT license
  1781. */
  1782. /*jshint browser: true, undef: true, unused: true, strict: true */
  1783. ( function( window, factory ) {
  1784. // universal module definition
  1785. /* jshint strict: false */ /*global define, module, require */
  1786. if ( typeof define == 'function' && define.amd ) {
  1787. // AMD
  1788. define( 'unipointer/unipointer',[
  1789. 'ev-emitter/ev-emitter'
  1790. ], function( EvEmitter ) {
  1791. return factory( window, EvEmitter );
  1792. });
  1793. } else if ( typeof module == 'object' && module.exports ) {
  1794. // CommonJS
  1795. module.exports = factory(
  1796. window,
  1797. require('ev-emitter')
  1798. );
  1799. } else {
  1800. // browser global
  1801. window.Unipointer = factory(
  1802. window,
  1803. window.EvEmitter
  1804. );
  1805. }
  1806. }( window, function factory( window, EvEmitter ) {
  1807. function noop() {}
  1808. function Unipointer() {}
  1809. // inherit EvEmitter
  1810. var proto = Unipointer.prototype = Object.create( EvEmitter.prototype );
  1811. proto.bindStartEvent = function( elem ) {
  1812. this._bindStartEvent( elem, true );
  1813. };
  1814. proto.unbindStartEvent = function( elem ) {
  1815. this._bindStartEvent( elem, false );
  1816. };
  1817. /**
  1818. * Add or remove start event
  1819. * @param {Boolean} isAdd - remove if falsey
  1820. */
  1821. proto._bindStartEvent = function( elem, isAdd ) {
  1822. // munge isAdd, default to true
  1823. isAdd = isAdd === undefined ? true : isAdd;
  1824. var bindMethod = isAdd ? 'addEventListener' : 'removeEventListener';
  1825. // default to mouse events
  1826. var startEvent = 'mousedown';
  1827. if ( window.PointerEvent ) {
  1828. // Pointer Events
  1829. startEvent = 'pointerdown';
  1830. } else if ( 'ontouchstart' in window ) {
  1831. // Touch Events. iOS Safari
  1832. startEvent = 'touchstart';
  1833. }
  1834. elem[ bindMethod ]( startEvent, this );
  1835. };
  1836. // trigger handler methods for events
  1837. proto.handleEvent = function( event ) {
  1838. var method = 'on' + event.type;
  1839. if ( this[ method ] ) {
  1840. this[ method ]( event );
  1841. }
  1842. };
  1843. // returns the touch that we're keeping track of
  1844. proto.getTouch = function( touches ) {
  1845. for ( var i=0; i < touches.length; i++ ) {
  1846. var touch = touches[i];
  1847. if ( touch.identifier == this.pointerIdentifier ) {
  1848. return touch;
  1849. }
  1850. }
  1851. };
  1852. // ----- start event ----- //
  1853. proto.onmousedown = function( event ) {
  1854. // dismiss clicks from right or middle buttons
  1855. var button = event.button;
  1856. if ( button && ( button !== 0 && button !== 1 ) ) {
  1857. return;
  1858. }
  1859. this._pointerDown( event, event );
  1860. };
  1861. proto.ontouchstart = function( event ) {
  1862. this._pointerDown( event, event.changedTouches[0] );
  1863. };
  1864. proto.onpointerdown = function( event ) {
  1865. this._pointerDown( event, event );
  1866. };
  1867. /**
  1868. * pointer start
  1869. * @param {Event} event
  1870. * @param {Event or Touch} pointer
  1871. */
  1872. proto._pointerDown = function( event, pointer ) {
  1873. // dismiss right click and other pointers
  1874. // button = 0 is okay, 1-4 not
  1875. if ( event.button || this.isPointerDown ) {
  1876. return;
  1877. }
  1878. this.isPointerDown = true;
  1879. // save pointer identifier to match up touch events
  1880. this.pointerIdentifier = pointer.pointerId !== undefined ?
  1881. // pointerId for pointer events, touch.indentifier for touch events
  1882. pointer.pointerId : pointer.identifier;
  1883. this.pointerDown( event, pointer );
  1884. };
  1885. proto.pointerDown = function( event, pointer ) {
  1886. this._bindPostStartEvents( event );
  1887. this.emitEvent( 'pointerDown', [ event, pointer ] );
  1888. };
  1889. // hash of events to be bound after start event
  1890. var postStartEvents = {
  1891. mousedown: [ 'mousemove', 'mouseup' ],
  1892. touchstart: [ 'touchmove', 'touchend', 'touchcancel' ],
  1893. pointerdown: [ 'pointermove', 'pointerup', 'pointercancel' ],
  1894. };
  1895. proto._bindPostStartEvents = function( event ) {
  1896. if ( !event ) {
  1897. return;
  1898. }
  1899. // get proper events to match start event
  1900. var events = postStartEvents[ event.type ];
  1901. // bind events to node
  1902. events.forEach( function( eventName ) {
  1903. window.addEventListener( eventName, this );
  1904. }, this );
  1905. // save these arguments
  1906. this._boundPointerEvents = events;
  1907. };
  1908. proto._unbindPostStartEvents = function() {
  1909. // check for _boundEvents, in case dragEnd triggered twice (old IE8 bug)
  1910. if ( !this._boundPointerEvents ) {
  1911. return;
  1912. }
  1913. this._boundPointerEvents.forEach( function( eventName ) {
  1914. window.removeEventListener( eventName, this );
  1915. }, this );
  1916. delete this._boundPointerEvents;
  1917. };
  1918. // ----- move event ----- //
  1919. proto.onmousemove = function( event ) {
  1920. this._pointerMove( event, event );
  1921. };
  1922. proto.onpointermove = function( event ) {
  1923. if ( event.pointerId == this.pointerIdentifier ) {
  1924. this._pointerMove( event, event );
  1925. }
  1926. };
  1927. proto.ontouchmove = function( event ) {
  1928. var touch = this.getTouch( event.changedTouches );
  1929. if ( touch ) {
  1930. this._pointerMove( event, touch );
  1931. }
  1932. };
  1933. /**
  1934. * pointer move
  1935. * @param {Event} event
  1936. * @param {Event or Touch} pointer
  1937. * @private
  1938. */
  1939. proto._pointerMove = function( event, pointer ) {
  1940. this.pointerMove( event, pointer );
  1941. };
  1942. // public
  1943. proto.pointerMove = function( event, pointer ) {
  1944. this.emitEvent( 'pointerMove', [ event, pointer ] );
  1945. };
  1946. // ----- end event ----- //
  1947. proto.onmouseup = function( event ) {
  1948. this._pointerUp( event, event );
  1949. };
  1950. proto.onpointerup = function( event ) {
  1951. if ( event.pointerId == this.pointerIdentifier ) {
  1952. this._pointerUp( event, event );
  1953. }
  1954. };
  1955. proto.ontouchend = function( event ) {
  1956. var touch = this.getTouch( event.changedTouches );
  1957. if ( touch ) {
  1958. this._pointerUp( event, touch );
  1959. }
  1960. };
  1961. /**
  1962. * pointer up
  1963. * @param {Event} event
  1964. * @param {Event or Touch} pointer
  1965. * @private
  1966. */
  1967. proto._pointerUp = function( event, pointer ) {
  1968. this._pointerDone();
  1969. this.pointerUp( event, pointer );
  1970. };
  1971. // public
  1972. proto.pointerUp = function( event, pointer ) {
  1973. this.emitEvent( 'pointerUp', [ event, pointer ] );
  1974. };
  1975. // ----- pointer done ----- //
  1976. // triggered on pointer up & pointer cancel
  1977. proto._pointerDone = function() {
  1978. this._pointerReset();
  1979. this._unbindPostStartEvents();
  1980. this.pointerDone();
  1981. };
  1982. proto._pointerReset = function() {
  1983. // reset properties
  1984. this.isPointerDown = false;
  1985. delete this.pointerIdentifier;
  1986. };
  1987. proto.pointerDone = noop;
  1988. // ----- pointer cancel ----- //
  1989. proto.onpointercancel = function( event ) {
  1990. if ( event.pointerId == this.pointerIdentifier ) {
  1991. this._pointerCancel( event, event );
  1992. }
  1993. };
  1994. proto.ontouchcancel = function( event ) {
  1995. var touch = this.getTouch( event.changedTouches );
  1996. if ( touch ) {
  1997. this._pointerCancel( event, touch );
  1998. }
  1999. };
  2000. /**
  2001. * pointer cancel
  2002. * @param {Event} event
  2003. * @param {Event or Touch} pointer
  2004. * @private
  2005. */
  2006. proto._pointerCancel = function( event, pointer ) {
  2007. this._pointerDone();
  2008. this.pointerCancel( event, pointer );
  2009. };
  2010. // public
  2011. proto.pointerCancel = function( event, pointer ) {
  2012. this.emitEvent( 'pointerCancel', [ event, pointer ] );
  2013. };
  2014. // ----- ----- //
  2015. // utility function for getting x/y coords from event
  2016. Unipointer.getPointerPoint = function( pointer ) {
  2017. return {
  2018. x: pointer.pageX,
  2019. y: pointer.pageY
  2020. };
  2021. };
  2022. // ----- ----- //
  2023. return Unipointer;
  2024. }));
  2025. /*!
  2026. * Unidragger v2.3.0
  2027. * Draggable base class
  2028. * MIT license
  2029. */
  2030. /*jshint browser: true, unused: true, undef: true, strict: true */
  2031. ( function( window, factory ) {
  2032. // universal module definition
  2033. /*jshint strict: false */ /*globals define, module, require */
  2034. if ( typeof define == 'function' && define.amd ) {
  2035. // AMD
  2036. define( 'unidragger/unidragger',[
  2037. 'unipointer/unipointer'
  2038. ], function( Unipointer ) {
  2039. return factory( window, Unipointer );
  2040. });
  2041. } else if ( typeof module == 'object' && module.exports ) {
  2042. // CommonJS
  2043. module.exports = factory(
  2044. window,
  2045. require('unipointer')
  2046. );
  2047. } else {
  2048. // browser global
  2049. window.Unidragger = factory(
  2050. window,
  2051. window.Unipointer
  2052. );
  2053. }
  2054. }( window, function factory( window, Unipointer ) {
  2055. // -------------------------- Unidragger -------------------------- //
  2056. function Unidragger() {}
  2057. // inherit Unipointer & EvEmitter
  2058. var proto = Unidragger.prototype = Object.create( Unipointer.prototype );
  2059. // ----- bind start ----- //
  2060. proto.bindHandles = function() {
  2061. this._bindHandles( true );
  2062. };
  2063. proto.unbindHandles = function() {
  2064. this._bindHandles( false );
  2065. };
  2066. /**
  2067. * Add or remove start event
  2068. * @param {Boolean} isAdd
  2069. */
  2070. proto._bindHandles = function( isAdd ) {
  2071. // munge isAdd, default to true
  2072. isAdd = isAdd === undefined ? true : isAdd;
  2073. // bind each handle
  2074. var bindMethod = isAdd ? 'addEventListener' : 'removeEventListener';
  2075. var touchAction = isAdd ? this._touchActionValue : '';
  2076. for ( var i=0; i < this.handles.length; i++ ) {
  2077. var handle = this.handles[i];
  2078. this._bindStartEvent( handle, isAdd );
  2079. handle[ bindMethod ]( 'click', this );
  2080. // touch-action: none to override browser touch gestures. metafizzy/flickity#540
  2081. if ( window.PointerEvent ) {
  2082. handle.style.touchAction = touchAction;
  2083. }
  2084. }
  2085. };
  2086. // prototype so it can be overwriteable by Flickity
  2087. proto._touchActionValue = 'none';
  2088. // ----- start event ----- //
  2089. /**
  2090. * pointer start
  2091. * @param {Event} event
  2092. * @param {Event or Touch} pointer
  2093. */
  2094. proto.pointerDown = function( event, pointer ) {
  2095. var isOkay = this.okayPointerDown( event );
  2096. if ( !isOkay ) {
  2097. return;
  2098. }
  2099. // track start event position
  2100. this.pointerDownPointer = pointer;
  2101. event.preventDefault();
  2102. this.pointerDownBlur();
  2103. // bind move and end events
  2104. this._bindPostStartEvents( event );
  2105. this.emitEvent( 'pointerDown', [ event, pointer ] );
  2106. };
  2107. // nodes that have text fields
  2108. var cursorNodes = {
  2109. TEXTAREA: true,
  2110. INPUT: true,
  2111. SELECT: true,
  2112. OPTION: true,
  2113. };
  2114. // input types that do not have text fields
  2115. var clickTypes = {
  2116. radio: true,
  2117. checkbox: true,
  2118. button: true,
  2119. submit: true,
  2120. image: true,
  2121. file: true,
  2122. };
  2123. // dismiss inputs with text fields. flickity#403, flickity#404
  2124. proto.okayPointerDown = function( event ) {
  2125. var isCursorNode = cursorNodes[ event.target.nodeName ];
  2126. var isClickType = clickTypes[ event.target.type ];
  2127. var isOkay = !isCursorNode || isClickType;
  2128. if ( !isOkay ) {
  2129. this._pointerReset();
  2130. }
  2131. return isOkay;
  2132. };
  2133. // kludge to blur previously focused input
  2134. proto.pointerDownBlur = function() {
  2135. var focused = document.activeElement;
  2136. // do not blur body for IE10, metafizzy/flickity#117
  2137. var canBlur = focused && focused.blur && focused != document.body;
  2138. if ( canBlur ) {
  2139. focused.blur();
  2140. }
  2141. };
  2142. // ----- move event ----- //
  2143. /**
  2144. * drag move
  2145. * @param {Event} event
  2146. * @param {Event or Touch} pointer
  2147. */
  2148. proto.pointerMove = function( event, pointer ) {
  2149. var moveVector = this._dragPointerMove( event, pointer );
  2150. this.emitEvent( 'pointerMove', [ event, pointer, moveVector ] );
  2151. this._dragMove( event, pointer, moveVector );
  2152. };
  2153. // base pointer move logic
  2154. proto._dragPointerMove = function( event, pointer ) {
  2155. var moveVector = {
  2156. x: pointer.pageX - this.pointerDownPointer.pageX,
  2157. y: pointer.pageY - this.pointerDownPointer.pageY
  2158. };
  2159. // start drag if pointer has moved far enough to start drag
  2160. if ( !this.isDragging && this.hasDragStarted( moveVector ) ) {
  2161. this._dragStart( event, pointer );
  2162. }
  2163. return moveVector;
  2164. };
  2165. // condition if pointer has moved far enough to start drag
  2166. proto.hasDragStarted = function( moveVector ) {
  2167. return Math.abs( moveVector.x ) > 3 || Math.abs( moveVector.y ) > 3;
  2168. };
  2169. // ----- end event ----- //
  2170. /**
  2171. * pointer up
  2172. * @param {Event} event
  2173. * @param {Event or Touch} pointer
  2174. */
  2175. proto.pointerUp = function( event, pointer ) {
  2176. this.emitEvent( 'pointerUp', [ event, pointer ] );
  2177. this._dragPointerUp( event, pointer );
  2178. };
  2179. proto._dragPointerUp = function( event, pointer ) {
  2180. if ( this.isDragging ) {
  2181. this._dragEnd( event, pointer );
  2182. } else {
  2183. // pointer didn't move enough for drag to start
  2184. this._staticClick( event, pointer );
  2185. }
  2186. };
  2187. // -------------------------- drag -------------------------- //
  2188. // dragStart
  2189. proto._dragStart = function( event, pointer ) {
  2190. this.isDragging = true;
  2191. // prevent clicks
  2192. this.isPreventingClicks = true;
  2193. this.dragStart( event, pointer );
  2194. };
  2195. proto.dragStart = function( event, pointer ) {
  2196. this.emitEvent( 'dragStart', [ event, pointer ] );
  2197. };
  2198. // dragMove
  2199. proto._dragMove = function( event, pointer, moveVector ) {
  2200. // do not drag if not dragging yet
  2201. if ( !this.isDragging ) {
  2202. return;
  2203. }
  2204. this.dragMove( event, pointer, moveVector );
  2205. };
  2206. proto.dragMove = function( event, pointer, moveVector ) {
  2207. event.preventDefault();
  2208. this.emitEvent( 'dragMove', [ event, pointer, moveVector ] );
  2209. };
  2210. // dragEnd
  2211. proto._dragEnd = function( event, pointer ) {
  2212. // set flags
  2213. this.isDragging = false;
  2214. // re-enable clicking async
  2215. setTimeout( function() {
  2216. delete this.isPreventingClicks;
  2217. }.bind( this ) );
  2218. this.dragEnd( event, pointer );
  2219. };
  2220. proto.dragEnd = function( event, pointer ) {
  2221. this.emitEvent( 'dragEnd', [ event, pointer ] );
  2222. };
  2223. // ----- onclick ----- //
  2224. // handle all clicks and prevent clicks when dragging
  2225. proto.onclick = function( event ) {
  2226. if ( this.isPreventingClicks ) {
  2227. event.preventDefault();
  2228. }
  2229. };
  2230. // ----- staticClick ----- //
  2231. // triggered after pointer down & up with no/tiny movement
  2232. proto._staticClick = function( event, pointer ) {
  2233. // ignore emulated mouse up clicks
  2234. if ( this.isIgnoringMouseUp && event.type == 'mouseup' ) {
  2235. return;
  2236. }
  2237. this.staticClick( event, pointer );
  2238. // set flag for emulated clicks 300ms after touchend
  2239. if ( event.type != 'mouseup' ) {
  2240. this.isIgnoringMouseUp = true;
  2241. // reset flag after 300ms
  2242. setTimeout( function() {
  2243. delete this.isIgnoringMouseUp;
  2244. }.bind( this ), 400 );
  2245. }
  2246. };
  2247. proto.staticClick = function( event, pointer ) {
  2248. this.emitEvent( 'staticClick', [ event, pointer ] );
  2249. };
  2250. // ----- utils ----- //
  2251. Unidragger.getPointerPoint = Unipointer.getPointerPoint;
  2252. // ----- ----- //
  2253. return Unidragger;
  2254. }));
  2255. // drag
  2256. ( function( window, factory ) {
  2257. // universal module definition
  2258. /* jshint strict: false */
  2259. if ( typeof define == 'function' && define.amd ) {
  2260. // AMD
  2261. define( 'flickity/js/drag',[
  2262. './flickity',
  2263. 'unidragger/unidragger',
  2264. 'fizzy-ui-utils/utils'
  2265. ], function( Flickity, Unidragger, utils ) {
  2266. return factory( window, Flickity, Unidragger, utils );
  2267. });
  2268. } else if ( typeof module == 'object' && module.exports ) {
  2269. // CommonJS
  2270. module.exports = factory(
  2271. window,
  2272. require('./flickity'),
  2273. require('unidragger'),
  2274. require('fizzy-ui-utils')
  2275. );
  2276. } else {
  2277. // browser global
  2278. window.Flickity = factory(
  2279. window,
  2280. window.Flickity,
  2281. window.Unidragger,
  2282. window.fizzyUIUtils
  2283. );
  2284. }
  2285. }( window, function factory( window, Flickity, Unidragger, utils ) {
  2286. // ----- defaults ----- //
  2287. utils.extend( Flickity.defaults, {
  2288. draggable: '>1',
  2289. dragThreshold: 3,
  2290. });
  2291. // ----- create ----- //
  2292. Flickity.createMethods.push('_createDrag');
  2293. // -------------------------- drag prototype -------------------------- //
  2294. var proto = Flickity.prototype;
  2295. utils.extend( proto, Unidragger.prototype );
  2296. proto._touchActionValue = 'pan-y';
  2297. // -------------------------- -------------------------- //
  2298. var isTouch = 'createTouch' in document;
  2299. var isTouchmoveScrollCanceled = false;
  2300. proto._createDrag = function() {
  2301. this.on( 'activate', this.onActivateDrag );
  2302. this.on( 'uiChange', this._uiChangeDrag );
  2303. this.on( 'deactivate', this.onDeactivateDrag );
  2304. this.on( 'cellChange', this.updateDraggable );
  2305. // TODO updateDraggable on resize? if groupCells & slides change
  2306. // HACK - add seemingly innocuous handler to fix iOS 10 scroll behavior
  2307. // #457, RubaXa/Sortable#973
  2308. if ( isTouch && !isTouchmoveScrollCanceled ) {
  2309. window.addEventListener( 'touchmove', function() {});
  2310. isTouchmoveScrollCanceled = true;
  2311. }
  2312. };
  2313. proto.onActivateDrag = function() {
  2314. this.handles = [ this.viewport ];
  2315. this.bindHandles();
  2316. this.updateDraggable();
  2317. };
  2318. proto.onDeactivateDrag = function() {
  2319. this.unbindHandles();
  2320. this.element.classList.remove('is-draggable');
  2321. };
  2322. proto.updateDraggable = function() {
  2323. // disable dragging if less than 2 slides. #278
  2324. if ( this.options.draggable == '>1' ) {
  2325. this.isDraggable = this.slides.length > 1;
  2326. } else {
  2327. this.isDraggable = this.options.draggable;
  2328. }
  2329. if ( this.isDraggable ) {
  2330. this.element.classList.add('is-draggable');
  2331. } else {
  2332. this.element.classList.remove('is-draggable');
  2333. }
  2334. };
  2335. // backwards compatibility
  2336. proto.bindDrag = function() {
  2337. this.options.draggable = true;
  2338. this.updateDraggable();
  2339. };
  2340. proto.unbindDrag = function() {
  2341. this.options.draggable = false;
  2342. this.updateDraggable();
  2343. };
  2344. proto._uiChangeDrag = function() {
  2345. delete this.isFreeScrolling;
  2346. };
  2347. // -------------------------- pointer events -------------------------- //
  2348. proto.pointerDown = function( event, pointer ) {
  2349. if ( !this.isDraggable ) {
  2350. this._pointerDownDefault( event, pointer );
  2351. return;
  2352. }
  2353. var isOkay = this.okayPointerDown( event );
  2354. if ( !isOkay ) {
  2355. return;
  2356. }
  2357. this._pointerDownPreventDefault( event );
  2358. this.pointerDownFocus( event );
  2359. // blur
  2360. if ( document.activeElement != this.element ) {
  2361. // do not blur if already focused
  2362. this.pointerDownBlur();
  2363. }
  2364. // stop if it was moving
  2365. this.dragX = this.x;
  2366. this.viewport.classList.add('is-pointer-down');
  2367. // track scrolling
  2368. this.pointerDownScroll = getScrollPosition();
  2369. window.addEventListener( 'scroll', this );
  2370. this._pointerDownDefault( event, pointer );
  2371. };
  2372. // default pointerDown logic, used for staticClick
  2373. proto._pointerDownDefault = function( event, pointer ) {
  2374. // track start event position
  2375. // Safari 9 overrides pageX and pageY. These values needs to be copied. #779
  2376. this.pointerDownPointer = {
  2377. pageX: pointer.pageX,
  2378. pageY: pointer.pageY,
  2379. };
  2380. // bind move and end events
  2381. this._bindPostStartEvents( event );
  2382. this.dispatchEvent( 'pointerDown', event, [ pointer ] );
  2383. };
  2384. var focusNodes = {
  2385. INPUT: true,
  2386. TEXTAREA: true,
  2387. SELECT: true,
  2388. };
  2389. proto.pointerDownFocus = function( event ) {
  2390. var isFocusNode = focusNodes[ event.target.nodeName ];
  2391. if ( !isFocusNode ) {
  2392. this.focus();
  2393. }
  2394. };
  2395. proto._pointerDownPreventDefault = function( event ) {
  2396. var isTouchStart = event.type == 'touchstart';
  2397. var isTouchPointer = event.pointerType == 'touch';
  2398. var isFocusNode = focusNodes[ event.target.nodeName ];
  2399. if ( !isTouchStart && !isTouchPointer && !isFocusNode ) {
  2400. event.preventDefault();
  2401. }
  2402. };
  2403. // ----- move ----- //
  2404. proto.hasDragStarted = function( moveVector ) {
  2405. return Math.abs( moveVector.x ) > this.options.dragThreshold;
  2406. };
  2407. // ----- up ----- //
  2408. proto.pointerUp = function( event, pointer ) {
  2409. delete this.isTouchScrolling;
  2410. this.viewport.classList.remove('is-pointer-down');
  2411. this.dispatchEvent( 'pointerUp', event, [ pointer ] );
  2412. this._dragPointerUp( event, pointer );
  2413. };
  2414. proto.pointerDone = function() {
  2415. window.removeEventListener( 'scroll', this );
  2416. delete this.pointerDownScroll;
  2417. };
  2418. // -------------------------- dragging -------------------------- //
  2419. proto.dragStart = function( event, pointer ) {
  2420. if ( !this.isDraggable ) {
  2421. return;
  2422. }
  2423. this.dragStartPosition = this.x;
  2424. this.startAnimation();
  2425. window.removeEventListener( 'scroll', this );
  2426. this.dispatchEvent( 'dragStart', event, [ pointer ] );
  2427. };
  2428. proto.pointerMove = function( event, pointer ) {
  2429. var moveVector = this._dragPointerMove( event, pointer );
  2430. this.dispatchEvent( 'pointerMove', event, [ pointer, moveVector ] );
  2431. this._dragMove( event, pointer, moveVector );
  2432. };
  2433. proto.dragMove = function( event, pointer, moveVector ) {
  2434. if ( !this.isDraggable ) {
  2435. return;
  2436. }
  2437. event.preventDefault();
  2438. this.previousDragX = this.dragX;
  2439. // reverse if right-to-left
  2440. var direction = this.options.rightToLeft ? -1 : 1;
  2441. if ( this.options.wrapAround ) {
  2442. // wrap around move. #589
  2443. moveVector.x = moveVector.x % this.slideableWidth;
  2444. }
  2445. var dragX = this.dragStartPosition + moveVector.x * direction;
  2446. if ( !this.options.wrapAround && this.slides.length ) {
  2447. // slow drag
  2448. var originBound = Math.max( -this.slides[0].target, this.dragStartPosition );
  2449. dragX = dragX > originBound ? ( dragX + originBound ) * 0.5 : dragX;
  2450. var endBound = Math.min( -this.getLastSlide().target, this.dragStartPosition );
  2451. dragX = dragX < endBound ? ( dragX + endBound ) * 0.5 : dragX;
  2452. }
  2453. this.dragX = dragX;
  2454. this.dragMoveTime = new Date();
  2455. this.dispatchEvent( 'dragMove', event, [ pointer, moveVector ] );
  2456. };
  2457. proto.dragEnd = function( event, pointer ) {
  2458. if ( !this.isDraggable ) {
  2459. return;
  2460. }
  2461. if ( this.options.freeScroll ) {
  2462. this.isFreeScrolling = true;
  2463. }
  2464. // set selectedIndex based on where flick will end up
  2465. var index = this.dragEndRestingSelect();
  2466. if ( this.options.freeScroll && !this.options.wrapAround ) {
  2467. // if free-scroll & not wrap around
  2468. // do not free-scroll if going outside of bounding slides
  2469. // so bounding slides can attract slider, and keep it in bounds
  2470. var restingX = this.getRestingPosition();
  2471. this.isFreeScrolling = -restingX > this.slides[0].target &&
  2472. -restingX < this.getLastSlide().target;
  2473. } else if ( !this.options.freeScroll && index == this.selectedIndex ) {
  2474. // boost selection if selected index has not changed
  2475. index += this.dragEndBoostSelect();
  2476. }
  2477. delete this.previousDragX;
  2478. // apply selection
  2479. // TODO refactor this, selecting here feels weird
  2480. // HACK, set flag so dragging stays in correct direction
  2481. this.isDragSelect = this.options.wrapAround;
  2482. this.select( index );
  2483. delete this.isDragSelect;
  2484. this.dispatchEvent( 'dragEnd', event, [ pointer ] );
  2485. };
  2486. proto.dragEndRestingSelect = function() {
  2487. var restingX = this.getRestingPosition();
  2488. // how far away from selected slide
  2489. var distance = Math.abs( this.getSlideDistance( -restingX, this.selectedIndex ) );
  2490. // get closet resting going up and going down
  2491. var positiveResting = this._getClosestResting( restingX, distance, 1 );
  2492. var negativeResting = this._getClosestResting( restingX, distance, -1 );
  2493. // use closer resting for wrap-around
  2494. var index = positiveResting.distance < negativeResting.distance ?
  2495. positiveResting.index : negativeResting.index;
  2496. return index;
  2497. };
  2498. /**
  2499. * given resting X and distance to selected cell
  2500. * get the distance and index of the closest cell
  2501. * @param {Number} restingX - estimated post-flick resting position
  2502. * @param {Number} distance - distance to selected cell
  2503. * @param {Integer} increment - +1 or -1, going up or down
  2504. * @returns {Object} - { distance: {Number}, index: {Integer} }
  2505. */
  2506. proto._getClosestResting = function( restingX, distance, increment ) {
  2507. var index = this.selectedIndex;
  2508. var minDistance = Infinity;
  2509. var condition = this.options.contain && !this.options.wrapAround ?
  2510. // if contain, keep going if distance is equal to minDistance
  2511. function( d, md ) { return d <= md; } : function( d, md ) { return d < md; };
  2512. while ( condition( distance, minDistance ) ) {
  2513. // measure distance to next cell
  2514. index += increment;
  2515. minDistance = distance;
  2516. distance = this.getSlideDistance( -restingX, index );
  2517. if ( distance === null ) {
  2518. break;
  2519. }
  2520. distance = Math.abs( distance );
  2521. }
  2522. return {
  2523. distance: minDistance,
  2524. // selected was previous index
  2525. index: index - increment
  2526. };
  2527. };
  2528. /**
  2529. * measure distance between x and a slide target
  2530. * @param {Number} x
  2531. * @param {Integer} index - slide index
  2532. */
  2533. proto.getSlideDistance = function( x, index ) {
  2534. var len = this.slides.length;
  2535. // wrap around if at least 2 slides
  2536. var isWrapAround = this.options.wrapAround && len > 1;
  2537. var slideIndex = isWrapAround ? utils.modulo( index, len ) : index;
  2538. var slide = this.slides[ slideIndex ];
  2539. if ( !slide ) {
  2540. return null;
  2541. }
  2542. // add distance for wrap-around slides
  2543. var wrap = isWrapAround ? this.slideableWidth * Math.floor( index / len ) : 0;
  2544. return x - ( slide.target + wrap );
  2545. };
  2546. proto.dragEndBoostSelect = function() {
  2547. // do not boost if no previousDragX or dragMoveTime
  2548. if ( this.previousDragX === undefined || !this.dragMoveTime ||
  2549. // or if drag was held for 100 ms
  2550. new Date() - this.dragMoveTime > 100 ) {
  2551. return 0;
  2552. }
  2553. var distance = this.getSlideDistance( -this.dragX, this.selectedIndex );
  2554. var delta = this.previousDragX - this.dragX;
  2555. if ( distance > 0 && delta > 0 ) {
  2556. // boost to next if moving towards the right, and positive velocity
  2557. return 1;
  2558. } else if ( distance < 0 && delta < 0 ) {
  2559. // boost to previous if moving towards the left, and negative velocity
  2560. return -1;
  2561. }
  2562. return 0;
  2563. };
  2564. // ----- staticClick ----- //
  2565. proto.staticClick = function( event, pointer ) {
  2566. // get clickedCell, if cell was clicked
  2567. var clickedCell = this.getParentCell( event.target );
  2568. var cellElem = clickedCell && clickedCell.element;
  2569. var cellIndex = clickedCell && this.cells.indexOf( clickedCell );
  2570. this.dispatchEvent( 'staticClick', event, [ pointer, cellElem, cellIndex ] );
  2571. };
  2572. // ----- scroll ----- //
  2573. proto.onscroll = function() {
  2574. var scroll = getScrollPosition();
  2575. var scrollMoveX = this.pointerDownScroll.x - scroll.x;
  2576. var scrollMoveY = this.pointerDownScroll.y - scroll.y;
  2577. // cancel click/tap if scroll is too much
  2578. if ( Math.abs( scrollMoveX ) > 3 || Math.abs( scrollMoveY ) > 3 ) {
  2579. this._pointerDone();
  2580. }
  2581. };
  2582. // ----- utils ----- //
  2583. function getScrollPosition() {
  2584. return {
  2585. x: window.pageXOffset,
  2586. y: window.pageYOffset
  2587. };
  2588. }
  2589. // ----- ----- //
  2590. return Flickity;
  2591. }));
  2592. // prev/next buttons
  2593. ( function( window, factory ) {
  2594. // universal module definition
  2595. /* jshint strict: false */
  2596. if ( typeof define == 'function' && define.amd ) {
  2597. // AMD
  2598. define( 'flickity/js/prev-next-button',[
  2599. './flickity',
  2600. 'unipointer/unipointer',
  2601. 'fizzy-ui-utils/utils'
  2602. ], function( Flickity, Unipointer, utils ) {
  2603. return factory( window, Flickity, Unipointer, utils );
  2604. });
  2605. } else if ( typeof module == 'object' && module.exports ) {
  2606. // CommonJS
  2607. module.exports = factory(
  2608. window,
  2609. require('./flickity'),
  2610. require('unipointer'),
  2611. require('fizzy-ui-utils')
  2612. );
  2613. } else {
  2614. // browser global
  2615. factory(
  2616. window,
  2617. window.Flickity,
  2618. window.Unipointer,
  2619. window.fizzyUIUtils
  2620. );
  2621. }
  2622. }( window, function factory( window, Flickity, Unipointer, utils ) {
  2623. 'use strict';
  2624. var svgURI = 'http://www.w3.org/2000/svg';
  2625. // -------------------------- PrevNextButton -------------------------- //
  2626. function PrevNextButton( direction, parent ) {
  2627. this.direction = direction;
  2628. this.parent = parent;
  2629. this._create();
  2630. }
  2631. PrevNextButton.prototype = Object.create( Unipointer.prototype );
  2632. PrevNextButton.prototype._create = function() {
  2633. // properties
  2634. this.isEnabled = true;
  2635. this.isPrevious = this.direction == -1;
  2636. var leftDirection = this.parent.options.rightToLeft ? 1 : -1;
  2637. this.isLeft = this.direction == leftDirection;
  2638. var element = this.element = document.createElement('button');
  2639. element.className = 'flickity-button flickity-prev-next-button';
  2640. element.className += this.isPrevious ? ' previous' : ' next';
  2641. // prevent button from submitting form http://stackoverflow.com/a/10836076/182183
  2642. element.setAttribute( 'type', 'button' );
  2643. // init as disabled
  2644. this.disable();
  2645. element.setAttribute( 'aria-label', this.isPrevious ? 'Previous' : 'Next' );
  2646. // create arrow
  2647. var svg = this.createSVG();
  2648. element.appendChild( svg );
  2649. // events
  2650. this.parent.on( 'select', this.update.bind( this ) );
  2651. this.on( 'pointerDown', this.parent.childUIPointerDown.bind( this.parent ) );
  2652. };
  2653. PrevNextButton.prototype.activate = function() {
  2654. this.bindStartEvent( this.element );
  2655. this.element.addEventListener( 'click', this );
  2656. // add to DOM
  2657. this.parent.element.appendChild( this.element );
  2658. };
  2659. PrevNextButton.prototype.deactivate = function() {
  2660. // remove from DOM
  2661. this.parent.element.removeChild( this.element );
  2662. // click events
  2663. this.unbindStartEvent( this.element );
  2664. this.element.removeEventListener( 'click', this );
  2665. };
  2666. PrevNextButton.prototype.createSVG = function() {
  2667. var svg = document.createElementNS( svgURI, 'svg');
  2668. svg.setAttribute( 'class', 'flickity-button-icon' );
  2669. svg.setAttribute( 'viewBox', '0 0 100 100' );
  2670. var path = document.createElementNS( svgURI, 'path');
  2671. var pathMovements = getArrowMovements( this.parent.options.arrowShape );
  2672. path.setAttribute( 'd', pathMovements );
  2673. path.setAttribute( 'class', 'arrow' );
  2674. // rotate arrow
  2675. if ( !this.isLeft ) {
  2676. path.setAttribute( 'transform', 'translate(100, 100) rotate(180) ' );
  2677. }
  2678. svg.appendChild( path );
  2679. return svg;
  2680. };
  2681. // get SVG path movmement
  2682. function getArrowMovements( shape ) {
  2683. // use shape as movement if string
  2684. if ( typeof shape == 'string' ) {
  2685. return shape;
  2686. }
  2687. // create movement string
  2688. return 'M ' + shape.x0 + ',50' +
  2689. ' L ' + shape.x1 + ',' + ( shape.y1 + 50 ) +
  2690. ' L ' + shape.x2 + ',' + ( shape.y2 + 50 ) +
  2691. ' L ' + shape.x3 + ',50 ' +
  2692. ' L ' + shape.x2 + ',' + ( 50 - shape.y2 ) +
  2693. ' L ' + shape.x1 + ',' + ( 50 - shape.y1 ) +
  2694. ' Z';
  2695. }
  2696. PrevNextButton.prototype.handleEvent = utils.handleEvent;
  2697. PrevNextButton.prototype.onclick = function() {
  2698. if ( !this.isEnabled ) {
  2699. return;
  2700. }
  2701. this.parent.uiChange();
  2702. var method = this.isPrevious ? 'previous' : 'next';
  2703. this.parent[ method ]();
  2704. };
  2705. // ----- ----- //
  2706. PrevNextButton.prototype.enable = function() {
  2707. if ( this.isEnabled ) {
  2708. return;
  2709. }
  2710. this.element.disabled = false;
  2711. this.isEnabled = true;
  2712. };
  2713. PrevNextButton.prototype.disable = function() {
  2714. if ( !this.isEnabled ) {
  2715. return;
  2716. }
  2717. this.element.disabled = true;
  2718. this.isEnabled = false;
  2719. };
  2720. PrevNextButton.prototype.update = function() {
  2721. // index of first or last slide, if previous or next
  2722. var slides = this.parent.slides;
  2723. // enable is wrapAround and at least 2 slides
  2724. if ( this.parent.options.wrapAround && slides.length > 1 ) {
  2725. this.enable();
  2726. return;
  2727. }
  2728. var lastIndex = slides.length ? slides.length - 1 : 0;
  2729. var boundIndex = this.isPrevious ? 0 : lastIndex;
  2730. var method = this.parent.selectedIndex == boundIndex ? 'disable' : 'enable';
  2731. this[ method ]();
  2732. };
  2733. PrevNextButton.prototype.destroy = function() {
  2734. this.deactivate();
  2735. this.allOff();
  2736. };
  2737. // -------------------------- Flickity prototype -------------------------- //
  2738. utils.extend( Flickity.defaults, {
  2739. prevNextButtons: true,
  2740. arrowShape: {
  2741. x0: 10,
  2742. x1: 60, y1: 50,
  2743. x2: 70, y2: 40,
  2744. x3: 30
  2745. }
  2746. });
  2747. Flickity.createMethods.push('_createPrevNextButtons');
  2748. var proto = Flickity.prototype;
  2749. proto._createPrevNextButtons = function() {
  2750. if ( !this.options.prevNextButtons ) {
  2751. return;
  2752. }
  2753. this.prevButton = new PrevNextButton( -1, this );
  2754. this.nextButton = new PrevNextButton( 1, this );
  2755. this.on( 'activate', this.activatePrevNextButtons );
  2756. };
  2757. proto.activatePrevNextButtons = function() {
  2758. this.prevButton.activate();
  2759. this.nextButton.activate();
  2760. this.on( 'deactivate', this.deactivatePrevNextButtons );
  2761. };
  2762. proto.deactivatePrevNextButtons = function() {
  2763. this.prevButton.deactivate();
  2764. this.nextButton.deactivate();
  2765. this.off( 'deactivate', this.deactivatePrevNextButtons );
  2766. };
  2767. // -------------------------- -------------------------- //
  2768. Flickity.PrevNextButton = PrevNextButton;
  2769. return Flickity;
  2770. }));
  2771. // page dots
  2772. ( function( window, factory ) {
  2773. // universal module definition
  2774. /* jshint strict: false */
  2775. if ( typeof define == 'function' && define.amd ) {
  2776. // AMD
  2777. define( 'flickity/js/page-dots',[
  2778. './flickity',
  2779. 'unipointer/unipointer',
  2780. 'fizzy-ui-utils/utils'
  2781. ], function( Flickity, Unipointer, utils ) {
  2782. return factory( window, Flickity, Unipointer, utils );
  2783. });
  2784. } else if ( typeof module == 'object' && module.exports ) {
  2785. // CommonJS
  2786. module.exports = factory(
  2787. window,
  2788. require('./flickity'),
  2789. require('unipointer'),
  2790. require('fizzy-ui-utils')
  2791. );
  2792. } else {
  2793. // browser global
  2794. factory(
  2795. window,
  2796. window.Flickity,
  2797. window.Unipointer,
  2798. window.fizzyUIUtils
  2799. );
  2800. }
  2801. }( window, function factory( window, Flickity, Unipointer, utils ) {
  2802. // -------------------------- PageDots -------------------------- //
  2803. function PageDots( parent ) {
  2804. this.parent = parent;
  2805. this._create();
  2806. }
  2807. PageDots.prototype = Object.create( Unipointer.prototype );
  2808. PageDots.prototype._create = function() {
  2809. // create holder element
  2810. this.holder = document.createElement('ol');
  2811. this.holder.className = 'flickity-page-dots';
  2812. // create dots, array of elements
  2813. this.dots = [];
  2814. // events
  2815. this.handleClick = this.onClick.bind( this );
  2816. this.on( 'pointerDown', this.parent.childUIPointerDown.bind( this.parent ) );
  2817. };
  2818. PageDots.prototype.activate = function() {
  2819. this.setDots();
  2820. this.holder.addEventListener( 'click', this.handleClick );
  2821. this.bindStartEvent( this.holder );
  2822. // add to DOM
  2823. this.parent.element.appendChild( this.holder );
  2824. };
  2825. PageDots.prototype.deactivate = function() {
  2826. this.holder.removeEventListener( 'click', this.handleClick );
  2827. this.unbindStartEvent( this.holder );
  2828. // remove from DOM
  2829. this.parent.element.removeChild( this.holder );
  2830. };
  2831. PageDots.prototype.setDots = function() {
  2832. // get difference between number of slides and number of dots
  2833. var delta = this.parent.slides.length - this.dots.length;
  2834. if ( delta > 0 ) {
  2835. this.addDots( delta );
  2836. } else if ( delta < 0 ) {
  2837. this.removeDots( -delta );
  2838. }
  2839. };
  2840. PageDots.prototype.addDots = function( count ) {
  2841. var fragment = document.createDocumentFragment();
  2842. var newDots = [];
  2843. var length = this.dots.length;
  2844. var max = length + count;
  2845. for ( var i = length; i < max; i++ ) {
  2846. var dot = document.createElement('li');
  2847. dot.className = 'dot';
  2848. dot.setAttribute( 'aria-label', 'Page dot ' + ( i + 1 ) );
  2849. fragment.appendChild( dot );
  2850. newDots.push( dot );
  2851. }
  2852. this.holder.appendChild( fragment );
  2853. this.dots = this.dots.concat( newDots );
  2854. };
  2855. PageDots.prototype.removeDots = function( count ) {
  2856. // remove from this.dots collection
  2857. var removeDots = this.dots.splice( this.dots.length - count, count );
  2858. // remove from DOM
  2859. removeDots.forEach( function( dot ) {
  2860. this.holder.removeChild( dot );
  2861. }, this );
  2862. };
  2863. PageDots.prototype.updateSelected = function() {
  2864. // remove selected class on previous
  2865. if ( this.selectedDot ) {
  2866. this.selectedDot.className = 'dot';
  2867. this.selectedDot.removeAttribute('aria-current');
  2868. }
  2869. // don't proceed if no dots
  2870. if ( !this.dots.length ) {
  2871. return;
  2872. }
  2873. this.selectedDot = this.dots[ this.parent.selectedIndex ];
  2874. this.selectedDot.className = 'dot is-selected';
  2875. this.selectedDot.setAttribute( 'aria-current', 'step' );
  2876. };
  2877. PageDots.prototype.onTap = // old method name, backwards-compatible
  2878. PageDots.prototype.onClick = function( event ) {
  2879. var target = event.target;
  2880. // only care about dot clicks
  2881. if ( target.nodeName != 'LI' ) {
  2882. return;
  2883. }
  2884. this.parent.uiChange();
  2885. var index = this.dots.indexOf( target );
  2886. this.parent.select( index );
  2887. };
  2888. PageDots.prototype.destroy = function() {
  2889. this.deactivate();
  2890. this.allOff();
  2891. };
  2892. Flickity.PageDots = PageDots;
  2893. // -------------------------- Flickity -------------------------- //
  2894. utils.extend( Flickity.defaults, {
  2895. pageDots: true
  2896. });
  2897. Flickity.createMethods.push('_createPageDots');
  2898. var proto = Flickity.prototype;
  2899. proto._createPageDots = function() {
  2900. if ( !this.options.pageDots ) {
  2901. return;
  2902. }
  2903. this.pageDots = new PageDots( this );
  2904. // events
  2905. this.on( 'activate', this.activatePageDots );
  2906. this.on( 'select', this.updateSelectedPageDots );
  2907. this.on( 'cellChange', this.updatePageDots );
  2908. this.on( 'resize', this.updatePageDots );
  2909. this.on( 'deactivate', this.deactivatePageDots );
  2910. };
  2911. proto.activatePageDots = function() {
  2912. this.pageDots.activate();
  2913. };
  2914. proto.updateSelectedPageDots = function() {
  2915. this.pageDots.updateSelected();
  2916. };
  2917. proto.updatePageDots = function() {
  2918. this.pageDots.setDots();
  2919. };
  2920. proto.deactivatePageDots = function() {
  2921. this.pageDots.deactivate();
  2922. };
  2923. // ----- ----- //
  2924. Flickity.PageDots = PageDots;
  2925. return Flickity;
  2926. }));
  2927. // player & autoPlay
  2928. ( function( window, factory ) {
  2929. // universal module definition
  2930. /* jshint strict: false */
  2931. if ( typeof define == 'function' && define.amd ) {
  2932. // AMD
  2933. define( 'flickity/js/player',[
  2934. 'ev-emitter/ev-emitter',
  2935. 'fizzy-ui-utils/utils',
  2936. './flickity'
  2937. ], function( EvEmitter, utils, Flickity ) {
  2938. return factory( EvEmitter, utils, Flickity );
  2939. });
  2940. } else if ( typeof module == 'object' && module.exports ) {
  2941. // CommonJS
  2942. module.exports = factory(
  2943. require('ev-emitter'),
  2944. require('fizzy-ui-utils'),
  2945. require('./flickity')
  2946. );
  2947. } else {
  2948. // browser global
  2949. factory(
  2950. window.EvEmitter,
  2951. window.fizzyUIUtils,
  2952. window.Flickity
  2953. );
  2954. }
  2955. }( window, function factory( EvEmitter, utils, Flickity ) {
  2956. // -------------------------- Player -------------------------- //
  2957. function Player( parent ) {
  2958. this.parent = parent;
  2959. this.state = 'stopped';
  2960. // visibility change event handler
  2961. this.onVisibilityChange = this.visibilityChange.bind( this );
  2962. this.onVisibilityPlay = this.visibilityPlay.bind( this );
  2963. }
  2964. Player.prototype = Object.create( EvEmitter.prototype );
  2965. // start play
  2966. Player.prototype.play = function() {
  2967. if ( this.state == 'playing' ) {
  2968. return;
  2969. }
  2970. // do not play if page is hidden, start playing when page is visible
  2971. var isPageHidden = document.hidden;
  2972. if ( isPageHidden ) {
  2973. document.addEventListener( 'visibilitychange', this.onVisibilityPlay );
  2974. return;
  2975. }
  2976. this.state = 'playing';
  2977. // listen to visibility change
  2978. document.addEventListener( 'visibilitychange', this.onVisibilityChange );
  2979. // start ticking
  2980. this.tick();
  2981. };
  2982. Player.prototype.tick = function() {
  2983. // do not tick if not playing
  2984. if ( this.state != 'playing' ) {
  2985. return;
  2986. }
  2987. var time = this.parent.options.autoPlay;
  2988. // default to 3 seconds
  2989. time = typeof time == 'number' ? time : 3000;
  2990. var _this = this;
  2991. // HACK: reset ticks if stopped and started within interval
  2992. this.clear();
  2993. this.timeout = setTimeout( function() {
  2994. _this.parent.next( true );
  2995. _this.tick();
  2996. }, time );
  2997. };
  2998. Player.prototype.stop = function() {
  2999. this.state = 'stopped';
  3000. this.clear();
  3001. // remove visibility change event
  3002. document.removeEventListener( 'visibilitychange', this.onVisibilityChange );
  3003. };
  3004. Player.prototype.clear = function() {
  3005. clearTimeout( this.timeout );
  3006. };
  3007. Player.prototype.pause = function() {
  3008. if ( this.state == 'playing' ) {
  3009. this.state = 'paused';
  3010. this.clear();
  3011. }
  3012. };
  3013. Player.prototype.unpause = function() {
  3014. // re-start play if paused
  3015. if ( this.state == 'paused' ) {
  3016. this.play();
  3017. }
  3018. };
  3019. // pause if page visibility is hidden, unpause if visible
  3020. Player.prototype.visibilityChange = function() {
  3021. var isPageHidden = document.hidden;
  3022. this[ isPageHidden ? 'pause' : 'unpause' ]();
  3023. };
  3024. Player.prototype.visibilityPlay = function() {
  3025. this.play();
  3026. document.removeEventListener( 'visibilitychange', this.onVisibilityPlay );
  3027. };
  3028. // -------------------------- Flickity -------------------------- //
  3029. utils.extend( Flickity.defaults, {
  3030. pauseAutoPlayOnHover: true
  3031. });
  3032. Flickity.createMethods.push('_createPlayer');
  3033. var proto = Flickity.prototype;
  3034. proto._createPlayer = function() {
  3035. this.player = new Player( this );
  3036. this.on( 'activate', this.activatePlayer );
  3037. this.on( 'uiChange', this.stopPlayer );
  3038. this.on( 'pointerDown', this.stopPlayer );
  3039. this.on( 'deactivate', this.deactivatePlayer );
  3040. };
  3041. proto.activatePlayer = function() {
  3042. if ( !this.options.autoPlay ) {
  3043. return;
  3044. }
  3045. this.player.play();
  3046. this.element.addEventListener( 'mouseenter', this );
  3047. };
  3048. // Player API, don't hate the ... thanks I know where the door is
  3049. proto.playPlayer = function() {
  3050. this.player.play();
  3051. };
  3052. proto.stopPlayer = function() {
  3053. this.player.stop();
  3054. };
  3055. proto.pausePlayer = function() {
  3056. this.player.pause();
  3057. };
  3058. proto.unpausePlayer = function() {
  3059. this.player.unpause();
  3060. };
  3061. proto.deactivatePlayer = function() {
  3062. this.player.stop();
  3063. this.element.removeEventListener( 'mouseenter', this );
  3064. };
  3065. // ----- mouseenter/leave ----- //
  3066. // pause auto-play on hover
  3067. proto.onmouseenter = function() {
  3068. if ( !this.options.pauseAutoPlayOnHover ) {
  3069. return;
  3070. }
  3071. this.player.pause();
  3072. this.element.addEventListener( 'mouseleave', this );
  3073. };
  3074. // resume auto-play on hover off
  3075. proto.onmouseleave = function() {
  3076. this.player.unpause();
  3077. this.element.removeEventListener( 'mouseleave', this );
  3078. };
  3079. // ----- ----- //
  3080. Flickity.Player = Player;
  3081. return Flickity;
  3082. }));
  3083. // add, remove cell
  3084. ( function( window, factory ) {
  3085. // universal module definition
  3086. /* jshint strict: false */
  3087. if ( typeof define == 'function' && define.amd ) {
  3088. // AMD
  3089. define( 'flickity/js/add-remove-cell',[
  3090. './flickity',
  3091. 'fizzy-ui-utils/utils'
  3092. ], function( Flickity, utils ) {
  3093. return factory( window, Flickity, utils );
  3094. });
  3095. } else if ( typeof module == 'object' && module.exports ) {
  3096. // CommonJS
  3097. module.exports = factory(
  3098. window,
  3099. require('./flickity'),
  3100. require('fizzy-ui-utils')
  3101. );
  3102. } else {
  3103. // browser global
  3104. factory(
  3105. window,
  3106. window.Flickity,
  3107. window.fizzyUIUtils
  3108. );
  3109. }
  3110. }( window, function factory( window, Flickity, utils ) {
  3111. // append cells to a document fragment
  3112. function getCellsFragment( cells ) {
  3113. var fragment = document.createDocumentFragment();
  3114. cells.forEach( function( cell ) {
  3115. fragment.appendChild( cell.element );
  3116. });
  3117. return fragment;
  3118. }
  3119. // -------------------------- add/remove cell prototype -------------------------- //
  3120. var proto = Flickity.prototype;
  3121. /**
  3122. * Insert, prepend, or append cells
  3123. * @param {Element, Array, NodeList} elems
  3124. * @param {Integer} index
  3125. */
  3126. proto.insert = function( elems, index ) {
  3127. var cells = this._makeCells( elems );
  3128. if ( !cells || !cells.length ) {
  3129. return;
  3130. }
  3131. var len = this.cells.length;
  3132. // default to append
  3133. index = index === undefined ? len : index;
  3134. // add cells with document fragment
  3135. var fragment = getCellsFragment( cells );
  3136. // append to slider
  3137. var isAppend = index == len;
  3138. if ( isAppend ) {
  3139. this.slider.appendChild( fragment );
  3140. } else {
  3141. var insertCellElement = this.cells[ index ].element;
  3142. this.slider.insertBefore( fragment, insertCellElement );
  3143. }
  3144. // add to this.cells
  3145. if ( index === 0 ) {
  3146. // prepend, add to start
  3147. this.cells = cells.concat( this.cells );
  3148. } else if ( isAppend ) {
  3149. // append, add to end
  3150. this.cells = this.cells.concat( cells );
  3151. } else {
  3152. // insert in this.cells
  3153. var endCells = this.cells.splice( index, len - index );
  3154. this.cells = this.cells.concat( cells ).concat( endCells );
  3155. }
  3156. this._sizeCells( cells );
  3157. this.cellChange( index, true );
  3158. };
  3159. proto.append = function( elems ) {
  3160. this.insert( elems, this.cells.length );
  3161. };
  3162. proto.prepend = function( elems ) {
  3163. this.insert( elems, 0 );
  3164. };
  3165. /**
  3166. * Remove cells
  3167. * @param {Element, Array, NodeList} elems
  3168. */
  3169. proto.remove = function( elems ) {
  3170. var cells = this.getCells( elems );
  3171. if ( !cells || !cells.length ) {
  3172. return;
  3173. }
  3174. var minCellIndex = this.cells.length - 1;
  3175. // remove cells from collection & DOM
  3176. cells.forEach( function( cell ) {
  3177. cell.remove();
  3178. var index = this.cells.indexOf( cell );
  3179. minCellIndex = Math.min( index, minCellIndex );
  3180. utils.removeFrom( this.cells, cell );
  3181. }, this );
  3182. this.cellChange( minCellIndex, true );
  3183. };
  3184. /**
  3185. * logic to be run after a cell's size changes
  3186. * @param {Element} elem - cell's element
  3187. */
  3188. proto.cellSizeChange = function( elem ) {
  3189. var cell = this.getCell( elem );
  3190. if ( !cell ) {
  3191. return;
  3192. }
  3193. cell.getSize();
  3194. var index = this.cells.indexOf( cell );
  3195. this.cellChange( index );
  3196. };
  3197. /**
  3198. * logic any time a cell is changed: added, removed, or size changed
  3199. * @param {Integer} changedCellIndex - index of the changed cell, optional
  3200. */
  3201. proto.cellChange = function( changedCellIndex, isPositioningSlider ) {
  3202. var prevSelectedElem = this.selectedElement;
  3203. this._positionCells( changedCellIndex );
  3204. this._getWrapShiftCells();
  3205. this.setGallerySize();
  3206. // update selectedIndex
  3207. // try to maintain position & select previous selected element
  3208. var cell = this.getCell( prevSelectedElem );
  3209. if ( cell ) {
  3210. this.selectedIndex = this.getCellSlideIndex( cell );
  3211. }
  3212. this.selectedIndex = Math.min( this.slides.length - 1, this.selectedIndex );
  3213. this.emitEvent( 'cellChange', [ changedCellIndex ] );
  3214. // position slider
  3215. this.select( this.selectedIndex );
  3216. // do not position slider after lazy load
  3217. if ( isPositioningSlider ) {
  3218. this.positionSliderAtSelected();
  3219. }
  3220. };
  3221. // ----- ----- //
  3222. return Flickity;
  3223. }));
  3224. // lazyload
  3225. ( function( window, factory ) {
  3226. // universal module definition
  3227. /* jshint strict: false */
  3228. if ( typeof define == 'function' && define.amd ) {
  3229. // AMD
  3230. define( 'flickity/js/lazyload',[
  3231. './flickity',
  3232. 'fizzy-ui-utils/utils'
  3233. ], function( Flickity, utils ) {
  3234. return factory( window, Flickity, utils );
  3235. });
  3236. } else if ( typeof module == 'object' && module.exports ) {
  3237. // CommonJS
  3238. module.exports = factory(
  3239. window,
  3240. require('./flickity'),
  3241. require('fizzy-ui-utils')
  3242. );
  3243. } else {
  3244. // browser global
  3245. factory(
  3246. window,
  3247. window.Flickity,
  3248. window.fizzyUIUtils
  3249. );
  3250. }
  3251. }( window, function factory( window, Flickity, utils ) {
  3252. 'use strict';
  3253. Flickity.createMethods.push('_createLazyload');
  3254. var proto = Flickity.prototype;
  3255. proto._createLazyload = function() {
  3256. this.on( 'select', this.lazyLoad );
  3257. };
  3258. proto.lazyLoad = function() {
  3259. var lazyLoad = this.options.lazyLoad;
  3260. if ( !lazyLoad ) {
  3261. return;
  3262. }
  3263. // get adjacent cells, use lazyLoad option for adjacent count
  3264. var adjCount = typeof lazyLoad == 'number' ? lazyLoad : 0;
  3265. var cellElems = this.getAdjacentCellElements( adjCount );
  3266. // get lazy images in those cells
  3267. var lazyImages = [];
  3268. cellElems.forEach( function( cellElem ) {
  3269. var lazyCellImages = getCellLazyImages( cellElem );
  3270. lazyImages = lazyImages.concat( lazyCellImages );
  3271. });
  3272. // load lazy images
  3273. lazyImages.forEach( function( img ) {
  3274. new LazyLoader( img, this );
  3275. }, this );
  3276. };
  3277. function getCellLazyImages( cellElem ) {
  3278. // check if cell element is lazy image
  3279. if ( cellElem.nodeName == 'IMG' ) {
  3280. var lazyloadAttr = cellElem.getAttribute('data-flickity-lazyload');
  3281. var srcAttr = cellElem.getAttribute('data-flickity-lazyload-src');
  3282. var srcsetAttr = cellElem.getAttribute('data-flickity-lazyload-srcset');
  3283. if ( lazyloadAttr || srcAttr || srcsetAttr ) {
  3284. return [ cellElem ];
  3285. }
  3286. }
  3287. // select lazy images in cell
  3288. var lazySelector = 'img[data-flickity-lazyload], ' +
  3289. 'img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]';
  3290. var imgs = cellElem.querySelectorAll( lazySelector );
  3291. return utils.makeArray( imgs );
  3292. }
  3293. // -------------------------- LazyLoader -------------------------- //
  3294. /**
  3295. * class to handle loading images
  3296. */
  3297. function LazyLoader( img, flickity ) {
  3298. this.img = img;
  3299. this.flickity = flickity;
  3300. this.load();
  3301. }
  3302. LazyLoader.prototype.handleEvent = utils.handleEvent;
  3303. LazyLoader.prototype.load = function() {
  3304. this.img.addEventListener( 'load', this );
  3305. this.img.addEventListener( 'error', this );
  3306. // get src & srcset
  3307. var src = this.img.getAttribute('data-flickity-lazyload') ||
  3308. this.img.getAttribute('data-flickity-lazyload-src');
  3309. var srcset = this.img.getAttribute('data-flickity-lazyload-srcset');
  3310. // set src & serset
  3311. this.img.src = src;
  3312. if ( srcset ) {
  3313. this.img.setAttribute( 'srcset', srcset );
  3314. }
  3315. // remove attr
  3316. this.img.removeAttribute('data-flickity-lazyload');
  3317. this.img.removeAttribute('data-flickity-lazyload-src');
  3318. this.img.removeAttribute('data-flickity-lazyload-srcset');
  3319. };
  3320. LazyLoader.prototype.onload = function( event ) {
  3321. this.complete( event, 'flickity-lazyloaded' );
  3322. };
  3323. LazyLoader.prototype.onerror = function( event ) {
  3324. this.complete( event, 'flickity-lazyerror' );
  3325. };
  3326. LazyLoader.prototype.complete = function( event, className ) {
  3327. // unbind events
  3328. this.img.removeEventListener( 'load', this );
  3329. this.img.removeEventListener( 'error', this );
  3330. var cell = this.flickity.getParentCell( this.img );
  3331. var cellElem = cell && cell.element;
  3332. this.flickity.cellSizeChange( cellElem );
  3333. this.img.classList.add( className );
  3334. this.flickity.dispatchEvent( 'lazyLoad', event, cellElem );
  3335. };
  3336. // ----- ----- //
  3337. Flickity.LazyLoader = LazyLoader;
  3338. return Flickity;
  3339. }));
  3340. /*!
  3341. * Flickity v2.2.1
  3342. * Touch, responsive, flickable carousels
  3343. *
  3344. * Licensed GPLv3 for open source use
  3345. * or Flickity Commercial License for commercial use
  3346. *
  3347. * https://flickity.metafizzy.co
  3348. * Copyright 2015-2019 Metafizzy
  3349. */
  3350. ( function( window, factory ) {
  3351. // universal module definition
  3352. /* jshint strict: false */
  3353. if ( typeof define == 'function' && define.amd ) {
  3354. // AMD
  3355. define( 'flickity/js/index',[
  3356. './flickity',
  3357. './drag',
  3358. './prev-next-button',
  3359. './page-dots',
  3360. './player',
  3361. './add-remove-cell',
  3362. './lazyload'
  3363. ], factory );
  3364. } else if ( typeof module == 'object' && module.exports ) {
  3365. // CommonJS
  3366. module.exports = factory(
  3367. require('./flickity'),
  3368. require('./drag'),
  3369. require('./prev-next-button'),
  3370. require('./page-dots'),
  3371. require('./player'),
  3372. require('./add-remove-cell'),
  3373. require('./lazyload')
  3374. );
  3375. }
  3376. })( window, function factory( Flickity ) {
  3377. /*jshint strict: false*/
  3378. return Flickity;
  3379. });
  3380. /*!
  3381. * Flickity asNavFor v2.0.2
  3382. * enable asNavFor for Flickity
  3383. */
  3384. /*jshint browser: true, undef: true, unused: true, strict: true*/
  3385. ( function( window, factory ) {
  3386. // universal module definition
  3387. /*jshint strict: false */ /*globals define, module, require */
  3388. if ( typeof define == 'function' && define.amd ) {
  3389. // AMD
  3390. define( 'flickity-as-nav-for/as-nav-for',[
  3391. 'flickity/js/index',
  3392. 'fizzy-ui-utils/utils'
  3393. ], factory );
  3394. } else if ( typeof module == 'object' && module.exports ) {
  3395. // CommonJS
  3396. module.exports = factory(
  3397. require('flickity'),
  3398. require('fizzy-ui-utils')
  3399. );
  3400. } else {
  3401. // browser global
  3402. window.Flickity = factory(
  3403. window.Flickity,
  3404. window.fizzyUIUtils
  3405. );
  3406. }
  3407. }( window, function factory( Flickity, utils ) {
  3408. // -------------------------- asNavFor prototype -------------------------- //
  3409. // Flickity.defaults.asNavFor = null;
  3410. Flickity.createMethods.push('_createAsNavFor');
  3411. var proto = Flickity.prototype;
  3412. proto._createAsNavFor = function() {
  3413. this.on( 'activate', this.activateAsNavFor );
  3414. this.on( 'deactivate', this.deactivateAsNavFor );
  3415. this.on( 'destroy', this.destroyAsNavFor );
  3416. var asNavForOption = this.options.asNavFor;
  3417. if ( !asNavForOption ) {
  3418. return;
  3419. }
  3420. // HACK do async, give time for other flickity to be initalized
  3421. var _this = this;
  3422. setTimeout( function initNavCompanion() {
  3423. _this.setNavCompanion( asNavForOption );
  3424. });
  3425. };
  3426. proto.setNavCompanion = function( elem ) {
  3427. elem = utils.getQueryElement( elem );
  3428. var companion = Flickity.data( elem );
  3429. // stop if no companion or companion is self
  3430. if ( !companion || companion == this ) {
  3431. return;
  3432. }
  3433. this.navCompanion = companion;
  3434. // companion select
  3435. var _this = this;
  3436. this.onNavCompanionSelect = function() {
  3437. _this.navCompanionSelect();
  3438. };
  3439. companion.on( 'select', this.onNavCompanionSelect );
  3440. // click
  3441. this.on( 'staticClick', this.onNavStaticClick );
  3442. this.navCompanionSelect( true );
  3443. };
  3444. proto.navCompanionSelect = function( isInstant ) {
  3445. // wait for companion & selectedCells first. #8
  3446. var companionCells = this.navCompanion && this.navCompanion.selectedCells;
  3447. if ( !companionCells ) {
  3448. return;
  3449. }
  3450. // select slide that matches first cell of slide
  3451. var selectedCell = companionCells[0];
  3452. var firstIndex = this.navCompanion.cells.indexOf( selectedCell );
  3453. var lastIndex = firstIndex + companionCells.length - 1;
  3454. var selectIndex = Math.floor( lerp( firstIndex, lastIndex,
  3455. this.navCompanion.cellAlign ) );
  3456. this.selectCell( selectIndex, false, isInstant );
  3457. // set nav selected class
  3458. this.removeNavSelectedElements();
  3459. // stop if companion has more cells than this one
  3460. if ( selectIndex >= this.cells.length ) {
  3461. return;
  3462. }
  3463. var selectedCells = this.cells.slice( firstIndex, lastIndex + 1 );
  3464. this.navSelectedElements = selectedCells.map( function( cell ) {
  3465. return cell.element;
  3466. });
  3467. this.changeNavSelectedClass('add');
  3468. };
  3469. function lerp( a, b, t ) {
  3470. return ( b - a ) * t + a;
  3471. }
  3472. proto.changeNavSelectedClass = function( method ) {
  3473. this.navSelectedElements.forEach( function( navElem ) {
  3474. navElem.classList[ method ]('is-nav-selected');
  3475. });
  3476. };
  3477. proto.activateAsNavFor = function() {
  3478. this.navCompanionSelect( true );
  3479. };
  3480. proto.removeNavSelectedElements = function() {
  3481. if ( !this.navSelectedElements ) {
  3482. return;
  3483. }
  3484. this.changeNavSelectedClass('remove');
  3485. delete this.navSelectedElements;
  3486. };
  3487. proto.onNavStaticClick = function( event, pointer, cellElement, cellIndex ) {
  3488. if ( typeof cellIndex == 'number' ) {
  3489. this.navCompanion.selectCell( cellIndex );
  3490. }
  3491. };
  3492. proto.deactivateAsNavFor = function() {
  3493. this.removeNavSelectedElements();
  3494. };
  3495. proto.destroyAsNavFor = function() {
  3496. if ( !this.navCompanion ) {
  3497. return;
  3498. }
  3499. this.navCompanion.off( 'select', this.onNavCompanionSelect );
  3500. this.off( 'staticClick', this.onNavStaticClick );
  3501. delete this.navCompanion;
  3502. };
  3503. // ----- ----- //
  3504. return Flickity;
  3505. }));
  3506. /*!
  3507. * imagesLoaded v4.1.4
  3508. * JavaScript is all like "You images are done yet or what?"
  3509. * MIT License
  3510. */
  3511. ( function( window, factory ) { 'use strict';
  3512. // universal module definition
  3513. /*global define: false, module: false, require: false */
  3514. if ( typeof define == 'function' && define.amd ) {
  3515. // AMD
  3516. define( 'imagesloaded/imagesloaded',[
  3517. 'ev-emitter/ev-emitter'
  3518. ], function( EvEmitter ) {
  3519. return factory( window, EvEmitter );
  3520. });
  3521. } else if ( typeof module == 'object' && module.exports ) {
  3522. // CommonJS
  3523. module.exports = factory(
  3524. window,
  3525. require('ev-emitter')
  3526. );
  3527. } else {
  3528. // browser global
  3529. window.imagesLoaded = factory(
  3530. window,
  3531. window.EvEmitter
  3532. );
  3533. }
  3534. })( typeof window !== 'undefined' ? window : this,
  3535. // -------------------------- factory -------------------------- //
  3536. function factory( window, EvEmitter ) {
  3537. var $ = window.jQuery;
  3538. var console = window.console;
  3539. // -------------------------- helpers -------------------------- //
  3540. // extend objects
  3541. function extend( a, b ) {
  3542. for ( var prop in b ) {
  3543. a[ prop ] = b[ prop ];
  3544. }
  3545. return a;
  3546. }
  3547. var arraySlice = Array.prototype.slice;
  3548. // turn element or nodeList into an array
  3549. function makeArray( obj ) {
  3550. if ( Array.isArray( obj ) ) {
  3551. // use object if already an array
  3552. return obj;
  3553. }
  3554. var isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
  3555. if ( isArrayLike ) {
  3556. // convert nodeList to array
  3557. return arraySlice.call( obj );
  3558. }
  3559. // array of single index
  3560. return [ obj ];
  3561. }
  3562. // -------------------------- imagesLoaded -------------------------- //
  3563. /**
  3564. * @param {Array, Element, NodeList, String} elem
  3565. * @param {Object or Function} options - if function, use as callback
  3566. * @param {Function} onAlways - callback function
  3567. */
  3568. function ImagesLoaded( elem, options, onAlways ) {
  3569. // coerce ImagesLoaded() without new, to be new ImagesLoaded()
  3570. if ( !( this instanceof ImagesLoaded ) ) {
  3571. return new ImagesLoaded( elem, options, onAlways );
  3572. }
  3573. // use elem as selector string
  3574. var queryElem = elem;
  3575. if ( typeof elem == 'string' ) {
  3576. queryElem = document.querySelectorAll( elem );
  3577. }
  3578. // bail if bad element
  3579. if ( !queryElem ) {
  3580. console.error( 'Bad element for imagesLoaded ' + ( queryElem || elem ) );
  3581. return;
  3582. }
  3583. this.elements = makeArray( queryElem );
  3584. this.options = extend( {}, this.options );
  3585. // shift arguments if no options set
  3586. if ( typeof options == 'function' ) {
  3587. onAlways = options;
  3588. } else {
  3589. extend( this.options, options );
  3590. }
  3591. if ( onAlways ) {
  3592. this.on( 'always', onAlways );
  3593. }
  3594. this.getImages();
  3595. if ( $ ) {
  3596. // add jQuery Deferred object
  3597. this.jqDeferred = new $.Deferred();
  3598. }
  3599. // HACK check async to allow time to bind listeners
  3600. setTimeout( this.check.bind( this ) );
  3601. }
  3602. ImagesLoaded.prototype = Object.create( EvEmitter.prototype );
  3603. ImagesLoaded.prototype.options = {};
  3604. ImagesLoaded.prototype.getImages = function() {
  3605. this.images = [];
  3606. // filter & find items if we have an item selector
  3607. this.elements.forEach( this.addElementImages, this );
  3608. };
  3609. /**
  3610. * @param {Node} element
  3611. */
  3612. ImagesLoaded.prototype.addElementImages = function( elem ) {
  3613. // filter siblings
  3614. if ( elem.nodeName == 'IMG' ) {
  3615. this.addImage( elem );
  3616. }
  3617. // get background image on element
  3618. if ( this.options.background === true ) {
  3619. this.addElementBackgroundImages( elem );
  3620. }
  3621. // find children
  3622. // no non-element nodes, #143
  3623. var nodeType = elem.nodeType;
  3624. if ( !nodeType || !elementNodeTypes[ nodeType ] ) {
  3625. return;
  3626. }
  3627. var childImgs = elem.querySelectorAll('img');
  3628. // concat childElems to filterFound array
  3629. for ( var i=0; i < childImgs.length; i++ ) {
  3630. var img = childImgs[i];
  3631. this.addImage( img );
  3632. }
  3633. // get child background images
  3634. if ( typeof this.options.background == 'string' ) {
  3635. var children = elem.querySelectorAll( this.options.background );
  3636. for ( i=0; i < children.length; i++ ) {
  3637. var child = children[i];
  3638. this.addElementBackgroundImages( child );
  3639. }
  3640. }
  3641. };
  3642. var elementNodeTypes = {
  3643. 1: true,
  3644. 9: true,
  3645. 11: true
  3646. };
  3647. ImagesLoaded.prototype.addElementBackgroundImages = function( elem ) {
  3648. var style = getComputedStyle( elem );
  3649. if ( !style ) {
  3650. // Firefox returns null if in a hidden iframe https://bugzil.la/548397
  3651. return;
  3652. }
  3653. // get url inside url("...")
  3654. var reURL = /url\((['"])?(.*?)\1\)/gi;
  3655. var matches = reURL.exec( style.backgroundImage );
  3656. while ( matches !== null ) {
  3657. var url = matches && matches[2];
  3658. if ( url ) {
  3659. this.addBackground( url, elem );
  3660. }
  3661. matches = reURL.exec( style.backgroundImage );
  3662. }
  3663. };
  3664. /**
  3665. * @param {Image} img
  3666. */
  3667. ImagesLoaded.prototype.addImage = function( img ) {
  3668. var loadingImage = new LoadingImage( img );
  3669. this.images.push( loadingImage );
  3670. };
  3671. ImagesLoaded.prototype.addBackground = function( url, elem ) {
  3672. var background = new Background( url, elem );
  3673. this.images.push( background );
  3674. };
  3675. ImagesLoaded.prototype.check = function() {
  3676. var _this = this;
  3677. this.progressedCount = 0;
  3678. this.hasAnyBroken = false;
  3679. // complete if no images
  3680. if ( !this.images.length ) {
  3681. this.complete();
  3682. return;
  3683. }
  3684. function onProgress( image, elem, message ) {
  3685. // HACK - Chrome triggers event before object properties have changed. #83
  3686. setTimeout( function() {
  3687. _this.progress( image, elem, message );
  3688. });
  3689. }
  3690. this.images.forEach( function( loadingImage ) {
  3691. loadingImage.once( 'progress', onProgress );
  3692. loadingImage.check();
  3693. });
  3694. };
  3695. ImagesLoaded.prototype.progress = function( image, elem, message ) {
  3696. this.progressedCount++;
  3697. this.hasAnyBroken = this.hasAnyBroken || !image.isLoaded;
  3698. // progress event
  3699. this.emitEvent( 'progress', [ this, image, elem ] );
  3700. if ( this.jqDeferred && this.jqDeferred.notify ) {
  3701. this.jqDeferred.notify( this, image );
  3702. }
  3703. // check if completed
  3704. if ( this.progressedCount == this.images.length ) {
  3705. this.complete();
  3706. }
  3707. if ( this.options.debug && console ) {
  3708. console.log( 'progress: ' + message, image, elem );
  3709. }
  3710. };
  3711. ImagesLoaded.prototype.complete = function() {
  3712. var eventName = this.hasAnyBroken ? 'fail' : 'done';
  3713. this.isComplete = true;
  3714. this.emitEvent( eventName, [ this ] );
  3715. this.emitEvent( 'always', [ this ] );
  3716. if ( this.jqDeferred ) {
  3717. var jqMethod = this.hasAnyBroken ? 'reject' : 'resolve';
  3718. this.jqDeferred[ jqMethod ]( this );
  3719. }
  3720. };
  3721. // -------------------------- -------------------------- //
  3722. function LoadingImage( img ) {
  3723. this.img = img;
  3724. }
  3725. LoadingImage.prototype = Object.create( EvEmitter.prototype );
  3726. LoadingImage.prototype.check = function() {
  3727. // If complete is true and browser supports natural sizes,
  3728. // try to check for image status manually.
  3729. var isComplete = this.getIsImageComplete();
  3730. if ( isComplete ) {
  3731. // report based on naturalWidth
  3732. this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
  3733. return;
  3734. }
  3735. // If none of the checks above matched, simulate loading on detached element.
  3736. this.proxyImage = new Image();
  3737. this.proxyImage.addEventListener( 'load', this );
  3738. this.proxyImage.addEventListener( 'error', this );
  3739. // bind to image as well for Firefox. #191
  3740. this.img.addEventListener( 'load', this );
  3741. this.img.addEventListener( 'error', this );
  3742. this.proxyImage.src = this.img.src;
  3743. };
  3744. LoadingImage.prototype.getIsImageComplete = function() {
  3745. // check for non-zero, non-undefined naturalWidth
  3746. // fixes Safari+InfiniteScroll+Masonry bug infinite-scroll#671
  3747. return this.img.complete && this.img.naturalWidth;
  3748. };
  3749. LoadingImage.prototype.confirm = function( isLoaded, message ) {
  3750. this.isLoaded = isLoaded;
  3751. this.emitEvent( 'progress', [ this, this.img, message ] );
  3752. };
  3753. // ----- events ----- //
  3754. // trigger specified handler for event type
  3755. LoadingImage.prototype.handleEvent = function( event ) {
  3756. var method = 'on' + event.type;
  3757. if ( this[ method ] ) {
  3758. this[ method ]( event );
  3759. }
  3760. };
  3761. LoadingImage.prototype.onload = function() {
  3762. this.confirm( true, 'onload' );
  3763. this.unbindEvents();
  3764. };
  3765. LoadingImage.prototype.onerror = function() {
  3766. this.confirm( false, 'onerror' );
  3767. this.unbindEvents();
  3768. };
  3769. LoadingImage.prototype.unbindEvents = function() {
  3770. this.proxyImage.removeEventListener( 'load', this );
  3771. this.proxyImage.removeEventListener( 'error', this );
  3772. this.img.removeEventListener( 'load', this );
  3773. this.img.removeEventListener( 'error', this );
  3774. };
  3775. // -------------------------- Background -------------------------- //
  3776. function Background( url, element ) {
  3777. this.url = url;
  3778. this.element = element;
  3779. this.img = new Image();
  3780. }
  3781. // inherit LoadingImage prototype
  3782. Background.prototype = Object.create( LoadingImage.prototype );
  3783. Background.prototype.check = function() {
  3784. this.img.addEventListener( 'load', this );
  3785. this.img.addEventListener( 'error', this );
  3786. this.img.src = this.url;
  3787. // check if image is already complete
  3788. var isComplete = this.getIsImageComplete();
  3789. if ( isComplete ) {
  3790. this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
  3791. this.unbindEvents();
  3792. }
  3793. };
  3794. Background.prototype.unbindEvents = function() {
  3795. this.img.removeEventListener( 'load', this );
  3796. this.img.removeEventListener( 'error', this );
  3797. };
  3798. Background.prototype.confirm = function( isLoaded, message ) {
  3799. this.isLoaded = isLoaded;
  3800. this.emitEvent( 'progress', [ this, this.element, message ] );
  3801. };
  3802. // -------------------------- jQuery -------------------------- //
  3803. ImagesLoaded.makeJQueryPlugin = function( jQuery ) {
  3804. jQuery = jQuery || window.jQuery;
  3805. if ( !jQuery ) {
  3806. return;
  3807. }
  3808. // set local variable
  3809. $ = jQuery;
  3810. // $().imagesLoaded()
  3811. $.fn.imagesLoaded = function( options, callback ) {
  3812. var instance = new ImagesLoaded( this, options, callback );
  3813. return instance.jqDeferred.promise( $(this) );
  3814. };
  3815. };
  3816. // try making plugin
  3817. ImagesLoaded.makeJQueryPlugin();
  3818. // -------------------------- -------------------------- //
  3819. return ImagesLoaded;
  3820. });
  3821. /*!
  3822. * Flickity imagesLoaded v2.0.0
  3823. * enables imagesLoaded option for Flickity
  3824. */
  3825. /*jshint browser: true, strict: true, undef: true, unused: true */
  3826. ( function( window, factory ) {
  3827. // universal module definition
  3828. /*jshint strict: false */ /*globals define, module, require */
  3829. if ( typeof define == 'function' && define.amd ) {
  3830. // AMD
  3831. define( [
  3832. 'flickity/js/index',
  3833. 'imagesloaded/imagesloaded'
  3834. ], function( Flickity, imagesLoaded ) {
  3835. return factory( window, Flickity, imagesLoaded );
  3836. });
  3837. } else if ( typeof module == 'object' && module.exports ) {
  3838. // CommonJS
  3839. module.exports = factory(
  3840. window,
  3841. require('flickity'),
  3842. require('imagesloaded')
  3843. );
  3844. } else {
  3845. // browser global
  3846. window.Flickity = factory(
  3847. window,
  3848. window.Flickity,
  3849. window.imagesLoaded
  3850. );
  3851. }
  3852. }( window, function factory( window, Flickity, imagesLoaded ) {
  3853. 'use strict';
  3854. Flickity.createMethods.push('_createImagesLoaded');
  3855. var proto = Flickity.prototype;
  3856. proto._createImagesLoaded = function() {
  3857. this.on( 'activate', this.imagesLoaded );
  3858. };
  3859. proto.imagesLoaded = function() {
  3860. if ( !this.options.imagesLoaded ) {
  3861. return;
  3862. }
  3863. var _this = this;
  3864. function onImagesLoadedProgress( instance, image ) {
  3865. var cell = _this.getParentCell( image.img );
  3866. _this.cellSizeChange( cell && cell.element );
  3867. if ( !_this.options.freeScroll ) {
  3868. _this.positionSliderAtSelected();
  3869. }
  3870. }
  3871. imagesLoaded( this.slider ).on( 'progress', onImagesLoadedProgress );
  3872. };
  3873. return Flickity;
  3874. }));