1/*! 2 * ScrollMagic v2.0.7 (2019-05-07) 3 * The javascript library for magical scroll interactions. 4 * (c) 2019 Jan Paepke (@janpaepke) 5 * Project Website: http://scrollmagic.io 6 * 7 * @version 2.0.7 8 * @license Dual licensed under MIT license and GPL. 9 * @author Jan Paepke - [email protected] 10 * 11 * @file ScrollMagic GSAP Animation Plugin. 12 * 13 * requires: GSAP ~1.14 14 * Powered by the Greensock Animation Platform (GSAP): http://www.greensock.com/js 15 * Greensock License info at http://www.greensock.com/licensing/ 16 */ 17/** 18 * This plugin is meant to be used in conjunction with the Greensock Animation Plattform. 19 * It offers an easy API to trigger Tweens or synchronize them to the scrollbar movement. 20 * 21 * Both the `lite` and the `max` versions of the GSAP library are supported. 22 * The most basic requirement is `TweenLite`. 23 * 24 * To have access to this extension, please include `plugins/animation.gsap.js`. 25 * @requires {@link http://greensock.com/gsap|GSAP ~1.14.x} 26 * @mixin animation.GSAP 27 */ 28(function (root, factory) { 29 if (typeof define === 'function' && define.amd) { 30 // AMD. Register as an anonymous module. 31 define(['ScrollMagic', 'TweenMax', 'TimelineMax'], factory); 32 } else if (typeof exports === 'object') { 33 // CommonJS 34 // Loads whole gsap package onto global scope. 35 require('gsap'); 36 factory(require('scrollmagic'), TweenMax, TimelineMax); 37 } else { 38 // Browser globals 39 factory(root.ScrollMagic || (root.jQuery && root.jQuery.ScrollMagic), root.TweenMax || root.TweenLite, root.TimelineMax || root.TimelineLite); 40 } 41}(this, function (ScrollMagic, Tween, Timeline) { 42 "use strict"; 43 var NAMESPACE = "animation.gsap"; 44 45 var 46 console = window.console || {}, 47 err = Function.prototype.bind.call(console.error || console.log || function () {}, console); 48 if (!ScrollMagic) { 49 err("(" + NAMESPACE + ") -> ERROR: The ScrollMagic main module could not be found. Please make sure it's loaded before this plugin or use an asynchronous loader like requirejs."); 50 } 51 if (!Tween) { 52 err("(" + NAMESPACE + ") -> ERROR: TweenLite or TweenMax could not be found. Please make sure GSAP is loaded before ScrollMagic or use an asynchronous loader like requirejs."); 53 } 54 55 /* 56 * ---------------------------------------------------------------- 57 * Extensions for Scene 58 * ---------------------------------------------------------------- 59 */ 60 /** 61 * Every instance of ScrollMagic.Scene now accepts an additional option. 62 * See {@link ScrollMagic.Scene} for a complete list of the standard options. 63 * @memberof! animation.GSAP# 64 * @method new ScrollMagic.Scene(options) 65 * @example 66 * var scene = new ScrollMagic.Scene({tweenChanges: true}); 67 * 68 * @param {object} [options] - Options for the Scene. The options can be updated at any time. 69 * @param {boolean} [options.tweenChanges=false] - Tweens Animation to the progress target instead of setting it. 70 Does not affect animations where duration is `0`. 71 */ 72 /** 73 * **Get** or **Set** the tweenChanges option value. 74 * This only affects scenes with a duration. If `tweenChanges` is `true`, the progress update when scrolling will not be immediate, but instead the animation will smoothly animate to the target state. 75 * For a better understanding, try enabling and disabling this option in the [Scene Manipulation Example](../examples/basic/scene_manipulation.html). 76 * @memberof! animation.GSAP# 77 * @method Scene.tweenChanges 78 * 79 * @example 80 * // get the current tweenChanges option 81 * var tweenChanges = scene.tweenChanges(); 82 * 83 * // set new tweenChanges option 84 * scene.tweenChanges(true); 85 * 86 * @fires {@link Scene.change}, when used as setter 87 * @param {boolean} [newTweenChanges] - The new tweenChanges setting of the scene. 88 * @returns {boolean} `get` - Current tweenChanges option value. 89 * @returns {Scene} `set` - Parent object for chaining. 90 */ 91 // add option (TODO: DOC (private for dev)) 92 ScrollMagic.Scene.addOption( 93 "tweenChanges", // name 94 false, // default 95 function (val) { // validation callback 96 return !!val; 97 } 98 ); 99 // extend scene 100 ScrollMagic.Scene.extend(function () { 101 var Scene = this, 102 _tween; 103 104 var log = function () { 105 if (Scene._log) { // not available, when main source minified 106 Array.prototype.splice.call(arguments, 1, 0, "(" + NAMESPACE + ")", "->"); 107 Scene._log.apply(this, arguments); 108 } 109 }; 110 111 // set listeners 112 Scene.on("progress.plugin_gsap", function () { 113 updateTweenProgress(); 114 }); 115 Scene.on("destroy.plugin_gsap", function (e) { 116 Scene.removeTween(e.reset); 117 }); 118 119 /** 120 * Update the tween progress to current position. 121 * @private 122 */ 123 var updateTweenProgress = function () { 124 if (_tween) { 125 var 126 progress = Scene.progress(), 127 state = Scene.state(); 128 if (_tween.repeat && _tween.repeat() === -1) { 129 // infinite loop, so not in relation to progress 130 if (state === 'DURING' && _tween.paused()) { 131 _tween.play(); 132 } else if (state !== 'DURING' && !_tween.paused()) { 133 _tween.pause(); 134 } 135 } else if (progress != _tween.progress()) { // do we even need to update the progress? 136 // no infinite loop - so should we just play or go to a specific point in t
136ime? 137 if (Scene.duration() === 0) { 138 // play the animation 139 if (progress > 0) { // play from 0 to 1 140 _tween.play(); 141 } else { // play from 1 to 0 142 _tween.reverse(); 143 } 144 } else { 145 // go to a specific point in time 146 if (Scene.tweenChanges() && _tween.tweenTo) { 147 // go smooth 148 _tween.tweenTo(progress * _tween.duration()); 149 } else { 150 // just hard set it 151 _tween.progress(progress).pause(); 152 } 153 } 154 } 155 } 156 }; 157 158 /** 159 * Add a tween to the scene. 160 * If you want to add multiple tweens, add them into a GSAP Timeline object and supply it instead (see example below). 161 * 162 * If the scene has a duration, the tween's duration will be projected to the scroll distance of the scene, meaning its progress will be synced to scrollbar movement. 163 * For a scene with a duration of `0`, the tween will be triggered when scrolling forward past the scene's trigger position and reversed, when scrolling back. 164 * To gain better understanding, check out the [Simple Tweening example](../examples/basic/simple_tweening.html). 165 * 166 * Instead of supplying a tween this method can also be used as a shorthand for `TweenMax.to()` (see example below). 167 * @memberof! animation.GSAP# 168 * 169 * @example 170 * // add a single tween directly 171 * scene.setTween(TweenMax.to("obj"), 1, {x: 100}); 172 * 173 * // add a single tween via variable 174 * var tween = TweenMax.to("obj"), 1, {x: 100}; 175 * scene.setTween(tween); 176 * 177 * // add multiple tweens, wrapped in a timeline. 178 * var timeline = new TimelineMax(); 179 * var tween1 = TweenMax.from("obj1", 1, {x: 100}); 180 * var tween2 = TweenMax.to("obj2", 1, {y: 100}); 181 * timeline 182 * .add(tween1) 183 * .add(tween2); 184 * scene.addTween(timeline); 185 * 186 * // short hand to add a TweenMax.to() tween 187 * scene.setTween("obj3", 0.5, {y: 100}); 188 * 189 * // short hand to add a TweenMax.to() tween for 1 second 190 * // this is useful, when the scene has a duration and the tween duration isn't important anyway 191 * scene.setTween("obj3", {y: 100}); 192 * 193 * @param {(object|string)} TweenObject - A TweenMax, TweenLite, TimelineMax or TimelineLite object that should be animated in the scene. Can also be a Dom Element or Selector, when using direct tween definition (see examples). 194 * @param {(number|object)} duration - A duration for the tween, or tween parameters. If an object containing parameters are supplied, a default duration of 1 will be used. 195 * @param {object} params - The parameters for the tween 196 * @returns {Scene} Parent object for chaining. 197 */ 198 Scene.setTween = function (TweenObject, duration, params) { 199 var newTween; 200 if (arguments.length > 1) { 201 if (arguments.length < 3) { 202 params = duration; 203 duration = 1; 204 } 205 TweenObject = Tween.to(TweenObject, duration, params); 206 } 207 try { 208 // wrap Tween into a Timeline Object if available to include delay and repeats in the duration and standardize methods. 209 if (Timeline) { 210 newTween = new Timeline({ 211 smoothChildTiming: true 212 }) 213 .add(TweenObject); 214 } else { 215 newTween = TweenObject; 216 } 217 newTween.pause(); 218 } catch (e) { 219 log(1, "ERROR calling method 'setTween()': Supplied argument is not a valid TweenObject"); 220 return Scene; 221 } 222 if (_tween) { // kill old tween? 223 Scene.removeTween(); 224 } 225 _tween = newTween; 226 227 // some properties need to be transferred it to the wrapper, otherwise they would get lost. 228 if (TweenObject.repeat && TweenObject.repeat() === -1) { // TweenMax or TimelineMax Object? 229 _tween.repeat(-1); 230 _tween.yoyo(TweenObject.yoyo()); 231 } 232 // Some tween validations and debugging helpers 233 234 if (Scene.tweenChanges() && !_tween.tweenTo) { 235 log(2, "WARNING: tweenChanges will only work if the TimelineMax object is available for ScrollMagic."); 236 } 237 238 // check if there are position tweens defined for the trigger and warn about it :) 239 if (_tween && Scene.controller() && Scene.triggerElement() && Scene.loglevel() >= 2) { // controller is needed to know scroll direction. 240 var 241 triggerTweens = Tween.getTweensOf(Scene.triggerElement()),
242 vertical = Scene.controller().info("vertical"); 243 triggerTweens.forEach(function (value, index) { 244 var 245 tweenvars = value.vars.css || value.vars, 246 condition = vertical ? (tweenvars.top !== undefined || tweenvars.bottom !== undefined) : (tweenvars.left !== undefined || tweenvars.right !== undefined); 247 if (condition) { 248 log(2, "WARNING: Tweening the position of the trigger element affects the scene timing and should be avoided!"); 249 return false; 250 } 251 }); 252 } 253 254 // warn about tween overwrites, when an element is tweened multiple times 255 if (parseFloat(TweenLite.version) >= 1.14) { // onOverwrite only present since GSAP v1.14.0 256 var 257 list = _tween.getChildren ? _tween.getChildren(true, true, false) : [_tween], // get all nested tween objects 258 newCallback = function () { 259 log(2, "WARNING: tween was overwritten by another. To learn how to avoid this issue see here: https://github.com/janpaepke/ScrollMagic/wiki/WARNING:-tween-was-overwritten-by-another"); 260 }; 261 for (var i = 0, thisTween, oldCallback; i < list.length; i++) { 262 /*jshint loopfunc: true */ 263 thisTween = list[i]; 264 if (oldCallback !== newCallback) { // if tweens is added more than once 265 oldCallback = thisTween.vars.onOverwrite; 266 thisTween.vars.onOverwrite = function () { 267 if (oldCallback) { 268 oldCallback.apply(this, arguments); 269 } 270 newCallback.apply(this, arguments); 271 }; 272 } 273 } 274 } 275 log(3, "added tween"); 276 277 updateTweenProgress(); 278 return Scene; 279 }; 280 281 /** 282 * Remove the tween from the scene. 283 * This will terminate the control of the Scene over the tween. 284 * 285 * Using the reset option you can decide if the tween should remain in the current state or be rewound to set the target elements back to the state they were in before the tween was added to the scene. 286 * @memberof! animation.GSAP# 287 * 288 * @example 289 * // remove the tween from the scene without resetting it 290 * scene.removeTween(); 291 * 292 * // remove the tween from the scene and reset it to initial position 293 * scene.removeTween(true); 294 * 295 * @param {boolean} [reset=false] - If `true` the tween will be reset to its initial values. 296 * @returns {Scene} Parent object for chaining. 297 */ 298 Scene.removeTween = function (reset) { 299 if (_tween) { 300 if (reset) { 301 _tween.progress(0).pause(); 302 } 303 _tween.kill(); 304 _tween = undefined; 305 log(3, "removed tween (reset: " + (reset ? "true" : "false") + ")"); 306 } 307 return Scene; 308 }; 309 310 }); 311}));
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.