isotope.pkgd.js 89 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561
  1. /*!
  2. * Isotope PACKAGED v3.0.5
  3. *
  4. * Licensed GPLv3 for open source use
  5. * or Isotope Commercial License for commercial use
  6. *
  7. * https://isotope.metafizzy.co
  8. * Copyright 2017 Metafizzy
  9. */
  10. /**
  11. * Bridget makes jQuery widgets
  12. * v2.0.1
  13. * MIT license
  14. */
  15. /* jshint browser: true, strict: true, undef: true, unused: true */
  16. ( function( window, factory ) {
  17. // universal module definition
  18. /*jshint strict: false */ /* globals define, module, require */
  19. if ( typeof define == 'function' && define.amd ) {
  20. // AMD
  21. define( 'jquery-bridget/jquery-bridget',[ 'jquery' ], function( jQuery ) {
  22. return factory( window, jQuery );
  23. });
  24. } else if ( typeof module == 'object' && module.exports ) {
  25. // CommonJS
  26. module.exports = factory(
  27. window,
  28. require('jquery')
  29. );
  30. } else {
  31. // browser global
  32. window.jQueryBridget = factory(
  33. window,
  34. window.jQuery
  35. );
  36. }
  37. }( window, function factory( window, jQuery ) {
  38. 'use strict';
  39. // ----- utils ----- //
  40. var arraySlice = Array.prototype.slice;
  41. // helper function for logging errors
  42. // $.error breaks jQuery chaining
  43. var console = window.console;
  44. var logError = typeof console == 'undefined' ? function() {} :
  45. function( message ) {
  46. console.error( message );
  47. };
  48. // ----- jQueryBridget ----- //
  49. function jQueryBridget( namespace, PluginClass, $ ) {
  50. $ = $ || jQuery || window.jQuery;
  51. if ( !$ ) {
  52. return;
  53. }
  54. // add option method -> $().plugin('option', {...})
  55. if ( !PluginClass.prototype.option ) {
  56. // option setter
  57. PluginClass.prototype.option = function( opts ) {
  58. // bail out if not an object
  59. if ( !$.isPlainObject( opts ) ){
  60. return;
  61. }
  62. this.options = $.extend( true, this.options, opts );
  63. };
  64. }
  65. // make jQuery plugin
  66. $.fn[ namespace ] = function( arg0 /*, arg1 */ ) {
  67. if ( typeof arg0 == 'string' ) {
  68. // method call $().plugin( 'methodName', { options } )
  69. // shift arguments by 1
  70. var args = arraySlice.call( arguments, 1 );
  71. return methodCall( this, arg0, args );
  72. }
  73. // just $().plugin({ options })
  74. plainCall( this, arg0 );
  75. return this;
  76. };
  77. // $().plugin('methodName')
  78. function methodCall( $elems, methodName, args ) {
  79. var returnValue;
  80. var pluginMethodStr = '$().' + namespace + '("' + methodName + '")';
  81. $elems.each( function( i, elem ) {
  82. // get instance
  83. var instance = $.data( elem, namespace );
  84. if ( !instance ) {
  85. logError( namespace + ' not initialized. Cannot call methods, i.e. ' +
  86. pluginMethodStr );
  87. return;
  88. }
  89. var method = instance[ methodName ];
  90. if ( !method || methodName.charAt(0) == '_' ) {
  91. logError( pluginMethodStr + ' is not a valid method' );
  92. return;
  93. }
  94. // apply method, get return value
  95. var value = method.apply( instance, args );
  96. // set return value if value is returned, use only first value
  97. returnValue = returnValue === undefined ? value : returnValue;
  98. });
  99. return returnValue !== undefined ? returnValue : $elems;
  100. }
  101. function plainCall( $elems, options ) {
  102. $elems.each( function( i, elem ) {
  103. var instance = $.data( elem, namespace );
  104. if ( instance ) {
  105. // set options & init
  106. instance.option( options );
  107. instance._init();
  108. } else {
  109. // initialize new instance
  110. instance = new PluginClass( elem, options );
  111. $.data( elem, namespace, instance );
  112. }
  113. });
  114. }
  115. updateJQuery( $ );
  116. }
  117. // ----- updateJQuery ----- //
  118. // set $.bridget for v1 backwards compatibility
  119. function updateJQuery( $ ) {
  120. if ( !$ || ( $ && $.bridget ) ) {
  121. return;
  122. }
  123. $.bridget = jQueryBridget;
  124. }
  125. updateJQuery( jQuery || window.jQuery );
  126. // ----- ----- //
  127. return jQueryBridget;
  128. }));
  129. /**
  130. * EvEmitter v1.1.0
  131. * Lil' event emitter
  132. * MIT License
  133. */
  134. /* jshint unused: true, undef: true, strict: true */
  135. ( function( global, factory ) {
  136. // universal module definition
  137. /* jshint strict: false */ /* globals define, module, window */
  138. if ( typeof define == 'function' && define.amd ) {
  139. // AMD - RequireJS
  140. define( 'ev-emitter/ev-emitter',factory );
  141. } else if ( typeof module == 'object' && module.exports ) {
  142. // CommonJS - Browserify, Webpack
  143. module.exports = factory();
  144. } else {
  145. // Browser globals
  146. global.EvEmitter = factory();
  147. }
  148. }( typeof window != 'undefined' ? window : this, function() {
  149. function EvEmitter() {}
  150. var proto = EvEmitter.prototype;
  151. proto.on = function( eventName, listener ) {
  152. if ( !eventName || !listener ) {
  153. return;
  154. }
  155. // set events hash
  156. var events = this._events = this._events || {};
  157. // set listeners array
  158. var listeners = events[ eventName ] = events[ eventName ] || [];
  159. // only add once
  160. if ( listeners.indexOf( listener ) == -1 ) {
  161. listeners.push( listener );
  162. }
  163. return this;
  164. };
  165. proto.once = function( eventName, listener ) {
  166. if ( !eventName || !listener ) {
  167. return;
  168. }
  169. // add event
  170. this.on( eventName, listener );
  171. // set once flag
  172. // set onceEvents hash
  173. var onceEvents = this._onceEvents = this._onceEvents || {};
  174. // set onceListeners object
  175. var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
  176. // set flag
  177. onceListeners[ listener ] = true;
  178. return this;
  179. };
  180. proto.off = function( eventName, listener ) {
  181. var listeners = this._events && this._events[ eventName ];
  182. if ( !listeners || !listeners.length ) {
  183. return;
  184. }
  185. var index = listeners.indexOf( listener );
  186. if ( index != -1 ) {
  187. listeners.splice( index, 1 );
  188. }
  189. return this;
  190. };
  191. proto.emitEvent = function( eventName, args ) {
  192. var listeners = this._events && this._events[ eventName ];
  193. if ( !listeners || !listeners.length ) {
  194. return;
  195. }
  196. // copy over to avoid interference if .off() in listener
  197. listeners = listeners.slice(0);
  198. args = args || [];
  199. // once stuff
  200. var onceListeners = this._onceEvents && this._onceEvents[ eventName ];
  201. for ( var i=0; i < listeners.length; i++ ) {
  202. var listener = listeners[i]
  203. var isOnce = onceListeners && onceListeners[ listener ];
  204. if ( isOnce ) {
  205. // remove listener
  206. // remove before trigger to prevent recursion
  207. this.off( eventName, listener );
  208. // unset once flag
  209. delete onceListeners[ listener ];
  210. }
  211. // trigger listener
  212. listener.apply( this, args );
  213. }
  214. return this;
  215. };
  216. proto.allOff = function() {
  217. delete this._events;
  218. delete this._onceEvents;
  219. };
  220. return EvEmitter;
  221. }));
  222. /*!
  223. * getSize v2.0.2
  224. * measure size of elements
  225. * MIT license
  226. */
  227. /*jshint browser: true, strict: true, undef: true, unused: true */
  228. /*global define: false, module: false, console: false */
  229. ( function( window, factory ) {
  230. 'use strict';
  231. if ( typeof define == 'function' && define.amd ) {
  232. // AMD
  233. define( 'get-size/get-size',[],function() {
  234. return factory();
  235. });
  236. } else if ( typeof module == 'object' && module.exports ) {
  237. // CommonJS
  238. module.exports = factory();
  239. } else {
  240. // browser global
  241. window.getSize = factory();
  242. }
  243. })( window, function factory() {
  244. 'use strict';
  245. // -------------------------- helpers -------------------------- //
  246. // get a number from a string, not a percentage
  247. function getStyleSize( value ) {
  248. var num = parseFloat( value );
  249. // not a percent like '100%', and a number
  250. var isValid = value.indexOf('%') == -1 && !isNaN( num );
  251. return isValid && num;
  252. }
  253. function noop() {}
  254. var logError = typeof console == 'undefined' ? noop :
  255. function( message ) {
  256. console.error( message );
  257. };
  258. // -------------------------- measurements -------------------------- //
  259. var measurements = [
  260. 'paddingLeft',
  261. 'paddingRight',
  262. 'paddingTop',
  263. 'paddingBottom',
  264. 'marginLeft',
  265. 'marginRight',
  266. 'marginTop',
  267. 'marginBottom',
  268. 'borderLeftWidth',
  269. 'borderRightWidth',
  270. 'borderTopWidth',
  271. 'borderBottomWidth'
  272. ];
  273. var measurementsLength = measurements.length;
  274. function getZeroSize() {
  275. var size = {
  276. width: 0,
  277. height: 0,
  278. innerWidth: 0,
  279. innerHeight: 0,
  280. outerWidth: 0,
  281. outerHeight: 0
  282. };
  283. for ( var i=0; i < measurementsLength; i++ ) {
  284. var measurement = measurements[i];
  285. size[ measurement ] = 0;
  286. }
  287. return size;
  288. }
  289. // -------------------------- getStyle -------------------------- //
  290. /**
  291. * getStyle, get style of element, check for Firefox bug
  292. * https://bugzilla.mozilla.org/show_bug.cgi?id=548397
  293. */
  294. function getStyle( elem ) {
  295. var style = getComputedStyle( elem );
  296. if ( !style ) {
  297. logError( 'Style returned ' + style +
  298. '. Are you running this code in a hidden iframe on Firefox? ' +
  299. 'See http://bit.ly/getsizebug1' );
  300. }
  301. return style;
  302. }
  303. // -------------------------- setup -------------------------- //
  304. var isSetup = false;
  305. var isBoxSizeOuter;
  306. /**
  307. * setup
  308. * check isBoxSizerOuter
  309. * do on first getSize() rather than on page load for Firefox bug
  310. */
  311. function setup() {
  312. // setup once
  313. if ( isSetup ) {
  314. return;
  315. }
  316. isSetup = true;
  317. // -------------------------- box sizing -------------------------- //
  318. /**
  319. * WebKit measures the outer-width on style.width on border-box elems
  320. * IE & Firefox<29 measures the inner-width
  321. */
  322. var div = document.createElement('div');
  323. div.style.width = '200px';
  324. div.style.padding = '1px 2px 3px 4px';
  325. div.style.borderStyle = 'solid';
  326. div.style.borderWidth = '1px 2px 3px 4px';
  327. div.style.boxSizing = 'border-box';
  328. var body = document.body || document.documentElement;
  329. body.appendChild( div );
  330. var style = getStyle( div );
  331. getSize.isBoxSizeOuter = isBoxSizeOuter = getStyleSize( style.width ) == 200;
  332. body.removeChild( div );
  333. }
  334. // -------------------------- getSize -------------------------- //
  335. function getSize( elem ) {
  336. setup();
  337. // use querySeletor if elem is string
  338. if ( typeof elem == 'string' ) {
  339. elem = document.querySelector( elem );
  340. }
  341. // do not proceed on non-objects
  342. if ( !elem || typeof elem != 'object' || !elem.nodeType ) {
  343. return;
  344. }
  345. var style = getStyle( elem );
  346. // if hidden, everything is 0
  347. if ( style.display == 'none' ) {
  348. return getZeroSize();
  349. }
  350. var size = {};
  351. size.width = elem.offsetWidth;
  352. size.height = elem.offsetHeight;
  353. var isBorderBox = size.isBorderBox = style.boxSizing == 'border-box';
  354. // get all measurements
  355. for ( var i=0; i < measurementsLength; i++ ) {
  356. var measurement = measurements[i];
  357. var value = style[ measurement ];
  358. var num = parseFloat( value );
  359. // any 'auto', 'medium' value will be 0
  360. size[ measurement ] = !isNaN( num ) ? num : 0;
  361. }
  362. var paddingWidth = size.paddingLeft + size.paddingRight;
  363. var paddingHeight = size.paddingTop + size.paddingBottom;
  364. var marginWidth = size.marginLeft + size.marginRight;
  365. var marginHeight = size.marginTop + size.marginBottom;
  366. var borderWidth = size.borderLeftWidth + size.borderRightWidth;
  367. var borderHeight = size.borderTopWidth + size.borderBottomWidth;
  368. var isBorderBoxSizeOuter = isBorderBox && isBoxSizeOuter;
  369. // overwrite width and height if we can get it from style
  370. var styleWidth = getStyleSize( style.width );
  371. if ( styleWidth !== false ) {
  372. size.width = styleWidth +
  373. // add padding and border unless it's already including it
  374. ( isBorderBoxSizeOuter ? 0 : paddingWidth + borderWidth );
  375. }
  376. var styleHeight = getStyleSize( style.height );
  377. if ( styleHeight !== false ) {
  378. size.height = styleHeight +
  379. // add padding and border unless it's already including it
  380. ( isBorderBoxSizeOuter ? 0 : paddingHeight + borderHeight );
  381. }
  382. size.innerWidth = size.width - ( paddingWidth + borderWidth );
  383. size.innerHeight = size.height - ( paddingHeight + borderHeight );
  384. size.outerWidth = size.width + marginWidth;
  385. size.outerHeight = size.height + marginHeight;
  386. return size;
  387. }
  388. return getSize;
  389. });
  390. /**
  391. * matchesSelector v2.0.2
  392. * matchesSelector( element, '.selector' )
  393. * MIT license
  394. */
  395. /*jshint browser: true, strict: true, undef: true, unused: true */
  396. ( function( window, factory ) {
  397. /*global define: false, module: false */
  398. 'use strict';
  399. // universal module definition
  400. if ( typeof define == 'function' && define.amd ) {
  401. // AMD
  402. define( 'desandro-matches-selector/matches-selector',factory );
  403. } else if ( typeof module == 'object' && module.exports ) {
  404. // CommonJS
  405. module.exports = factory();
  406. } else {
  407. // browser global
  408. window.matchesSelector = factory();
  409. }
  410. }( window, function factory() {
  411. 'use strict';
  412. var matchesMethod = ( function() {
  413. var ElemProto = window.Element.prototype;
  414. // check for the standard method name first
  415. if ( ElemProto.matches ) {
  416. return 'matches';
  417. }
  418. // check un-prefixed
  419. if ( ElemProto.matchesSelector ) {
  420. return 'matchesSelector';
  421. }
  422. // check vendor prefixes
  423. var prefixes = [ 'webkit', 'moz', 'ms', 'o' ];
  424. for ( var i=0; i < prefixes.length; i++ ) {
  425. var prefix = prefixes[i];
  426. var method = prefix + 'MatchesSelector';
  427. if ( ElemProto[ method ] ) {
  428. return method;
  429. }
  430. }
  431. })();
  432. return function matchesSelector( elem, selector ) {
  433. return elem[ matchesMethod ]( selector );
  434. };
  435. }));
  436. /**
  437. * Fizzy UI utils v2.0.5
  438. * MIT license
  439. */
  440. /*jshint browser: true, undef: true, unused: true, strict: true */
  441. ( function( window, factory ) {
  442. // universal module definition
  443. /*jshint strict: false */ /*globals define, module, require */
  444. if ( typeof define == 'function' && define.amd ) {
  445. // AMD
  446. define( 'fizzy-ui-utils/utils',[
  447. 'desandro-matches-selector/matches-selector'
  448. ], function( matchesSelector ) {
  449. return factory( window, matchesSelector );
  450. });
  451. } else if ( typeof module == 'object' && module.exports ) {
  452. // CommonJS
  453. module.exports = factory(
  454. window,
  455. require('desandro-matches-selector')
  456. );
  457. } else {
  458. // browser global
  459. window.fizzyUIUtils = factory(
  460. window,
  461. window.matchesSelector
  462. );
  463. }
  464. }( window, function factory( window, matchesSelector ) {
  465. var utils = {};
  466. // ----- extend ----- //
  467. // extends objects
  468. utils.extend = function( a, b ) {
  469. for ( var prop in b ) {
  470. a[ prop ] = b[ prop ];
  471. }
  472. return a;
  473. };
  474. // ----- modulo ----- //
  475. utils.modulo = function( num, div ) {
  476. return ( ( num % div ) + div ) % div;
  477. };
  478. // ----- makeArray ----- //
  479. // turn element or nodeList into an array
  480. utils.makeArray = function( obj ) {
  481. var ary = [];
  482. if ( Array.isArray( obj ) ) {
  483. // use object if already an array
  484. ary = obj;
  485. } else if ( obj && typeof obj == 'object' &&
  486. typeof obj.length == 'number' ) {
  487. // convert nodeList to array
  488. for ( var i=0; i < obj.length; i++ ) {
  489. ary.push( obj[i] );
  490. }
  491. } else {
  492. // array of single index
  493. ary.push( obj );
  494. }
  495. return ary;
  496. };
  497. // ----- removeFrom ----- //
  498. utils.removeFrom = function( ary, obj ) {
  499. var index = ary.indexOf( obj );
  500. if ( index != -1 ) {
  501. ary.splice( index, 1 );
  502. }
  503. };
  504. // ----- getParent ----- //
  505. utils.getParent = function( elem, selector ) {
  506. while ( elem.parentNode && elem != document.body ) {
  507. elem = elem.parentNode;
  508. if ( matchesSelector( elem, selector ) ) {
  509. return elem;
  510. }
  511. }
  512. };
  513. // ----- getQueryElement ----- //
  514. // use element as selector string
  515. utils.getQueryElement = function( elem ) {
  516. if ( typeof elem == 'string' ) {
  517. return document.querySelector( elem );
  518. }
  519. return elem;
  520. };
  521. // ----- handleEvent ----- //
  522. // enable .ontype to trigger from .addEventListener( elem, 'type' )
  523. utils.handleEvent = function( event ) {
  524. var method = 'on' + event.type;
  525. if ( this[ method ] ) {
  526. this[ method ]( event );
  527. }
  528. };
  529. // ----- filterFindElements ----- //
  530. utils.filterFindElements = function( elems, selector ) {
  531. // make array of elems
  532. elems = utils.makeArray( elems );
  533. var ffElems = [];
  534. elems.forEach( function( elem ) {
  535. // check that elem is an actual element
  536. if ( !( elem instanceof HTMLElement ) ) {
  537. return;
  538. }
  539. // add elem if no selector
  540. if ( !selector ) {
  541. ffElems.push( elem );
  542. return;
  543. }
  544. // filter & find items if we have a selector
  545. // filter
  546. if ( matchesSelector( elem, selector ) ) {
  547. ffElems.push( elem );
  548. }
  549. // find children
  550. var childElems = elem.querySelectorAll( selector );
  551. // concat childElems to filterFound array
  552. for ( var i=0; i < childElems.length; i++ ) {
  553. ffElems.push( childElems[i] );
  554. }
  555. });
  556. return ffElems;
  557. };
  558. // ----- debounceMethod ----- //
  559. utils.debounceMethod = function( _class, methodName, threshold ) {
  560. // original method
  561. var method = _class.prototype[ methodName ];
  562. var timeoutName = methodName + 'Timeout';
  563. _class.prototype[ methodName ] = function() {
  564. var timeout = this[ timeoutName ];
  565. if ( timeout ) {
  566. clearTimeout( timeout );
  567. }
  568. var args = arguments;
  569. var _this = this;
  570. this[ timeoutName ] = setTimeout( function() {
  571. method.apply( _this, args );
  572. delete _this[ timeoutName ];
  573. }, threshold || 100 );
  574. };
  575. };
  576. // ----- docReady ----- //
  577. utils.docReady = function( callback ) {
  578. var readyState = document.readyState;
  579. if ( readyState == 'complete' || readyState == 'interactive' ) {
  580. // do async to allow for other scripts to run. metafizzy/flickity#441
  581. setTimeout( callback );
  582. } else {
  583. document.addEventListener( 'DOMContentLoaded', callback );
  584. }
  585. };
  586. // ----- htmlInit ----- //
  587. // http://jamesroberts.name/blog/2010/02/22/string-functions-for-javascript-trim-to-camel-case-to-dashed-and-to-underscore/
  588. utils.toDashed = function( str ) {
  589. return str.replace( /(.)([A-Z])/g, function( match, $1, $2 ) {
  590. return $1 + '-' + $2;
  591. }).toLowerCase();
  592. };
  593. var console = window.console;
  594. /**
  595. * allow user to initialize classes via [data-namespace] or .js-namespace class
  596. * htmlInit( Widget, 'widgetName' )
  597. * options are parsed from data-namespace-options
  598. */
  599. utils.htmlInit = function( WidgetClass, namespace ) {
  600. utils.docReady( function() {
  601. var dashedNamespace = utils.toDashed( namespace );
  602. var dataAttr = 'data-' + dashedNamespace;
  603. var dataAttrElems = document.querySelectorAll( '[' + dataAttr + ']' );
  604. var jsDashElems = document.querySelectorAll( '.js-' + dashedNamespace );
  605. var elems = utils.makeArray( dataAttrElems )
  606. .concat( utils.makeArray( jsDashElems ) );
  607. var dataOptionsAttr = dataAttr + '-options';
  608. var jQuery = window.jQuery;
  609. elems.forEach( function( elem ) {
  610. var attr = elem.getAttribute( dataAttr ) ||
  611. elem.getAttribute( dataOptionsAttr );
  612. var options;
  613. try {
  614. options = attr && JSON.parse( attr );
  615. } catch ( error ) {
  616. // log error, do not initialize
  617. if ( console ) {
  618. console.error( 'Error parsing ' + dataAttr + ' on ' + elem.className +
  619. ': ' + error );
  620. }
  621. return;
  622. }
  623. // initialize
  624. var instance = new WidgetClass( elem, options );
  625. // make available via $().data('namespace')
  626. if ( jQuery ) {
  627. jQuery.data( elem, namespace, instance );
  628. }
  629. });
  630. });
  631. };
  632. // ----- ----- //
  633. return utils;
  634. }));
  635. /**
  636. * Outlayer Item
  637. */
  638. ( function( window, factory ) {
  639. // universal module definition
  640. /* jshint strict: false */ /* globals define, module, require */
  641. if ( typeof define == 'function' && define.amd ) {
  642. // AMD - RequireJS
  643. define( 'outlayer/item',[
  644. 'ev-emitter/ev-emitter',
  645. 'get-size/get-size'
  646. ],
  647. factory
  648. );
  649. } else if ( typeof module == 'object' && module.exports ) {
  650. // CommonJS - Browserify, Webpack
  651. module.exports = factory(
  652. require('ev-emitter'),
  653. require('get-size')
  654. );
  655. } else {
  656. // browser global
  657. window.Outlayer = {};
  658. window.Outlayer.Item = factory(
  659. window.EvEmitter,
  660. window.getSize
  661. );
  662. }
  663. }( window, function factory( EvEmitter, getSize ) {
  664. 'use strict';
  665. // ----- helpers ----- //
  666. function isEmptyObj( obj ) {
  667. for ( var prop in obj ) {
  668. return false;
  669. }
  670. prop = null;
  671. return true;
  672. }
  673. // -------------------------- CSS3 support -------------------------- //
  674. var docElemStyle = document.documentElement.style;
  675. var transitionProperty = typeof docElemStyle.transition == 'string' ?
  676. 'transition' : 'WebkitTransition';
  677. var transformProperty = typeof docElemStyle.transform == 'string' ?
  678. 'transform' : 'WebkitTransform';
  679. var transitionEndEvent = {
  680. WebkitTransition: 'webkitTransitionEnd',
  681. transition: 'transitionend'
  682. }[ transitionProperty ];
  683. // cache all vendor properties that could have vendor prefix
  684. var vendorProperties = {
  685. transform: transformProperty,
  686. transition: transitionProperty,
  687. transitionDuration: transitionProperty + 'Duration',
  688. transitionProperty: transitionProperty + 'Property',
  689. transitionDelay: transitionProperty + 'Delay'
  690. };
  691. // -------------------------- Item -------------------------- //
  692. function Item( element, layout ) {
  693. if ( !element ) {
  694. return;
  695. }
  696. this.element = element;
  697. // parent layout class, i.e. Masonry, Isotope, or Packery
  698. this.layout = layout;
  699. this.position = {
  700. x: 0,
  701. y: 0
  702. };
  703. this._create();
  704. }
  705. // inherit EvEmitter
  706. var proto = Item.prototype = Object.create( EvEmitter.prototype );
  707. proto.constructor = Item;
  708. proto._create = function() {
  709. // transition objects
  710. this._transn = {
  711. ingProperties: {},
  712. clean: {},
  713. onEnd: {}
  714. };
  715. this.css({
  716. position: 'absolute'
  717. });
  718. };
  719. // trigger specified handler for event type
  720. proto.handleEvent = function( event ) {
  721. var method = 'on' + event.type;
  722. if ( this[ method ] ) {
  723. this[ method ]( event );
  724. }
  725. };
  726. proto.getSize = function() {
  727. this.size = getSize( this.element );
  728. };
  729. /**
  730. * apply CSS styles to element
  731. * @param {Object} style
  732. */
  733. proto.css = function( style ) {
  734. var elemStyle = this.element.style;
  735. for ( var prop in style ) {
  736. // use vendor property if available
  737. var supportedProp = vendorProperties[ prop ] || prop;
  738. elemStyle[ supportedProp ] = style[ prop ];
  739. }
  740. };
  741. // measure position, and sets it
  742. proto.getPosition = function() {
  743. var style = getComputedStyle( this.element );
  744. var isOriginLeft = this.layout._getOption('originLeft');
  745. var isOriginTop = this.layout._getOption('originTop');
  746. var xValue = style[ isOriginLeft ? 'left' : 'right' ];
  747. var yValue = style[ isOriginTop ? 'top' : 'bottom' ];
  748. // convert percent to pixels
  749. var layoutSize = this.layout.size;
  750. var x = xValue.indexOf('%') != -1 ?
  751. ( parseFloat( xValue ) / 100 ) * layoutSize.width : parseInt( xValue, 10 );
  752. var y = yValue.indexOf('%') != -1 ?
  753. ( parseFloat( yValue ) / 100 ) * layoutSize.height : parseInt( yValue, 10 );
  754. // clean up 'auto' or other non-integer values
  755. x = isNaN( x ) ? 0 : x;
  756. y = isNaN( y ) ? 0 : y;
  757. // remove padding from measurement
  758. x -= isOriginLeft ? layoutSize.paddingLeft : layoutSize.paddingRight;
  759. y -= isOriginTop ? layoutSize.paddingTop : layoutSize.paddingBottom;
  760. this.position.x = x;
  761. this.position.y = y;
  762. };
  763. // set settled position, apply padding
  764. proto.layoutPosition = function() {
  765. var layoutSize = this.layout.size;
  766. var style = {};
  767. var isOriginLeft = this.layout._getOption('originLeft');
  768. var isOriginTop = this.layout._getOption('originTop');
  769. // x
  770. var xPadding = isOriginLeft ? 'paddingLeft' : 'paddingRight';
  771. var xProperty = isOriginLeft ? 'left' : 'right';
  772. var xResetProperty = isOriginLeft ? 'right' : 'left';
  773. var x = this.position.x + layoutSize[ xPadding ];
  774. // set in percentage or pixels
  775. style[ xProperty ] = this.getXValue( x );
  776. // reset other property
  777. style[ xResetProperty ] = '';
  778. // y
  779. var yPadding = isOriginTop ? 'paddingTop' : 'paddingBottom';
  780. var yProperty = isOriginTop ? 'top' : 'bottom';
  781. var yResetProperty = isOriginTop ? 'bottom' : 'top';
  782. var y = this.position.y + layoutSize[ yPadding ];
  783. // set in percentage or pixels
  784. style[ yProperty ] = this.getYValue( y );
  785. // reset other property
  786. style[ yResetProperty ] = '';
  787. this.css( style );
  788. this.emitEvent( 'layout', [ this ] );
  789. };
  790. proto.getXValue = function( x ) {
  791. var isHorizontal = this.layout._getOption('horizontal');
  792. return this.layout.options.percentPosition && !isHorizontal ?
  793. ( ( x / this.layout.size.width ) * 100 ) + '%' : x + 'px';
  794. };
  795. proto.getYValue = function( y ) {
  796. var isHorizontal = this.layout._getOption('horizontal');
  797. return this.layout.options.percentPosition && isHorizontal ?
  798. ( ( y / this.layout.size.height ) * 100 ) + '%' : y + 'px';
  799. };
  800. proto._transitionTo = function( x, y ) {
  801. this.getPosition();
  802. // get current x & y from top/left
  803. var curX = this.position.x;
  804. var curY = this.position.y;
  805. var compareX = parseInt( x, 10 );
  806. var compareY = parseInt( y, 10 );
  807. var didNotMove = compareX === this.position.x && compareY === this.position.y;
  808. // save end position
  809. this.setPosition( x, y );
  810. // if did not move and not transitioning, just go to layout
  811. if ( didNotMove && !this.isTransitioning ) {
  812. this.layoutPosition();
  813. return;
  814. }
  815. var transX = x - curX;
  816. var transY = y - curY;
  817. var transitionStyle = {};
  818. transitionStyle.transform = this.getTranslate( transX, transY );
  819. this.transition({
  820. to: transitionStyle,
  821. onTransitionEnd: {
  822. transform: this.layoutPosition
  823. },
  824. isCleaning: true
  825. });
  826. };
  827. proto.getTranslate = function( x, y ) {
  828. // flip cooridinates if origin on right or bottom
  829. var isOriginLeft = this.layout._getOption('originLeft');
  830. var isOriginTop = this.layout._getOption('originTop');
  831. x = isOriginLeft ? x : -x;
  832. y = isOriginTop ? y : -y;
  833. return 'translate3d(' + x + 'px, ' + y + 'px, 0)';
  834. };
  835. // non transition + transform support
  836. proto.goTo = function( x, y ) {
  837. this.setPosition( x, y );
  838. this.layoutPosition();
  839. };
  840. proto.moveTo = proto._transitionTo;
  841. proto.setPosition = function( x, y ) {
  842. this.position.x = parseInt( x, 10 );
  843. this.position.y = parseInt( y, 10 );
  844. };
  845. // ----- transition ----- //
  846. /**
  847. * @param {Object} style - CSS
  848. * @param {Function} onTransitionEnd
  849. */
  850. // non transition, just trigger callback
  851. proto._nonTransition = function( args ) {
  852. this.css( args.to );
  853. if ( args.isCleaning ) {
  854. this._removeStyles( args.to );
  855. }
  856. for ( var prop in args.onTransitionEnd ) {
  857. args.onTransitionEnd[ prop ].call( this );
  858. }
  859. };
  860. /**
  861. * proper transition
  862. * @param {Object} args - arguments
  863. * @param {Object} to - style to transition to
  864. * @param {Object} from - style to start transition from
  865. * @param {Boolean} isCleaning - removes transition styles after transition
  866. * @param {Function} onTransitionEnd - callback
  867. */
  868. proto.transition = function( args ) {
  869. // redirect to nonTransition if no transition duration
  870. if ( !parseFloat( this.layout.options.transitionDuration ) ) {
  871. this._nonTransition( args );
  872. return;
  873. }
  874. var _transition = this._transn;
  875. // keep track of onTransitionEnd callback by css property
  876. for ( var prop in args.onTransitionEnd ) {
  877. _transition.onEnd[ prop ] = args.onTransitionEnd[ prop ];
  878. }
  879. // keep track of properties that are transitioning
  880. for ( prop in args.to ) {
  881. _transition.ingProperties[ prop ] = true;
  882. // keep track of properties to clean up when transition is done
  883. if ( args.isCleaning ) {
  884. _transition.clean[ prop ] = true;
  885. }
  886. }
  887. // set from styles
  888. if ( args.from ) {
  889. this.css( args.from );
  890. // force redraw. http://blog.alexmaccaw.com/css-transitions
  891. var h = this.element.offsetHeight;
  892. // hack for JSHint to hush about unused var
  893. h = null;
  894. }
  895. // enable transition
  896. this.enableTransition( args.to );
  897. // set styles that are transitioning
  898. this.css( args.to );
  899. this.isTransitioning = true;
  900. };
  901. // dash before all cap letters, including first for
  902. // WebkitTransform => -webkit-transform
  903. function toDashedAll( str ) {
  904. return str.replace( /([A-Z])/g, function( $1 ) {
  905. return '-' + $1.toLowerCase();
  906. });
  907. }
  908. var transitionProps = 'opacity,' + toDashedAll( transformProperty );
  909. proto.enableTransition = function(/* style */) {
  910. // HACK changing transitionProperty during a transition
  911. // will cause transition to jump
  912. if ( this.isTransitioning ) {
  913. return;
  914. }
  915. // make `transition: foo, bar, baz` from style object
  916. // HACK un-comment this when enableTransition can work
  917. // while a transition is happening
  918. // var transitionValues = [];
  919. // for ( var prop in style ) {
  920. // // dash-ify camelCased properties like WebkitTransition
  921. // prop = vendorProperties[ prop ] || prop;
  922. // transitionValues.push( toDashedAll( prop ) );
  923. // }
  924. // munge number to millisecond, to match stagger
  925. var duration = this.layout.options.transitionDuration;
  926. duration = typeof duration == 'number' ? duration + 'ms' : duration;
  927. // enable transition styles
  928. this.css({
  929. transitionProperty: transitionProps,
  930. transitionDuration: duration,
  931. transitionDelay: this.staggerDelay || 0
  932. });
  933. // listen for transition end event
  934. this.element.addEventListener( transitionEndEvent, this, false );
  935. };
  936. // ----- events ----- //
  937. proto.onwebkitTransitionEnd = function( event ) {
  938. this.ontransitionend( event );
  939. };
  940. proto.onotransitionend = function( event ) {
  941. this.ontransitionend( event );
  942. };
  943. // properties that I munge to make my life easier
  944. var dashedVendorProperties = {
  945. '-webkit-transform': 'transform'
  946. };
  947. proto.ontransitionend = function( event ) {
  948. // disregard bubbled events from children
  949. if ( event.target !== this.element ) {
  950. return;
  951. }
  952. var _transition = this._transn;
  953. // get property name of transitioned property, convert to prefix-free
  954. var propertyName = dashedVendorProperties[ event.propertyName ] || event.propertyName;
  955. // remove property that has completed transitioning
  956. delete _transition.ingProperties[ propertyName ];
  957. // check if any properties are still transitioning
  958. if ( isEmptyObj( _transition.ingProperties ) ) {
  959. // all properties have completed transitioning
  960. this.disableTransition();
  961. }
  962. // clean style
  963. if ( propertyName in _transition.clean ) {
  964. // clean up style
  965. this.element.style[ event.propertyName ] = '';
  966. delete _transition.clean[ propertyName ];
  967. }
  968. // trigger onTransitionEnd callback
  969. if ( propertyName in _transition.onEnd ) {
  970. var onTransitionEnd = _transition.onEnd[ propertyName ];
  971. onTransitionEnd.call( this );
  972. delete _transition.onEnd[ propertyName ];
  973. }
  974. this.emitEvent( 'transitionEnd', [ this ] );
  975. };
  976. proto.disableTransition = function() {
  977. this.removeTransitionStyles();
  978. this.element.removeEventListener( transitionEndEvent, this, false );
  979. this.isTransitioning = false;
  980. };
  981. /**
  982. * removes style property from element
  983. * @param {Object} style
  984. **/
  985. proto._removeStyles = function( style ) {
  986. // clean up transition styles
  987. var cleanStyle = {};
  988. for ( var prop in style ) {
  989. cleanStyle[ prop ] = '';
  990. }
  991. this.css( cleanStyle );
  992. };
  993. var cleanTransitionStyle = {
  994. transitionProperty: '',
  995. transitionDuration: '',
  996. transitionDelay: ''
  997. };
  998. proto.removeTransitionStyles = function() {
  999. // remove transition
  1000. this.css( cleanTransitionStyle );
  1001. };
  1002. // ----- stagger ----- //
  1003. proto.stagger = function( delay ) {
  1004. delay = isNaN( delay ) ? 0 : delay;
  1005. this.staggerDelay = delay + 'ms';
  1006. };
  1007. // ----- show/hide/remove ----- //
  1008. // remove element from DOM
  1009. proto.removeElem = function() {
  1010. this.element.parentNode.removeChild( this.element );
  1011. // remove display: none
  1012. this.css({ display: '' });
  1013. this.emitEvent( 'remove', [ this ] );
  1014. };
  1015. proto.remove = function() {
  1016. // just remove element if no transition support or no transition
  1017. if ( !transitionProperty || !parseFloat( this.layout.options.transitionDuration ) ) {
  1018. this.removeElem();
  1019. return;
  1020. }
  1021. // start transition
  1022. this.once( 'transitionEnd', function() {
  1023. this.removeElem();
  1024. });
  1025. this.hide();
  1026. };
  1027. proto.reveal = function() {
  1028. delete this.isHidden;
  1029. // remove display: none
  1030. this.css({ display: '' });
  1031. var options = this.layout.options;
  1032. var onTransitionEnd = {};
  1033. var transitionEndProperty = this.getHideRevealTransitionEndProperty('visibleStyle');
  1034. onTransitionEnd[ transitionEndProperty ] = this.onRevealTransitionEnd;
  1035. this.transition({
  1036. from: options.hiddenStyle,
  1037. to: options.visibleStyle,
  1038. isCleaning: true,
  1039. onTransitionEnd: onTransitionEnd
  1040. });
  1041. };
  1042. proto.onRevealTransitionEnd = function() {
  1043. // check if still visible
  1044. // during transition, item may have been hidden
  1045. if ( !this.isHidden ) {
  1046. this.emitEvent('reveal');
  1047. }
  1048. };
  1049. /**
  1050. * get style property use for hide/reveal transition end
  1051. * @param {String} styleProperty - hiddenStyle/visibleStyle
  1052. * @returns {String}
  1053. */
  1054. proto.getHideRevealTransitionEndProperty = function( styleProperty ) {
  1055. var optionStyle = this.layout.options[ styleProperty ];
  1056. // use opacity
  1057. if ( optionStyle.opacity ) {
  1058. return 'opacity';
  1059. }
  1060. // get first property
  1061. for ( var prop in optionStyle ) {
  1062. return prop;
  1063. }
  1064. };
  1065. proto.hide = function() {
  1066. // set flag
  1067. this.isHidden = true;
  1068. // remove display: none
  1069. this.css({ display: '' });
  1070. var options = this.layout.options;
  1071. var onTransitionEnd = {};
  1072. var transitionEndProperty = this.getHideRevealTransitionEndProperty('hiddenStyle');
  1073. onTransitionEnd[ transitionEndProperty ] = this.onHideTransitionEnd;
  1074. this.transition({
  1075. from: options.visibleStyle,
  1076. to: options.hiddenStyle,
  1077. // keep hidden stuff hidden
  1078. isCleaning: true,
  1079. onTransitionEnd: onTransitionEnd
  1080. });
  1081. };
  1082. proto.onHideTransitionEnd = function() {
  1083. // check if still hidden
  1084. // during transition, item may have been un-hidden
  1085. if ( this.isHidden ) {
  1086. this.css({ display: 'none' });
  1087. this.emitEvent('hide');
  1088. }
  1089. };
  1090. proto.destroy = function() {
  1091. this.css({
  1092. position: '',
  1093. left: '',
  1094. right: '',
  1095. top: '',
  1096. bottom: '',
  1097. transition: '',
  1098. transform: ''
  1099. });
  1100. };
  1101. return Item;
  1102. }));
  1103. /*!
  1104. * Outlayer v2.1.0
  1105. * the brains and guts of a layout library
  1106. * MIT license
  1107. */
  1108. ( function( window, factory ) {
  1109. 'use strict';
  1110. // universal module definition
  1111. /* jshint strict: false */ /* globals define, module, require */
  1112. if ( typeof define == 'function' && define.amd ) {
  1113. // AMD - RequireJS
  1114. define( 'outlayer/outlayer',[
  1115. 'ev-emitter/ev-emitter',
  1116. 'get-size/get-size',
  1117. 'fizzy-ui-utils/utils',
  1118. './item'
  1119. ],
  1120. function( EvEmitter, getSize, utils, Item ) {
  1121. return factory( window, EvEmitter, getSize, utils, Item);
  1122. }
  1123. );
  1124. } else if ( typeof module == 'object' && module.exports ) {
  1125. // CommonJS - Browserify, Webpack
  1126. module.exports = factory(
  1127. window,
  1128. require('ev-emitter'),
  1129. require('get-size'),
  1130. require('fizzy-ui-utils'),
  1131. require('./item')
  1132. );
  1133. } else {
  1134. // browser global
  1135. window.Outlayer = factory(
  1136. window,
  1137. window.EvEmitter,
  1138. window.getSize,
  1139. window.fizzyUIUtils,
  1140. window.Outlayer.Item
  1141. );
  1142. }
  1143. }( window, function factory( window, EvEmitter, getSize, utils, Item ) {
  1144. 'use strict';
  1145. // ----- vars ----- //
  1146. var console = window.console;
  1147. var jQuery = window.jQuery;
  1148. var noop = function() {};
  1149. // -------------------------- Outlayer -------------------------- //
  1150. // globally unique identifiers
  1151. var GUID = 0;
  1152. // internal store of all Outlayer intances
  1153. var instances = {};
  1154. /**
  1155. * @param {Element, String} element
  1156. * @param {Object} options
  1157. * @constructor
  1158. */
  1159. function Outlayer( element, options ) {
  1160. var queryElement = utils.getQueryElement( element );
  1161. if ( !queryElement ) {
  1162. if ( console ) {
  1163. console.error( 'Bad element for ' + this.constructor.namespace +
  1164. ': ' + ( queryElement || element ) );
  1165. }
  1166. return;
  1167. }
  1168. this.element = queryElement;
  1169. // add jQuery
  1170. if ( jQuery ) {
  1171. this.$element = jQuery( this.element );
  1172. }
  1173. // options
  1174. this.options = utils.extend( {}, this.constructor.defaults );
  1175. this.option( options );
  1176. // add id for Outlayer.getFromElement
  1177. var id = ++GUID;
  1178. this.element.outlayerGUID = id; // expando
  1179. instances[ id ] = this; // associate via id
  1180. // kick it off
  1181. this._create();
  1182. var isInitLayout = this._getOption('initLayout');
  1183. if ( isInitLayout ) {
  1184. this.layout();
  1185. }
  1186. }
  1187. // settings are for internal use only
  1188. Outlayer.namespace = 'outlayer';
  1189. Outlayer.Item = Item;
  1190. // default options
  1191. Outlayer.defaults = {
  1192. containerStyle: {
  1193. position: 'relative'
  1194. },
  1195. initLayout: true,
  1196. originLeft: true,
  1197. originTop: true,
  1198. resize: true,
  1199. resizeContainer: true,
  1200. // item options
  1201. transitionDuration: '0.4s',
  1202. hiddenStyle: {
  1203. opacity: 0,
  1204. transform: 'scale(0.001)'
  1205. },
  1206. visibleStyle: {
  1207. opacity: 1,
  1208. transform: 'scale(1)'
  1209. }
  1210. };
  1211. var proto = Outlayer.prototype;
  1212. // inherit EvEmitter
  1213. utils.extend( proto, EvEmitter.prototype );
  1214. /**
  1215. * set options
  1216. * @param {Object} opts
  1217. */
  1218. proto.option = function( opts ) {
  1219. utils.extend( this.options, opts );
  1220. };
  1221. /**
  1222. * get backwards compatible option value, check old name
  1223. */
  1224. proto._getOption = function( option ) {
  1225. var oldOption = this.constructor.compatOptions[ option ];
  1226. return oldOption && this.options[ oldOption ] !== undefined ?
  1227. this.options[ oldOption ] : this.options[ option ];
  1228. };
  1229. Outlayer.compatOptions = {
  1230. // currentName: oldName
  1231. initLayout: 'isInitLayout',
  1232. horizontal: 'isHorizontal',
  1233. layoutInstant: 'isLayoutInstant',
  1234. originLeft: 'isOriginLeft',
  1235. originTop: 'isOriginTop',
  1236. resize: 'isResizeBound',
  1237. resizeContainer: 'isResizingContainer'
  1238. };
  1239. proto._create = function() {
  1240. // get items from children
  1241. this.reloadItems();
  1242. // elements that affect layout, but are not laid out
  1243. this.stamps = [];
  1244. this.stamp( this.options.stamp );
  1245. // set container style
  1246. utils.extend( this.element.style, this.options.containerStyle );
  1247. // bind resize method
  1248. var canBindResize = this._getOption('resize');
  1249. if ( canBindResize ) {
  1250. this.bindResize();
  1251. }
  1252. };
  1253. // goes through all children again and gets bricks in proper order
  1254. proto.reloadItems = function() {
  1255. // collection of item elements
  1256. this.items = this._itemize( this.element.children );
  1257. };
  1258. /**
  1259. * turn elements into Outlayer.Items to be used in layout
  1260. * @param {Array or NodeList or HTMLElement} elems
  1261. * @returns {Array} items - collection of new Outlayer Items
  1262. */
  1263. proto._itemize = function( elems ) {
  1264. var itemElems = this._filterFindItemElements( elems );
  1265. var Item = this.constructor.Item;
  1266. // create new Outlayer Items for collection
  1267. var items = [];
  1268. for ( var i=0; i < itemElems.length; i++ ) {
  1269. var elem = itemElems[i];
  1270. var item = new Item( elem, this );
  1271. items.push( item );
  1272. }
  1273. return items;
  1274. };
  1275. /**
  1276. * get item elements to be used in layout
  1277. * @param {Array or NodeList or HTMLElement} elems
  1278. * @returns {Array} items - item elements
  1279. */
  1280. proto._filterFindItemElements = function( elems ) {
  1281. return utils.filterFindElements( elems, this.options.itemSelector );
  1282. };
  1283. /**
  1284. * getter method for getting item elements
  1285. * @returns {Array} elems - collection of item elements
  1286. */
  1287. proto.getItemElements = function() {
  1288. return this.items.map( function( item ) {
  1289. return item.element;
  1290. });
  1291. };
  1292. // ----- init & layout ----- //
  1293. /**
  1294. * lays out all items
  1295. */
  1296. proto.layout = function() {
  1297. this._resetLayout();
  1298. this._manageStamps();
  1299. // don't animate first layout
  1300. var layoutInstant = this._getOption('layoutInstant');
  1301. var isInstant = layoutInstant !== undefined ?
  1302. layoutInstant : !this._isLayoutInited;
  1303. this.layoutItems( this.items, isInstant );
  1304. // flag for initalized
  1305. this._isLayoutInited = true;
  1306. };
  1307. // _init is alias for layout
  1308. proto._init = proto.layout;
  1309. /**
  1310. * logic before any new layout
  1311. */
  1312. proto._resetLayout = function() {
  1313. this.getSize();
  1314. };
  1315. proto.getSize = function() {
  1316. this.size = getSize( this.element );
  1317. };
  1318. /**
  1319. * get measurement from option, for columnWidth, rowHeight, gutter
  1320. * if option is String -> get element from selector string, & get size of element
  1321. * if option is Element -> get size of element
  1322. * else use option as a number
  1323. *
  1324. * @param {String} measurement
  1325. * @param {String} size - width or height
  1326. * @private
  1327. */
  1328. proto._getMeasurement = function( measurement, size ) {
  1329. var option = this.options[ measurement ];
  1330. var elem;
  1331. if ( !option ) {
  1332. // default to 0
  1333. this[ measurement ] = 0;
  1334. } else {
  1335. // use option as an element
  1336. if ( typeof option == 'string' ) {
  1337. elem = this.element.querySelector( option );
  1338. } else if ( option instanceof HTMLElement ) {
  1339. elem = option;
  1340. }
  1341. // use size of element, if element
  1342. this[ measurement ] = elem ? getSize( elem )[ size ] : option;
  1343. }
  1344. };
  1345. /**
  1346. * layout a collection of item elements
  1347. * @api public
  1348. */
  1349. proto.layoutItems = function( items, isInstant ) {
  1350. items = this._getItemsForLayout( items );
  1351. this._layoutItems( items, isInstant );
  1352. this._postLayout();
  1353. };
  1354. /**
  1355. * get the items to be laid out
  1356. * you may want to skip over some items
  1357. * @param {Array} items
  1358. * @returns {Array} items
  1359. */
  1360. proto._getItemsForLayout = function( items ) {
  1361. return items.filter( function( item ) {
  1362. return !item.isIgnored;
  1363. });
  1364. };
  1365. /**
  1366. * layout items
  1367. * @param {Array} items
  1368. * @param {Boolean} isInstant
  1369. */
  1370. proto._layoutItems = function( items, isInstant ) {
  1371. this._emitCompleteOnItems( 'layout', items );
  1372. if ( !items || !items.length ) {
  1373. // no items, emit event with empty array
  1374. return;
  1375. }
  1376. var queue = [];
  1377. items.forEach( function( item ) {
  1378. // get x/y object from method
  1379. var position = this._getItemLayoutPosition( item );
  1380. // enqueue
  1381. position.item = item;
  1382. position.isInstant = isInstant || item.isLayoutInstant;
  1383. queue.push( position );
  1384. }, this );
  1385. this._processLayoutQueue( queue );
  1386. };
  1387. /**
  1388. * get item layout position
  1389. * @param {Outlayer.Item} item
  1390. * @returns {Object} x and y position
  1391. */
  1392. proto._getItemLayoutPosition = function( /* item */ ) {
  1393. return {
  1394. x: 0,
  1395. y: 0
  1396. };
  1397. };
  1398. /**
  1399. * iterate over array and position each item
  1400. * Reason being - separating this logic prevents 'layout invalidation'
  1401. * thx @paul_irish
  1402. * @param {Array} queue
  1403. */
  1404. proto._processLayoutQueue = function( queue ) {
  1405. this.updateStagger();
  1406. queue.forEach( function( obj, i ) {
  1407. this._positionItem( obj.item, obj.x, obj.y, obj.isInstant, i );
  1408. }, this );
  1409. };
  1410. // set stagger from option in milliseconds number
  1411. proto.updateStagger = function() {
  1412. var stagger = this.options.stagger;
  1413. if ( stagger === null || stagger === undefined ) {
  1414. this.stagger = 0;
  1415. return;
  1416. }
  1417. this.stagger = getMilliseconds( stagger );
  1418. return this.stagger;
  1419. };
  1420. /**
  1421. * Sets position of item in DOM
  1422. * @param {Outlayer.Item} item
  1423. * @param {Number} x - horizontal position
  1424. * @param {Number} y - vertical position
  1425. * @param {Boolean} isInstant - disables transitions
  1426. */
  1427. proto._positionItem = function( item, x, y, isInstant, i ) {
  1428. if ( isInstant ) {
  1429. // if not transition, just set CSS
  1430. item.goTo( x, y );
  1431. } else {
  1432. item.stagger( i * this.stagger );
  1433. item.moveTo( x, y );
  1434. }
  1435. };
  1436. /**
  1437. * Any logic you want to do after each layout,
  1438. * i.e. size the container
  1439. */
  1440. proto._postLayout = function() {
  1441. this.resizeContainer();
  1442. };
  1443. proto.resizeContainer = function() {
  1444. var isResizingContainer = this._getOption('resizeContainer');
  1445. if ( !isResizingContainer ) {
  1446. return;
  1447. }
  1448. var size = this._getContainerSize();
  1449. if ( size ) {
  1450. this._setContainerMeasure( size.width, true );
  1451. this._setContainerMeasure( size.height, false );
  1452. }
  1453. };
  1454. /**
  1455. * Sets width or height of container if returned
  1456. * @returns {Object} size
  1457. * @param {Number} width
  1458. * @param {Number} height
  1459. */
  1460. proto._getContainerSize = noop;
  1461. /**
  1462. * @param {Number} measure - size of width or height
  1463. * @param {Boolean} isWidth
  1464. */
  1465. proto._setContainerMeasure = function( measure, isWidth ) {
  1466. if ( measure === undefined ) {
  1467. return;
  1468. }
  1469. var elemSize = this.size;
  1470. // add padding and border width if border box
  1471. if ( elemSize.isBorderBox ) {
  1472. measure += isWidth ? elemSize.paddingLeft + elemSize.paddingRight +
  1473. elemSize.borderLeftWidth + elemSize.borderRightWidth :
  1474. elemSize.paddingBottom + elemSize.paddingTop +
  1475. elemSize.borderTopWidth + elemSize.borderBottomWidth;
  1476. }
  1477. measure = Math.max( measure, 0 );
  1478. this.element.style[ isWidth ? 'width' : 'height' ] = measure + 'px';
  1479. };
  1480. /**
  1481. * emit eventComplete on a collection of items events
  1482. * @param {String} eventName
  1483. * @param {Array} items - Outlayer.Items
  1484. */
  1485. proto._emitCompleteOnItems = function( eventName, items ) {
  1486. var _this = this;
  1487. function onComplete() {
  1488. _this.dispatchEvent( eventName + 'Complete', null, [ items ] );
  1489. }
  1490. var count = items.length;
  1491. if ( !items || !count ) {
  1492. onComplete();
  1493. return;
  1494. }
  1495. var doneCount = 0;
  1496. function tick() {
  1497. doneCount++;
  1498. if ( doneCount == count ) {
  1499. onComplete();
  1500. }
  1501. }
  1502. // bind callback
  1503. items.forEach( function( item ) {
  1504. item.once( eventName, tick );
  1505. });
  1506. };
  1507. /**
  1508. * emits events via EvEmitter and jQuery events
  1509. * @param {String} type - name of event
  1510. * @param {Event} event - original event
  1511. * @param {Array} args - extra arguments
  1512. */
  1513. proto.dispatchEvent = function( type, event, args ) {
  1514. // add original event to arguments
  1515. var emitArgs = event ? [ event ].concat( args ) : args;
  1516. this.emitEvent( type, emitArgs );
  1517. if ( jQuery ) {
  1518. // set this.$element
  1519. this.$element = this.$element || jQuery( this.element );
  1520. if ( event ) {
  1521. // create jQuery event
  1522. var $event = jQuery.Event( event );
  1523. $event.type = type;
  1524. this.$element.trigger( $event, args );
  1525. } else {
  1526. // just trigger with type if no event available
  1527. this.$element.trigger( type, args );
  1528. }
  1529. }
  1530. };
  1531. // -------------------------- ignore & stamps -------------------------- //
  1532. /**
  1533. * keep item in collection, but do not lay it out
  1534. * ignored items do not get skipped in layout
  1535. * @param {Element} elem
  1536. */
  1537. proto.ignore = function( elem ) {
  1538. var item = this.getItem( elem );
  1539. if ( item ) {
  1540. item.isIgnored = true;
  1541. }
  1542. };
  1543. /**
  1544. * return item to layout collection
  1545. * @param {Element} elem
  1546. */
  1547. proto.unignore = function( elem ) {
  1548. var item = this.getItem( elem );
  1549. if ( item ) {
  1550. delete item.isIgnored;
  1551. }
  1552. };
  1553. /**
  1554. * adds elements to stamps
  1555. * @param {NodeList, Array, Element, or String} elems
  1556. */
  1557. proto.stamp = function( elems ) {
  1558. elems = this._find( elems );
  1559. if ( !elems ) {
  1560. return;
  1561. }
  1562. this.stamps = this.stamps.concat( elems );
  1563. // ignore
  1564. elems.forEach( this.ignore, this );
  1565. };
  1566. /**
  1567. * removes elements to stamps
  1568. * @param {NodeList, Array, or Element} elems
  1569. */
  1570. proto.unstamp = function( elems ) {
  1571. elems = this._find( elems );
  1572. if ( !elems ){
  1573. return;
  1574. }
  1575. elems.forEach( function( elem ) {
  1576. // filter out removed stamp elements
  1577. utils.removeFrom( this.stamps, elem );
  1578. this.unignore( elem );
  1579. }, this );
  1580. };
  1581. /**
  1582. * finds child elements
  1583. * @param {NodeList, Array, Element, or String} elems
  1584. * @returns {Array} elems
  1585. */
  1586. proto._find = function( elems ) {
  1587. if ( !elems ) {
  1588. return;
  1589. }
  1590. // if string, use argument as selector string
  1591. if ( typeof elems == 'string' ) {
  1592. elems = this.element.querySelectorAll( elems );
  1593. }
  1594. elems = utils.makeArray( elems );
  1595. return elems;
  1596. };
  1597. proto._manageStamps = function() {
  1598. if ( !this.stamps || !this.stamps.length ) {
  1599. return;
  1600. }
  1601. this._getBoundingRect();
  1602. this.stamps.forEach( this._manageStamp, this );
  1603. };
  1604. // update boundingLeft / Top
  1605. proto._getBoundingRect = function() {
  1606. // get bounding rect for container element
  1607. var boundingRect = this.element.getBoundingClientRect();
  1608. var size = this.size;
  1609. this._boundingRect = {
  1610. left: boundingRect.left + size.paddingLeft + size.borderLeftWidth,
  1611. top: boundingRect.top + size.paddingTop + size.borderTopWidth,
  1612. right: boundingRect.right - ( size.paddingRight + size.borderRightWidth ),
  1613. bottom: boundingRect.bottom - ( size.paddingBottom + size.borderBottomWidth )
  1614. };
  1615. };
  1616. /**
  1617. * @param {Element} stamp
  1618. **/
  1619. proto._manageStamp = noop;
  1620. /**
  1621. * get x/y position of element relative to container element
  1622. * @param {Element} elem
  1623. * @returns {Object} offset - has left, top, right, bottom
  1624. */
  1625. proto._getElementOffset = function( elem ) {
  1626. var boundingRect = elem.getBoundingClientRect();
  1627. var thisRect = this._boundingRect;
  1628. var size = getSize( elem );
  1629. var offset = {
  1630. left: boundingRect.left - thisRect.left - size.marginLeft,
  1631. top: boundingRect.top - thisRect.top - size.marginTop,
  1632. right: thisRect.right - boundingRect.right - size.marginRight,
  1633. bottom: thisRect.bottom - boundingRect.bottom - size.marginBottom
  1634. };
  1635. return offset;
  1636. };
  1637. // -------------------------- resize -------------------------- //
  1638. // enable event handlers for listeners
  1639. // i.e. resize -> onresize
  1640. proto.handleEvent = utils.handleEvent;
  1641. /**
  1642. * Bind layout to window resizing
  1643. */
  1644. proto.bindResize = function() {
  1645. window.addEventListener( 'resize', this );
  1646. this.isResizeBound = true;
  1647. };
  1648. /**
  1649. * Unbind layout to window resizing
  1650. */
  1651. proto.unbindResize = function() {
  1652. window.removeEventListener( 'resize', this );
  1653. this.isResizeBound = false;
  1654. };
  1655. proto.onresize = function() {
  1656. this.resize();
  1657. };
  1658. utils.debounceMethod( Outlayer, 'onresize', 100 );
  1659. proto.resize = function() {
  1660. // don't trigger if size did not change
  1661. // or if resize was unbound. See #9
  1662. if ( !this.isResizeBound || !this.needsResizeLayout() ) {
  1663. return;
  1664. }
  1665. this.layout();
  1666. };
  1667. /**
  1668. * check if layout is needed post layout
  1669. * @returns Boolean
  1670. */
  1671. proto.needsResizeLayout = function() {
  1672. var size = getSize( this.element );
  1673. // check that this.size and size are there
  1674. // IE8 triggers resize on body size change, so they might not be
  1675. var hasSizes = this.size && size;
  1676. return hasSizes && size.innerWidth !== this.size.innerWidth;
  1677. };
  1678. // -------------------------- methods -------------------------- //
  1679. /**
  1680. * add items to Outlayer instance
  1681. * @param {Array or NodeList or Element} elems
  1682. * @returns {Array} items - Outlayer.Items
  1683. **/
  1684. proto.addItems = function( elems ) {
  1685. var items = this._itemize( elems );
  1686. // add items to collection
  1687. if ( items.length ) {
  1688. this.items = this.items.concat( items );
  1689. }
  1690. return items;
  1691. };
  1692. /**
  1693. * Layout newly-appended item elements
  1694. * @param {Array or NodeList or Element} elems
  1695. */
  1696. proto.appended = function( elems ) {
  1697. var items = this.addItems( elems );
  1698. if ( !items.length ) {
  1699. return;
  1700. }
  1701. // layout and reveal just the new items
  1702. this.layoutItems( items, true );
  1703. this.reveal( items );
  1704. };
  1705. /**
  1706. * Layout prepended elements
  1707. * @param {Array or NodeList or Element} elems
  1708. */
  1709. proto.prepended = function( elems ) {
  1710. var items = this._itemize( elems );
  1711. if ( !items.length ) {
  1712. return;
  1713. }
  1714. // add items to beginning of collection
  1715. var previousItems = this.items.slice(0);
  1716. this.items = items.concat( previousItems );
  1717. // start new layout
  1718. this._resetLayout();
  1719. this._manageStamps();
  1720. // layout new stuff without transition
  1721. this.layoutItems( items, true );
  1722. this.reveal( items );
  1723. // layout previous items
  1724. this.layoutItems( previousItems );
  1725. };
  1726. /**
  1727. * reveal a collection of items
  1728. * @param {Array of Outlayer.Items} items
  1729. */
  1730. proto.reveal = function( items ) {
  1731. this._emitCompleteOnItems( 'reveal', items );
  1732. if ( !items || !items.length ) {
  1733. return;
  1734. }
  1735. var stagger = this.updateStagger();
  1736. items.forEach( function( item, i ) {
  1737. item.stagger( i * stagger );
  1738. item.reveal();
  1739. });
  1740. };
  1741. /**
  1742. * hide a collection of items
  1743. * @param {Array of Outlayer.Items} items
  1744. */
  1745. proto.hide = function( items ) {
  1746. this._emitCompleteOnItems( 'hide', items );
  1747. if ( !items || !items.length ) {
  1748. return;
  1749. }
  1750. var stagger = this.updateStagger();
  1751. items.forEach( function( item, i ) {
  1752. item.stagger( i * stagger );
  1753. item.hide();
  1754. });
  1755. };
  1756. /**
  1757. * reveal item elements
  1758. * @param {Array}, {Element}, {NodeList} items
  1759. */
  1760. proto.revealItemElements = function( elems ) {
  1761. var items = this.getItems( elems );
  1762. this.reveal( items );
  1763. };
  1764. /**
  1765. * hide item elements
  1766. * @param {Array}, {Element}, {NodeList} items
  1767. */
  1768. proto.hideItemElements = function( elems ) {
  1769. var items = this.getItems( elems );
  1770. this.hide( items );
  1771. };
  1772. /**
  1773. * get Outlayer.Item, given an Element
  1774. * @param {Element} elem
  1775. * @param {Function} callback
  1776. * @returns {Outlayer.Item} item
  1777. */
  1778. proto.getItem = function( elem ) {
  1779. // loop through items to get the one that matches
  1780. for ( var i=0; i < this.items.length; i++ ) {
  1781. var item = this.items[i];
  1782. if ( item.element == elem ) {
  1783. // return item
  1784. return item;
  1785. }
  1786. }
  1787. };
  1788. /**
  1789. * get collection of Outlayer.Items, given Elements
  1790. * @param {Array} elems
  1791. * @returns {Array} items - Outlayer.Items
  1792. */
  1793. proto.getItems = function( elems ) {
  1794. elems = utils.makeArray( elems );
  1795. var items = [];
  1796. elems.forEach( function( elem ) {
  1797. var item = this.getItem( elem );
  1798. if ( item ) {
  1799. items.push( item );
  1800. }
  1801. }, this );
  1802. return items;
  1803. };
  1804. /**
  1805. * remove element(s) from instance and DOM
  1806. * @param {Array or NodeList or Element} elems
  1807. */
  1808. proto.remove = function( elems ) {
  1809. var removeItems = this.getItems( elems );
  1810. this._emitCompleteOnItems( 'remove', removeItems );
  1811. // bail if no items to remove
  1812. if ( !removeItems || !removeItems.length ) {
  1813. return;
  1814. }
  1815. removeItems.forEach( function( item ) {
  1816. item.remove();
  1817. // remove item from collection
  1818. utils.removeFrom( this.items, item );
  1819. }, this );
  1820. };
  1821. // ----- destroy ----- //
  1822. // remove and disable Outlayer instance
  1823. proto.destroy = function() {
  1824. // clean up dynamic styles
  1825. var style = this.element.style;
  1826. style.height = '';
  1827. style.position = '';
  1828. style.width = '';
  1829. // destroy items
  1830. this.items.forEach( function( item ) {
  1831. item.destroy();
  1832. });
  1833. this.unbindResize();
  1834. var id = this.element.outlayerGUID;
  1835. delete instances[ id ]; // remove reference to instance by id
  1836. delete this.element.outlayerGUID;
  1837. // remove data for jQuery
  1838. if ( jQuery ) {
  1839. jQuery.removeData( this.element, this.constructor.namespace );
  1840. }
  1841. };
  1842. // -------------------------- data -------------------------- //
  1843. /**
  1844. * get Outlayer instance from element
  1845. * @param {Element} elem
  1846. * @returns {Outlayer}
  1847. */
  1848. Outlayer.data = function( elem ) {
  1849. elem = utils.getQueryElement( elem );
  1850. var id = elem && elem.outlayerGUID;
  1851. return id && instances[ id ];
  1852. };
  1853. // -------------------------- create Outlayer class -------------------------- //
  1854. /**
  1855. * create a layout class
  1856. * @param {String} namespace
  1857. */
  1858. Outlayer.create = function( namespace, options ) {
  1859. // sub-class Outlayer
  1860. var Layout = subclass( Outlayer );
  1861. // apply new options and compatOptions
  1862. Layout.defaults = utils.extend( {}, Outlayer.defaults );
  1863. utils.extend( Layout.defaults, options );
  1864. Layout.compatOptions = utils.extend( {}, Outlayer.compatOptions );
  1865. Layout.namespace = namespace;
  1866. Layout.data = Outlayer.data;
  1867. // sub-class Item
  1868. Layout.Item = subclass( Item );
  1869. // -------------------------- declarative -------------------------- //
  1870. utils.htmlInit( Layout, namespace );
  1871. // -------------------------- jQuery bridge -------------------------- //
  1872. // make into jQuery plugin
  1873. if ( jQuery && jQuery.bridget ) {
  1874. jQuery.bridget( namespace, Layout );
  1875. }
  1876. return Layout;
  1877. };
  1878. function subclass( Parent ) {
  1879. function SubClass() {
  1880. Parent.apply( this, arguments );
  1881. }
  1882. SubClass.prototype = Object.create( Parent.prototype );
  1883. SubClass.prototype.constructor = SubClass;
  1884. return SubClass;
  1885. }
  1886. // ----- helpers ----- //
  1887. // how many milliseconds are in each unit
  1888. var msUnits = {
  1889. ms: 1,
  1890. s: 1000
  1891. };
  1892. // munge time-like parameter into millisecond number
  1893. // '0.4s' -> 40
  1894. function getMilliseconds( time ) {
  1895. if ( typeof time == 'number' ) {
  1896. return time;
  1897. }
  1898. var matches = time.match( /(^\d*\.?\d*)(\w*)/ );
  1899. var num = matches && matches[1];
  1900. var unit = matches && matches[2];
  1901. if ( !num.length ) {
  1902. return 0;
  1903. }
  1904. num = parseFloat( num );
  1905. var mult = msUnits[ unit ] || 1;
  1906. return num * mult;
  1907. }
  1908. // ----- fin ----- //
  1909. // back in global
  1910. Outlayer.Item = Item;
  1911. return Outlayer;
  1912. }));
  1913. /**
  1914. * Isotope Item
  1915. **/
  1916. ( function( window, factory ) {
  1917. // universal module definition
  1918. /* jshint strict: false */ /*globals define, module, require */
  1919. if ( typeof define == 'function' && define.amd ) {
  1920. // AMD
  1921. define( 'isotope-layout/js/item',[
  1922. 'outlayer/outlayer'
  1923. ],
  1924. factory );
  1925. } else if ( typeof module == 'object' && module.exports ) {
  1926. // CommonJS
  1927. module.exports = factory(
  1928. require('outlayer')
  1929. );
  1930. } else {
  1931. // browser global
  1932. window.Isotope = window.Isotope || {};
  1933. window.Isotope.Item = factory(
  1934. window.Outlayer
  1935. );
  1936. }
  1937. }( window, function factory( Outlayer ) {
  1938. 'use strict';
  1939. // -------------------------- Item -------------------------- //
  1940. // sub-class Outlayer Item
  1941. function Item() {
  1942. Outlayer.Item.apply( this, arguments );
  1943. }
  1944. var proto = Item.prototype = Object.create( Outlayer.Item.prototype );
  1945. var _create = proto._create;
  1946. proto._create = function() {
  1947. // assign id, used for original-order sorting
  1948. this.id = this.layout.itemGUID++;
  1949. _create.call( this );
  1950. this.sortData = {};
  1951. };
  1952. proto.updateSortData = function() {
  1953. if ( this.isIgnored ) {
  1954. return;
  1955. }
  1956. // default sorters
  1957. this.sortData.id = this.id;
  1958. // for backward compatibility
  1959. this.sortData['original-order'] = this.id;
  1960. this.sortData.random = Math.random();
  1961. // go thru getSortData obj and apply the sorters
  1962. var getSortData = this.layout.options.getSortData;
  1963. var sorters = this.layout._sorters;
  1964. for ( var key in getSortData ) {
  1965. var sorter = sorters[ key ];
  1966. this.sortData[ key ] = sorter( this.element, this );
  1967. }
  1968. };
  1969. var _destroy = proto.destroy;
  1970. proto.destroy = function() {
  1971. // call super
  1972. _destroy.apply( this, arguments );
  1973. // reset display, #741
  1974. this.css({
  1975. display: ''
  1976. });
  1977. };
  1978. return Item;
  1979. }));
  1980. /**
  1981. * Isotope LayoutMode
  1982. */
  1983. ( function( window, factory ) {
  1984. // universal module definition
  1985. /* jshint strict: false */ /*globals define, module, require */
  1986. if ( typeof define == 'function' && define.amd ) {
  1987. // AMD
  1988. define( 'isotope-layout/js/layout-mode',[
  1989. 'get-size/get-size',
  1990. 'outlayer/outlayer'
  1991. ],
  1992. factory );
  1993. } else if ( typeof module == 'object' && module.exports ) {
  1994. // CommonJS
  1995. module.exports = factory(
  1996. require('get-size'),
  1997. require('outlayer')
  1998. );
  1999. } else {
  2000. // browser global
  2001. window.Isotope = window.Isotope || {};
  2002. window.Isotope.LayoutMode = factory(
  2003. window.getSize,
  2004. window.Outlayer
  2005. );
  2006. }
  2007. }( window, function factory( getSize, Outlayer ) {
  2008. 'use strict';
  2009. // layout mode class
  2010. function LayoutMode( isotope ) {
  2011. this.isotope = isotope;
  2012. // link properties
  2013. if ( isotope ) {
  2014. this.options = isotope.options[ this.namespace ];
  2015. this.element = isotope.element;
  2016. this.items = isotope.filteredItems;
  2017. this.size = isotope.size;
  2018. }
  2019. }
  2020. var proto = LayoutMode.prototype;
  2021. /**
  2022. * some methods should just defer to default Outlayer method
  2023. * and reference the Isotope instance as `this`
  2024. **/
  2025. var facadeMethods = [
  2026. '_resetLayout',
  2027. '_getItemLayoutPosition',
  2028. '_manageStamp',
  2029. '_getContainerSize',
  2030. '_getElementOffset',
  2031. 'needsResizeLayout',
  2032. '_getOption'
  2033. ];
  2034. facadeMethods.forEach( function( methodName ) {
  2035. proto[ methodName ] = function() {
  2036. return Outlayer.prototype[ methodName ].apply( this.isotope, arguments );
  2037. };
  2038. });
  2039. // ----- ----- //
  2040. // for horizontal layout modes, check vertical size
  2041. proto.needsVerticalResizeLayout = function() {
  2042. // don't trigger if size did not change
  2043. var size = getSize( this.isotope.element );
  2044. // check that this.size and size are there
  2045. // IE8 triggers resize on body size change, so they might not be
  2046. var hasSizes = this.isotope.size && size;
  2047. return hasSizes && size.innerHeight != this.isotope.size.innerHeight;
  2048. };
  2049. // ----- measurements ----- //
  2050. proto._getMeasurement = function() {
  2051. this.isotope._getMeasurement.apply( this, arguments );
  2052. };
  2053. proto.getColumnWidth = function() {
  2054. this.getSegmentSize( 'column', 'Width' );
  2055. };
  2056. proto.getRowHeight = function() {
  2057. this.getSegmentSize( 'row', 'Height' );
  2058. };
  2059. /**
  2060. * get columnWidth or rowHeight
  2061. * segment: 'column' or 'row'
  2062. * size 'Width' or 'Height'
  2063. **/
  2064. proto.getSegmentSize = function( segment, size ) {
  2065. var segmentName = segment + size;
  2066. var outerSize = 'outer' + size;
  2067. // columnWidth / outerWidth // rowHeight / outerHeight
  2068. this._getMeasurement( segmentName, outerSize );
  2069. // got rowHeight or columnWidth, we can chill
  2070. if ( this[ segmentName ] ) {
  2071. return;
  2072. }
  2073. // fall back to item of first element
  2074. var firstItemSize = this.getFirstItemSize();
  2075. this[ segmentName ] = firstItemSize && firstItemSize[ outerSize ] ||
  2076. // or size of container
  2077. this.isotope.size[ 'inner' + size ];
  2078. };
  2079. proto.getFirstItemSize = function() {
  2080. var firstItem = this.isotope.filteredItems[0];
  2081. return firstItem && firstItem.element && getSize( firstItem.element );
  2082. };
  2083. // ----- methods that should reference isotope ----- //
  2084. proto.layout = function() {
  2085. this.isotope.layout.apply( this.isotope, arguments );
  2086. };
  2087. proto.getSize = function() {
  2088. this.isotope.getSize();
  2089. this.size = this.isotope.size;
  2090. };
  2091. // -------------------------- create -------------------------- //
  2092. LayoutMode.modes = {};
  2093. LayoutMode.create = function( namespace, options ) {
  2094. function Mode() {
  2095. LayoutMode.apply( this, arguments );
  2096. }
  2097. Mode.prototype = Object.create( proto );
  2098. Mode.prototype.constructor = Mode;
  2099. // default options
  2100. if ( options ) {
  2101. Mode.options = options;
  2102. }
  2103. Mode.prototype.namespace = namespace;
  2104. // register in Isotope
  2105. LayoutMode.modes[ namespace ] = Mode;
  2106. return Mode;
  2107. };
  2108. return LayoutMode;
  2109. }));
  2110. /*!
  2111. * Masonry v4.2.1
  2112. * Cascading grid layout library
  2113. * https://masonry.desandro.com
  2114. * MIT License
  2115. * by David DeSandro
  2116. */
  2117. ( function( window, factory ) {
  2118. // universal module definition
  2119. /* jshint strict: false */ /*globals define, module, require */
  2120. if ( typeof define == 'function' && define.amd ) {
  2121. // AMD
  2122. define( 'masonry-layout/masonry',[
  2123. 'outlayer/outlayer',
  2124. 'get-size/get-size'
  2125. ],
  2126. factory );
  2127. } else if ( typeof module == 'object' && module.exports ) {
  2128. // CommonJS
  2129. module.exports = factory(
  2130. require('outlayer'),
  2131. require('get-size')
  2132. );
  2133. } else {
  2134. // browser global
  2135. window.Masonry = factory(
  2136. window.Outlayer,
  2137. window.getSize
  2138. );
  2139. }
  2140. }( window, function factory( Outlayer, getSize ) {
  2141. // -------------------------- masonryDefinition -------------------------- //
  2142. // create an Outlayer layout class
  2143. var Masonry = Outlayer.create('masonry');
  2144. // isFitWidth -> fitWidth
  2145. Masonry.compatOptions.fitWidth = 'isFitWidth';
  2146. var proto = Masonry.prototype;
  2147. proto._resetLayout = function() {
  2148. this.getSize();
  2149. this._getMeasurement( 'columnWidth', 'outerWidth' );
  2150. this._getMeasurement( 'gutter', 'outerWidth' );
  2151. this.measureColumns();
  2152. // reset column Y
  2153. this.colYs = [];
  2154. for ( var i=0; i < this.cols; i++ ) {
  2155. this.colYs.push( 0 );
  2156. }
  2157. this.maxY = 0;
  2158. this.horizontalColIndex = 0;
  2159. };
  2160. proto.measureColumns = function() {
  2161. this.getContainerWidth();
  2162. // if columnWidth is 0, default to outerWidth of first item
  2163. if ( !this.columnWidth ) {
  2164. var firstItem = this.items[0];
  2165. var firstItemElem = firstItem && firstItem.element;
  2166. // columnWidth fall back to item of first element
  2167. this.columnWidth = firstItemElem && getSize( firstItemElem ).outerWidth ||
  2168. // if first elem has no width, default to size of container
  2169. this.containerWidth;
  2170. }
  2171. var columnWidth = this.columnWidth += this.gutter;
  2172. // calculate columns
  2173. var containerWidth = this.containerWidth + this.gutter;
  2174. var cols = containerWidth / columnWidth;
  2175. // fix rounding errors, typically with gutters
  2176. var excess = columnWidth - containerWidth % columnWidth;
  2177. // if overshoot is less than a pixel, round up, otherwise floor it
  2178. var mathMethod = excess && excess < 1 ? 'round' : 'floor';
  2179. cols = Math[ mathMethod ]( cols );
  2180. this.cols = Math.max( cols, 1 );
  2181. };
  2182. proto.getContainerWidth = function() {
  2183. // container is parent if fit width
  2184. var isFitWidth = this._getOption('fitWidth');
  2185. var container = isFitWidth ? this.element.parentNode : this.element;
  2186. // check that this.size and size are there
  2187. // IE8 triggers resize on body size change, so they might not be
  2188. var size = getSize( container );
  2189. this.containerWidth = size && size.innerWidth;
  2190. };
  2191. proto._getItemLayoutPosition = function( item ) {
  2192. item.getSize();
  2193. // how many columns does this brick span
  2194. var remainder = item.size.outerWidth % this.columnWidth;
  2195. var mathMethod = remainder && remainder < 1 ? 'round' : 'ceil';
  2196. // round if off by 1 pixel, otherwise use ceil
  2197. var colSpan = Math[ mathMethod ]( item.size.outerWidth / this.columnWidth );
  2198. colSpan = Math.min( colSpan, this.cols );
  2199. // use horizontal or top column position
  2200. var colPosMethod = this.options.horizontalOrder ?
  2201. '_getHorizontalColPosition' : '_getTopColPosition';
  2202. var colPosition = this[ colPosMethod ]( colSpan, item );
  2203. // position the brick
  2204. var position = {
  2205. x: this.columnWidth * colPosition.col,
  2206. y: colPosition.y
  2207. };
  2208. // apply setHeight to necessary columns
  2209. var setHeight = colPosition.y + item.size.outerHeight;
  2210. var setMax = colSpan + colPosition.col;
  2211. for ( var i = colPosition.col; i < setMax; i++ ) {
  2212. this.colYs[i] = setHeight;
  2213. }
  2214. return position;
  2215. };
  2216. proto._getTopColPosition = function( colSpan ) {
  2217. var colGroup = this._getTopColGroup( colSpan );
  2218. // get the minimum Y value from the columns
  2219. var minimumY = Math.min.apply( Math, colGroup );
  2220. return {
  2221. col: colGroup.indexOf( minimumY ),
  2222. y: minimumY,
  2223. };
  2224. };
  2225. /**
  2226. * @param {Number} colSpan - number of columns the element spans
  2227. * @returns {Array} colGroup
  2228. */
  2229. proto._getTopColGroup = function( colSpan ) {
  2230. if ( colSpan < 2 ) {
  2231. // if brick spans only one column, use all the column Ys
  2232. return this.colYs;
  2233. }
  2234. var colGroup = [];
  2235. // how many different places could this brick fit horizontally
  2236. var groupCount = this.cols + 1 - colSpan;
  2237. // for each group potential horizontal position
  2238. for ( var i = 0; i < groupCount; i++ ) {
  2239. colGroup[i] = this._getColGroupY( i, colSpan );
  2240. }
  2241. return colGroup;
  2242. };
  2243. proto._getColGroupY = function( col, colSpan ) {
  2244. if ( colSpan < 2 ) {
  2245. return this.colYs[ col ];
  2246. }
  2247. // make an array of colY values for that one group
  2248. var groupColYs = this.colYs.slice( col, col + colSpan );
  2249. // and get the max value of the array
  2250. return Math.max.apply( Math, groupColYs );
  2251. };
  2252. // get column position based on horizontal index. #873
  2253. proto._getHorizontalColPosition = function( colSpan, item ) {
  2254. var col = this.horizontalColIndex % this.cols;
  2255. var isOver = colSpan > 1 && col + colSpan > this.cols;
  2256. // shift to next row if item can't fit on current row
  2257. col = isOver ? 0 : col;
  2258. // don't let zero-size items take up space
  2259. var hasSize = item.size.outerWidth && item.size.outerHeight;
  2260. this.horizontalColIndex = hasSize ? col + colSpan : this.horizontalColIndex;
  2261. return {
  2262. col: col,
  2263. y: this._getColGroupY( col, colSpan ),
  2264. };
  2265. };
  2266. proto._manageStamp = function( stamp ) {
  2267. var stampSize = getSize( stamp );
  2268. var offset = this._getElementOffset( stamp );
  2269. // get the columns that this stamp affects
  2270. var isOriginLeft = this._getOption('originLeft');
  2271. var firstX = isOriginLeft ? offset.left : offset.right;
  2272. var lastX = firstX + stampSize.outerWidth;
  2273. var firstCol = Math.floor( firstX / this.columnWidth );
  2274. firstCol = Math.max( 0, firstCol );
  2275. var lastCol = Math.floor( lastX / this.columnWidth );
  2276. // lastCol should not go over if multiple of columnWidth #425
  2277. lastCol -= lastX % this.columnWidth ? 0 : 1;
  2278. lastCol = Math.min( this.cols - 1, lastCol );
  2279. // set colYs to bottom of the stamp
  2280. var isOriginTop = this._getOption('originTop');
  2281. var stampMaxY = ( isOriginTop ? offset.top : offset.bottom ) +
  2282. stampSize.outerHeight;
  2283. for ( var i = firstCol; i <= lastCol; i++ ) {
  2284. this.colYs[i] = Math.max( stampMaxY, this.colYs[i] );
  2285. }
  2286. };
  2287. proto._getContainerSize = function() {
  2288. this.maxY = Math.max.apply( Math, this.colYs );
  2289. var size = {
  2290. height: this.maxY
  2291. };
  2292. if ( this._getOption('fitWidth') ) {
  2293. size.width = this._getContainerFitWidth();
  2294. }
  2295. return size;
  2296. };
  2297. proto._getContainerFitWidth = function() {
  2298. var unusedCols = 0;
  2299. // count unused columns
  2300. var i = this.cols;
  2301. while ( --i ) {
  2302. if ( this.colYs[i] !== 0 ) {
  2303. break;
  2304. }
  2305. unusedCols++;
  2306. }
  2307. // fit container to columns that have been used
  2308. return ( this.cols - unusedCols ) * this.columnWidth - this.gutter;
  2309. };
  2310. proto.needsResizeLayout = function() {
  2311. var previousWidth = this.containerWidth;
  2312. this.getContainerWidth();
  2313. return previousWidth != this.containerWidth;
  2314. };
  2315. return Masonry;
  2316. }));
  2317. /*!
  2318. * Masonry layout mode
  2319. * sub-classes Masonry
  2320. * https://masonry.desandro.com
  2321. */
  2322. ( function( window, factory ) {
  2323. // universal module definition
  2324. /* jshint strict: false */ /*globals define, module, require */
  2325. if ( typeof define == 'function' && define.amd ) {
  2326. // AMD
  2327. define( 'isotope-layout/js/layout-modes/masonry',[
  2328. '../layout-mode',
  2329. 'masonry-layout/masonry'
  2330. ],
  2331. factory );
  2332. } else if ( typeof module == 'object' && module.exports ) {
  2333. // CommonJS
  2334. module.exports = factory(
  2335. require('../layout-mode'),
  2336. require('masonry-layout')
  2337. );
  2338. } else {
  2339. // browser global
  2340. factory(
  2341. window.Isotope.LayoutMode,
  2342. window.Masonry
  2343. );
  2344. }
  2345. }( window, function factory( LayoutMode, Masonry ) {
  2346. 'use strict';
  2347. // -------------------------- masonryDefinition -------------------------- //
  2348. // create an Outlayer layout class
  2349. var MasonryMode = LayoutMode.create('masonry');
  2350. var proto = MasonryMode.prototype;
  2351. var keepModeMethods = {
  2352. _getElementOffset: true,
  2353. layout: true,
  2354. _getMeasurement: true
  2355. };
  2356. // inherit Masonry prototype
  2357. for ( var method in Masonry.prototype ) {
  2358. // do not inherit mode methods
  2359. if ( !keepModeMethods[ method ] ) {
  2360. proto[ method ] = Masonry.prototype[ method ];
  2361. }
  2362. }
  2363. var measureColumns = proto.measureColumns;
  2364. proto.measureColumns = function() {
  2365. // set items, used if measuring first item
  2366. this.items = this.isotope.filteredItems;
  2367. measureColumns.call( this );
  2368. };
  2369. // point to mode options for fitWidth
  2370. var _getOption = proto._getOption;
  2371. proto._getOption = function( option ) {
  2372. if ( option == 'fitWidth' ) {
  2373. return this.options.isFitWidth !== undefined ?
  2374. this.options.isFitWidth : this.options.fitWidth;
  2375. }
  2376. return _getOption.apply( this.isotope, arguments );
  2377. };
  2378. return MasonryMode;
  2379. }));
  2380. /**
  2381. * fitRows layout mode
  2382. */
  2383. ( function( window, factory ) {
  2384. // universal module definition
  2385. /* jshint strict: false */ /*globals define, module, require */
  2386. if ( typeof define == 'function' && define.amd ) {
  2387. // AMD
  2388. define( 'isotope-layout/js/layout-modes/fit-rows',[
  2389. '../layout-mode'
  2390. ],
  2391. factory );
  2392. } else if ( typeof exports == 'object' ) {
  2393. // CommonJS
  2394. module.exports = factory(
  2395. require('../layout-mode')
  2396. );
  2397. } else {
  2398. // browser global
  2399. factory(
  2400. window.Isotope.LayoutMode
  2401. );
  2402. }
  2403. }( window, function factory( LayoutMode ) {
  2404. 'use strict';
  2405. var FitRows = LayoutMode.create('fitRows');
  2406. var proto = FitRows.prototype;
  2407. proto._resetLayout = function() {
  2408. this.x = 0;
  2409. this.y = 0;
  2410. this.maxY = 0;
  2411. this._getMeasurement( 'gutter', 'outerWidth' );
  2412. };
  2413. proto._getItemLayoutPosition = function( item ) {
  2414. item.getSize();
  2415. var itemWidth = item.size.outerWidth + this.gutter;
  2416. // if this element cannot fit in the current row
  2417. var containerWidth = this.isotope.size.innerWidth + this.gutter;
  2418. if ( this.x !== 0 && itemWidth + this.x > containerWidth ) {
  2419. this.x = 0;
  2420. this.y = this.maxY;
  2421. }
  2422. var position = {
  2423. x: this.x,
  2424. y: this.y
  2425. };
  2426. this.maxY = Math.max( this.maxY, this.y + item.size.outerHeight );
  2427. this.x += itemWidth;
  2428. return position;
  2429. };
  2430. proto._getContainerSize = function() {
  2431. return { height: this.maxY };
  2432. };
  2433. return FitRows;
  2434. }));
  2435. /**
  2436. * vertical layout mode
  2437. */
  2438. ( function( window, factory ) {
  2439. // universal module definition
  2440. /* jshint strict: false */ /*globals define, module, require */
  2441. if ( typeof define == 'function' && define.amd ) {
  2442. // AMD
  2443. define( 'isotope-layout/js/layout-modes/vertical',[
  2444. '../layout-mode'
  2445. ],
  2446. factory );
  2447. } else if ( typeof module == 'object' && module.exports ) {
  2448. // CommonJS
  2449. module.exports = factory(
  2450. require('../layout-mode')
  2451. );
  2452. } else {
  2453. // browser global
  2454. factory(
  2455. window.Isotope.LayoutMode
  2456. );
  2457. }
  2458. }( window, function factory( LayoutMode ) {
  2459. 'use strict';
  2460. var Vertical = LayoutMode.create( 'vertical', {
  2461. horizontalAlignment: 0
  2462. });
  2463. var proto = Vertical.prototype;
  2464. proto._resetLayout = function() {
  2465. this.y = 0;
  2466. };
  2467. proto._getItemLayoutPosition = function( item ) {
  2468. item.getSize();
  2469. var x = ( this.isotope.size.innerWidth - item.size.outerWidth ) *
  2470. this.options.horizontalAlignment;
  2471. var y = this.y;
  2472. this.y += item.size.outerHeight;
  2473. return { x: x, y: y };
  2474. };
  2475. proto._getContainerSize = function() {
  2476. return { height: this.y };
  2477. };
  2478. return Vertical;
  2479. }));
  2480. /*!
  2481. * Isotope v3.0.5
  2482. *
  2483. * Licensed GPLv3 for open source use
  2484. * or Isotope Commercial License for commercial use
  2485. *
  2486. * https://isotope.metafizzy.co
  2487. * Copyright 2017 Metafizzy
  2488. */
  2489. ( function( window, factory ) {
  2490. // universal module definition
  2491. /* jshint strict: false */ /*globals define, module, require */
  2492. if ( typeof define == 'function' && define.amd ) {
  2493. // AMD
  2494. define( [
  2495. 'outlayer/outlayer',
  2496. 'get-size/get-size',
  2497. 'desandro-matches-selector/matches-selector',
  2498. 'fizzy-ui-utils/utils',
  2499. 'isotope-layout/js/item',
  2500. 'isotope-layout/js/layout-mode',
  2501. // include default layout modes
  2502. 'isotope-layout/js/layout-modes/masonry',
  2503. 'isotope-layout/js/layout-modes/fit-rows',
  2504. 'isotope-layout/js/layout-modes/vertical'
  2505. ],
  2506. function( Outlayer, getSize, matchesSelector, utils, Item, LayoutMode ) {
  2507. return factory( window, Outlayer, getSize, matchesSelector, utils, Item, LayoutMode );
  2508. });
  2509. } else if ( typeof module == 'object' && module.exports ) {
  2510. // CommonJS
  2511. module.exports = factory(
  2512. window,
  2513. require('outlayer'),
  2514. require('get-size'),
  2515. require('desandro-matches-selector'),
  2516. require('fizzy-ui-utils'),
  2517. require('isotope-layout/js/item'),
  2518. require('isotope-layout/js/layout-mode'),
  2519. // include default layout modes
  2520. require('isotope-layout/js/layout-modes/masonry'),
  2521. require('isotope-layout/js/layout-modes/fit-rows'),
  2522. require('isotope-layout/js/layout-modes/vertical')
  2523. );
  2524. } else {
  2525. // browser global
  2526. window.Isotope = factory(
  2527. window,
  2528. window.Outlayer,
  2529. window.getSize,
  2530. window.matchesSelector,
  2531. window.fizzyUIUtils,
  2532. window.Isotope.Item,
  2533. window.Isotope.LayoutMode
  2534. );
  2535. }
  2536. }( window, function factory( window, Outlayer, getSize, matchesSelector, utils,
  2537. Item, LayoutMode ) {
  2538. // -------------------------- vars -------------------------- //
  2539. var jQuery = window.jQuery;
  2540. // -------------------------- helpers -------------------------- //
  2541. var trim = String.prototype.trim ?
  2542. function( str ) {
  2543. return str.trim();
  2544. } :
  2545. function( str ) {
  2546. return str.replace( /^\s+|\s+$/g, '' );
  2547. };
  2548. // -------------------------- isotopeDefinition -------------------------- //
  2549. // create an Outlayer layout class
  2550. var Isotope = Outlayer.create( 'isotope', {
  2551. layoutMode: 'masonry',
  2552. isJQueryFiltering: true,
  2553. sortAscending: true
  2554. });
  2555. Isotope.Item = Item;
  2556. Isotope.LayoutMode = LayoutMode;
  2557. var proto = Isotope.prototype;
  2558. proto._create = function() {
  2559. this.itemGUID = 0;
  2560. // functions that sort items
  2561. this._sorters = {};
  2562. this._getSorters();
  2563. // call super
  2564. Outlayer.prototype._create.call( this );
  2565. // create layout modes
  2566. this.modes = {};
  2567. // start filteredItems with all items
  2568. this.filteredItems = this.items;
  2569. // keep of track of sortBys
  2570. this.sortHistory = [ 'original-order' ];
  2571. // create from registered layout modes
  2572. for ( var name in LayoutMode.modes ) {
  2573. this._initLayoutMode( name );
  2574. }
  2575. };
  2576. proto.reloadItems = function() {
  2577. // reset item ID counter
  2578. this.itemGUID = 0;
  2579. // call super
  2580. Outlayer.prototype.reloadItems.call( this );
  2581. };
  2582. proto._itemize = function() {
  2583. var items = Outlayer.prototype._itemize.apply( this, arguments );
  2584. // assign ID for original-order
  2585. for ( var i=0; i < items.length; i++ ) {
  2586. var item = items[i];
  2587. item.id = this.itemGUID++;
  2588. }
  2589. this._updateItemsSortData( items );
  2590. return items;
  2591. };
  2592. // -------------------------- layout -------------------------- //
  2593. proto._initLayoutMode = function( name ) {
  2594. var Mode = LayoutMode.modes[ name ];
  2595. // set mode options
  2596. // HACK extend initial options, back-fill in default options
  2597. var initialOpts = this.options[ name ] || {};
  2598. this.options[ name ] = Mode.options ?
  2599. utils.extend( Mode.options, initialOpts ) : initialOpts;
  2600. // init layout mode instance
  2601. this.modes[ name ] = new Mode( this );
  2602. };
  2603. proto.layout = function() {
  2604. // if first time doing layout, do all magic
  2605. if ( !this._isLayoutInited && this._getOption('initLayout') ) {
  2606. this.arrange();
  2607. return;
  2608. }
  2609. this._layout();
  2610. };
  2611. // private method to be used in layout() & magic()
  2612. proto._layout = function() {
  2613. // don't animate first layout
  2614. var isInstant = this._getIsInstant();
  2615. // layout flow
  2616. this._resetLayout();
  2617. this._manageStamps();
  2618. this.layoutItems( this.filteredItems, isInstant );
  2619. // flag for initalized
  2620. this._isLayoutInited = true;
  2621. };
  2622. // filter + sort + layout
  2623. proto.arrange = function( opts ) {
  2624. // set any options pass
  2625. this.option( opts );
  2626. this._getIsInstant();
  2627. // filter, sort, and layout
  2628. // filter
  2629. var filtered = this._filter( this.items );
  2630. this.filteredItems = filtered.matches;
  2631. this._bindArrangeComplete();
  2632. if ( this._isInstant ) {
  2633. this._noTransition( this._hideReveal, [ filtered ] );
  2634. } else {
  2635. this._hideReveal( filtered );
  2636. }
  2637. this._sort();
  2638. this._layout();
  2639. };
  2640. // alias to _init for main plugin method
  2641. proto._init = proto.arrange;
  2642. proto._hideReveal = function( filtered ) {
  2643. this.reveal( filtered.needReveal );
  2644. this.hide( filtered.needHide );
  2645. };
  2646. // HACK
  2647. // Don't animate/transition first layout
  2648. // Or don't animate/transition other layouts
  2649. proto._getIsInstant = function() {
  2650. var isLayoutInstant = this._getOption('layoutInstant');
  2651. var isInstant = isLayoutInstant !== undefined ? isLayoutInstant :
  2652. !this._isLayoutInited;
  2653. this._isInstant = isInstant;
  2654. return isInstant;
  2655. };
  2656. // listen for layoutComplete, hideComplete and revealComplete
  2657. // to trigger arrangeComplete
  2658. proto._bindArrangeComplete = function() {
  2659. // listen for 3 events to trigger arrangeComplete
  2660. var isLayoutComplete, isHideComplete, isRevealComplete;
  2661. var _this = this;
  2662. function arrangeParallelCallback() {
  2663. if ( isLayoutComplete && isHideComplete && isRevealComplete ) {
  2664. _this.dispatchEvent( 'arrangeComplete', null, [ _this.filteredItems ] );
  2665. }
  2666. }
  2667. this.once( 'layoutComplete', function() {
  2668. isLayoutComplete = true;
  2669. arrangeParallelCallback();
  2670. });
  2671. this.once( 'hideComplete', function() {
  2672. isHideComplete = true;
  2673. arrangeParallelCallback();
  2674. });
  2675. this.once( 'revealComplete', function() {
  2676. isRevealComplete = true;
  2677. arrangeParallelCallback();
  2678. });
  2679. };
  2680. // -------------------------- filter -------------------------- //
  2681. proto._filter = function( items ) {
  2682. var filter = this.options.filter;
  2683. filter = filter || '*';
  2684. var matches = [];
  2685. var hiddenMatched = [];
  2686. var visibleUnmatched = [];
  2687. var test = this._getFilterTest( filter );
  2688. // test each item
  2689. for ( var i=0; i < items.length; i++ ) {
  2690. var item = items[i];
  2691. if ( item.isIgnored ) {
  2692. continue;
  2693. }
  2694. // add item to either matched or unmatched group
  2695. var isMatched = test( item );
  2696. // item.isFilterMatched = isMatched;
  2697. // add to matches if its a match
  2698. if ( isMatched ) {
  2699. matches.push( item );
  2700. }
  2701. // add to additional group if item needs to be hidden or revealed
  2702. if ( isMatched && item.isHidden ) {
  2703. hiddenMatched.push( item );
  2704. } else if ( !isMatched && !item.isHidden ) {
  2705. visibleUnmatched.push( item );
  2706. }
  2707. }
  2708. // return collections of items to be manipulated
  2709. return {
  2710. matches: matches,
  2711. needReveal: hiddenMatched,
  2712. needHide: visibleUnmatched
  2713. };
  2714. };
  2715. // get a jQuery, function, or a matchesSelector test given the filter
  2716. proto._getFilterTest = function( filter ) {
  2717. if ( jQuery && this.options.isJQueryFiltering ) {
  2718. // use jQuery
  2719. return function( item ) {
  2720. return jQuery( item.element ).is( filter );
  2721. };
  2722. }
  2723. if ( typeof filter == 'function' ) {
  2724. // use filter as function
  2725. return function( item ) {
  2726. return filter( item.element );
  2727. };
  2728. }
  2729. // default, use filter as selector string
  2730. return function( item ) {
  2731. return matchesSelector( item.element, filter );
  2732. };
  2733. };
  2734. // -------------------------- sorting -------------------------- //
  2735. /**
  2736. * @params {Array} elems
  2737. * @public
  2738. */
  2739. proto.updateSortData = function( elems ) {
  2740. // get items
  2741. var items;
  2742. if ( elems ) {
  2743. elems = utils.makeArray( elems );
  2744. items = this.getItems( elems );
  2745. } else {
  2746. // update all items if no elems provided
  2747. items = this.items;
  2748. }
  2749. this._getSorters();
  2750. this._updateItemsSortData( items );
  2751. };
  2752. proto._getSorters = function() {
  2753. var getSortData = this.options.getSortData;
  2754. for ( var key in getSortData ) {
  2755. var sorter = getSortData[ key ];
  2756. this._sorters[ key ] = mungeSorter( sorter );
  2757. }
  2758. };
  2759. /**
  2760. * @params {Array} items - of Isotope.Items
  2761. * @private
  2762. */
  2763. proto._updateItemsSortData = function( items ) {
  2764. // do not update if no items
  2765. var len = items && items.length;
  2766. for ( var i=0; len && i < len; i++ ) {
  2767. var item = items[i];
  2768. item.updateSortData();
  2769. }
  2770. };
  2771. // ----- munge sorter ----- //
  2772. // encapsulate this, as we just need mungeSorter
  2773. // other functions in here are just for munging
  2774. var mungeSorter = ( function() {
  2775. // add a magic layer to sorters for convienent shorthands
  2776. // `.foo-bar` will use the text of .foo-bar querySelector
  2777. // `[foo-bar]` will use attribute
  2778. // you can also add parser
  2779. // `.foo-bar parseInt` will parse that as a number
  2780. function mungeSorter( sorter ) {
  2781. // if not a string, return function or whatever it is
  2782. if ( typeof sorter != 'string' ) {
  2783. return sorter;
  2784. }
  2785. // parse the sorter string
  2786. var args = trim( sorter ).split(' ');
  2787. var query = args[0];
  2788. // check if query looks like [an-attribute]
  2789. var attrMatch = query.match( /^\[(.+)\]$/ );
  2790. var attr = attrMatch && attrMatch[1];
  2791. var getValue = getValueGetter( attr, query );
  2792. // use second argument as a parser
  2793. var parser = Isotope.sortDataParsers[ args[1] ];
  2794. // parse the value, if there was a parser
  2795. sorter = parser ? function( elem ) {
  2796. return elem && parser( getValue( elem ) );
  2797. } :
  2798. // otherwise just return value
  2799. function( elem ) {
  2800. return elem && getValue( elem );
  2801. };
  2802. return sorter;
  2803. }
  2804. // get an attribute getter, or get text of the querySelector
  2805. function getValueGetter( attr, query ) {
  2806. // if query looks like [foo-bar], get attribute
  2807. if ( attr ) {
  2808. return function getAttribute( elem ) {
  2809. return elem.getAttribute( attr );
  2810. };
  2811. }
  2812. // otherwise, assume its a querySelector, and get its text
  2813. return function getChildText( elem ) {
  2814. var child = elem.querySelector( query );
  2815. return child && child.textContent;
  2816. };
  2817. }
  2818. return mungeSorter;
  2819. })();
  2820. // parsers used in getSortData shortcut strings
  2821. Isotope.sortDataParsers = {
  2822. 'parseInt': function( val ) {
  2823. return parseInt( val, 10 );
  2824. },
  2825. 'parseFloat': function( val ) {
  2826. return parseFloat( val );
  2827. }
  2828. };
  2829. // ----- sort method ----- //
  2830. // sort filteredItem order
  2831. proto._sort = function() {
  2832. if ( !this.options.sortBy ) {
  2833. return;
  2834. }
  2835. // keep track of sortBy History
  2836. var sortBys = utils.makeArray( this.options.sortBy );
  2837. if ( !this._getIsSameSortBy( sortBys ) ) {
  2838. // concat all sortBy and sortHistory, add to front, oldest goes in last
  2839. this.sortHistory = sortBys.concat( this.sortHistory );
  2840. }
  2841. // sort magic
  2842. var itemSorter = getItemSorter( this.sortHistory, this.options.sortAscending );
  2843. this.filteredItems.sort( itemSorter );
  2844. };
  2845. // check if sortBys is same as start of sortHistory
  2846. proto._getIsSameSortBy = function( sortBys ) {
  2847. for ( var i=0; i < sortBys.length; i++ ) {
  2848. if ( sortBys[i] != this.sortHistory[i] ) {
  2849. return false;
  2850. }
  2851. }
  2852. return true;
  2853. };
  2854. // returns a function used for sorting
  2855. function getItemSorter( sortBys, sortAsc ) {
  2856. return function sorter( itemA, itemB ) {
  2857. // cycle through all sortKeys
  2858. for ( var i = 0; i < sortBys.length; i++ ) {
  2859. var sortBy = sortBys[i];
  2860. var a = itemA.sortData[ sortBy ];
  2861. var b = itemB.sortData[ sortBy ];
  2862. if ( a > b || a < b ) {
  2863. // if sortAsc is an object, use the value given the sortBy key
  2864. var isAscending = sortAsc[ sortBy ] !== undefined ? sortAsc[ sortBy ] : sortAsc;
  2865. var direction = isAscending ? 1 : -1;
  2866. return ( a > b ? 1 : -1 ) * direction;
  2867. }
  2868. }
  2869. return 0;
  2870. };
  2871. }
  2872. // -------------------------- methods -------------------------- //
  2873. // get layout mode
  2874. proto._mode = function() {
  2875. var layoutMode = this.options.layoutMode;
  2876. var mode = this.modes[ layoutMode ];
  2877. if ( !mode ) {
  2878. // TODO console.error
  2879. throw new Error( 'No layout mode: ' + layoutMode );
  2880. }
  2881. // HACK sync mode's options
  2882. // any options set after init for layout mode need to be synced
  2883. mode.options = this.options[ layoutMode ];
  2884. return mode;
  2885. };
  2886. proto._resetLayout = function() {
  2887. // trigger original reset layout
  2888. Outlayer.prototype._resetLayout.call( this );
  2889. this._mode()._resetLayout();
  2890. };
  2891. proto._getItemLayoutPosition = function( item ) {
  2892. return this._mode()._getItemLayoutPosition( item );
  2893. };
  2894. proto._manageStamp = function( stamp ) {
  2895. this._mode()._manageStamp( stamp );
  2896. };
  2897. proto._getContainerSize = function() {
  2898. return this._mode()._getContainerSize();
  2899. };
  2900. proto.needsResizeLayout = function() {
  2901. return this._mode().needsResizeLayout();
  2902. };
  2903. // -------------------------- adding & removing -------------------------- //
  2904. // HEADS UP overwrites default Outlayer appended
  2905. proto.appended = function( elems ) {
  2906. var items = this.addItems( elems );
  2907. if ( !items.length ) {
  2908. return;
  2909. }
  2910. // filter, layout, reveal new items
  2911. var filteredItems = this._filterRevealAdded( items );
  2912. // add to filteredItems
  2913. this.filteredItems = this.filteredItems.concat( filteredItems );
  2914. };
  2915. // HEADS UP overwrites default Outlayer prepended
  2916. proto.prepended = function( elems ) {
  2917. var items = this._itemize( elems );
  2918. if ( !items.length ) {
  2919. return;
  2920. }
  2921. // start new layout
  2922. this._resetLayout();
  2923. this._manageStamps();
  2924. // filter, layout, reveal new items
  2925. var filteredItems = this._filterRevealAdded( items );
  2926. // layout previous items
  2927. this.layoutItems( this.filteredItems );
  2928. // add to items and filteredItems
  2929. this.filteredItems = filteredItems.concat( this.filteredItems );
  2930. this.items = items.concat( this.items );
  2931. };
  2932. proto._filterRevealAdded = function( items ) {
  2933. var filtered = this._filter( items );
  2934. this.hide( filtered.needHide );
  2935. // reveal all new items
  2936. this.reveal( filtered.matches );
  2937. // layout new items, no transition
  2938. this.layoutItems( filtered.matches, true );
  2939. return filtered.matches;
  2940. };
  2941. /**
  2942. * Filter, sort, and layout newly-appended item elements
  2943. * @param {Array or NodeList or Element} elems
  2944. */
  2945. proto.insert = function( elems ) {
  2946. var items = this.addItems( elems );
  2947. if ( !items.length ) {
  2948. return;
  2949. }
  2950. // append item elements
  2951. var i, item;
  2952. var len = items.length;
  2953. for ( i=0; i < len; i++ ) {
  2954. item = items[i];
  2955. this.element.appendChild( item.element );
  2956. }
  2957. // filter new stuff
  2958. var filteredInsertItems = this._filter( items ).matches;
  2959. // set flag
  2960. for ( i=0; i < len; i++ ) {
  2961. items[i].isLayoutInstant = true;
  2962. }
  2963. this.arrange();
  2964. // reset flag
  2965. for ( i=0; i < len; i++ ) {
  2966. delete items[i].isLayoutInstant;
  2967. }
  2968. this.reveal( filteredInsertItems );
  2969. };
  2970. var _remove = proto.remove;
  2971. proto.remove = function( elems ) {
  2972. elems = utils.makeArray( elems );
  2973. var removeItems = this.getItems( elems );
  2974. // do regular thing
  2975. _remove.call( this, elems );
  2976. // bail if no items to remove
  2977. var len = removeItems && removeItems.length;
  2978. // remove elems from filteredItems
  2979. for ( var i=0; len && i < len; i++ ) {
  2980. var item = removeItems[i];
  2981. // remove item from collection
  2982. utils.removeFrom( this.filteredItems, item );
  2983. }
  2984. };
  2985. proto.shuffle = function() {
  2986. // update random sortData
  2987. for ( var i=0; i < this.items.length; i++ ) {
  2988. var item = this.items[i];
  2989. item.sortData.random = Math.random();
  2990. }
  2991. this.options.sortBy = 'random';
  2992. this._sort();
  2993. this._layout();
  2994. };
  2995. /**
  2996. * trigger fn without transition
  2997. * kind of hacky to have this in the first place
  2998. * @param {Function} fn
  2999. * @param {Array} args
  3000. * @returns ret
  3001. * @private
  3002. */
  3003. proto._noTransition = function( fn, args ) {
  3004. // save transitionDuration before disabling
  3005. var transitionDuration = this.options.transitionDuration;
  3006. // disable transition
  3007. this.options.transitionDuration = 0;
  3008. // do it
  3009. var returnValue = fn.apply( this, args );
  3010. // re-enable transition for reveal
  3011. this.options.transitionDuration = transitionDuration;
  3012. return returnValue;
  3013. };
  3014. // ----- helper methods ----- //
  3015. /**
  3016. * getter method for getting filtered item elements
  3017. * @returns {Array} elems - collection of item elements
  3018. */
  3019. proto.getFilteredItemElements = function() {
  3020. return this.filteredItems.map( function( item ) {
  3021. return item.element;
  3022. });
  3023. };
  3024. // ----- ----- //
  3025. return Isotope;
  3026. }));