scrollreveal.js 42 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551
  1. /*! @license ScrollReveal v4.0.1
  2. Copyright 2018 Fisssion LLC.
  3. Licensed under the GNU General Public License 3.0 for
  4. compatible open source projects and non-commercial use.
  5. For commercial sites, themes, projects, and applications,
  6. keep your source code private/proprietary by purchasing
  7. a commercial license from https://scrollrevealjs.org/
  8. */
  9. (function (global, factory) {
  10. typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  11. typeof define === 'function' && define.amd ? define(factory) :
  12. (global.ScrollReveal = factory());
  13. }(this, (function () { 'use strict';
  14. var defaults = {
  15. delay: 0,
  16. distance: '0',
  17. duration: 600,
  18. easing: 'cubic-bezier(0.5, 0, 0, 1)',
  19. interval: 0,
  20. opacity: 0,
  21. origin: 'bottom',
  22. rotate: {
  23. x: 0,
  24. y: 0,
  25. z: 0
  26. },
  27. scale: 1,
  28. cleanup: true,
  29. container: document.documentElement,
  30. desktop: true,
  31. mobile: true,
  32. reset: false,
  33. useDelay: 'always',
  34. viewFactor: 0.0,
  35. viewOffset: {
  36. top: 0,
  37. right: 0,
  38. bottom: 0,
  39. left: 0
  40. },
  41. afterReset: function afterReset() {},
  42. afterReveal: function afterReveal() {},
  43. beforeReset: function beforeReset() {},
  44. beforeReveal: function beforeReveal() {}
  45. }
  46. function failure() {
  47. var root = document.documentElement;
  48. root.classList.remove('sr');
  49. return {
  50. clean: function clean() {},
  51. destroy: function destroy() {},
  52. reveal: function reveal() {},
  53. sync: function sync() {},
  54. get noop() {
  55. return true
  56. }
  57. }
  58. }
  59. function success() {
  60. var html = document.documentElement;
  61. var body = document.body;
  62. html.classList.add('sr');
  63. if (body) {
  64. body.style.height = '100%';
  65. } else {
  66. document.addEventListener('DOMContentLoaded', function () {
  67. body.style.height = '100%';
  68. });
  69. }
  70. }
  71. var mount = { success: success, failure: failure }
  72. /*! @license is-dom-node v1.0.4
  73. Copyright 2018 Fisssion LLC.
  74. Permission is hereby granted, free of charge, to any person obtaining a copy
  75. of this software and associated documentation files (the "Software"), to deal
  76. in the Software without restriction, including without limitation the rights
  77. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  78. copies of the Software, and to permit persons to whom the Software is
  79. furnished to do so, subject to the following conditions:
  80. The above copyright notice and this permission notice shall be included in all
  81. copies or substantial portions of the Software.
  82. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  83. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  84. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  85. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  86. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  87. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  88. SOFTWARE.
  89. */
  90. function isDomNode(x) {
  91. return typeof window.Node === 'object'
  92. ? x instanceof window.Node
  93. : x !== null &&
  94. typeof x === 'object' &&
  95. typeof x.nodeType === 'number' &&
  96. typeof x.nodeName === 'string'
  97. }
  98. /*! @license is-dom-node-list v1.2.1
  99. Copyright 2018 Fisssion LLC.
  100. Permission is hereby granted, free of charge, to any person obtaining a copy
  101. of this software and associated documentation files (the "Software"), to deal
  102. in the Software without restriction, including without limitation the rights
  103. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  104. copies of the Software, and to permit persons to whom the Software is
  105. furnished to do so, subject to the following conditions:
  106. The above copyright notice and this permission notice shall be included in all
  107. copies or substantial portions of the Software.
  108. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  109. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  110. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  111. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  112. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  113. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  114. SOFTWARE.
  115. */
  116. function isDomNodeList(x) {
  117. var prototypeToString = Object.prototype.toString.call(x);
  118. var regex = /^\[object (HTMLCollection|NodeList|Object)\]$/;
  119. return typeof window.NodeList === 'object'
  120. ? x instanceof window.NodeList
  121. : x !== null &&
  122. typeof x === 'object' &&
  123. typeof x.length === 'number' &&
  124. regex.test(prototypeToString) &&
  125. (x.length === 0 || isDomNode(x[0]))
  126. }
  127. /*! @license Tealight v0.3.0
  128. Copyright 2018 Fisssion LLC.
  129. Permission is hereby granted, free of charge, to any person obtaining a copy
  130. of this software and associated documentation files (the "Software"), to deal
  131. in the Software without restriction, including without limitation the rights
  132. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  133. copies of the Software, and to permit persons to whom the Software is
  134. furnished to do so, subject to the following conditions:
  135. The above copyright notice and this permission notice shall be included in all
  136. copies or substantial portions of the Software.
  137. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  138. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  139. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  140. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  141. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  142. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  143. SOFTWARE.
  144. */
  145. function index(target, context) {
  146. if ( context === void 0 ) { context = document; }
  147. if (target instanceof Array) { return target.filter(isDomNode) }
  148. if (isDomNode(target)) { return [target] }
  149. if (isDomNodeList(target)) { return Array.prototype.slice.call(target) }
  150. if (typeof target === 'string') {
  151. try {
  152. var query = context.querySelectorAll(target);
  153. return Array.prototype.slice.call(query)
  154. } catch (err) {
  155. return []
  156. }
  157. }
  158. return []
  159. }
  160. function isObject(x) {
  161. return (
  162. x !== null &&
  163. x instanceof Object &&
  164. (x.constructor === Object ||
  165. Object.prototype.toString.call(x) === '[object Object]')
  166. )
  167. }
  168. function each(collection, callback) {
  169. if (isObject(collection)) {
  170. var keys = Object.keys(collection);
  171. return keys.forEach(function (key) { return callback(collection[key], key, collection); })
  172. }
  173. if (collection instanceof Array) {
  174. return collection.forEach(function (item, i) { return callback(item, i, collection); })
  175. }
  176. throw new TypeError('Expected either an array or object literal.')
  177. }
  178. function logger(message) {
  179. var details = [], len = arguments.length - 1;
  180. while ( len-- > 0 ) details[ len ] = arguments[ len + 1 ];
  181. if (this.constructor.debug && console) {
  182. var report = "%cScrollReveal: " + message;
  183. details.forEach(function (detail) { return (report += "\n — " + detail); });
  184. console.log(report, 'color: #ea654b;'); // eslint-disable-line no-console
  185. }
  186. }
  187. function rinse() {
  188. var this$1 = this;
  189. var struct = function () { return ({
  190. active: [],
  191. stale: []
  192. }); };
  193. var elementIds = struct();
  194. var sequenceIds = struct();
  195. var containerIds = struct();
  196. /**
  197. * Take stock of active element IDs.
  198. */
  199. try {
  200. each(index('[data-sr-id]'), function (node) {
  201. var id = parseInt(node.getAttribute('data-sr-id'));
  202. elementIds.active.push(id);
  203. });
  204. } catch (e) {
  205. throw e
  206. }
  207. /**
  208. * Destroy stale elements.
  209. */
  210. each(this.store.elements, function (element) {
  211. if (elementIds.active.indexOf(element.id) === -1) {
  212. elementIds.stale.push(element.id);
  213. }
  214. });
  215. each(elementIds.stale, function (staleId) { return delete this$1.store.elements[staleId]; });
  216. /**
  217. * Take stock of active container and sequence IDs.
  218. */
  219. each(this.store.elements, function (element) {
  220. if (containerIds.active.indexOf(element.containerId) === -1) {
  221. containerIds.active.push(element.containerId);
  222. }
  223. if (element.hasOwnProperty('sequence')) {
  224. if (sequenceIds.active.indexOf(element.sequence.id) === -1) {
  225. sequenceIds.active.push(element.sequence.id);
  226. }
  227. }
  228. });
  229. /**
  230. * Destroy stale containers.
  231. */
  232. each(this.store.containers, function (container) {
  233. if (containerIds.active.indexOf(container.id) === -1) {
  234. containerIds.stale.push(container.id);
  235. }
  236. });
  237. each(containerIds.stale, function (staleId) {
  238. var stale = this$1.store.containers[staleId].node;
  239. stale.removeEventListener('scroll', this$1.delegate);
  240. stale.removeEventListener('resize', this$1.delegate);
  241. delete this$1.store.containers[staleId];
  242. });
  243. /**
  244. * Destroy stale sequences.
  245. */
  246. each(this.store.sequences, function (sequence) {
  247. if (sequenceIds.active.indexOf(sequence.id) === -1) {
  248. sequenceIds.stale.push(sequence.id);
  249. }
  250. });
  251. each(sequenceIds.stale, function (staleId) { return delete this$1.store.sequences[staleId]; });
  252. }
  253. function clean(target) {
  254. var this$1 = this;
  255. var dirty;
  256. try {
  257. each(index(target), function (node) {
  258. var id = node.getAttribute('data-sr-id');
  259. if (id !== null) {
  260. dirty = true;
  261. var element = this$1.store.elements[id];
  262. if (element.callbackTimer) {
  263. window.clearTimeout(element.callbackTimer.clock);
  264. }
  265. node.setAttribute('style', element.styles.inline.generated);
  266. node.removeAttribute('data-sr-id');
  267. delete this$1.store.elements[id];
  268. }
  269. });
  270. } catch (e) {
  271. return logger.call(this, 'Clean failed.', e.message)
  272. }
  273. if (dirty) {
  274. try {
  275. rinse.call(this);
  276. } catch (e) {
  277. return logger.call(this, 'Clean failed.', e.message)
  278. }
  279. }
  280. }
  281. function destroy() {
  282. var this$1 = this;
  283. /**
  284. * Remove all generated styles and element ids
  285. */
  286. each(this.store.elements, function (element) {
  287. element.node.setAttribute('style', element.styles.inline.generated);
  288. element.node.removeAttribute('data-sr-id');
  289. });
  290. /**
  291. * Remove all event listeners.
  292. */
  293. each(this.store.containers, function (container) {
  294. var target =
  295. container.node === document.documentElement ? window : container.node;
  296. target.removeEventListener('scroll', this$1.delegate);
  297. target.removeEventListener('resize', this$1.delegate);
  298. });
  299. /**
  300. * Clear all data from the store
  301. */
  302. this.store = {
  303. containers: {},
  304. elements: {},
  305. history: [],
  306. sequences: {}
  307. };
  308. }
  309. /*! @license Rematrix v0.2.2
  310. Copyright 2018 Fisssion LLC.
  311. Permission is hereby granted, free of charge, to any person obtaining a copy
  312. of this software and associated documentation files (the "Software"), to deal
  313. in the Software without restriction, including without limitation the rights
  314. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  315. copies of the Software, and to permit persons to whom the Software is
  316. furnished to do so, subject to the following conditions:
  317. The above copyright notice and this permission notice shall be included in
  318. all copies or substantial portions of the Software.
  319. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  320. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  321. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  322. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  323. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  324. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
  325. THE SOFTWARE.
  326. */
  327. /**
  328. * @module Rematrix
  329. */
  330. /**
  331. * Transformation matrices in the browser come in two flavors:
  332. *
  333. * - `matrix` using 6 values (short)
  334. * - `matrix3d` using 16 values (long)
  335. *
  336. * This utility follows this [conversion guide](https://goo.gl/EJlUQ1)
  337. * to expand short form matrices to their equivalent long form.
  338. *
  339. * @param {array} source - Accepts both short and long form matrices.
  340. * @return {array}
  341. */
  342. function format(source) {
  343. if (source.constructor !== Array) {
  344. throw new TypeError('Expected array.')
  345. }
  346. if (source.length === 16) {
  347. return source
  348. }
  349. if (source.length === 6) {
  350. var matrix = identity();
  351. matrix[0] = source[0];
  352. matrix[1] = source[1];
  353. matrix[4] = source[2];
  354. matrix[5] = source[3];
  355. matrix[12] = source[4];
  356. matrix[13] = source[5];
  357. return matrix
  358. }
  359. throw new RangeError('Expected array with either 6 or 16 values.')
  360. }
  361. /**
  362. * Returns a matrix representing no transformation. The product of any matrix
  363. * multiplied by the identity matrix will be the original matrix.
  364. *
  365. * > **Tip:** Similar to how `5 * 1 === 5`, where `1` is the identity.
  366. *
  367. * @return {array}
  368. */
  369. function identity() {
  370. var matrix = [];
  371. for (var i = 0; i < 16; i++) {
  372. i % 5 == 0 ? matrix.push(1) : matrix.push(0);
  373. }
  374. return matrix
  375. }
  376. /**
  377. * Returns a 4x4 matrix describing the combined transformations
  378. * of both arguments.
  379. *
  380. * > **Note:** Order is very important. For example, rotating 45°
  381. * along the Z-axis, followed by translating 500 pixels along the
  382. * Y-axis... is not the same as translating 500 pixels along the
  383. * Y-axis, followed by rotating 45° along on the Z-axis.
  384. *
  385. * @param {array} m - Accepts both short and long form matrices.
  386. * @param {array} x - Accepts both short and long form matrices.
  387. * @return {array}
  388. */
  389. function multiply(m, x) {
  390. var fm = format(m);
  391. var fx = format(x);
  392. var product = [];
  393. for (var i = 0; i < 4; i++) {
  394. var row = [fm[i], fm[i + 4], fm[i + 8], fm[i + 12]];
  395. for (var j = 0; j < 4; j++) {
  396. var k = j * 4;
  397. var col = [fx[k], fx[k + 1], fx[k + 2], fx[k + 3]];
  398. var result =
  399. row[0] * col[0] + row[1] * col[1] + row[2] * col[2] + row[3] * col[3];
  400. product[i + k] = result;
  401. }
  402. }
  403. return product
  404. }
  405. /**
  406. * Attempts to return a 4x4 matrix describing the CSS transform
  407. * matrix passed in, but will return the identity matrix as a
  408. * fallback.
  409. *
  410. * **Tip:** In virtually all cases, this method is used to convert
  411. * a CSS matrix (retrieved as a `string` from computed styles) to
  412. * its equivalent array format.
  413. *
  414. * @param {string} source - String containing a valid CSS `matrix` or `matrix3d` property.
  415. * @return {array}
  416. */
  417. function parse(source) {
  418. if (typeof source === 'string') {
  419. var match = source.match(/matrix(3d)?\(([^)]+)\)/);
  420. if (match) {
  421. var raw = match[2].split(', ').map(parseFloat);
  422. return format(raw)
  423. }
  424. }
  425. return identity()
  426. }
  427. /**
  428. * Returns a 4x4 matrix describing X-axis rotation.
  429. *
  430. * @param {number} angle - Measured in degrees.
  431. * @return {array}
  432. */
  433. function rotateX(angle) {
  434. var theta = Math.PI / 180 * angle;
  435. var matrix = identity();
  436. matrix[5] = matrix[10] = Math.cos(theta);
  437. matrix[6] = matrix[9] = Math.sin(theta);
  438. matrix[9] *= -1;
  439. return matrix
  440. }
  441. /**
  442. * Returns a 4x4 matrix describing Y-axis rotation.
  443. *
  444. * @param {number} angle - Measured in degrees.
  445. * @return {array}
  446. */
  447. function rotateY(angle) {
  448. var theta = Math.PI / 180 * angle;
  449. var matrix = identity();
  450. matrix[0] = matrix[10] = Math.cos(theta);
  451. matrix[2] = matrix[8] = Math.sin(theta);
  452. matrix[2] *= -1;
  453. return matrix
  454. }
  455. /**
  456. * Returns a 4x4 matrix describing Z-axis rotation.
  457. *
  458. * @param {number} angle - Measured in degrees.
  459. * @return {array}
  460. */
  461. function rotateZ(angle) {
  462. var theta = Math.PI / 180 * angle;
  463. var matrix = identity();
  464. matrix[0] = matrix[5] = Math.cos(theta);
  465. matrix[1] = matrix[4] = Math.sin(theta);
  466. matrix[4] *= -1;
  467. return matrix
  468. }
  469. /**
  470. * Returns a 4x4 matrix describing 2D scaling. The first argument
  471. * is used for both X and Y-axis scaling, unless an optional
  472. * second argument is provided to explicitly define Y-axis scaling.
  473. *
  474. * @param {number} scalar - Decimal multiplier.
  475. * @param {number} [scalarY] - Decimal multiplier.
  476. * @return {array}
  477. */
  478. function scale(scalar, scalarY) {
  479. var matrix = identity();
  480. matrix[0] = scalar;
  481. matrix[5] = typeof scalarY === 'number' ? scalarY : scalar;
  482. return matrix
  483. }
  484. /**
  485. * Returns a 4x4 matrix describing X-axis translation.
  486. *
  487. * @param {number} distance - Measured in pixels.
  488. * @return {array}
  489. */
  490. function translateX(distance) {
  491. var matrix = identity();
  492. matrix[12] = distance;
  493. return matrix
  494. }
  495. /**
  496. * Returns a 4x4 matrix describing Y-axis translation.
  497. *
  498. * @param {number} distance - Measured in pixels.
  499. * @return {array}
  500. */
  501. function translateY(distance) {
  502. var matrix = identity();
  503. matrix[13] = distance;
  504. return matrix
  505. }
  506. var getPrefixedCssProp = (function () {
  507. var properties = {};
  508. var style = document.documentElement.style;
  509. function getPrefixedCssProperty(name, source) {
  510. if ( source === void 0 ) source = style;
  511. if (name && typeof name === 'string') {
  512. if (properties[name]) {
  513. return properties[name]
  514. }
  515. if (typeof source[name] === 'string') {
  516. return (properties[name] = name)
  517. }
  518. if (typeof source[("-webkit-" + name)] === 'string') {
  519. return (properties[name] = "-webkit-" + name)
  520. }
  521. throw new RangeError(("Unable to find \"" + name + "\" style property."))
  522. }
  523. throw new TypeError('Expected a string.')
  524. }
  525. getPrefixedCssProperty.clearCache = function () { return (properties = {}); };
  526. return getPrefixedCssProperty
  527. })();
  528. function style(element) {
  529. var computed = window.getComputedStyle(element.node);
  530. var position = computed.position;
  531. var config = element.config;
  532. /**
  533. * Generate inline styles
  534. */
  535. var inline = {};
  536. var inlineStyle = element.node.getAttribute('style') || '';
  537. var inlineMatch = inlineStyle.match(/[\w-]+\s*:\s*[^;]+\s*/gi) || [];
  538. inline.computed = inlineMatch ? inlineMatch.map(function (m) { return m.trim(); }).join('; ') + ';' : '';
  539. inline.generated = inlineMatch.some(function (m) { return m.match(/visibility\s?:\s?visible/i); })
  540. ? inline.computed
  541. : inlineMatch.concat( ['visibility: visible']).map(function (m) { return m.trim(); }).join('; ') + ';';
  542. /**
  543. * Generate opacity styles
  544. */
  545. var computedOpacity = parseFloat(computed.opacity);
  546. var configOpacity = !isNaN(parseFloat(config.opacity))
  547. ? parseFloat(config.opacity)
  548. : parseFloat(computed.opacity);
  549. var opacity = {
  550. computed: computedOpacity !== configOpacity ? ("opacity: " + computedOpacity + ";") : '',
  551. generated: computedOpacity !== configOpacity ? ("opacity: " + configOpacity + ";") : ''
  552. };
  553. /**
  554. * Generate transformation styles
  555. */
  556. var transformations = [];
  557. if (parseFloat(config.distance)) {
  558. var axis = config.origin === 'top' || config.origin === 'bottom' ? 'Y' : 'X';
  559. /**
  560. * Let’s make sure our our pixel distances are negative for top and left.
  561. * e.g. { origin: 'top', distance: '25px' } starts at `top: -25px` in CSS.
  562. */
  563. var distance = config.distance;
  564. if (config.origin === 'top' || config.origin === 'left') {
  565. distance = /^-/.test(distance) ? distance.substr(1) : ("-" + distance);
  566. }
  567. var ref = distance.match(/(^-?\d+\.?\d?)|(em$|px$|%$)/g);
  568. var value = ref[0];
  569. var unit = ref[1];
  570. switch (unit) {
  571. case 'em':
  572. distance = parseInt(computed.fontSize) * value;
  573. break
  574. case 'px':
  575. distance = value;
  576. break
  577. case '%':
  578. /**
  579. * Here we use `getBoundingClientRect` instead of
  580. * the existing data attached to `element.geometry`
  581. * because only the former includes any transformations
  582. * current applied to the element.
  583. *
  584. * If that behavior ends up being unintuitive, this
  585. * logic could instead utilize `element.geometry.height`
  586. * and `element.geoemetry.width` for the distaince calculation
  587. */
  588. distance =
  589. axis === 'Y'
  590. ? element.node.getBoundingClientRect().height * value / 100
  591. : element.node.getBoundingClientRect().width * value / 100;
  592. break
  593. default:
  594. throw new RangeError('Unrecognized or missing distance unit.')
  595. }
  596. if (axis === 'Y') {
  597. transformations.push(translateY(distance));
  598. } else {
  599. transformations.push(translateX(distance));
  600. }
  601. }
  602. if (config.rotate.x) { transformations.push(rotateX(config.rotate.x)); }
  603. if (config.rotate.y) { transformations.push(rotateY(config.rotate.y)); }
  604. if (config.rotate.z) { transformations.push(rotateZ(config.rotate.z)); }
  605. if (config.scale !== 1) {
  606. if (config.scale === 0) {
  607. /**
  608. * The CSS Transforms matrix interpolation specification
  609. * basically disallows transitions of non-invertible
  610. * matrixes, which means browsers won't transition
  611. * elements with zero scale.
  612. *
  613. * That’s inconvenient for the API and developer
  614. * experience, so we simply nudge their value
  615. * slightly above zero; this allows browsers
  616. * to transition our element as expected.
  617. *
  618. * `0.0002` was the smallest number
  619. * that performed across browsers.
  620. */
  621. transformations.push(scale(0.0002));
  622. } else {
  623. transformations.push(scale(config.scale));
  624. }
  625. }
  626. var transform = {};
  627. if (transformations.length) {
  628. transform.property = getPrefixedCssProp('transform');
  629. /**
  630. * The default computed transform value should be one of:
  631. * undefined || 'none' || 'matrix()' || 'matrix3d()'
  632. */
  633. transform.computed = {
  634. raw: computed[transform.property],
  635. matrix: parse(computed[transform.property])
  636. };
  637. transformations.unshift(transform.computed.matrix);
  638. var product = transformations.reduce(multiply);
  639. transform.generated = {
  640. initial: ((transform.property) + ": matrix3d(" + (product.join(', ')) + ");"),
  641. final: ((transform.property) + ": matrix3d(" + (transform.computed.matrix.join(
  642. ', '
  643. )) + ");")
  644. };
  645. } else {
  646. transform.generated = {
  647. initial: '',
  648. final: ''
  649. };
  650. }
  651. /**
  652. * Generate transition styles
  653. */
  654. var transition = {};
  655. if (opacity.generated || transform.generated.initial) {
  656. transition.property = getPrefixedCssProp('transition');
  657. transition.computed = computed[transition.property];
  658. transition.fragments = [];
  659. var delay = config.delay;
  660. var duration = config.duration;
  661. var easing = config.easing;
  662. if (opacity.generated) {
  663. transition.fragments.push({
  664. delayed: ("opacity " + (duration / 1000) + "s " + easing + " " + (delay / 1000) + "s"),
  665. instant: ("opacity " + (duration / 1000) + "s " + easing + " 0s")
  666. });
  667. }
  668. if (transform.generated.initial) {
  669. transition.fragments.push({
  670. delayed: ((transform.property) + " " + (duration / 1000) + "s " + easing + " " + (delay /
  671. 1000) + "s"),
  672. instant: ((transform.property) + " " + (duration / 1000) + "s " + easing + " 0s")
  673. });
  674. }
  675. /**
  676. * The default computed transition property should be one of:
  677. * undefined || '' || 'all 0s ease 0s' || 'all 0s 0s cubic-bezier()'
  678. */
  679. if (transition.computed && !transition.computed.match(/all 0s/)) {
  680. transition.fragments.unshift({
  681. delayed: transition.computed,
  682. instant: transition.computed
  683. });
  684. }
  685. var composed = transition.fragments.reduce(
  686. function (composition, fragment, i) {
  687. composition.delayed +=
  688. i === 0 ? fragment.delayed : (", " + (fragment.delayed));
  689. composition.instant +=
  690. i === 0 ? fragment.instant : (", " + (fragment.instant));
  691. return composition
  692. },
  693. {
  694. delayed: '',
  695. instant: ''
  696. }
  697. );
  698. transition.generated = {
  699. delayed: ((transition.property) + ": " + (composed.delayed) + ";"),
  700. instant: ((transition.property) + ": " + (composed.instant) + ";")
  701. };
  702. } else {
  703. transition.generated = {
  704. delayed: '',
  705. instant: ''
  706. };
  707. }
  708. return {
  709. inline: inline,
  710. opacity: opacity,
  711. position: position,
  712. transform: transform,
  713. transition: transition
  714. }
  715. }
  716. function animate(element, force) {
  717. if ( force === void 0 ) force = {};
  718. var pristine = force.pristine || this.pristine;
  719. var delayed =
  720. element.config.useDelay === 'always' ||
  721. (element.config.useDelay === 'onload' && pristine) ||
  722. (element.config.useDelay === 'once' && !element.seen);
  723. var shouldReveal = element.visible && !element.revealed;
  724. var shouldReset = !element.visible && element.revealed && element.config.reset;
  725. if (force.reveal || shouldReveal) {
  726. return triggerReveal.call(this, element, delayed)
  727. }
  728. if (force.reset || shouldReset) {
  729. return triggerReset.call(this, element)
  730. }
  731. }
  732. function triggerReveal(element, delayed) {
  733. var styles = [
  734. element.styles.inline.generated,
  735. element.styles.opacity.computed,
  736. element.styles.transform.generated.final
  737. ];
  738. if (delayed) {
  739. styles.push(element.styles.transition.generated.delayed);
  740. } else {
  741. styles.push(element.styles.transition.generated.instant);
  742. }
  743. element.revealed = element.seen = true;
  744. element.node.setAttribute('style', styles.filter(function (s) { return s !== ''; }).join(' '));
  745. registerCallbacks.call(this, element, delayed);
  746. }
  747. function triggerReset(element) {
  748. var styles = [
  749. element.styles.inline.generated,
  750. element.styles.opacity.generated,
  751. element.styles.transform.generated.initial,
  752. element.styles.transition.generated.instant
  753. ];
  754. element.revealed = false;
  755. element.node.setAttribute('style', styles.filter(function (s) { return s !== ''; }).join(' '));
  756. registerCallbacks.call(this, element);
  757. }
  758. function registerCallbacks(element, isDelayed) {
  759. var this$1 = this;
  760. var duration = isDelayed
  761. ? element.config.duration + element.config.delay
  762. : element.config.duration;
  763. var beforeCallback = element.revealed
  764. ? element.config.beforeReveal
  765. : element.config.beforeReset;
  766. var afterCallback = element.revealed
  767. ? element.config.afterReveal
  768. : element.config.afterReset;
  769. var elapsed = 0;
  770. if (element.callbackTimer) {
  771. elapsed = Date.now() - element.callbackTimer.start;
  772. window.clearTimeout(element.callbackTimer.clock);
  773. }
  774. beforeCallback(element.node);
  775. element.callbackTimer = {
  776. start: Date.now(),
  777. clock: window.setTimeout(function () {
  778. afterCallback(element.node);
  779. element.callbackTimer = null;
  780. if (element.revealed && !element.config.reset && element.config.cleanup) {
  781. clean.call(this$1, element.node);
  782. }
  783. }, duration - elapsed)
  784. };
  785. }
  786. var nextUniqueId = (function () {
  787. var uid = 0;
  788. return function () { return uid++; }
  789. })();
  790. function sequence(element, pristine) {
  791. if ( pristine === void 0 ) pristine = this.pristine;
  792. /**
  793. * We first check if the element should reset.
  794. */
  795. if (!element.visible && element.revealed && element.config.reset) {
  796. return animate.call(this, element, { reset: true })
  797. }
  798. var seq = this.store.sequences[element.sequence.id];
  799. var i = element.sequence.index;
  800. if (seq) {
  801. var visible = new SequenceModel(seq, 'visible', this.store);
  802. var revealed = new SequenceModel(seq, 'revealed', this.store);
  803. seq.models = { visible: visible, revealed: revealed };
  804. /**
  805. * If the sequence has no revealed members,
  806. * then we reveal the first visible element
  807. * within that sequence.
  808. *
  809. * The sequence then cues a recursive call
  810. * in both directions.
  811. */
  812. if (!revealed.body.length) {
  813. var nextId = seq.members[visible.body[0]];
  814. var nextElement = this.store.elements[nextId];
  815. if (nextElement) {
  816. cue.call(this, seq, visible.body[0], -1, pristine);
  817. cue.call(this, seq, visible.body[0], +1, pristine);
  818. return animate.call(this, nextElement, { reveal: true, pristine: pristine })
  819. }
  820. }
  821. /**
  822. * If our element isn’t resetting, we check the
  823. * element sequence index against the head, and
  824. * then the foot of the sequence.
  825. */
  826. if (
  827. !seq.blocked.head &&
  828. i === [].concat( revealed.head ).pop() &&
  829. i >= [].concat( visible.body ).shift()
  830. ) {
  831. cue.call(this, seq, i, -1, pristine);
  832. return animate.call(this, element, { reveal: true, pristine: pristine })
  833. }
  834. if (
  835. !seq.blocked.foot &&
  836. i === [].concat( revealed.foot ).shift() &&
  837. i <= [].concat( visible.body ).pop()
  838. ) {
  839. cue.call(this, seq, i, +1, pristine);
  840. return animate.call(this, element, { reveal: true, pristine: pristine })
  841. }
  842. }
  843. }
  844. function Sequence(interval) {
  845. var i = Math.abs(interval);
  846. if (!isNaN(i)) {
  847. this.id = nextUniqueId();
  848. this.interval = Math.max(i, 16);
  849. this.members = [];
  850. this.models = {};
  851. this.blocked = {
  852. head: false,
  853. foot: false
  854. };
  855. } else {
  856. throw new RangeError('Invalid sequence interval.')
  857. }
  858. }
  859. function SequenceModel(seq, prop, store) {
  860. var this$1 = this;
  861. this.head = [];
  862. this.body = [];
  863. this.foot = [];
  864. each(seq.members, function (id, index) {
  865. var element = store.elements[id];
  866. if (element && element[prop]) {
  867. this$1.body.push(index);
  868. }
  869. });
  870. if (this.body.length) {
  871. each(seq.members, function (id, index) {
  872. var element = store.elements[id];
  873. if (element && !element[prop]) {
  874. if (index < this$1.body[0]) {
  875. this$1.head.push(index);
  876. } else {
  877. this$1.foot.push(index);
  878. }
  879. }
  880. });
  881. }
  882. }
  883. function cue(seq, i, direction, pristine) {
  884. var this$1 = this;
  885. var blocked = ['head', null, 'foot'][1 + direction];
  886. var nextId = seq.members[i + direction];
  887. var nextElement = this.store.elements[nextId];
  888. seq.blocked[blocked] = true;
  889. setTimeout(function () {
  890. seq.blocked[blocked] = false;
  891. if (nextElement) {
  892. sequence.call(this$1, nextElement, pristine);
  893. }
  894. }, seq.interval);
  895. }
  896. function initialize() {
  897. var this$1 = this;
  898. rinse.call(this);
  899. each(this.store.elements, function (element) {
  900. var styles = [element.styles.inline.generated];
  901. if (element.visible) {
  902. styles.push(element.styles.opacity.computed);
  903. styles.push(element.styles.transform.generated.final);
  904. } else {
  905. styles.push(element.styles.opacity.generated);
  906. styles.push(element.styles.transform.generated.initial);
  907. }
  908. element.node.setAttribute('style', styles.filter(function (s) { return s !== ''; }).join(' '));
  909. });
  910. each(this.store.containers, function (container) {
  911. var target =
  912. container.node === document.documentElement ? window : container.node;
  913. target.addEventListener('scroll', this$1.delegate);
  914. target.addEventListener('resize', this$1.delegate);
  915. });
  916. /**
  917. * Manually invoke delegate once to capture
  918. * element and container dimensions, container
  919. * scroll position, and trigger any valid reveals
  920. */
  921. this.delegate();
  922. /**
  923. * Wipe any existing `setTimeout` now
  924. * that initialization has completed.
  925. */
  926. this.initTimeout = null;
  927. }
  928. function isMobile(agent) {
  929. if ( agent === void 0 ) agent = navigator.userAgent;
  930. return /Android|iPhone|iPad|iPod/i.test(agent)
  931. }
  932. function deepAssign(target) {
  933. var sources = [], len = arguments.length - 1;
  934. while ( len-- > 0 ) sources[ len ] = arguments[ len + 1 ];
  935. if (isObject(target)) {
  936. each(sources, function (source) {
  937. each(source, function (data, key) {
  938. if (isObject(data)) {
  939. if (!target[key] || !isObject(target[key])) {
  940. target[key] = {};
  941. }
  942. deepAssign(target[key], data);
  943. } else {
  944. target[key] = data;
  945. }
  946. });
  947. });
  948. return target
  949. } else {
  950. throw new TypeError('Target must be an object literal.')
  951. }
  952. }
  953. function reveal(target, options, syncing) {
  954. var this$1 = this;
  955. if ( options === void 0 ) options = {};
  956. if ( syncing === void 0 ) syncing = false;
  957. var containerBuffer = [];
  958. var sequence$$1;
  959. var interval = options.interval || defaults.interval;
  960. try {
  961. if (interval) {
  962. sequence$$1 = new Sequence(interval);
  963. }
  964. var nodes = index(target);
  965. if (!nodes.length) {
  966. throw new Error('Invalid reveal target.')
  967. }
  968. var elements = nodes.reduce(function (elementBuffer, elementNode) {
  969. var element = {};
  970. var existingId = elementNode.getAttribute('data-sr-id');
  971. if (existingId) {
  972. deepAssign(element, this$1.store.elements[existingId]);
  973. /**
  974. * In order to prevent previously generated styles
  975. * from throwing off the new styles, the style tag
  976. * has to be reverted to its pre-reveal state.
  977. */
  978. element.node.setAttribute('style', element.styles.inline.computed);
  979. } else {
  980. element.id = nextUniqueId();
  981. element.node = elementNode;
  982. element.seen = false;
  983. element.revealed = false;
  984. element.visible = false;
  985. }
  986. var config = deepAssign({}, element.config || this$1.defaults, options);
  987. if ((!config.mobile && isMobile()) || (!config.desktop && !isMobile())) {
  988. if (existingId) {
  989. clean.call(this$1, element);
  990. }
  991. return elementBuffer // skip elements that are disabled
  992. }
  993. var containerNode = index(config.container)[0];
  994. if (!containerNode) {
  995. throw new Error('Invalid container.')
  996. }
  997. if (!containerNode.contains(elementNode)) {
  998. return elementBuffer // skip elements found outside the container
  999. }
  1000. var containerId;
  1001. {
  1002. containerId = getContainerId(
  1003. containerNode,
  1004. containerBuffer,
  1005. this$1.store.containers
  1006. );
  1007. if (containerId === null) {
  1008. containerId = nextUniqueId();
  1009. containerBuffer.push({ id: containerId, node: containerNode });
  1010. }
  1011. }
  1012. element.config = config;
  1013. element.containerId = containerId;
  1014. element.styles = style(element);
  1015. if (sequence$$1) {
  1016. element.sequence = {
  1017. id: sequence$$1.id,
  1018. index: sequence$$1.members.length
  1019. };
  1020. sequence$$1.members.push(element.id);
  1021. }
  1022. elementBuffer.push(element);
  1023. return elementBuffer
  1024. }, []);
  1025. /**
  1026. * Modifying the DOM via setAttribute needs to be handled
  1027. * separately from reading computed styles in the map above
  1028. * for the browser to batch DOM changes (limiting reflows)
  1029. */
  1030. each(elements, function (element) {
  1031. this$1.store.elements[element.id] = element;
  1032. element.node.setAttribute('data-sr-id', element.id);
  1033. });
  1034. } catch (e) {
  1035. return logger.call(this, 'Reveal failed.', e.message)
  1036. }
  1037. /**
  1038. * Now that element set-up is complete...
  1039. * Let’s commit any container and sequence data we have to the store.
  1040. */
  1041. each(containerBuffer, function (container) {
  1042. this$1.store.containers[container.id] = {
  1043. id: container.id,
  1044. node: container.node
  1045. };
  1046. });
  1047. if (sequence$$1) {
  1048. this.store.sequences[sequence$$1.id] = sequence$$1;
  1049. }
  1050. /**
  1051. * If reveal wasn't invoked by sync, we want to
  1052. * make sure to add this call to the history.
  1053. */
  1054. if (syncing !== true) {
  1055. this.store.history.push({ target: target, options: options });
  1056. /**
  1057. * Push initialization to the event queue, giving
  1058. * multiple reveal calls time to be interpreted.
  1059. */
  1060. if (this.initTimeout) {
  1061. window.clearTimeout(this.initTimeout);
  1062. }
  1063. this.initTimeout = window.setTimeout(initialize.bind(this), 0);
  1064. }
  1065. }
  1066. function getContainerId(node) {
  1067. var collections = [], len = arguments.length - 1;
  1068. while ( len-- > 0 ) collections[ len ] = arguments[ len + 1 ];
  1069. var id = null;
  1070. each(collections, function (collection) {
  1071. each(collection, function (container) {
  1072. if (id === null && container.node === node) {
  1073. id = container.id;
  1074. }
  1075. });
  1076. });
  1077. return id
  1078. }
  1079. /**
  1080. * Re-runs the reveal method for each record stored in history,
  1081. * for capturing new content asynchronously loaded into the DOM.
  1082. */
  1083. function sync() {
  1084. var this$1 = this;
  1085. each(this.store.history, function (record) {
  1086. reveal.call(this$1, record.target, record.options, true);
  1087. });
  1088. initialize.call(this);
  1089. }
  1090. var polyfill = function (x) { return (x > 0) - (x < 0) || +x; };
  1091. var mathSign = Math.sign || polyfill
  1092. /*! @license miniraf v1.0.0
  1093. Copyright 2018 Fisssion LLC.
  1094. Permission is hereby granted, free of charge, to any person obtaining a copy
  1095. of this software and associated documentation files (the "Software"), to deal
  1096. in the Software without restriction, including without limitation the rights
  1097. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  1098. copies of the Software, and to permit persons to whom the Software is
  1099. furnished to do so, subject to the following conditions:
  1100. The above copyright notice and this permission notice shall be included in all
  1101. copies or substantial portions of the Software.
  1102. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  1103. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  1104. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  1105. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  1106. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  1107. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  1108. SOFTWARE.
  1109. */
  1110. var polyfill$1 = (function () {
  1111. var clock = Date.now();
  1112. return function (callback) {
  1113. var currentTime = Date.now();
  1114. if (currentTime - clock > 16) {
  1115. clock = currentTime;
  1116. callback(currentTime);
  1117. } else {
  1118. setTimeout(function () { return polyfill$1(callback); }, 0);
  1119. }
  1120. }
  1121. })();
  1122. var index$1 = window.requestAnimationFrame ||
  1123. window.webkitRequestAnimationFrame ||
  1124. window.mozRequestAnimationFrame ||
  1125. polyfill$1;
  1126. function getGeometry(target, isContainer) {
  1127. /**
  1128. * We want to ignore padding and scrollbars for container elements.
  1129. * More information here: https://goo.gl/vOZpbz
  1130. */
  1131. var height = isContainer ? target.node.clientHeight : target.node.offsetHeight;
  1132. var width = isContainer ? target.node.clientWidth : target.node.offsetWidth;
  1133. var offsetTop = 0;
  1134. var offsetLeft = 0;
  1135. var node = target.node;
  1136. do {
  1137. if (!isNaN(node.offsetTop)) {
  1138. offsetTop += node.offsetTop;
  1139. }
  1140. if (!isNaN(node.offsetLeft)) {
  1141. offsetLeft += node.offsetLeft;
  1142. }
  1143. node = node.offsetParent;
  1144. } while (node)
  1145. return {
  1146. bounds: {
  1147. top: offsetTop,
  1148. right: offsetLeft + width,
  1149. bottom: offsetTop + height,
  1150. left: offsetLeft
  1151. },
  1152. height: height,
  1153. width: width
  1154. }
  1155. }
  1156. function getScrolled(container) {
  1157. var top, left;
  1158. if (container.node === document.documentElement) {
  1159. top = window.pageYOffset;
  1160. left = window.pageXOffset;
  1161. } else {
  1162. top = container.node.scrollTop;
  1163. left = container.node.scrollLeft;
  1164. }
  1165. return { top: top, left: left }
  1166. }
  1167. function isElementVisible(element) {
  1168. if ( element === void 0 ) element = {};
  1169. var container = this.store.containers[element.containerId];
  1170. if (!container) { return }
  1171. var viewFactor = Math.max(0, Math.min(1, element.config.viewFactor));
  1172. var viewOffset = element.config.viewOffset;
  1173. var elementBounds = {
  1174. top: element.geometry.bounds.top + element.geometry.height * viewFactor,
  1175. right: element.geometry.bounds.right - element.geometry.width * viewFactor,
  1176. bottom: element.geometry.bounds.bottom - element.geometry.height * viewFactor,
  1177. left: element.geometry.bounds.left + element.geometry.width * viewFactor
  1178. };
  1179. var containerBounds = {
  1180. top: container.geometry.bounds.top + container.scroll.top + viewOffset.top,
  1181. right: container.geometry.bounds.right + container.scroll.left - viewOffset.right,
  1182. bottom:
  1183. container.geometry.bounds.bottom + container.scroll.top - viewOffset.bottom,
  1184. left: container.geometry.bounds.left + container.scroll.left + viewOffset.left
  1185. };
  1186. return (
  1187. (elementBounds.top < containerBounds.bottom &&
  1188. elementBounds.right > containerBounds.left &&
  1189. elementBounds.bottom > containerBounds.top &&
  1190. elementBounds.left < containerBounds.right) ||
  1191. element.styles.position === 'fixed'
  1192. )
  1193. }
  1194. function delegate(
  1195. event,
  1196. elements
  1197. ) {
  1198. var this$1 = this;
  1199. if ( event === void 0 ) event = { type: 'init' };
  1200. if ( elements === void 0 ) elements = this.store.elements;
  1201. index$1(function () {
  1202. var stale = event.type === 'init' || event.type === 'resize';
  1203. each(this$1.store.containers, function (container) {
  1204. if (stale) {
  1205. container.geometry = getGeometry.call(this$1, container, true);
  1206. }
  1207. var scroll = getScrolled.call(this$1, container);
  1208. if (container.scroll) {
  1209. container.direction = {
  1210. x: mathSign(scroll.left - container.scroll.left),
  1211. y: mathSign(scroll.top - container.scroll.top)
  1212. };
  1213. }
  1214. container.scroll = scroll;
  1215. });
  1216. /**
  1217. * Due to how the sequencer is implemented, it’s
  1218. * important that we update the state of all
  1219. * elements, before any animation logic is
  1220. * evaluated (in the second loop below).
  1221. */
  1222. each(elements, function (element) {
  1223. if (stale) {
  1224. element.geometry = getGeometry.call(this$1, element);
  1225. }
  1226. element.visible = isElementVisible.call(this$1, element);
  1227. });
  1228. each(elements, function (element) {
  1229. if (element.sequence) {
  1230. sequence.call(this$1, element);
  1231. } else {
  1232. animate.call(this$1, element);
  1233. }
  1234. });
  1235. this$1.pristine = false;
  1236. });
  1237. }
  1238. function transformSupported() {
  1239. var style = document.documentElement.style;
  1240. return 'transform' in style || 'WebkitTransform' in style
  1241. }
  1242. function transitionSupported() {
  1243. var style = document.documentElement.style;
  1244. return 'transition' in style || 'WebkitTransition' in style
  1245. }
  1246. var version = "4.0.1";
  1247. var boundDelegate;
  1248. var boundDestroy;
  1249. var boundReveal;
  1250. var boundClean;
  1251. var boundSync;
  1252. var config;
  1253. var debug;
  1254. var instance;
  1255. function ScrollReveal(options) {
  1256. if ( options === void 0 ) options = {};
  1257. var invokedWithoutNew =
  1258. typeof this === 'undefined' ||
  1259. Object.getPrototypeOf(this) !== ScrollReveal.prototype;
  1260. if (invokedWithoutNew) {
  1261. return new ScrollReveal(options)
  1262. }
  1263. if (!ScrollReveal.isSupported()) {
  1264. logger.call(this, 'Instantiation failed.', 'This browser is not supported.');
  1265. return mount.failure()
  1266. }
  1267. var buffer;
  1268. try {
  1269. buffer = config
  1270. ? deepAssign({}, config, options)
  1271. : deepAssign({}, defaults, options);
  1272. } catch (e) {
  1273. logger.call(this, 'Invalid configuration.', e.message);
  1274. return mount.failure()
  1275. }
  1276. try {
  1277. var container = index(buffer.container)[0];
  1278. if (!container) {
  1279. throw new Error('Invalid container.')
  1280. }
  1281. } catch (e) {
  1282. logger.call(this, e.message);
  1283. return mount.failure()
  1284. }
  1285. config = buffer;
  1286. if ((!config.mobile && isMobile()) || (!config.desktop && !isMobile())) {
  1287. logger.call(
  1288. this,
  1289. 'This device is disabled.',
  1290. ("desktop: " + (config.desktop)),
  1291. ("mobile: " + (config.mobile))
  1292. );
  1293. return mount.failure()
  1294. }
  1295. mount.success();
  1296. this.store = {
  1297. containers: {},
  1298. elements: {},
  1299. history: [],
  1300. sequences: {}
  1301. };
  1302. this.pristine = true;
  1303. boundDelegate = boundDelegate || delegate.bind(this);
  1304. boundDestroy = boundDestroy || destroy.bind(this);
  1305. boundReveal = boundReveal || reveal.bind(this);
  1306. boundClean = boundClean || clean.bind(this);
  1307. boundSync = boundSync || sync.bind(this);
  1308. Object.defineProperty(this, 'delegate', { get: function () { return boundDelegate; } });
  1309. Object.defineProperty(this, 'destroy', { get: function () { return boundDestroy; } });
  1310. Object.defineProperty(this, 'reveal', { get: function () { return boundReveal; } });
  1311. Object.defineProperty(this, 'clean', { get: function () { return boundClean; } });
  1312. Object.defineProperty(this, 'sync', { get: function () { return boundSync; } });
  1313. Object.defineProperty(this, 'defaults', { get: function () { return config; } });
  1314. Object.defineProperty(this, 'version', { get: function () { return version; } });
  1315. Object.defineProperty(this, 'noop', { get: function () { return false; } });
  1316. return instance ? instance : (instance = this)
  1317. }
  1318. ScrollReveal.isSupported = function () { return transformSupported() && transitionSupported(); };
  1319. Object.defineProperty(ScrollReveal, 'debug', {
  1320. get: function () { return debug || false; },
  1321. set: function (value) { return (debug = typeof value === 'boolean' ? value : debug); }
  1322. });
  1323. ScrollReveal();
  1324. return ScrollReveal;
  1325. })));