jekyll-chalk 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/LICENSE.txt +21 -0
- data/README.md +89 -0
- data/_includes/footer.html +7 -0
- data/_includes/head.html +33 -0
- data/_includes/image.html +3 -0
- data/_includes/javascripts.html +21 -0
- data/_includes/navigation.html +75 -0
- data/_layouts/articles_by_tag.html +38 -0
- data/_layouts/default.html +16 -0
- data/_layouts/page.html +5 -0
- data/_layouts/post.html +71 -0
- data/assets/bower/fluidbox/.bower.json +44 -0
- data/assets/bower/fluidbox/Gruntfile.js +8 -0
- data/assets/bower/fluidbox/LICENSE.md +23 -0
- data/assets/bower/fluidbox/README.md +396 -0
- data/assets/bower/fluidbox/bower.json +35 -0
- data/assets/bower/fluidbox/demo/css/styles.min.css +2 -0
- data/assets/bower/fluidbox/demo/css/styles.min.css.map +1 -0
- data/assets/bower/fluidbox/demo/fonts/BLOKKRegular.eot +0 -0
- data/assets/bower/fluidbox/demo/fonts/BLOKKRegular.svg +233 -0
- data/assets/bower/fluidbox/demo/fonts/BLOKKRegular.ttf +0 -0
- data/assets/bower/fluidbox/demo/fonts/BLOKKRegular.woff +0 -0
- data/assets/bower/fluidbox/demo/fonts/fontello.eot +0 -0
- data/assets/bower/fluidbox/demo/fonts/fontello.svg +13 -0
- data/assets/bower/fluidbox/demo/fonts/fontello.ttf +0 -0
- data/assets/bower/fluidbox/demo/fonts/fontello.woff +0 -0
- data/assets/bower/fluidbox/demo/index.html +758 -0
- data/assets/bower/fluidbox/demo/src/css/styles.scss +1131 -0
- data/assets/bower/fluidbox/dist/css/fluidbox.min.css +2 -0
- data/assets/bower/fluidbox/dist/css/fluidbox.min.css.map +1 -0
- data/assets/bower/fluidbox/dist/js/jquery.fluidbox.min.js +1 -0
- data/assets/bower/fluidbox/grunt/aliases.yaml +20 -0
- data/assets/bower/fluidbox/grunt/clean.js +5 -0
- data/assets/bower/fluidbox/grunt/concurrent.js +33 -0
- data/assets/bower/fluidbox/grunt/jshint.js +10 -0
- data/assets/bower/fluidbox/grunt/postcss.js +47 -0
- data/assets/bower/fluidbox/grunt/sass.js +42 -0
- data/assets/bower/fluidbox/grunt/uglify.js +7 -0
- data/assets/bower/fluidbox/grunt/watch.js +28 -0
- data/assets/bower/fluidbox/index.html +8 -0
- data/assets/bower/fluidbox/license.txt +21 -0
- data/assets/bower/fluidbox/src/css/_fluidbox.scss +95 -0
- data/assets/bower/fluidbox/src/css/fluidbox.scss +2 -0
- data/assets/bower/fluidbox/src/js/jquery.fluidbox.js +722 -0
- data/assets/bower/jquery/.bower.json +25 -0
- data/assets/bower/jquery/AUTHORS.txt +295 -0
- data/assets/bower/jquery/LICENSE.txt +36 -0
- data/assets/bower/jquery/README.md +65 -0
- data/assets/bower/jquery/bower.json +14 -0
- data/assets/bower/jquery/dist/core.js +482 -0
- data/assets/bower/jquery/dist/jquery.js +10220 -0
- data/assets/bower/jquery/dist/jquery.min.js +4 -0
- data/assets/bower/jquery/dist/jquery.min.map +1 -0
- data/assets/bower/jquery/dist/jquery.slim.js +8107 -0
- data/assets/bower/jquery/dist/jquery.slim.min.js +4 -0
- data/assets/bower/jquery/dist/jquery.slim.min.map +1 -0
- data/assets/bower/jquery/external/sizzle/LICENSE.txt +36 -0
- data/assets/bower/jquery/external/sizzle/dist/sizzle.js +2272 -0
- data/assets/bower/jquery/external/sizzle/dist/sizzle.min.js +3 -0
- data/assets/bower/jquery/external/sizzle/dist/sizzle.min.map +1 -0
- data/assets/bower/jquery/src/.eslintrc.json +18 -0
- data/assets/bower/jquery/src/ajax.js +855 -0
- data/assets/bower/jquery/src/ajax/jsonp.js +102 -0
- data/assets/bower/jquery/src/ajax/load.js +76 -0
- data/assets/bower/jquery/src/ajax/parseXML.js +30 -0
- data/assets/bower/jquery/src/ajax/script.js +77 -0
- data/assets/bower/jquery/src/ajax/var/location.js +5 -0
- data/assets/bower/jquery/src/ajax/var/nonce.js +7 -0
- data/assets/bower/jquery/src/ajax/var/rquery.js +5 -0
- data/assets/bower/jquery/src/ajax/xhr.js +169 -0
- data/assets/bower/jquery/src/attributes.js +13 -0
- data/assets/bower/jquery/src/attributes/attr.js +140 -0
- data/assets/bower/jquery/src/attributes/classes.js +174 -0
- data/assets/bower/jquery/src/attributes/prop.js +143 -0
- data/assets/bower/jquery/src/attributes/support.js +33 -0
- data/assets/bower/jquery/src/attributes/val.js +188 -0
- data/assets/bower/jquery/src/callbacks.js +234 -0
- data/assets/bower/jquery/src/core.js +482 -0
- data/assets/bower/jquery/src/core/DOMEval.js +16 -0
- data/assets/bower/jquery/src/core/access.js +70 -0
- data/assets/bower/jquery/src/core/init.js +127 -0
- data/assets/bower/jquery/src/core/parseHTML.js +65 -0
- data/assets/bower/jquery/src/core/ready-no-deferred.js +105 -0
- data/assets/bower/jquery/src/core/ready.js +95 -0
- data/assets/bower/jquery/src/core/readyException.js +13 -0
- data/assets/bower/jquery/src/core/stripAndCollapse.js +14 -0
- data/assets/bower/jquery/src/core/support.js +20 -0
- data/assets/bower/jquery/src/core/var/rsingleTag.js +6 -0
- data/assets/bower/jquery/src/css.js +426 -0
- data/assets/bower/jquery/src/css/addGetHookIf.js +26 -0
- data/assets/bower/jquery/src/css/adjustCSS.js +71 -0
- data/assets/bower/jquery/src/css/curCSS.js +59 -0
- data/assets/bower/jquery/src/css/hiddenVisibleSelectors.js +15 -0
- data/assets/bower/jquery/src/css/showHide.js +105 -0
- data/assets/bower/jquery/src/css/support.js +89 -0
- data/assets/bower/jquery/src/css/var/cssExpand.js +5 -0
- data/assets/bower/jquery/src/css/var/getStyles.js +17 -0
- data/assets/bower/jquery/src/css/var/isHiddenWithinTree.js +34 -0
- data/assets/bower/jquery/src/css/var/rmargin.js +5 -0
- data/assets/bower/jquery/src/css/var/rnumnonpx.js +7 -0
- data/assets/bower/jquery/src/css/var/swap.js +26 -0
- data/assets/bower/jquery/src/data.js +179 -0
- data/assets/bower/jquery/src/data/Data.js +161 -0
- data/assets/bower/jquery/src/data/var/acceptData.js +19 -0
- data/assets/bower/jquery/src/data/var/dataPriv.js +7 -0
- data/assets/bower/jquery/src/data/var/dataUser.js +7 -0
- data/assets/bower/jquery/src/deferred.js +389 -0
- data/assets/bower/jquery/src/deferred/exceptionHook.js +21 -0
- data/assets/bower/jquery/src/deprecated.js +30 -0
- data/assets/bower/jquery/src/dimensions.js +56 -0
- data/assets/bower/jquery/src/effects.js +693 -0
- data/assets/bower/jquery/src/effects/Tween.js +123 -0
- data/assets/bower/jquery/src/effects/animatedSelector.js +15 -0
- data/assets/bower/jquery/src/event.js +745 -0
- data/assets/bower/jquery/src/event/ajax.js +22 -0
- data/assets/bower/jquery/src/event/alias.js +29 -0
- data/assets/bower/jquery/src/event/focusin.js +55 -0
- data/assets/bower/jquery/src/event/support.js +11 -0
- data/assets/bower/jquery/src/event/trigger.js +185 -0
- data/assets/bower/jquery/src/exports/amd.js +26 -0
- data/assets/bower/jquery/src/exports/global.js +34 -0
- data/assets/bower/jquery/src/jquery.js +41 -0
- data/assets/bower/jquery/src/manipulation.js +486 -0
- data/assets/bower/jquery/src/manipulation/_evalUrl.js +23 -0
- data/assets/bower/jquery/src/manipulation/buildFragment.js +104 -0
- data/assets/bower/jquery/src/manipulation/getAll.js +31 -0
- data/assets/bower/jquery/src/manipulation/setGlobalEval.js +22 -0
- data/assets/bower/jquery/src/manipulation/support.js +35 -0
- data/assets/bower/jquery/src/manipulation/var/rcheckableType.js +5 -0
- data/assets/bower/jquery/src/manipulation/var/rscriptType.js +5 -0
- data/assets/bower/jquery/src/manipulation/var/rtagName.js +5 -0
- data/assets/bower/jquery/src/manipulation/wrapMap.js +29 -0
- data/assets/bower/jquery/src/offset.js +232 -0
- data/assets/bower/jquery/src/queue.js +145 -0
- data/assets/bower/jquery/src/queue/delay.js +24 -0
- data/assets/bower/jquery/src/selector-native.js +237 -0
- data/assets/bower/jquery/src/selector-sizzle.js +19 -0
- data/assets/bower/jquery/src/selector.js +3 -0
- data/assets/bower/jquery/src/serialize.js +130 -0
- data/assets/bower/jquery/src/traversing.js +178 -0
- data/assets/bower/jquery/src/traversing/findFilter.js +106 -0
- data/assets/bower/jquery/src/traversing/var/dir.js +22 -0
- data/assets/bower/jquery/src/traversing/var/rneedsContext.js +8 -0
- data/assets/bower/jquery/src/traversing/var/siblings.js +17 -0
- data/assets/bower/jquery/src/var/ObjectFunctionString.js +7 -0
- data/assets/bower/jquery/src/var/arr.js +5 -0
- data/assets/bower/jquery/src/var/class2type.js +6 -0
- data/assets/bower/jquery/src/var/concat.js +7 -0
- data/assets/bower/jquery/src/var/document.js +5 -0
- data/assets/bower/jquery/src/var/documentElement.js +7 -0
- data/assets/bower/jquery/src/var/fnToString.js +7 -0
- data/assets/bower/jquery/src/var/getProto.js +5 -0
- data/assets/bower/jquery/src/var/hasOwn.js +7 -0
- data/assets/bower/jquery/src/var/indexOf.js +7 -0
- data/assets/bower/jquery/src/var/pnum.js +5 -0
- data/assets/bower/jquery/src/var/push.js +7 -0
- data/assets/bower/jquery/src/var/rcssNum.js +9 -0
- data/assets/bower/jquery/src/var/rnothtmlwhite.js +8 -0
- data/assets/bower/jquery/src/var/slice.js +7 -0
- data/assets/bower/jquery/src/var/support.js +6 -0
- data/assets/bower/jquery/src/var/toString.js +7 -0
- data/assets/bower/jquery/src/wrap.js +77 -0
- data/assets/bower/scrollreveal/.bower.json +36 -0
- data/assets/bower/scrollreveal/CHANGELOG.md +268 -0
- data/assets/bower/scrollreveal/LICENSE.md +12 -0
- data/assets/bower/scrollreveal/README.md +413 -0
- data/assets/bower/scrollreveal/bower.json +24 -0
- data/assets/bower/scrollreveal/dist/scrollreveal.js +860 -0
- data/assets/bower/scrollreveal/dist/scrollreveal.min.js +1 -0
- data/assets/bower/turbolinks5/.blade.yml +15 -0
- data/assets/bower/turbolinks5/.bower.json +14 -0
- data/assets/bower/turbolinks5/.gitignore +2 -0
- data/assets/bower/turbolinks5/CONDUCT.md +79 -0
- data/assets/bower/turbolinks5/Gemfile +9 -0
- data/assets/bower/turbolinks5/LICENSE +20 -0
- data/assets/bower/turbolinks5/README.md +435 -0
- data/assets/bower/turbolinks5/bin/blade +16 -0
- data/assets/bower/turbolinks5/bin/rackup +16 -0
- data/assets/bower/turbolinks5/config.ru +8 -0
- data/assets/bower/turbolinks5/dist/turbolinks.js +6 -0
- data/assets/bower/turbolinks5/package.json +31 -0
- data/assets/bower/turbolinks5/src/turbolinks/BANNER.js.erb +4 -0
- data/assets/bower/turbolinks5/src/turbolinks/VERSION +1 -0
- data/assets/bower/turbolinks5/src/turbolinks/browser_adapter.coffee +61 -0
- data/assets/bower/turbolinks5/src/turbolinks/compatibility.coffee +30 -0
- data/assets/bower/turbolinks5/src/turbolinks/controller.coffee +239 -0
- data/assets/bower/turbolinks5/src/turbolinks/error_renderer.coffee +21 -0
- data/assets/bower/turbolinks5/src/turbolinks/head_details.coffee +51 -0
- data/assets/bower/turbolinks5/src/turbolinks/helpers.coffee +51 -0
- data/assets/bower/turbolinks5/src/turbolinks/history.coffee +46 -0
- data/assets/bower/turbolinks5/src/turbolinks/http_request.coffee +88 -0
- data/assets/bower/turbolinks5/src/turbolinks/index.coffee +16 -0
- data/assets/bower/turbolinks5/src/turbolinks/location.coffee +70 -0
- data/assets/bower/turbolinks5/src/turbolinks/progress_bar.coffee +83 -0
- data/assets/bower/turbolinks5/src/turbolinks/renderer.coffee +27 -0
- data/assets/bower/turbolinks5/src/turbolinks/scroll_manager.coffee +27 -0
- data/assets/bower/turbolinks5/src/turbolinks/snapshot.coffee +47 -0
- data/assets/bower/turbolinks5/src/turbolinks/snapshot_cache.coffee +43 -0
- data/assets/bower/turbolinks5/src/turbolinks/snapshot_renderer.coffee +88 -0
- data/assets/bower/turbolinks5/src/turbolinks/start.coffee +18 -0
- data/assets/bower/turbolinks5/src/turbolinks/view.coffee +34 -0
- data/assets/bower/turbolinks5/src/turbolinks/visit.coffee +162 -0
- data/assets/bower/turbolinks5/test/src/fixtures/additional_assets.html +12 -0
- data/assets/bower/turbolinks5/test/src/fixtures/body_script.html +18 -0
- data/assets/bower/turbolinks5/test/src/fixtures/eval_false_script.html +18 -0
- data/assets/bower/turbolinks5/test/src/fixtures/head_script.html +18 -0
- data/assets/bower/turbolinks5/test/src/fixtures/navigation.html +21 -0
- data/assets/bower/turbolinks5/test/src/fixtures/one.html +12 -0
- data/assets/bower/turbolinks5/test/src/fixtures/rendering.html +20 -0
- data/assets/bower/turbolinks5/test/src/fixtures/tracked_asset_change.html +11 -0
- data/assets/bower/turbolinks5/test/src/fixtures/visit.html +14 -0
- data/assets/bower/turbolinks5/test/src/head.html.erb +1 -0
- data/assets/bower/turbolinks5/test/src/helpers/replicant_helpers.coffee +18 -0
- data/assets/bower/turbolinks5/test/src/modules/navigation_tests.coffee +75 -0
- data/assets/bower/turbolinks5/test/src/modules/rendering_tests.coffee +123 -0
- data/assets/bower/turbolinks5/test/src/modules/visit_tests.coffee +49 -0
- data/assets/bower/turbolinks5/test/src/test.coffee +4 -0
- data/assets/bower/turbolinks5/test/src/test.css +20 -0
- data/assets/bower/turbolinks5/test/vendor/replicant.js +10 -0
- data/assets/fonts/cormorant-garamond/Cormorant-Garamond-700.eot +0 -0
- data/assets/fonts/cormorant-garamond/Cormorant-Garamond-700.ttf +0 -0
- data/assets/fonts/cormorant-garamond/Cormorant-Garamond-700.woff +0 -0
- data/assets/fonts/cormorant-garamond/Cormorant-Garamond-700.woff2 +0 -0
- data/assets/fonts/ionicons/ionicons.eot +0 -0
- data/assets/fonts/ionicons/ionicons.svg +2232 -0
- data/assets/fonts/ionicons/ionicons.ttf +0 -0
- data/assets/fonts/ionicons/ionicons.woff +0 -0
- data/assets/fonts/lato/Lato-300.eot +0 -0
- data/assets/fonts/lato/Lato-300.ttf +0 -0
- data/assets/fonts/lato/Lato-300.woff +0 -0
- data/assets/fonts/lato/Lato-300.woff2 +0 -0
- data/assets/fonts/lato/Lato-700.eot +0 -0
- data/assets/fonts/lato/Lato-700.ttf +0 -0
- data/assets/fonts/lato/Lato-700.woff +0 -0
- data/assets/fonts/lato/Lato-700.woff2 +0 -0
- data/assets/fonts/lato/Lato-regular.eot +0 -0
- data/assets/fonts/lato/Lato-regular.ttf +0 -0
- data/assets/fonts/lato/Lato-regular.woff +0 -0
- data/assets/fonts/lato/Lato-regular.woff2 +0 -0
- data/assets/images/about.jpg +0 -0
- data/assets/images/about@2x.jpg +0 -0
- data/assets/images/apple-touch-icon.png +0 -0
- data/assets/images/documentation/chalk-intro.png +0 -0
- data/assets/images/documentation/chalk-intro@2x.png +0 -0
- data/assets/images/documentation/enlarge.gif +0 -0
- data/assets/images/documentation/enlarge@2x.gif +0 -0
- data/assets/images/documentation/sample-image.jpg +0 -0
- data/assets/images/documentation/sample-image@2x.jpg +0 -0
- data/assets/images/og-image.jpg +0 -0
- data/assets/javascripts/application.js +24 -0
- data/assets/javascripts/vendor.js +6 -0
- data/assets/javascripts/vendor/jquery-throttle-debounce.js +9 -0
- data/assets/javascripts/vendor/retina.js +182 -0
- data/assets/stylesheets/.csscomb.json +197 -0
- data/assets/stylesheets/.scss-lint.yml +33 -0
- data/assets/stylesheets/_base.scss +151 -0
- data/assets/stylesheets/_mixins.scss +28 -0
- data/assets/stylesheets/_variables.scss +47 -0
- data/assets/stylesheets/dark.scss +70 -0
- data/assets/stylesheets/fonts.scss +63 -0
- data/assets/stylesheets/layouts/_footer.scss +17 -0
- data/assets/stylesheets/layouts/_grid.scss +102 -0
- data/assets/stylesheets/light.scss +70 -0
- data/assets/stylesheets/modules/_about.scss +10 -0
- data/assets/stylesheets/modules/_articles.scss +211 -0
- data/assets/stylesheets/modules/_embed.scss +31 -0
- data/assets/stylesheets/modules/_header.scss +57 -0
- data/assets/stylesheets/modules/_highlights-dark.scss +415 -0
- data/assets/stylesheets/modules/_highlights-light.scss +409 -0
- data/assets/stylesheets/modules/_icons.scss +2967 -0
- data/assets/stylesheets/notfound-dark.scss +90 -0
- data/assets/stylesheets/notfound-light.scss +90 -0
- data/assets/stylesheets/vendor/_normalize.scss +461 -0
- metadata +276 -3
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name" : "scrollreveal",
|
|
3
|
+
"description" : "Easy scroll animations for web and mobile browsers.",
|
|
4
|
+
"homepage" : "https://scrollrevealjs.org",
|
|
5
|
+
"main" : ["dist/scrollreveal.js"],
|
|
6
|
+
"authors" : ["Julian Lloyd"],
|
|
7
|
+
"license" : "MIT",
|
|
8
|
+
|
|
9
|
+
"keywords": [
|
|
10
|
+
"scroll",
|
|
11
|
+
"reveal",
|
|
12
|
+
"css",
|
|
13
|
+
"animation",
|
|
14
|
+
"javascript",
|
|
15
|
+
"mobile"
|
|
16
|
+
],
|
|
17
|
+
|
|
18
|
+
"ignore": [
|
|
19
|
+
"**/.*",
|
|
20
|
+
"node_modules",
|
|
21
|
+
"bower_components",
|
|
22
|
+
"app/bower_components"
|
|
23
|
+
]
|
|
24
|
+
}
|
|
@@ -0,0 +1,860 @@
|
|
|
1
|
+
///// ///// ///// /////
|
|
2
|
+
///// ///// ///// /////
|
|
3
|
+
///// ///// ///// /////
|
|
4
|
+
///// ///// ///// /////
|
|
5
|
+
///// ///// /////
|
|
6
|
+
///// ///// /////
|
|
7
|
+
///// ///// ///// /////
|
|
8
|
+
///// ///// ///// /////
|
|
9
|
+
///// /////
|
|
10
|
+
///// /////
|
|
11
|
+
///// ///// ///// /////
|
|
12
|
+
///// ///// ///// /////
|
|
13
|
+
///// ///// ///// /////
|
|
14
|
+
///// ///// ///// /////
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* ScrollReveal
|
|
18
|
+
* ------------
|
|
19
|
+
* Version : 3.3.4
|
|
20
|
+
* Website : scrollrevealjs.org
|
|
21
|
+
* Repo : github.com/jlmakes/scrollreveal.js
|
|
22
|
+
* Author : Julian Lloyd (@jlmakes)
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
;(function () {
|
|
26
|
+
'use strict'
|
|
27
|
+
|
|
28
|
+
var sr
|
|
29
|
+
var _requestAnimationFrame
|
|
30
|
+
|
|
31
|
+
function ScrollReveal (config) {
|
|
32
|
+
// Support instantiation without the `new` keyword.
|
|
33
|
+
if (typeof this === 'undefined' || Object.getPrototypeOf(this) !== ScrollReveal.prototype) {
|
|
34
|
+
return new ScrollReveal(config)
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
sr = this // Save reference to instance.
|
|
38
|
+
sr.version = '3.3.4'
|
|
39
|
+
sr.tools = new Tools() // *required utilities
|
|
40
|
+
|
|
41
|
+
if (sr.isSupported()) {
|
|
42
|
+
sr.tools.extend(sr.defaults, config || {})
|
|
43
|
+
|
|
44
|
+
sr.defaults.container = _resolveContainer(sr.defaults)
|
|
45
|
+
|
|
46
|
+
sr.store = {
|
|
47
|
+
elements: {},
|
|
48
|
+
containers: []
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
sr.sequences = {}
|
|
52
|
+
sr.history = []
|
|
53
|
+
sr.uid = 0
|
|
54
|
+
sr.initialized = false
|
|
55
|
+
} else if (typeof console !== 'undefined' && console !== null) {
|
|
56
|
+
// Note: IE9 only supports console if devtools are open.
|
|
57
|
+
console.log('ScrollReveal is not supported in this browser.')
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
return sr
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Configuration
|
|
65
|
+
* -------------
|
|
66
|
+
* This object signature can be passed directly to the ScrollReveal constructor,
|
|
67
|
+
* or as the second argument of the `reveal()` method.
|
|
68
|
+
*/
|
|
69
|
+
|
|
70
|
+
ScrollReveal.prototype.defaults = {
|
|
71
|
+
// 'bottom', 'left', 'top', 'right'
|
|
72
|
+
origin: 'bottom',
|
|
73
|
+
|
|
74
|
+
// Can be any valid CSS distance, e.g. '5rem', '10%', '20vw', etc.
|
|
75
|
+
distance: '20px',
|
|
76
|
+
|
|
77
|
+
// Time in milliseconds.
|
|
78
|
+
duration: 500,
|
|
79
|
+
delay: 0,
|
|
80
|
+
|
|
81
|
+
// Starting angles in degrees, will transition from these values to 0 in all axes.
|
|
82
|
+
rotate: { x: 0, y: 0, z: 0 },
|
|
83
|
+
|
|
84
|
+
// Starting opacity value, before transitioning to the computed opacity.
|
|
85
|
+
opacity: 0,
|
|
86
|
+
|
|
87
|
+
// Starting scale value, will transition from this value to 1
|
|
88
|
+
scale: 0.9,
|
|
89
|
+
|
|
90
|
+
// Accepts any valid CSS easing, e.g. 'ease', 'ease-in-out', 'linear', etc.
|
|
91
|
+
easing: 'cubic-bezier(0.6, 0.2, 0.1, 1)',
|
|
92
|
+
|
|
93
|
+
// `<html>` is the default reveal container. You can pass either:
|
|
94
|
+
// DOM Node, e.g. document.querySelector('.fooContainer')
|
|
95
|
+
// Selector, e.g. '.fooContainer'
|
|
96
|
+
container: window.document.documentElement,
|
|
97
|
+
|
|
98
|
+
// true/false to control reveal animations on mobile.
|
|
99
|
+
mobile: true,
|
|
100
|
+
|
|
101
|
+
// true: reveals occur every time elements become visible
|
|
102
|
+
// false: reveals occur once as elements become visible
|
|
103
|
+
reset: false,
|
|
104
|
+
|
|
105
|
+
// 'always' — delay for all reveal animations
|
|
106
|
+
// 'once' — delay only the first time reveals occur
|
|
107
|
+
// 'onload' - delay only for animations triggered by first load
|
|
108
|
+
useDelay: 'always',
|
|
109
|
+
|
|
110
|
+
// Change when an element is considered in the viewport. The default value
|
|
111
|
+
// of 0.20 means 20% of an element must be visible for its reveal to occur.
|
|
112
|
+
viewFactor: 0.2,
|
|
113
|
+
|
|
114
|
+
// Pixel values that alter the container boundaries.
|
|
115
|
+
// e.g. Set `{ top: 48 }`, if you have a 48px tall fixed toolbar.
|
|
116
|
+
// --
|
|
117
|
+
// Visual Aid: https://scrollrevealjs.org/assets/viewoffset.png
|
|
118
|
+
viewOffset: { top: 0, right: 0, bottom: 0, left: 0 },
|
|
119
|
+
|
|
120
|
+
// Callbacks that fire for each triggered element reveal, and reset.
|
|
121
|
+
beforeReveal: function (domEl) {},
|
|
122
|
+
beforeReset: function (domEl) {},
|
|
123
|
+
|
|
124
|
+
// Callbacks that fire for each completed element reveal, and reset.
|
|
125
|
+
afterReveal: function (domEl) {},
|
|
126
|
+
afterReset: function (domEl) {}
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
/**
|
|
130
|
+
* Check if client supports CSS Transform and CSS Transition.
|
|
131
|
+
* @return {boolean}
|
|
132
|
+
*/
|
|
133
|
+
ScrollReveal.prototype.isSupported = function () {
|
|
134
|
+
var style = document.documentElement.style
|
|
135
|
+
return 'WebkitTransition' in style && 'WebkitTransform' in style ||
|
|
136
|
+
'transition' in style && 'transform' in style
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* Creates a reveal set, a group of elements that will animate when they
|
|
141
|
+
* become visible. If [interval] is provided, a new sequence is created
|
|
142
|
+
* that will ensure elements reveal in the order they appear in the DOM.
|
|
143
|
+
*
|
|
144
|
+
* @param {Node|NodeList|string} [target] The node, node list or selector to use for animation.
|
|
145
|
+
* @param {Object} [config] Override the defaults for this reveal set.
|
|
146
|
+
* @param {number} [interval] Time between sequenced element animations (milliseconds).
|
|
147
|
+
* @param {boolean} [sync] Used internally when updating reveals for async content.
|
|
148
|
+
*
|
|
149
|
+
* @return {Object} The current ScrollReveal instance.
|
|
150
|
+
*/
|
|
151
|
+
ScrollReveal.prototype.reveal = function (target, config, interval, sync) {
|
|
152
|
+
var container
|
|
153
|
+
var elements
|
|
154
|
+
var elem
|
|
155
|
+
var elemId
|
|
156
|
+
var sequence
|
|
157
|
+
var sequenceId
|
|
158
|
+
|
|
159
|
+
// No custom configuration was passed, but a sequence interval instead.
|
|
160
|
+
// let’s shuffle things around to make sure everything works.
|
|
161
|
+
if (config !== undefined && typeof config === 'number') {
|
|
162
|
+
interval = config
|
|
163
|
+
config = {}
|
|
164
|
+
} else if (config === undefined || config === null) {
|
|
165
|
+
config = {}
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
container = _resolveContainer(config)
|
|
169
|
+
elements = _getRevealElements(target, container)
|
|
170
|
+
|
|
171
|
+
if (!elements.length) {
|
|
172
|
+
console.log('ScrollReveal: reveal on "' + target + '" failed, no elements found.')
|
|
173
|
+
return sr
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
// Prepare a new sequence if an interval is passed.
|
|
177
|
+
if (interval && typeof interval === 'number') {
|
|
178
|
+
sequenceId = _nextUid()
|
|
179
|
+
|
|
180
|
+
sequence = sr.sequences[sequenceId] = {
|
|
181
|
+
id: sequenceId,
|
|
182
|
+
interval: interval,
|
|
183
|
+
elemIds: [],
|
|
184
|
+
active: false
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
// Begin main loop to configure ScrollReveal elements.
|
|
189
|
+
for (var i = 0; i < elements.length; i++) {
|
|
190
|
+
// Check if the element has already been configured and grab it from the store.
|
|
191
|
+
elemId = elements[i].getAttribute('data-sr-id')
|
|
192
|
+
if (elemId) {
|
|
193
|
+
elem = sr.store.elements[elemId]
|
|
194
|
+
} else {
|
|
195
|
+
// Otherwise, let’s do some basic setup.
|
|
196
|
+
elem = {
|
|
197
|
+
id: _nextUid(),
|
|
198
|
+
domEl: elements[i],
|
|
199
|
+
seen: false,
|
|
200
|
+
revealing: false
|
|
201
|
+
}
|
|
202
|
+
elem.domEl.setAttribute('data-sr-id', elem.id)
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
// Sequence only setup
|
|
206
|
+
if (sequence) {
|
|
207
|
+
elem.sequence = {
|
|
208
|
+
id: sequence.id,
|
|
209
|
+
index: sequence.elemIds.length
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
sequence.elemIds.push(elem.id)
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
// New or existing element, it’s time to update its configuration, styles,
|
|
216
|
+
// and send the updates to our store.
|
|
217
|
+
_configure(elem, config, container)
|
|
218
|
+
_style(elem)
|
|
219
|
+
_updateStore(elem)
|
|
220
|
+
|
|
221
|
+
// We need to make sure elements are set to visibility: visible, even when
|
|
222
|
+
// on mobile and `config.mobile === false`, or if unsupported.
|
|
223
|
+
if (sr.tools.isMobile() && !elem.config.mobile || !sr.isSupported()) {
|
|
224
|
+
elem.domEl.setAttribute('style', elem.styles.inline)
|
|
225
|
+
elem.disabled = true
|
|
226
|
+
} else if (!elem.revealing) {
|
|
227
|
+
// Otherwise, proceed normally.
|
|
228
|
+
elem.domEl.setAttribute('style',
|
|
229
|
+
elem.styles.inline +
|
|
230
|
+
elem.styles.transform.initial
|
|
231
|
+
)
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
// Each `reveal()` is recorded so that when calling `sync()` while working
|
|
236
|
+
// with asynchronously loaded content, it can re-trace your steps but with
|
|
237
|
+
// all your new elements now in the DOM.
|
|
238
|
+
|
|
239
|
+
// Since `reveal()` is called internally by `sync()`, we don’t want to
|
|
240
|
+
// record or intiialize each reveal during syncing.
|
|
241
|
+
if (!sync && sr.isSupported()) {
|
|
242
|
+
_record(target, config, interval)
|
|
243
|
+
|
|
244
|
+
// We push initialization to the event queue using setTimeout, so that we can
|
|
245
|
+
// give ScrollReveal room to process all reveal calls before putting things into motion.
|
|
246
|
+
// --
|
|
247
|
+
// Philip Roberts - What the heck is the event loop anyway? (JSConf EU 2014)
|
|
248
|
+
// https://www.youtube.com/watch?v=8aGhZQkoFbQ
|
|
249
|
+
if (sr.initTimeout) {
|
|
250
|
+
window.clearTimeout(sr.initTimeout)
|
|
251
|
+
}
|
|
252
|
+
sr.initTimeout = window.setTimeout(_init, 0)
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
return sr
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
/**
|
|
259
|
+
* Re-runs `reveal()` for each record stored in history, effectively capturing
|
|
260
|
+
* any content loaded asynchronously that matches existing reveal set targets.
|
|
261
|
+
* @return {Object} The current ScrollReveal instance.
|
|
262
|
+
*/
|
|
263
|
+
ScrollReveal.prototype.sync = function () {
|
|
264
|
+
if (sr.history.length && sr.isSupported()) {
|
|
265
|
+
for (var i = 0; i < sr.history.length; i++) {
|
|
266
|
+
var record = sr.history[i]
|
|
267
|
+
sr.reveal(record.target, record.config, record.interval, true)
|
|
268
|
+
}
|
|
269
|
+
_init()
|
|
270
|
+
} else {
|
|
271
|
+
console.log('ScrollReveal: sync failed, no reveals found.')
|
|
272
|
+
}
|
|
273
|
+
return sr
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
/**
|
|
277
|
+
* Private Methods
|
|
278
|
+
* ---------------
|
|
279
|
+
*/
|
|
280
|
+
|
|
281
|
+
function _resolveContainer (config) {
|
|
282
|
+
if (config && config.container) {
|
|
283
|
+
if (typeof config.container === 'string') {
|
|
284
|
+
return window.document.documentElement.querySelector(config.container)
|
|
285
|
+
} else if (sr.tools.isNode(config.container)) {
|
|
286
|
+
return config.container
|
|
287
|
+
} else {
|
|
288
|
+
console.log('ScrollReveal: invalid container "' + config.container + '" provided.')
|
|
289
|
+
console.log('ScrollReveal: falling back to default container.')
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
return sr.defaults.container
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
/**
|
|
296
|
+
* check to see if a node or node list was passed in as the target,
|
|
297
|
+
* otherwise query the container using target as a selector.
|
|
298
|
+
*
|
|
299
|
+
* @param {Node|NodeList|string} [target] client input for reveal target.
|
|
300
|
+
* @param {Node} [container] parent element for selector queries.
|
|
301
|
+
*
|
|
302
|
+
* @return {array} elements to be revealed.
|
|
303
|
+
*/
|
|
304
|
+
function _getRevealElements (target, container) {
|
|
305
|
+
if (typeof target === 'string') {
|
|
306
|
+
return Array.prototype.slice.call(container.querySelectorAll(target))
|
|
307
|
+
} else if (sr.tools.isNode(target)) {
|
|
308
|
+
return [target]
|
|
309
|
+
} else if (sr.tools.isNodeList(target)) {
|
|
310
|
+
return Array.prototype.slice.call(target)
|
|
311
|
+
}
|
|
312
|
+
return []
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
/**
|
|
316
|
+
* A consistent way of creating unique IDs.
|
|
317
|
+
* @returns {number}
|
|
318
|
+
*/
|
|
319
|
+
function _nextUid () {
|
|
320
|
+
return ++sr.uid
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
function _configure (elem, config, container) {
|
|
324
|
+
// If a container was passed as a part of the config object,
|
|
325
|
+
// let’s overwrite it with the resolved container passed in.
|
|
326
|
+
if (config.container) config.container = container
|
|
327
|
+
// If the element hasn’t already been configured, let’s use a clone of the
|
|
328
|
+
// defaults extended by the configuration passed as the second argument.
|
|
329
|
+
if (!elem.config) {
|
|
330
|
+
elem.config = sr.tools.extendClone(sr.defaults, config)
|
|
331
|
+
} else {
|
|
332
|
+
// Otherwise, let’s use a clone of the existing element configuration extended
|
|
333
|
+
// by the configuration passed as the second argument.
|
|
334
|
+
elem.config = sr.tools.extendClone(elem.config, config)
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
// Infer CSS Transform axis from origin string.
|
|
338
|
+
if (elem.config.origin === 'top' || elem.config.origin === 'bottom') {
|
|
339
|
+
elem.config.axis = 'Y'
|
|
340
|
+
} else {
|
|
341
|
+
elem.config.axis = 'X'
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
function _style (elem) {
|
|
346
|
+
var computed = window.getComputedStyle(elem.domEl)
|
|
347
|
+
|
|
348
|
+
if (!elem.styles) {
|
|
349
|
+
elem.styles = {
|
|
350
|
+
transition: {},
|
|
351
|
+
transform: {},
|
|
352
|
+
computed: {}
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
// Capture any existing inline styles, and add our visibility override.
|
|
356
|
+
// --
|
|
357
|
+
// See section 4.2. in the Documentation:
|
|
358
|
+
// https://github.com/jlmakes/scrollreveal.js#42-improve-user-experience
|
|
359
|
+
elem.styles.inline = elem.domEl.getAttribute('style') || ''
|
|
360
|
+
elem.styles.inline += '; visibility: visible; '
|
|
361
|
+
|
|
362
|
+
// grab the elements existing opacity.
|
|
363
|
+
elem.styles.computed.opacity = computed.opacity
|
|
364
|
+
|
|
365
|
+
// grab the elements existing transitions.
|
|
366
|
+
if (!computed.transition || computed.transition === 'all 0s ease 0s') {
|
|
367
|
+
elem.styles.computed.transition = ''
|
|
368
|
+
} else {
|
|
369
|
+
elem.styles.computed.transition = computed.transition + ', '
|
|
370
|
+
}
|
|
371
|
+
}
|
|
372
|
+
|
|
373
|
+
// Create transition styles
|
|
374
|
+
elem.styles.transition.instant = _generateTransition(elem, 0)
|
|
375
|
+
elem.styles.transition.delayed = _generateTransition(elem, elem.config.delay)
|
|
376
|
+
|
|
377
|
+
// Generate transform styles, first with the webkit prefix.
|
|
378
|
+
elem.styles.transform.initial = ' -webkit-transform:'
|
|
379
|
+
elem.styles.transform.target = ' -webkit-transform:'
|
|
380
|
+
_generateTransform(elem)
|
|
381
|
+
|
|
382
|
+
// And again without any prefix.
|
|
383
|
+
elem.styles.transform.initial += 'transform:'
|
|
384
|
+
elem.styles.transform.target += 'transform:'
|
|
385
|
+
_generateTransform(elem)
|
|
386
|
+
}
|
|
387
|
+
|
|
388
|
+
function _generateTransition (elem, delay) {
|
|
389
|
+
var config = elem.config
|
|
390
|
+
|
|
391
|
+
return '-webkit-transition: ' + elem.styles.computed.transition +
|
|
392
|
+
'-webkit-transform ' + config.duration / 1000 + 's ' +
|
|
393
|
+
config.easing + ' ' +
|
|
394
|
+
delay / 1000 + 's, opacity ' +
|
|
395
|
+
config.duration / 1000 + 's ' +
|
|
396
|
+
config.easing + ' ' +
|
|
397
|
+
delay / 1000 + 's; ' +
|
|
398
|
+
|
|
399
|
+
'transition: ' + elem.styles.computed.transition +
|
|
400
|
+
'transform ' + config.duration / 1000 + 's ' +
|
|
401
|
+
config.easing + ' ' +
|
|
402
|
+
delay / 1000 + 's, opacity ' +
|
|
403
|
+
config.duration / 1000 + 's ' +
|
|
404
|
+
config.easing + ' ' +
|
|
405
|
+
delay / 1000 + 's; '
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
function _generateTransform (elem) {
|
|
409
|
+
var config = elem.config
|
|
410
|
+
var cssDistance
|
|
411
|
+
var transform = elem.styles.transform
|
|
412
|
+
|
|
413
|
+
// Let’s make sure our our pixel distances are negative for top and left.
|
|
414
|
+
// e.g. origin = 'top' and distance = '25px' starts at `top: -25px` in CSS.
|
|
415
|
+
if (config.origin === 'top' || config.origin === 'left') {
|
|
416
|
+
cssDistance = /^-/.test(config.distance)
|
|
417
|
+
? config.distance.substr(1)
|
|
418
|
+
: '-' + config.distance
|
|
419
|
+
} else {
|
|
420
|
+
cssDistance = config.distance
|
|
421
|
+
}
|
|
422
|
+
|
|
423
|
+
if (parseInt(config.distance)) {
|
|
424
|
+
transform.initial += ' translate' + config.axis + '(' + cssDistance + ')'
|
|
425
|
+
transform.target += ' translate' + config.axis + '(0)'
|
|
426
|
+
}
|
|
427
|
+
if (config.scale) {
|
|
428
|
+
transform.initial += ' scale(' + config.scale + ')'
|
|
429
|
+
transform.target += ' scale(1)'
|
|
430
|
+
}
|
|
431
|
+
if (config.rotate.x) {
|
|
432
|
+
transform.initial += ' rotateX(' + config.rotate.x + 'deg)'
|
|
433
|
+
transform.target += ' rotateX(0)'
|
|
434
|
+
}
|
|
435
|
+
if (config.rotate.y) {
|
|
436
|
+
transform.initial += ' rotateY(' + config.rotate.y + 'deg)'
|
|
437
|
+
transform.target += ' rotateY(0)'
|
|
438
|
+
}
|
|
439
|
+
if (config.rotate.z) {
|
|
440
|
+
transform.initial += ' rotateZ(' + config.rotate.z + 'deg)'
|
|
441
|
+
transform.target += ' rotateZ(0)'
|
|
442
|
+
}
|
|
443
|
+
transform.initial += '; opacity: ' + config.opacity + ';'
|
|
444
|
+
transform.target += '; opacity: ' + elem.styles.computed.opacity + ';'
|
|
445
|
+
}
|
|
446
|
+
|
|
447
|
+
function _updateStore (elem) {
|
|
448
|
+
var container = elem.config.container
|
|
449
|
+
|
|
450
|
+
// If this element’s container isn’t already in the store, let’s add it.
|
|
451
|
+
if (container && sr.store.containers.indexOf(container) === -1) {
|
|
452
|
+
sr.store.containers.push(elem.config.container)
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
// Update the element stored with our new element.
|
|
456
|
+
sr.store.elements[elem.id] = elem
|
|
457
|
+
}
|
|
458
|
+
|
|
459
|
+
function _record (target, config, interval) {
|
|
460
|
+
// Save the `reveal()` arguments that triggered this `_record()` call, so we
|
|
461
|
+
// can re-trace our steps when calling the `sync()` method.
|
|
462
|
+
var record = {
|
|
463
|
+
target: target,
|
|
464
|
+
config: config,
|
|
465
|
+
interval: interval
|
|
466
|
+
}
|
|
467
|
+
sr.history.push(record)
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
function _init () {
|
|
471
|
+
if (sr.isSupported()) {
|
|
472
|
+
// Initial animate call triggers valid reveal animations on first load.
|
|
473
|
+
// Subsequent animate calls are made inside the event handler.
|
|
474
|
+
_animate()
|
|
475
|
+
|
|
476
|
+
// Then we loop through all container nodes in the store and bind event
|
|
477
|
+
// listeners to each.
|
|
478
|
+
for (var i = 0; i < sr.store.containers.length; i++) {
|
|
479
|
+
sr.store.containers[i].addEventListener('scroll', _handler)
|
|
480
|
+
sr.store.containers[i].addEventListener('resize', _handler)
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
// Let’s also do a one-time binding of window event listeners.
|
|
484
|
+
if (!sr.initialized) {
|
|
485
|
+
window.addEventListener('scroll', _handler)
|
|
486
|
+
window.addEventListener('resize', _handler)
|
|
487
|
+
sr.initialized = true
|
|
488
|
+
}
|
|
489
|
+
}
|
|
490
|
+
return sr
|
|
491
|
+
}
|
|
492
|
+
|
|
493
|
+
function _handler () {
|
|
494
|
+
_requestAnimationFrame(_animate)
|
|
495
|
+
}
|
|
496
|
+
|
|
497
|
+
function _setActiveSequences () {
|
|
498
|
+
var active
|
|
499
|
+
var elem
|
|
500
|
+
var elemId
|
|
501
|
+
var sequence
|
|
502
|
+
|
|
503
|
+
// Loop through all sequences
|
|
504
|
+
sr.tools.forOwn(sr.sequences, function (sequenceId) {
|
|
505
|
+
sequence = sr.sequences[sequenceId]
|
|
506
|
+
active = false
|
|
507
|
+
|
|
508
|
+
// For each sequenced elemenet, let’s check visibility and if
|
|
509
|
+
// any are visible, set it’s sequence to active.
|
|
510
|
+
for (var i = 0; i < sequence.elemIds.length; i++) {
|
|
511
|
+
elemId = sequence.elemIds[i]
|
|
512
|
+
elem = sr.store.elements[elemId]
|
|
513
|
+
if (_isElemVisible(elem) && !active) {
|
|
514
|
+
active = true
|
|
515
|
+
}
|
|
516
|
+
}
|
|
517
|
+
|
|
518
|
+
sequence.active = active
|
|
519
|
+
})
|
|
520
|
+
}
|
|
521
|
+
|
|
522
|
+
function _animate () {
|
|
523
|
+
var delayed
|
|
524
|
+
var elem
|
|
525
|
+
|
|
526
|
+
_setActiveSequences()
|
|
527
|
+
|
|
528
|
+
// Loop through all elements in the store
|
|
529
|
+
sr.tools.forOwn(sr.store.elements, function (elemId) {
|
|
530
|
+
elem = sr.store.elements[elemId]
|
|
531
|
+
delayed = _shouldUseDelay(elem)
|
|
532
|
+
|
|
533
|
+
// Let’s see if we should revealand if so,
|
|
534
|
+
// trigger the `beforeReveal` callback and
|
|
535
|
+
// determine whether or not to use delay.
|
|
536
|
+
if (_shouldReveal(elem)) {
|
|
537
|
+
elem.config.beforeReveal(elem.domEl)
|
|
538
|
+
if (delayed) {
|
|
539
|
+
elem.domEl.setAttribute('style',
|
|
540
|
+
elem.styles.inline +
|
|
541
|
+
elem.styles.transform.target +
|
|
542
|
+
elem.styles.transition.delayed
|
|
543
|
+
)
|
|
544
|
+
} else {
|
|
545
|
+
elem.domEl.setAttribute('style',
|
|
546
|
+
elem.styles.inline +
|
|
547
|
+
elem.styles.transform.target +
|
|
548
|
+
elem.styles.transition.instant
|
|
549
|
+
)
|
|
550
|
+
}
|
|
551
|
+
|
|
552
|
+
// Let’s queue the `afterReveal` callback
|
|
553
|
+
// and mark the element as seen and revealing.
|
|
554
|
+
_queueCallback('reveal', elem, delayed)
|
|
555
|
+
elem.revealing = true
|
|
556
|
+
elem.seen = true
|
|
557
|
+
|
|
558
|
+
if (elem.sequence) {
|
|
559
|
+
_queueNextInSequence(elem, delayed)
|
|
560
|
+
}
|
|
561
|
+
} else if (_shouldReset(elem)) {
|
|
562
|
+
//Otherwise reset our element and
|
|
563
|
+
// trigger the `beforeReset` callback.
|
|
564
|
+
elem.config.beforeReset(elem.domEl)
|
|
565
|
+
elem.domEl.setAttribute('style',
|
|
566
|
+
elem.styles.inline +
|
|
567
|
+
elem.styles.transform.initial +
|
|
568
|
+
elem.styles.transition.instant
|
|
569
|
+
)
|
|
570
|
+
// And queue the `afterReset` callback.
|
|
571
|
+
_queueCallback('reset', elem)
|
|
572
|
+
elem.revealing = false
|
|
573
|
+
}
|
|
574
|
+
})
|
|
575
|
+
}
|
|
576
|
+
|
|
577
|
+
function _queueNextInSequence (elem, delayed) {
|
|
578
|
+
var elapsed = 0
|
|
579
|
+
var delay = 0
|
|
580
|
+
var sequence = sr.sequences[elem.sequence.id]
|
|
581
|
+
|
|
582
|
+
// We’re processing a sequenced element, so let's block other elements in this sequence.
|
|
583
|
+
sequence.blocked = true
|
|
584
|
+
|
|
585
|
+
// Since we’re triggering animations a part of a sequence after animations on first load,
|
|
586
|
+
// we need to check for that condition and explicitly add the delay to our timer.
|
|
587
|
+
if (delayed && elem.config.useDelay === 'onload') {
|
|
588
|
+
delay = elem.config.delay
|
|
589
|
+
}
|
|
590
|
+
|
|
591
|
+
// If a sequence timer is already running, capture the elapsed time and clear it.
|
|
592
|
+
if (elem.sequence.timer) {
|
|
593
|
+
elapsed = Math.abs(elem.sequence.timer.started - new Date())
|
|
594
|
+
window.clearTimeout(elem.sequence.timer)
|
|
595
|
+
}
|
|
596
|
+
|
|
597
|
+
// Start a new timer.
|
|
598
|
+
elem.sequence.timer = { started: new Date() }
|
|
599
|
+
elem.sequence.timer.clock = window.setTimeout(function () {
|
|
600
|
+
// Sequence interval has passed, so unblock the sequence and re-run the handler.
|
|
601
|
+
sequence.blocked = false
|
|
602
|
+
elem.sequence.timer = null
|
|
603
|
+
_handler()
|
|
604
|
+
}, Math.abs(sequence.interval) + delay - elapsed)
|
|
605
|
+
}
|
|
606
|
+
|
|
607
|
+
function _queueCallback (type, elem, delayed) {
|
|
608
|
+
var elapsed = 0
|
|
609
|
+
var duration = 0
|
|
610
|
+
var callback = 'after'
|
|
611
|
+
|
|
612
|
+
// Check which callback we’re working with.
|
|
613
|
+
switch (type) {
|
|
614
|
+
case 'reveal':
|
|
615
|
+
duration = elem.config.duration
|
|
616
|
+
if (delayed) {
|
|
617
|
+
duration += elem.config.delay
|
|
618
|
+
}
|
|
619
|
+
callback += 'Reveal'
|
|
620
|
+
break
|
|
621
|
+
|
|
622
|
+
case 'reset':
|
|
623
|
+
duration = elem.config.duration
|
|
624
|
+
callback += 'Reset'
|
|
625
|
+
break
|
|
626
|
+
}
|
|
627
|
+
|
|
628
|
+
// If a timer is already running, capture the elapsed time and clear it.
|
|
629
|
+
if (elem.timer) {
|
|
630
|
+
elapsed = Math.abs(elem.timer.started - new Date())
|
|
631
|
+
window.clearTimeout(elem.timer.clock)
|
|
632
|
+
}
|
|
633
|
+
|
|
634
|
+
// Start a new timer.
|
|
635
|
+
elem.timer = { started: new Date() }
|
|
636
|
+
elem.timer.clock = window.setTimeout(function () {
|
|
637
|
+
// The timer completed, so let’s fire the callback and null the timer.
|
|
638
|
+
elem.config[callback](elem.domEl)
|
|
639
|
+
elem.timer = null
|
|
640
|
+
}, duration - elapsed)
|
|
641
|
+
}
|
|
642
|
+
|
|
643
|
+
function _shouldReveal (elem) {
|
|
644
|
+
if (elem.sequence) {
|
|
645
|
+
var sequence = sr.sequences[elem.sequence.id]
|
|
646
|
+
return sequence.active &&
|
|
647
|
+
!sequence.blocked &&
|
|
648
|
+
!elem.revealing &&
|
|
649
|
+
!elem.disabled
|
|
650
|
+
}
|
|
651
|
+
return _isElemVisible(elem) &&
|
|
652
|
+
!elem.revealing &&
|
|
653
|
+
!elem.disabled
|
|
654
|
+
}
|
|
655
|
+
|
|
656
|
+
function _shouldUseDelay (elem) {
|
|
657
|
+
var config = elem.config.useDelay
|
|
658
|
+
return config === 'always' ||
|
|
659
|
+
(config === 'onload' && !sr.initialized) ||
|
|
660
|
+
(config === 'once' && !elem.seen)
|
|
661
|
+
}
|
|
662
|
+
|
|
663
|
+
function _shouldReset (elem) {
|
|
664
|
+
if (elem.sequence) {
|
|
665
|
+
var sequence = sr.sequences[elem.sequence.id]
|
|
666
|
+
return !sequence.active &&
|
|
667
|
+
elem.config.reset &&
|
|
668
|
+
elem.revealing &&
|
|
669
|
+
!elem.disabled
|
|
670
|
+
}
|
|
671
|
+
return !_isElemVisible(elem) &&
|
|
672
|
+
elem.config.reset &&
|
|
673
|
+
elem.revealing &&
|
|
674
|
+
!elem.disabled
|
|
675
|
+
}
|
|
676
|
+
|
|
677
|
+
function _getContainer (container) {
|
|
678
|
+
return {
|
|
679
|
+
width: container.clientWidth,
|
|
680
|
+
height: container.clientHeight
|
|
681
|
+
}
|
|
682
|
+
}
|
|
683
|
+
|
|
684
|
+
function _getScrolled (container) {
|
|
685
|
+
// Return the container scroll values, plus the its offset.
|
|
686
|
+
if (container && container !== window.document.documentElement) {
|
|
687
|
+
var offset = _getOffset(container)
|
|
688
|
+
return {
|
|
689
|
+
x: container.scrollLeft + offset.left,
|
|
690
|
+
y: container.scrollTop + offset.top
|
|
691
|
+
}
|
|
692
|
+
} else {
|
|
693
|
+
// Otherwise, default to the window object’s scroll values.
|
|
694
|
+
return {
|
|
695
|
+
x: window.pageXOffset,
|
|
696
|
+
y: window.pageYOffset
|
|
697
|
+
}
|
|
698
|
+
}
|
|
699
|
+
}
|
|
700
|
+
|
|
701
|
+
function _getOffset (domEl) {
|
|
702
|
+
var offsetTop = 0
|
|
703
|
+
var offsetLeft = 0
|
|
704
|
+
|
|
705
|
+
// Grab the element’s dimensions.
|
|
706
|
+
var offsetHeight = domEl.offsetHeight
|
|
707
|
+
var offsetWidth = domEl.offsetWidth
|
|
708
|
+
|
|
709
|
+
// Now calculate the distance between the element and its parent, then
|
|
710
|
+
// again for the parent to its parent, and again etc... until we have the
|
|
711
|
+
// total distance of the element to the document’s top and left origin.
|
|
712
|
+
do {
|
|
713
|
+
if (!isNaN(domEl.offsetTop)) {
|
|
714
|
+
offsetTop += domEl.offsetTop
|
|
715
|
+
}
|
|
716
|
+
if (!isNaN(domEl.offsetLeft)) {
|
|
717
|
+
offsetLeft += domEl.offsetLeft
|
|
718
|
+
}
|
|
719
|
+
domEl = domEl.offsetParent
|
|
720
|
+
} while (domEl)
|
|
721
|
+
|
|
722
|
+
return {
|
|
723
|
+
top: offsetTop,
|
|
724
|
+
left: offsetLeft,
|
|
725
|
+
height: offsetHeight,
|
|
726
|
+
width: offsetWidth
|
|
727
|
+
}
|
|
728
|
+
}
|
|
729
|
+
|
|
730
|
+
function _isElemVisible (elem) {
|
|
731
|
+
var offset = _getOffset(elem.domEl)
|
|
732
|
+
var container = _getContainer(elem.config.container)
|
|
733
|
+
var scrolled = _getScrolled(elem.config.container)
|
|
734
|
+
var vF = elem.config.viewFactor
|
|
735
|
+
|
|
736
|
+
// Define the element geometry.
|
|
737
|
+
var elemHeight = offset.height
|
|
738
|
+
var elemWidth = offset.width
|
|
739
|
+
var elemTop = offset.top
|
|
740
|
+
var elemLeft = offset.left
|
|
741
|
+
var elemBottom = elemTop + elemHeight
|
|
742
|
+
var elemRight = elemLeft + elemWidth
|
|
743
|
+
|
|
744
|
+
return confirmBounds() || isPositionFixed()
|
|
745
|
+
|
|
746
|
+
function confirmBounds () {
|
|
747
|
+
// Define the element’s functional boundaries using its view factor.
|
|
748
|
+
var top = elemTop + elemHeight * vF
|
|
749
|
+
var left = elemLeft + elemWidth * vF
|
|
750
|
+
var bottom = elemBottom - elemHeight * vF
|
|
751
|
+
var right = elemRight - elemWidth * vF
|
|
752
|
+
|
|
753
|
+
// Define the container functional boundaries using its view offset.
|
|
754
|
+
var viewTop = scrolled.y + elem.config.viewOffset.top
|
|
755
|
+
var viewLeft = scrolled.x + elem.config.viewOffset.left
|
|
756
|
+
var viewBottom = scrolled.y - elem.config.viewOffset.bottom + container.height
|
|
757
|
+
var viewRight = scrolled.x - elem.config.viewOffset.right + container.width
|
|
758
|
+
|
|
759
|
+
return top < viewBottom &&
|
|
760
|
+
bottom > viewTop &&
|
|
761
|
+
left > viewLeft &&
|
|
762
|
+
right < viewRight
|
|
763
|
+
}
|
|
764
|
+
|
|
765
|
+
function isPositionFixed () {
|
|
766
|
+
return (window.getComputedStyle(elem.domEl).position === 'fixed')
|
|
767
|
+
}
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
/**
|
|
771
|
+
* Utilities
|
|
772
|
+
* ---------
|
|
773
|
+
*/
|
|
774
|
+
|
|
775
|
+
function Tools () {}
|
|
776
|
+
|
|
777
|
+
Tools.prototype.isObject = function (object) {
|
|
778
|
+
return object !== null && typeof object === 'object' && object.constructor === Object
|
|
779
|
+
}
|
|
780
|
+
|
|
781
|
+
Tools.prototype.isNode = function (object) {
|
|
782
|
+
return typeof window.Node === 'object'
|
|
783
|
+
? object instanceof window.Node
|
|
784
|
+
: object && typeof object === 'object' &&
|
|
785
|
+
typeof object.nodeType === 'number' &&
|
|
786
|
+
typeof object.nodeName === 'string'
|
|
787
|
+
}
|
|
788
|
+
|
|
789
|
+
Tools.prototype.isNodeList = function (object) {
|
|
790
|
+
var prototypeToString = Object.prototype.toString.call(object)
|
|
791
|
+
var regex = /^\[object (HTMLCollection|NodeList|Object)\]$/
|
|
792
|
+
|
|
793
|
+
return typeof window.NodeList === 'object'
|
|
794
|
+
? object instanceof window.NodeList
|
|
795
|
+
: object && typeof object === 'object' &&
|
|
796
|
+
regex.test(prototypeToString) &&
|
|
797
|
+
typeof object.length === 'number' &&
|
|
798
|
+
(object.length === 0 || this.isNode(object[0]))
|
|
799
|
+
}
|
|
800
|
+
|
|
801
|
+
Tools.prototype.forOwn = function (object, callback) {
|
|
802
|
+
if (!this.isObject(object)) {
|
|
803
|
+
throw new TypeError('Expected "object", but received "' + typeof object + '".')
|
|
804
|
+
} else {
|
|
805
|
+
for (var property in object) {
|
|
806
|
+
if (object.hasOwnProperty(property)) {
|
|
807
|
+
callback(property)
|
|
808
|
+
}
|
|
809
|
+
}
|
|
810
|
+
}
|
|
811
|
+
}
|
|
812
|
+
|
|
813
|
+
Tools.prototype.extend = function (target, source) {
|
|
814
|
+
this.forOwn(source, function (property) {
|
|
815
|
+
if (this.isObject(source[property])) {
|
|
816
|
+
if (!target[property] || !this.isObject(target[property])) {
|
|
817
|
+
target[property] = {}
|
|
818
|
+
}
|
|
819
|
+
this.extend(target[property], source[property])
|
|
820
|
+
} else {
|
|
821
|
+
target[property] = source[property]
|
|
822
|
+
}
|
|
823
|
+
}.bind(this))
|
|
824
|
+
return target
|
|
825
|
+
}
|
|
826
|
+
|
|
827
|
+
Tools.prototype.extendClone = function (target, source) {
|
|
828
|
+
return this.extend(this.extend({}, target), source)
|
|
829
|
+
}
|
|
830
|
+
|
|
831
|
+
Tools.prototype.isMobile = function () {
|
|
832
|
+
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
|
|
833
|
+
}
|
|
834
|
+
|
|
835
|
+
/**
|
|
836
|
+
* Polyfills
|
|
837
|
+
* --------
|
|
838
|
+
*/
|
|
839
|
+
|
|
840
|
+
_requestAnimationFrame = window.requestAnimationFrame ||
|
|
841
|
+
window.webkitRequestAnimationFrame ||
|
|
842
|
+
window.mozRequestAnimationFrame ||
|
|
843
|
+
function (callback) {
|
|
844
|
+
window.setTimeout(callback, 1000 / 60)
|
|
845
|
+
}
|
|
846
|
+
|
|
847
|
+
/**
|
|
848
|
+
* Module Wrapper
|
|
849
|
+
* --------------
|
|
850
|
+
*/
|
|
851
|
+
if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {
|
|
852
|
+
define(function () {
|
|
853
|
+
return ScrollReveal
|
|
854
|
+
})
|
|
855
|
+
} else if (typeof module !== 'undefined' && module.exports) {
|
|
856
|
+
module.exports = ScrollReveal
|
|
857
|
+
} else {
|
|
858
|
+
window.ScrollReveal = ScrollReveal
|
|
859
|
+
}
|
|
860
|
+
})();
|