1if (typeof barba !== "undefined") { 2 barba.hooks.after(() => { 3 animationsFrontend(); 4 }); 5} 6function animationsFrontend() { 7 //Remove flickering 8 document.querySelectorAll('[data-animator="flickering"]').forEach((element) => { 9 element.removeAttribute('data-animator'); 10 }); 11 12 var jsonString = data_animator.data_animations.replace(/\\/g, ""); 13 var JSONobject = JSON.parse(jsonString); 14 JSONobject.animator.folders.map((folder) => { 15 folder.folder.timelines.map((timeline) => { 16 var timeline = timeline.timeline; 17 var GSAPtimelineCustomEvent = gsap.timeline({ paused: !0 }); 18 document.querySelectorAll(timeline.trigger).forEach((triggerElement, triggerElementIndex) => { 19 var GSAPtimeline = ""; 20 if (timeline.conditionalDisplay != "Load everywhere") { 21 var postIDs = timeline.conditionalDisplay.match(/\d+/g); 22 if (postIDs) { 23 if (postIDs.includes(data_animator.post_id)) { 24 GSAPtimeline = createTimeline(timeline, GSAPtimeline); 25 } 26 } 27 } else { 28 GSAPtimeline = createTimeline(timeline, GSAPtimeline); 29 } 30 function createTimeline(timeline, GSAPtimeline) { 31 if (timeline.breakpoint) { 32 let mm = gsap.matchMedia(); 33 mm.add(`(${timeline.breakpoint})`, () => { 34 GSAPtimeline = handleTriggerEvent(timeline, GSAPtimeline); 35 }); 36 } else { 37 GSAPtimeline = handleTriggerEvent(timeline, GSAPtimeline); 38 } 39 return GSAPtimeline; 40 function handleTriggerEvent(timeline, GSAPtimeline) { 41 switch (timeline.triggerEvent) { 42 case "custom": 43 GSAPtimeline = gsap.timeline({ paused: !0 }); 44 if (timeline.reverseEnabled == "false" && timeline.restartEnabled == "false") { 45 triggerElement.addEventListener(timeline.customTriggerEvent, function () { 46 GSAPtimeline.play(); 47 GSAPtimelineCustomEvent.play(); 48 }); 49 } else if (timeline.restartEnabled == "true") { 50 triggerElement.addEventListener(timeline.customTriggerEvent, function () { 51 GSAPtimeline.restart(); 52 GSAPtimelineCustomEvent.restart(); 53 }); 54 } else if (timeline.reverseEnabled == "true") { 55 switch (timeline.customTriggerEvent) { 56 case "click": 57 GSAPtimeline.reversed(!0); 58 GSAPtimelineCustomEvent.reversed(!0); 59 triggerElement.addEventListener("click", function () { 60 GSAPtimeline.reversed() ? GSAPtimeline.play() : GSAPtimeline.reverse(); 61 GSAPtimelineCustomEvent.reversed() ? GSAPtimelineCustomEvent.play() : GSAPtimelineCustomEvent.reverse(); 62 }); 63 break; 64 case "dblclick": 65 GSAPtimeline.reversed(!0); 66 GSAPtimelineCustomEvent.reversed(!0); 67 triggerElement.addEventListener("dblclick", function () { 68 GSAPtimeline.reversed() ? GSAPtimeline.play() : GSAPtimeline.reverse(); 69 GSAPtimelineCustomEvent.reversed() ? GSAPtimelineCustomEvent.play() : GSAPtimelineCustomEvent.reverse(); 70 }); 71 break; 72 case "mouseenter": 73 triggerElement.addEventListener("mouseenter", function () { 74 GSAPtimeline.play(); 75 GSAPtimelineCustomEvent.play(); 76 }); 77 triggerElement.addEventListener("mouseleave", function () { 78 GSAPtimeline.reverse(); 79 GSAPtimelineCustomEvent.reverse(); 80 }); 81 break; 82 case "mouseleave": 83 triggerElement.addEventListener("mouseleave", function () { 84 GSAPtimeline.play(); 85 GSAPtimelineCustomEvent.play(); 86 }); 87 triggerElement.addEventListener("mouseenter", function () { 88 GSAPtimeline.reverse(); 89 GSAPtimelineCustomEvent.reverse(); 90 }); 91 break; 92 } 93 } 94 break; 95 case "pageload": 96 GSAPtimeline = gsap.timeline({ paused: !0 }); 97 GSAPtimeline.play(); 98 break; 99 case "scroll": 100 var scrollTriggerOptions = {}; 101 if (JSONobject.animator.markersEnabled === "true") scrollTriggerOptions.markers = !0; 102 if (timeline.start) scrollTriggerOptions.start = timeline.start; 103 if (timeline.end) scrollTriggerOptions.end = timeline.end; 104 if (timeline.toggleActions) scrollTriggerOptions.toggleActions = timeline.toggleActions; 105 if (timeline.scroller) scrollTriggerOptions.scroller = timeline.scroller; 106 if (timeline.scrubEnabled == "true" && timeline.scrub) scrollTriggerOptions.scrub = timeline.scrub; 107 if (timeline.pinEnabled == "true" && timeline.pin) { 108 if (timeline.pin == "this" && document.querySelector(timeline.trigger)) { 109 scrollTriggerOptions.pin = triggerElement; 110 } else if (timeline.pin != "" && document.querySelector(timeline.pin)) { 111 scrollTriggerOptions.pin = timeline.pin; 112 } 113 } 114 scrollTriggerOptions.trigger = triggerElement; 115 var varContainerAnimation = isInsideHorizontalScrollElement(triggerElement); 116 scrollTriggerOptions.containerAnimation = varContainerAnimation ? window[varContainerAnimation] : undefined; 117 GSAPtimeline = gsap.timeline({ scrollTrigger: scrollTriggerOptions }); 118 break; 119 } 120 return GSAPtimeline; 121 } 122 } 123 function isInsideHorizontalScrollElement(element) { 124 let containerName = null; 125 document.querySelectorAll(".next-horizontal-scroll").forEach((h
125orizontalScroll, index) => { 126 if (horizontalScroll.contains(element)) { 127 containerName = `NextHorizontalScroll${index}`; 128 } 129 }); 130 return containerName; 131 } 132 if (GSAPtimeline != "") { 133 timeline.animations.forEach(function (animation) { 134 var animation = animation.animation; 135 switch (animation.method) { 136 case "from": 137 var animationFromConfig = { duration: Number(animation.duration) }; 138 if (animation.delay) { 139 animationFromConfig.delay = Number(animation.delay); 140 } 141 if (animation.easing) { 142 animationFromConfig.ease = animation.easing; 143 } 144 if (animation.staggerEnabled == "true") { 145 animationFromConfig.stagger = animation.stagger; 146 } 147 if (animation.repeatEnabled == "true") { 148 animationFromConfig.repeat = Number(animation.repeat); 149 } 150 if (animation.yoyoEnabled == "true") { 151 animationFromConfig.yoyo = !0; 152 } 153 if (animation.fromObject.opacity) { 154 animationFromConfig.opacity = animation.fromObject.opacity; 155 } 156 if (animation.fromObject.autoAlpha) { 157 animationFromConfig.autoAlpha = animation.fromObject.autoAlpha; 158 } 159 if (animation.fromObject.transformX) { 160 animationFromConfig.x = animation.fromObject.transformX; 161 } 162 if (animation.fromObject.transformY) { 163 animationFromConfig.y = animation.fromObject.transformY; 164 } 165 if (animation.fromObject.transformScale) { 166 animationFromConfig.scale = animation.fromObject.transformScale; 167 } 168 if (animation.fromObject.transformRotate) { 169 animationFromConfig.rotation = animation.fromObject.transformRotate; 170 } 171 if (animation.fromObject.transformSkewX) { 172 animationFromConfig.skewX = animation.fromObject.transformSkewX; 173 } 174 if (animation.fromObject.transformSkewY) { 175 animationFromConfig.skewY = animation.fromObject.transformSkewY; 176 } 177 if (animation.fromObject.background) { 178 animationFromConfig.backgroundColor = animation.fromObject.background; 179 } 180 if (animation.fromObject.color) { 181 animationFromConfig.color = animation.fromObject.color; 182 } 183 if (animation.fromObject.fontFamily) { 184 animationFromConfig.fontFamily = animation.fromObject.fontFamily; 185 } 186 if (animation.fromObject.fontSize) { 187 animationFromConfig.fontSize = animation.fromObject.fontSize; 188 } 189 if (animation.fromObject.fontWeight) { 190 animationFromConfig.fontWeight = animation.fromObject.fontWeight; 191 } 192 if (animation.fromObject.fontStyle) { 193 animationFromConfig.fontStyle = animation.fromObject.fontStyle; 194 } 195 if (animation.fromObject.textAlign) { 196 animationFromConfig.textAlign = animation.fromObject.textAlign; 197 } 198 if (animation.fromObject.textDecoration) { 199 animationFromConfig.textDecoration = animation.fromObject.textDecoration; 200 } 201 if (animation.fromObject.textTransform) { 202 animationFromConfig.textTransform = animation.fromObject.textTransform; 203 } 204 if (animation.fromObject.lineHeight) { 205 animationFromConfig.lineHeight = animation.fromObject.lineHeight; 206 } 207 if (animation.fromObject.letterSpacing) { 208 animationFromConfig.letterSpacing = animation.fromObject.letterSpacing; 209 } 210 if (animation.fromObject.wordSpacing) { 211 animationFromConfig.wordSpacing = animation.fromObject.wordSpacing; 212 } 213 if (animation.fromObject.width) { 214 animationFromConfig.width = animation.fromObject.width; 215 } 216 if (animation.fromObject.height) { 217 animationFromConfig.height = animation.fromObject.height; 218 } 219 if (animation.fromObject.minWidth) { 220 animationFromConfig.minWidth = animation.fromObject.minWidth; 221 } 222 if (animation.fromObject.minHeight) { 223 animationFromConfig.minHeight = animation.fromObject.minHeight; 224 } 225 if (animation.fromObject.maxWidth) { 226 animationFromConfig.maxWidth = animation.fromObject.maxWidth; 227 } 228 if (animation.fromObject.maxHeight) { 229 animationFromConfig.maxHeight = animation.fromObject.maxHeight; 230 } 231 if (animation.fromObject.paddingTop) { 232 animationFromConfig.paddingTop = animation.fromObject.paddingTop; 233 } 234 if (animation.fromObject.paddingBottom) { 235 animationFromConfig.paddingBottom = animation.fromObject.paddingBottom; 236 } 237 if (animation.fromObject.paddingLeft) { 238 animationFromConfig.paddingLeft = animation.fromObject.paddingLeft; 239 } 240 if (animation.fromObject.paddingRight) { 241 animationFromConfig.paddingRight = animation.fromObject.paddingRight; 242 } 243 if (animation.fromObject.marginTop) { 244 animationFromConfig.marginTop = animation.fromObject.marginTop; 245 } 246 if (animation.fromObject.marginBottom) { 247 animationFromConfig.marginBottom = animation.fromObject.marginBottom; 248 } 249 if (animation.fromObject.marginLeft) { 250 animationFromConfig.marginLeft = animation.fromObject.marginLeft; 251 } 252 if (animation.fromObject.marginRight) { 253 animationFromConfig.marginRight = animation.fromObject.marginRight; 254 } 255 if (animation.fromObject.positionTop) { 256 animationFromConfig.top = animation.fromObject.positionTop; 257 } 258 if (animation.fromObject.positionBottom) { 259 animationFromConfig.bottom = animation.fromObject.positionBottom; 260 } 261 if (animation.fromObject.positionLeft) { 262 animationFromConfig.left = animation.fromObject.positionLeft; 263 } 264 if (animation.fromObject.positionRight) { 265 animationFromConfig.right = animation.fromObject.positionRight; 266 } 267 if (animation.fromObject.borderColor) { 268 animationFromConfig.borderColor = animation.fromObject.borderColor; 269 } 270 if (animation.fromObject.borderStyle) { 271 animationFromConfig.borderStyle = animation.fromObject.borderStyle; 272 } 273 if (animation.fromObject.borderWidthTop) { 274 animationFromConfig.borderTopWidth = animation.fromObject.borderWidthTop; 275 } 276 if (animation.fromObject.borderWidthBottom) { 277 animationFromConfig.borderBottomWidth = animation.fromObject.borderWidthBottom; 278 } 279 if (animation.fromObject.borderWidthLeft) { 280 animationFromConfig.borderLeftWidth = animation.fromObject.borderWidthLeft; 281 } 282 if (animation.fromObject.borderWidthRight) { 283 animationFromConfig.borderRightWidth = animation.fromObject.borderWidthRight; 284 } 285 if (animation.fromObject.borderTopLeftRadius) { 286 animationFromConfig.borderTopLeftRadius = animation.fromObject.borderTopLeftRadius; 287 } 288 if (animation.fromObject.borderTopRightRadius) { 289 animationFromConfig.borderTopRightRadius = animation.fromObject.borderTopRightRadius; 290 } 291 if (animation.fromObject.borderBottomLeftRadius) { 292 animationFromConfig.borderBottomLeftRadius = animation.fromObject.borderBottomLeftRadius; 293 } 294 if (animation.fromObject.borderBottomRightRadius) { 295 animationFromConfig.borderBottomRightRadius = animation.fromObject.borderBottomRightRadius; 296 } 297 if (animation.fromObject.boxShadowOffsetX && animation.fromObject.boxShadowOffsetY && animation.fromObject.boxShadowBlur && animation.fromObject.boxShadowSpread && animation.fromObject.boxShadowColor) {
298 var boxShadowProperties = { 299 offsetX: animation.fromObject.boxShadowOffsetX, 300 offsetY: animation.fromObject.boxShadowOffsetY, 301 blur: animation.fromObject.boxShadowBlur, 302 spread: animation.fromObject.boxShadowSpread, 303 color: animation.fromObject.boxShadowColor, 304 }; 305 animationFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 306 } 307 var filterString = ""; 308 if (animation.fromObject.filterBlur) { 309 filterString += `blur(${animation.fromObject.filterBlur}) `; 310 } 311 if (animation.fromObject.filterBrightness) { 312 filterString += `brightness(${animation.fromObject.filterBrightness}) `; 313 } 314 if (animation.fromObject.filterContrast) { 315 filterString += `contrast(${animation.fromObject.filterContrast}) `; 316 } 317 if (animation.fromObject.filterGrayscale) { 318 filterString += `grayscale(${animation.fromObject.filterGrayscale}) `; 319 } 320 if (animation.fromObject.filterHueRotate) { 321 filterString += `hue-rotate(${animation.fromObject.filterHueRotate}) `; 322 } 323 if (animation.fromObject.filterInvert) { 324 filterString += `invert(${animation.fromObject.filterInvert}) `; 325 } 326 if (animation.fromObject.filterSaturate) { 327 filterString += `saturate(${animation.fromObject.filterSaturate}) `; 328 } 329 if (animation.fromObject.filterSepia) { 330 filterString += `sepia(${animation.fromObject.filterSepia}) `; 331 } 332 if (filterString != "") { 333 filterString = filterString.trim(); 334 animationFromConfig.filter = filterString; 335 } 336 if (animation.fromObject.svgFill) { 337 animationFromConfig.fill = animation.fromObject.svgFill; 338 } 339 if (animation.fromObject.svgStrokeColor) { 340 animationFromConfig.stroke = animation.fromObject.svgStrokeColor; 341 } 342 if (animation.fromObject.svgStrokeWidth) { 343 animationFromConfig.strokeWidth = animation.fromObject.svgStrokeWidth; 344 } 345 //Add custom properties to animation 346 if (animation.fromObject.customProperties && animation.fromObject.customValues) { 347 const properties = animation.fromObject.customProperties.split('d110708'); 348 const values = animation.fromObject.customValues.split('d110708'); 349 350 properties.forEach((property, index) => { 351 const value = values[index]; 352 if (property !== "" && value !== "") { 353 animationFromConfig[property] = value; 354 } 355 }); 356 } 357 if (animation.element == "this" && timeline.trigger != "") { 358 var elementToAnimate = triggerElement; 359 360 //SplitText 361 if(animation.splitTextEnabled == "true"){ 362 new SplitText(document.querySelectorAll(`${timeline.trigger}, ${timeline.trigger} *`), { 363 type: animation.splitText, 364 charsClass: `${timeline.trigger}-char nb-animator-char`, 365 wordsClass: `${timeline.trigger}-word nb-animator-word`, 366 linesClass: `${timeline.trigger}-line nb-animator-line`, 367 }); 368 if(animation.splitText.includes('char')){ 369 GSAPtimeline.from(document.getElementsByClassName(`${timeline.trigger}-char`), animationFromConfig, 0); 370 }else if(animation.splitText.includes('word')){ 371 GSAPtimeline.from(document.getElementsByClassName(`${timeline.trigger}-word`), animationFromConfig, 0); 372 }else if(animation.splitText.includes('line')){ 373 GSAPtimeline.from(document.getElementsByClassName(`${timeline.trigger}-line`), animationFromConfig, 0); 374 }else{ 375 GSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 376 } 377 }else{ 378 GSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 379 } 380 } else if (animation.element != "") { 381 if (timeline.triggerEvent == "custom") { 382 var elementToAnimate = animation.element; 383 if (document.querySelector(elementToAnimate) && triggerElementIndex == 0) { 384 385 //SplitText 386 if(animation.splitTextEnabled == "true"){ 387 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 388 type: animation.splitText, 389 charsClass: `${elementToAnimate}-char nb-animator-char`, 390 wordsClass: `${elementToAnimate}-word nb-animator-word`, 391 linesClass: `${elementToAnimate}-line nb-animator-line`, 392 }); 393 if(animation.splitText.includes('char')){ 394 GSAPtimelineCustomEvent.from(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromConfig, 0); 395 }else if(animation.splitText.includes('word')){ 396 GSAPtimelineCustomEvent.from(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromConfig, 0); 397 }else if(animation.splitText.includes('line')){ 398 GSAPtimelineCustomEvent.from(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromConfig, 0); 399 }else{ 400 GSAPtimelineCustomEvent.from(animation.element, animationFromConfig, 0); 401 } 402 }else{ 403 GSAPtimelineCustomEvent.from(animation.element, animationFromConfig, 0); 404 } 405 406 } 407 } else if (triggerElementIndex == 0) { 408 var elementToAnimate = animation.element; 409 if (document.querySelector(elementToAnimate)) { 410 //SplitText 411 if(animation.splitTextEnabled == "true"){ 412 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 413 type: animation.splitText, 414 charsClass: `${elementToAnimate}-char nb-animator-char`, 415 wordsClass: `${elementToAnimate}-word nb-animator-word`, 416 linesClass: `${elementToAnimate}-line nb-animator-line`, 417 }); 418 if(animation.splitText.includes('char')){ 419 GSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromConfig, 0); 420 }else if(animation.splitText.includes('word')){ 421 GSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromConfig, 0); 422 }else if(animation.splitText.includes('line')){ 423 GSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromConfig, 0); 424 }else{ 425 GSAPtimeline.from(animation.element, animationFromConfig, 0); 426 } 427 }else{ 428 GSAPtimeline.from(animation.element, animationFromConfig, 0); 429 } 430 } 431 } 432 } 433 break; 434 case "to": 435 var animationToConfig = { duration: Number(animation.duration) }; 436 if (animation.delay) { 437 animationToConfig.delay = Number(animation.delay); 438 } 439 if (animation.easing) { 440 animationToConfig.ease = animation.easing; 441 } 442 if (animation.staggerEnabled == "true") { 443 animationToConfig.stagger = animation.stagger; 444 } 445 if (animation.repeatEnabled == "true") { 446 animationToConfig.repeat = Number(animation.repeat); 447 } 448 if (animation.yoyoEnabled == "true") { 449 animationToConfig.yoyo = !0; 450 } 451 if (animation.toObject.opacity) { 452 animationToConfig.opacity = animation.toObject.opacity; 453 } 454 if (animation.toObject.autoAlpha) { 455 animationToConfig.autoAlpha = animation.toObject.autoAlpha; 456 } 457 if (animation.toObject.transformX) { 458 animationToConfig.x = animation.toObject.transformX; 459 } 460 if (animation.toObject.transformY) { 461 animationToConfig.y = animation.toObject.transformY; 462 } 463 if (animation.toObject.transformScale) { 464 animationToConfig.scale = animation.toObject.transformScale; 465 } 466 if (animation.toObject.transformRotate) { 467 animationToConfig.rotation = animation.toObject.transformRotate; 468 } 469 if (animation.toObject.transformSkewX) { 470 animationToConfig.skewX = animation.toObject.transformSkewX; 471 } 472 if (animation.toObject.transformSkewY) { 473 animationToConfig.skewY = animation.toObject.transformSkewY; 474 } 475 if (animation.toObject.background) { 476 animationToConfig.backgroundColor = animation.toObject.background; 477 } 478 if (animation.toObject.color) { 479 animationToConfig.color = animation.toObject.color; 480 } 481 if (animation.toObject.fontFamily) { 482 animationToConfig.fontFamily = animation.toObject.fontFamily; 483 } 484 if (animation.toObject.fontSize) { 485 animationToConfig.fontSize = animation.toObject.fontSize; 486 } 487 if (animation.toObject.fontWeight) { 488 animationToConfig.fontWeight = animation.toObject.fontWeight; 489 } 490 if (animation.toObject.fontStyle) { 491 animationToConfig.fontStyle = animation.toObject.fontStyle; 492 } 493 if (animation.toObject.textAlign) { 494 animationToConfig.textAlign = animation.toObject.textAlign; 495 } 496 if (animation.toObject.textDecoration) { 497 animationToConfig.textDecoration = animation.toObject.textDecoration; 498 } 499 if (animation.toObject.textTransform) { 500 animationToConfig.textTransform = animation.toObject.textTransform; 501 } 502 if (animation.toObject.lineHeight) { 503 animationToConfig.lineHeight = animation.toObject.lineHeight; 504 } 505 if (animation.toObject.letterSpacing) { 506 animationToConfig.letterSpacing = animation.toObject.letterSpacing; 507 } 508 if (animation.toObject.wordSpacing) { 509 animationToConfig.wordSpacing = animation.toObject.wordSpacing; 510 } 511 if (animation.toObject.width) { 512 animationToConfig.width = animation.toObject.width; 513 } 514 if (animation.toObject.height) { 515 animation
515ToConfig.height = animation.toObject.height; 516 } 517 if (animation.toObject.minWidth) { 518 animationToConfig.minWidth = animation.toObject.minWidth; 519 } 520 if (animation.toObject.minHeight) { 521 animationToConfig.minHeight = animation.toObject.minHeight; 522 } 523 if (animation.toObject.maxWidth) { 524 animationToConfig.maxWidth = animation.toObject.maxWidth; 525 } 526 if (animation.toObject.maxHeight) { 527 animationToConfig.maxHeight = animation.toObject.maxHeight; 528 } 529 if (animation.toObject.paddingTop) { 530 animationToConfig.paddingTop = animation.toObject.paddingTop; 531 } 532 if (animation.toObject.paddingBottom) { 533 animationToConfig.paddingBottom = animation.toObject.paddingBottom; 534 } 535 if (animation.toObject.paddingLeft) { 536 animationToConfig.paddingLeft = animation.toObject.paddingLeft; 537 } 538 if (animation.toObject.paddingRight) { 539 animationToConfig.paddingRight = animation.toObject.paddingRight; 540 } 541 if (animation.toObject.marginTop) { 542 animationToConfig.marginTop = animation.toObject.marginTop; 543 } 544 if (animation.toObject.marginBottom) { 545 animationToConfig.marginBottom = animation.toObject.marginBottom; 546 } 547 if (animation.toObject.marginLeft) { 548 animationToConfig.marginLeft = animation.toObject.marginLeft; 549 } 550 if (animation.toObject.marginRight) { 551 animationToConfig.marginRight = animation.toObject.marginRight; 552 } 553 if (animation.toObject.positionTop) { 554 animationToConfig.top = animation.toObject.positionTop; 555 } 556 if (animation.toObject.positionBottom) { 557 animationToConfig.bottom = animation.toObject.positionBottom; 558 } 559 if (animation.toObject.positionLeft) { 560 animationToConfig.left = animation.toObject.positionLeft; 561 } 562 if (animation.toObject.positionRight) { 563 animationToConfig.right = animation.toObject.positionRight; 564 } 565 if (animation.toObject.borderColor) { 566 animationToConfig.borderColor = animation.toObject.borderColor; 567 } 568 if (animation.toObject.borderStyle) { 569 animationToConfig.borderStyle = animation.toObject.borderStyle; 570 } 571 if (animation.toObject.borderWidthTop) { 572 animationToConfig.borderTopWidth = animation.toObject.borderWidthTop; 573 } 574 if (animation.toObject.borderWidthBottom) { 575 animationToConfig.borderBottomWidth = animation.toObject.borderWidthBottom; 576 } 577 if (animation.toObject.borderWidthLeft) { 578 animationToConfig.borderLeftWidth = animation.toObject.borderWidthLeft; 579 } 580 if (animation.toObject.borderWidthRight) { 581 animationToConfig.borderRightWidth = animation.toObject.borderWidthRight; 582 } 583 if (animation.toObject.borderTopLeftRadius) { 584 animationToConfig.borderTopLeftRadius = animation.toObject.borderTopLeftRadius; 585 } 586 if (animation.toObject.borderTopRightRadius) { 587 animationToConfig.borderTopRightRadius = animation.toObject.borderTopRightRadius; 588 } 589 if (animation.toObject.borderBottomLeftRadius) { 590 animationToConfig.borderBottomLeftRadius = animation.toObject.borderBottomLeftRadius; 591 } 592 if (animation.toObject.borderBottomRightRadius) { 593 animationToConfig.borderBottomRightRadius = animation.toObject.borderBottomRightRadius; 594 } 595 if (animation.toObject.boxShadowOffsetX && animation.toObject.boxShadowOffsetY && animation.toObject.boxShadowBlur && animation.toObject.boxShadowSpread && animation.toObject.boxShadowColor) {
596 var boxShadowProperties = { 597 offsetX: animation.toObject.boxShadowOffsetX, 598 offsetY: animation.toObject.boxShadowOffsetY, 599 blur: animation.toObject.boxShadowBlur, 600 spread: animation.toObject.boxShadowSpread, 601 color: animation.toObject.boxShadowColor, 602 }; 603 animationToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 604 } 605 var filterString = ""; 606 if (animation.toObject.filterBlur) { 607 filterString += `blur(${animation.toObject.filterBlur}) `; 608 } 609 if (animation.toObject.filterBrightness) { 610 filterString += `brightness(${animation.toObject.filterBrightness}) `; 611 } 612 if (animation.toObject.filterContrast) { 613 filterString += `contrast(${animation.toObject.filterContrast}) `; 614 } 615 if (animation.toObject.filterGrayscale) { 616 filterString += `grayscale(${animation.toObject.filterGrayscale}) `; 617 } 618 if (animation.toObject.filterHueRotate) { 619 filterString += `hue-rotate(${animation.toObject.filterHueRotate}) `; 620 } 621 if (animation.toObject.filterInvert) { 622 filterString += `invert(${animation.toObject.filterInvert}) `; 623 } 624 if (animation.toObject.filterSaturate) { 625 filterString += `saturate(${animation.toObject.filterSaturate}) `; 626 } 627 if (animation.toObject.filterSepia) { 628 filterString += `sepia(${animation.toObject.filterSepia}) `; 629 } 630 if (filterString != "") { 631 filterString = filterString.trim(); 632 animationToConfig.filter = filterString; 633 } 634 if (animation.toObject.svgFill) { 635 animationToConfig.fill = animation.toObject.svgFill; 636 } 637 if (animation.toObject.svgStrokeColor) { 638 animationToConfig.stroke = animation.toObject.svgStrokeColor; 639 } 640 if (animation.toObject.svgStrokeWidth) { 641 animationToConfig.strokeWidth = animation.toObject.svgStrokeWidth; 642 } 643 //Add custom properties to animation 644 if (animation.toObject.customProperties && animation.toObject.customValues) { 645 const properties = animation.toObject.customProperties.split('d110708'); 646 const values = animation.toObject.customValues.split('d110708'); 647 648 properties.forEach((property, index) => { 649 const value = values[index]; 650 if (property !== "" && value !== "") { 651 animationToConfig[property] = value; 652 } 653 }); 654 } 655 if (animation.element == "this" && timeline.trigger != "") { 656 var elementToAnimate = triggerElement; 657 658 //SplitText 659 if(animation.splitTextEnabled == "true"){ 660 new SplitText(document.querySelectorAll(`${timeline.trigger}, ${timeline.trigger} *`), { 661 type: animation.splitText, 662 charsClass: `${timeline.trigger}-char nb-animator-char`, 663 wordsClass: `${timeline.trigger}-word nb-animator-word`, 664 linesClass: `${timeline.trigger}-line nb-animator-line`, 665 }); 666 if(animation.splitText.includes('char')){ 667 GSAPtimeline.to(document.getElementsByClassName(`${timeline.trigger}-char`), animationToConfig, 0); 668 }else if(animation.splitText.includes('word')){ 669 GSAPtimeline.to(document.getElementsByClassName(`${timeline.trigger}-word`), animationToConfig, 0); 670 }else if(animation.splitText.includes('line')){ 671 GSAPtimeline.to(document.getElementsByClassName(`${timeline.trigger}-line`), animationToConfig, 0); 672 }else{ 673 GSAPtimeline.to(elementToAnimate, animationToConfig, 0); 674 } 675 }else{ 676 GSAPtimeline.to(elementToAnimate, animationToConfig, 0); 677 } 678 } else if (animation.element != "") { 679 if (timeline.triggerEvent == "custom") { 680 var elementToAnimate = animation.element; 681 if (document.querySelector(elementToAnimate) && triggerElementIndex == 0) { 682 683 //SplitText 684 if(animation.splitTextEnabled == "true"){ 685 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 686 type: animation.splitText, 687 charsClass: `${elementToAnimate}-char nb-animator-char`, 688 wordsClass: `${elementToAnimate}-word nb-animator-word`, 689 linesClass: `${elementToAnimate}-line nb-animator-line`, 690 }); 691 if(animation.splitText.includes('char')){ 692 GSAPtimelineCustomEvent.to(document.getElementsByClassName(`${elementToAnimate}-char`), animationToConfig, 0); 693 }else if(animation.splitText.includes('word')){ 694 GSAPtimelineCustomEvent.to(document.getElementsByClassName(`${elementToAnimate}-word`), animationToConfig, 0); 695 }else if(animation.splitText.includes('line')){ 696 GSAPtimelineCustomEvent.to(document.getElementsByClassName(`${elementToAnimate}-line`), animationToConfig, 0); 697 }else{ 698 GSAPtimelineCustomEvent.to(animation.element, animationToConfig, 0); 699 } 700 }else{ 701 GSAPtimelineCustomEvent.to(animation.element, animationToConfig, 0); 702 } 703 704 } 705 } else if (triggerElementIndex == 0) { 706 var elementToAnimate = animation.element; 707 if (document.querySelector(elementToAnimate)) { 708 //SplitText 709 if(animation.splitTextEnabled == "true"){ 710 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 711 type: animation.splitText, 712 charsClass: `${elementToAnimate}-char nb-animator-char`, 713 wordsClass: `${elementToAnimate}-word nb-animator-word`, 714 linesClass: `${elementToAnimate}-line nb-animator-line`, 715 }); 716 if(animation.splitText.includes('char')){ 717 GSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-char`), animationToConfig, 0); 718 }else if(animation.splitText.includes('word')){ 719 GSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-word`), animationToConfig, 0); 720 }else if(animation.splitText.includes('line')){ 721 GSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-line`), animationToConfig, 0); 722 }else{ 723 GSAPtimeline.to(animation.element, animationToConfig, 0); 724 } 725 }else{ 726 GSAPtimeline.to(animation.element, animationToConfig, 0); 727 } 728 } 729 } 730 } 731 break; 732 case "fromto": 733 var animationFromToToConfig = { duration: Number(animation.duration) }; 734 if (animation.delay) { 735 animationFromToToConfig.delay = Number(animation.delay); 736 } 737 if (animation.easing) { 738 animationFromToToConfig.ease = animation.easing; 739 } 740 if (animation.staggerEnabled == "true") { 741 animationFromToToConfig.stagger = animation.stagger; 742 } 743 if (animation.repeatEnabled == "true") { 744 animationFromToToConfig.repeat = Number(animation.repeat); 745 } 746 if (animation.yoyoEnabled == "true") { 747 animationFromToToConfig.yoyo = !0; 748 } 749 if (animation.fromtotoObject.opacity) { 750 animationFromToToConfig.opacity = animation.fromtotoObject.opacity; 751 } 752 if (animation.fromtotoObject.autoAlpha) { 753 animationFromToToConfig.autoAlpha = animation.fromtotoObject.autoAlpha; 754 } 755 if (animation.fromtotoObject.transformX) { 756 animationFromToToConfig.x = animation.fromtotoObject.transformX; 757 } 758 if (animation.fromtotoObject.transformY) { 759 animationFromToToConfig.y = animation.fromtotoObject.transformY; 760 } 761 if (animation.fromtotoObject.transformScale) { 762 animationFromToToConfig.scale = animation.fromtotoObject.transformScale; 763 } 764 if (animation.fromtotoObject.transformRotate) { 765 animationFromToToConfig.rotation = animation.fromtotoObject.transformRotate; 766 } 767 if (animation.fromtotoObject.transformSkewX) { 768 animationFromToToConfig.skewX = animation.fromtotoObject.transformSkewX; 769 } 770 if (animation.fromtotoObject.transformSkewY) { 771 animationFromToToConfig.skewY = animation.fromtotoObject.transformSkewY; 772 } 773 if (animation.fromtotoObject.background) { 774 animationFromToToConfig.backgroundColor = animation.fromtotoObject.background; 775 } 776 if (animation.fromtotoObject.color) { 777 animationFromToToConfig.color = animation.fromtotoObject.color; 778 } 779 if (animation.fromtotoObject.fontFamily) { 780 animationFromToToConfig.fontFamily = animation.fromtotoObject.fontFamily; 781 } 782 if (animation.fromtotoObject.fontSize) { 783 animationFromToToConfig.fontSize = animation.fromtotoObject.fontSize; 784 } 785 if (animation.fromtotoObject.fontWeight) { 786 animationFromToToConfig.fontWeight = animation.fromtotoObject.fontWeight; 787 } 788 if (animation.fromtotoObject.fontStyle) { 789 animationFromToToConfig.fontStyle = animation.fromtotoObject.fontStyle; 790 } 791 if (animation.fromtotoObject.textAlign) { 792 animationFromToToConfig.textAlign = animation.fromtotoObject.textAlign; 793 } 794 if (animation.fromtotoObject.textDecoration) { 795 animationFromToToConfig.textDecoration = animation.fromtotoObject.textDecoration; 796 } 797 if (animation.fromtotoObject.textTransform) { 798 animationFromToToConfig.textTransform = animation.fromtotoObject.textTransform; 799 } 800 if (animation.fromtotoObject.lineHeight) { 801 animationFromToToConfig.lineHeight = animation.fromtotoObject.lineHeight; 802 } 803 if (animation.fromtotoObject.letterSpacing) { 804 animationFromToToConfig.letterSpacing = animation.fromtotoObject.letterSpacing; 805 } 806 if (animation.fromtotoObject.wordSpacing) { 807 animationFromToToConfig.wordSpacing = animation.fromtotoObject.wordSpacing; 808 } 809 if
809 (animation.fromtotoObject.width) { 810 animationFromToToConfig.width = animation.fromtotoObject.width; 811 } 812 if (animation.fromtotoObject.height) { 813 animationFromToToConfig.height = animation.fromtotoObject.height; 814 } 815 if (animation.fromtotoObject.minWidth) { 816 animationFromToToConfig.minWidth = animation.fromtotoObject.minWidth; 817 } 818 if (animation.fromtotoObject.minHeight) { 819 animationFromToToConfig.minHeight = animation.fromtotoObject.minHeight; 820 } 821 if (animation.fromtotoObject.maxWidth) { 822 animationFromToToConfig.maxWidth = animation.fromtotoObject.maxWidth; 823 } 824 if (animation.fromtotoObject.maxHeight) { 825 animationFromToToConfig.maxHeight = animation.fromtotoObject.maxHeight; 826 } 827 if (animation.fromtotoObject.paddingTop) { 828 animationFromToToConfig.paddingTop = animation.fromtotoObject.paddingTop; 829 } 830 if (animation.fromtotoObject.paddingBottom) { 831 animationFromToToConfig.paddingBottom = animation.fromtotoObject.paddingBottom; 832 } 833 if (animation.fromtotoObject.paddingLeft) { 834 animationFromToToConfig.paddingLeft = animation.fromtotoObject.paddingLeft; 835 } 836 if (animation.fromtotoObject.paddingRight) { 837 animationFromToToConfig.paddingRight = animation.fromtotoObject.paddingRight; 838 } 839 if (animation.fromtotoObject.marginTop) { 840 animationFromToToConfig.marginTop = animation.fromtotoObject.marginTop; 841 } 842 if (animation.fromtotoObject.marginBottom) { 843 animationFromToToConfig.marginBottom = animation.fromtotoObject.marginBottom; 844 } 845 if (animation.fromtotoObject.marginLeft) { 846 animationFromToToConfig.marginLeft = animation.fromtotoObject.marginLeft; 847 } 848 if (animation.fromtotoObject.marginRight) { 849 animationFromToToConfig.marginRight = animation.fromtotoObject.marginRight; 850 } 851 if (animation.fromtotoObject.positionTop) { 852 animationFromToToConfig.top = animation.fromtotoObject.positionTop; 853 } 854 if (animation.fromtotoObject.positionBottom) { 855 animationFromToToConfig.bottom = animation.fromtotoObject.positionBottom; 856 } 857 if (animation.fromtotoObject.positionLeft) { 858 animationFromToToConfig.left = animation.fromtotoObject.positionLeft; 859 } 860 if (animation.fromtotoObject.positionRight) { 861 animationFromToToConfig.right = animation.fromtotoObject.positionRight; 862 } 863 if (animation.fromtotoObject.borderColor) { 864 animationFromToToConfig.borderColor = animation.fromtotoObject.borderColor; 865 } 866 if (animation.fromtotoObject.borderStyle) { 867 animationFromToToConfig.borderStyle = animation.fromtotoObject.borderStyle; 868 } 869 if (animation.fromtotoObject.borderWidthTop) { 870 animationFromToToConfig.borderTopWidth = animation.fromtotoObject.borderWidthTop; 871 } 872 if (animation.fromtotoObject.borderWidthBottom) { 873 animationFromToToConfig.borderBottomWidth = animation.fromtotoObject.borderWidthBottom; 874 } 875 if (animation.fromtotoObject.borderWidthLeft) { 876 animationFromToToConfig.borderLeftWidth = animation.fromtotoObject.borderWidthLeft; 877 } 878 if (animation.fromtotoObject.borderWidthRight) { 879 animationFromToToConfig.borderRightWidth = animation.fromtotoObject.borderWidthRight; 880 } 881 if (animation.fromtotoObject.borderTopLeftRadius) { 882 animationFromToToConfig.borderTopLeftRadius = animation.fromtotoObject.borderTopLeftRadius; 883 } 884 if (animation.fromtotoObject.borderTopRightRadius) { 885 animationFromToToConfig.borderTopRightRadius = animation.fromtotoObject.borderTopRightRadius; 886 } 887 if (animation.fromtotoObject.borderBottomLeftRadius) { 888 animationFromToToConfig.borderBottomLeftRadius = animation.fromtotoObject.borderBottomLeftRadius; 889 } 890 if (animation.fromtotoObject.borderBottomRightRadius) { 891 animationFromToToConfig.borderBottomRightRadius = animation.fromtotoObject.borderBottomRightRadius; 892 } 893 if ( 894 animation.fromtotoObject.boxShadowOffsetX && 895 animation.fromtotoObject.boxShadowOffsetY && 896 animation.fromtotoObject.boxShadowBlur && 897 animation.fromtotoObject.boxShadowSpread && 898 animation.fromtotoObject.boxShadowColor 899 ) {
900 var boxShadowProperties = { 901 offsetX: animation.fromtotoObject.boxShadowOffsetX, 902 offsetY: animation.fromtotoObject.boxShadowOffsetY, 903 blur: animation.fromtotoObject.boxShadowBlur, 904 spread: animation.fromtotoObject.boxShadowSpread, 905 color: animation.fromtotoObject.boxShadowColor, 906 }; 907 animationFromToToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 908 } 909 var filterString = ""; 910 if (animation.fromtotoObject.filterBlur) { 911 filterString += `blur(${animation.fromtotoObject.filterBlur}) `; 912 } 913 if (animation.fromtotoObject.filterBrightness) { 914 filterString += `brightness(${animation.fromtotoObject.filterBrightness}) `; 915 } 916 if (animation.fromtotoObject.filterContrast) { 917 filterString += `contrast(${animation.fromtotoObject.filterContrast}) `; 918 } 919 if (animation.fromtotoObject.filterGrayscale) { 920 filterString += `grayscale(${animation.fromtotoObject.filterGrayscale}) `; 921 } 922 if (animation.fromtotoObject.filterHueRotate) { 923 filterString += `hue-rotate(${animation.fromtotoObject.filterHueRotate}) `; 924 } 925 if (animation.fromtotoObject.filterInvert) { 926 filterString += `invert(${animation.fromtotoObject.filterInvert}) `; 927 } 928 if (animation.fromtotoObject.filterSaturate) { 929 filterString += `saturate(${animation.fromtotoObject.filterSaturate}) `; 930 } 931 if (animation.fromtotoObject.filterSepia) { 932 filterString += `sepia(${animation.fromtotoObject.filterSepia}) `; 933 } 934 if (filterString != "") { 935 filterString = filterString.trim(); 936 animationFromToToConfig.filter = filterString; 937 } 938 if (animation.fromtotoObject.svgFill) { 939 animationFromToToConfig.fill = animation.fromtotoObject.svgFill; 940 } 941 if (animation.fromtotoObject.svgStrokeColor) { 942 animationFromToToConfig.stroke = animation.fromtotoObject.svgStrokeColor; 943 } 944 if (animation.fromtotoObject.svgStrokeWidth) { 945 animationFromToToConfig.strokeWidth = animation.fromtotoObject.svgStrokeWidth; 946 } 947 //Add custom properties to animation 948 if (animation.fromtotoObject.customProperties && animation.fromtotoObject.customValues) { 949 const properties = animation.fromtotoObject.customProperties.split('d110708'); 950 const values = animation.fromtotoObject.customValues.split('d110708'); 951 952 properties.forEach((property, index) => { 953 const value = values[index]; 954 if (property !== "" && value !== "") { 955 animationFromToToConfig[property] = value; 956 } 957 }); 958 } 959 var animationFromToFromConfig = {}; 960 if (animation.fromtofromObject.opacity) { 961 animationFromToFromConfig.opacity = animation.fromtofromObject.opacity; 962 } 963 if (animation.fromtofromObject.autoAlpha) { 964 animationFromToFromConfig.autoAlpha = animation.fromtofromObject.autoAlpha; 965 } 966 if (animation.fromtofromObject.transformX) { 967 animationFromToFromConfig.x = animation.fromtofromObject.transformX; 968 } 969 if (animation.fromtofromObject.transformY) { 970 animationFromToFromConfig.y = animation.fromtofromObject.transformY; 971 } 972 if (animation.fromtofromObject.transformScale) { 973 animationFromToFromConfig.scale = animation.fromtofromObject.transformScale; 974 } 975 if (animation.fromtofromObject.transformRotate) { 976 animationFromToFromConfig.rotation = animation.fromtofromObject.transformRotate; 977 } 978 if (animation.fromtofromObject.transformSkewX) { 979 animationFromToFromConfig.skewX = animation.fromtofromObject.transformSkewX; 980 } 981 if (animation.fromtofromObject.transformSkewY) { 982 animationFromToFromConfig.skewY = animation.fromtofromObject.transformSkewY; 983 } 984 if (animation.fromtofromObject.background) { 985 animationFromToFromConfig.backgroundColor = animation.fromtofromObject.background; 986 } 987 if (animation.fromtofromObject.color) { 988 animationFromToFromConfig.color = animation.fromtofromObject.color; 989 } 990 if (animation.fromtofromObject.fontFamily) { 991 animationFromToFromConfig.fontFamily = animation.fromtofromObject.fontFamily; 992 } 993 if (animation.fromtofromObject.fontSize) { 994 animationFromToFromConfig.fontSize = animation.fromtofromObject.fontSize; 995 } 996 if (animation.fromtofromObject.fontWeight) { 997 animationFromToFromConfig.fontWeight = animation.fromtofromObject.fontWeight; 998 } 999 if (animation.fromtofromObject.fontStyle) { 1000 animationFromToFromConfig.fontStyle = animation.fromtofromObject.fontStyle; 1001 } 1002 if (animation.fromtofromObject.textAlign) { 1003 animationFromToFromConfig.textAlign = animation.fromtofromObject.textAlign; 1004 } 1005 if (animation.fromtofromObject.textDecoration) { 1006 animationFromToFromConfig.textDecoration = animation.fromtofromObject.textDecoration; 1007 } 1008 if (animation.fromtofromObject.textTransform) { 1009 animationFromToFromConfig.textTransform = animation.fromtofromObject.textTransform; 1010 } 1011 if (animation.fromtofromObject.lineHeight) { 1012 animationFromToFromConfig.lineHeight = animation.fromtofromObject.lineHeight; 1013 } 1014 if (animation.fromtofromObject.letterSpacing) { 1015 animationFromToFromConfig.letterSpacing = animation.fromtofromObject.letterSpacing; 1016 } 1017 if (animation.fromtofromObject.wordSpacing) { 1018 animationFromToFromConfig.wordSpacing = animation.fromtofromObject.wordSpacing; 1019 } 1020 if (animation.fromtofromObject.width) { 1021 animationFromToFromConfig.width = animation.fromtofromObject.width; 1022 } 1023 if (animation.fromtofromObject.height) { 1024 animationFromToFromConfig.height = animation.fromtofromObject.height; 1025 } 1026 if (animation.fromtofromObject.minWidth) { 1027 animationFromToFromConfig.minWidth = animation.fromtofromObject.minWidth; 1028 } 1029 if (animation.fromtofromObject.minHeight) { 1030 animationFromToFromConfig.minHeight = animation.fromtofromObject.minHeight; 1031 } 1032 if (animation.fromtofromObject.maxWidth) { 1033 animationFromToFromConfig.maxWidth = animation.fromtofromObject.maxWidth; 1034 } 1035 if (animation.fromtofromObject.maxHeight) { 1036 animationFromToFromConfig.maxHeight = animation.fromtofromObject.maxHeight; 1037 } 1038 if (animation.fromtofromObject.paddingTop) { 1039 animationFromToFromConfig.paddingTop = animation.fromtofromObject.paddingTop; 1040 } 1041 if (animation.fromtofromObject.paddingBottom) { 1042 animationFromToFromConfig.paddingBottom = animation.fromtofromObject.paddingBottom; 1043 } 1044 if (animation.fromtofromObject.paddingLeft) { 1045 animationFromToFromConfig.paddingLeft = animation.fromtofromObject.paddingLeft; 1046 } 1047 if (animation.fromtofromObject.paddingRight) { 1048 animationFromToFromConfig.paddingRight = animation.fromtofromObject.paddingRight; 1049 } 1050 if (animation.fromtofromObject.marginTop) { 1051 animationFromToFromConfig.marginTop = animation.fromtofromObject.marginTop; 1052 } 1053 if (animation.fromtofromObject.marginBottom) { 1054 animationFromToFromConfig.marginBottom = animation.fromtofromObject.marginBottom; 1055 } 1056 if (animation.fromtofromObject.marginLeft) { 1057 animationFromToFromConfig.marginLeft = animation.fromtofromObject.marginLeft; 1058 } 1059 if (animation.fromtofromObject.marginRight) { 1060 animationFromToFromConfig.marginRight = animation.fromtofromObject.marginRight; 1061 } 1062 if (animation.fromtofromObject.positionTop) { 1063 animationFromToFromConfig.top = animation.fromtofromObject.positionTop; 1064 } 1065 if (animation.fromtofromObject.positionBottom) { 1066 animationFromToFromConfig.bottom = animation.fromtofromObject.positionBottom; 1067 } 1068 if (animation.fromtofromObject.positionLeft) { 1069 animationFromToFromConfig.left = animation.fromtofromObject.positionLeft; 1070 } 1071 if (animation.fromtofromObject.positionRight) { 1072 animationFromToFromConfig.right = animation.fromtofromObject.positionRight; 1073 } 1074 if (animation.fromtofromObject.borderColor) { 1075 animationFromToFromConfig.borderColor = animation.fromtofromObject.borderColor; 1076 } 1077 if (animation.fromtofromObject.borderStyle) { 1078 animationFromToFromConfig.borderStyle = animation.fromtofromObject.borderStyle; 1079 } 1080 if (animation.fromtofromObject.borderWidthTop) { 1081 animationFromToFromConfig.borderTopWidth = animation.fromtofromObject.borderWidthTop; 1082 } 1083 if (animation.fromtofromObject.borderWidthBottom) { 1084 animationFromToFromConfig.borderBottomWidth = animation.fromtofromObject.borderWidthBottom; 1085 } 1086 if (animation.fromtofromObject.borderWidthLeft) { 1087 animationFromToFromConfig.borderLeftWidth = animation.fromtofromObject.borderWidthLeft; 1088 } 1089 if (animation.fromtofromObject.borderWidthRight) { 1090 animationFromToFromConfig.borderRightWidth = animation.fromtofromObject.borderWidthRight; 1091 } 1092 if (animation.fromtofromObject.borderTopLeftRadius) { 1093 animationFromToFromConfig.borderTopLeftRadius = animation.fromtofromObject.borderTopLeftRadius; 1094 } 1095 if (animation.fromtofromObject.borderTopRightRadius) { 1096 animationFromToFromConfig.borderTopRightRadius = animation.fromtofromObject.borderTopRightRadius; 1097 } 1098 if (animation.fromtofromObject.borderBottomLeftRadius) { 1099 animationFromToFromConfig.borderBottomLeftRadius = animation.fromtofromObject.borderBottomLeftRadius; 1100 } 1101 if (animation.fromtofromObject.borderBottomRightRadius) { 1102 animationFromToFromConfig.borderBottomRightRadius = animation.fromtofromObject.borderBottomRightRadius; 1103 } 1104 if ( 1105 animation.fromtofromObject.boxShadowOffsetX && 1106 animation.fromtofromObject.boxShadowOffsetY && 1107 animation.fromtofromObject.boxShadowBlur && 1108 animation.fromtofromObject.boxShadowSpread && 1109 animation.fromtofromObject.boxShadowColor 1110 ) {
1111 var boxShadowProperties = { 1112 offsetX: animation.fromtofromObject.boxShadowOffsetX, 1113 offsetY: animation.fromtofromObject.boxShadowOffsetY, 1114 blur: animation.fromtofromObject.boxShadowBlur, 1115 spread: animation.fromtofromObject.boxShadowSpread, 1116 color: animation.fromtofromObject.boxShadowColor, 1117 }; 1118 animationFromToFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 1119 } 1120 var filterString = ""; 1121 if (animation.fromtofromObject.filterBlur) { 1122 filterString += `blur(${animation.fromtofromObject.filterBlur}) `; 1123 } 1124 if (animation.fromtofromObject.filterBrightness) { 1125 filterString += `brightness(${animation.fromtofromObject.filterBrightness}) `; 1126 } 1127 if (animation.fromtofromObject.filterContrast) { 1128 filterString += `contrast(${animation.fromtofromObject.filterContrast}) `; 1129 } 1130 if (animation.fromtofromObject.filterGrayscale) { 1131 filterString += `grayscale(${animation.fromtofromObject.filterGrayscale}) `; 1132 } 1133 if (animation.fromtofromObject.filterHueRotate) { 1134 filterString += `hue-rotate(${animation.fromtofromObject.filterHueRotate}) `; 1135 } 1136 if (animation.fromtofromObject.filterInvert) { 1137 filterString += `invert(${animation.fromtofromObject.filterInvert}) `; 1138 } 1139 if (animation.fromtofromObject.filterSaturate) { 1140 filterString += `saturate(${animation.fromtofromObject.filterSaturate}) `; 1141 } 1142 if (animation.fromtofromObject.filterSepia) { 1143 filterString += `sepia(${animation.fromtofromObject.filterSepia}) `; 1144 } 1145 if (filterString != "") { 1146 filterString = filterString.trim(); 1147 animationFromToFromConfig.filter = filterString; 1148 } 1149 if (animation.fromtofromObject.svgFill) { 1150 animationFromToFromConfig.fill = animation.fromtofromObject.svgFill; 1151 } 1152 if (animation.fromtofromObject.svgStrokeColor) { 1153 animationFromToFromConfig.stroke = animation.fromtofromObject.svgStrokeColor; 1154 } 1155 if (animation.fromtofromObject.svgStrokeWidth) { 1156 animationFromToFromConfig.strokeWidth = animation.fromtofromObject.svgStrokeWidth; 1157 } 1158 //Add custom properties to animation 1159 if (animation.fromtofromObject.customProperties && animation.fromtofromObject.customValues) { 1160 const properties = animation.fromtofromObject.customProperties.split('d110708'); 1161 const values = animation.fromtofromObject.customValues.split('d110708'); 1162
1163 properties.forEach((property, index) => { 1164 const value = values[index]; 1165 if (property !== "" && value !== "") { 1166 animationFromToFromConfig[property] = value; 1167 } 1168 }); 1169 } 1170 if (animation.element == "this" && timeline.trigger != "") { 1171 var elementToAnimate = triggerElement; 1172 1173 //SplitText 1174 if(animation.splitTextEnabled == "true"){ 1175 new SplitText(document.querySelectorAll(`${timeline.trigger}, ${timeline.trigger} *`), { 1176 type: animation.splitText, 1177 charsClass: `${timeline.trigger}-char nb-animator-char`, 1178 wordsClass: `${timeline.trigger}-word nb-animator-word`, 1179 linesClass: `${timeline.trigger}-line nb-animator-line`, 1180 }); 1181 if(animation.splitText.includes('char')){ 1182 GSAPtimeline.fromTo(document.getElementsByClassName(`${timeline.trigger}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 1183 }else if(animation.splitText.includes('word')){ 1184 GSAPtimeline.fromTo(document.getElementsByClassName(`${timeline.trigger}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 1185 }else if(animation.splitText.includes('line')){ 1186 GSAPtimeline.fromTo(document.getElementsByClassName(`${timeline.trigger}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 1187 }else{ 1188 GSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1189 } 1190 }else{ 1191 GSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1192 } 1193 } else if (animation.element != "") { 1194 if (timeline.triggerEvent == "custom") { 1195 var elementToAnimate = animation.element; 1196 if (document.querySelector(elementToAnimate) && triggerElementIndex == 0) { 1197 1198 //SplitText 1199 if(animation.splitTextEnabled == "true"){ 1200 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 1201 type: animation.splitText, 1202 charsClass: `${elementToAnimate}-char nb-animator-char`, 1203 wordsClass: `${elementToAnimate}-word nb-animator-word`, 1204 linesClass: `${elementToAnimate}-line nb-animator-line`, 1205 }); 1206 if(animation.splitText.includes('char')){ 1207 GSAPtimelineCustomEvent.fromTo(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 1208 }else if(animation.splitText.includes('word')){ 1209 GSAPtimelineCustomEvent.fromTo(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 1210 }else if(animation.splitText.includes('line')){ 1211 GSAPtimelineCustomEvent.fromTo(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 1212 }else{ 1213 GSAPtimelineCustomEvent.fromTo(animation.element, animationFromToFromConfig, animationFromToToConfig, 0); 1214 } 1215 }else{ 1216 GSAPtimelineCustomEvent.fromTo(animation.element, animationFromToFromConfig, animationFromToToConfig, 0); 1217 } 1218 1219 } 1220 } else if (triggerElementIndex == 0) { 1221 var elementToAnimate = animation.element; 1222 if (document.querySelector(elementToAnimate)) { 1223 //SplitText 1224 if(animation.splitTextEnabled == "true"){ 1225 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 1226 type: animation.splitText, 1227 charsClass: `${elementToAnimate}-char nb-animator-char`, 1228 wordsClass: `${elementToAnimate}-word nb-animator-word`, 1229 linesClass: `${elementToAnimate}-line nb-animator-line`, 1230 }); 1231 if(animation.splitText.includes('char')){ 1232 GSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 1233 }else if(animation.splitText.includes('word')){ 1234 GSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 1235 }else if(animation.splitText.includes('line')){ 1236 GSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 1237 }else{ 1238 GSAPtimeline.fromTo(animation.element, animationFromToFromConfig, animationFromToToConfig, 0); 1239 } 1240 }else{ 1241 GSAPtimeline.fromTo(animation.element, animationFromToFromConfig, animationFromToToConfig, 0); 1242 } 1243 } 1244 } 1245 } 1246 break; 1247 } 1248 }); 1249 } 1250 }); 1251 }); 1252 });
1253} 1254window.addEventListener("load", () => { 1255 animationsFrontend(); 1256});
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.