1document.addEventListener("DOMContentLoaded", function (e) { 2 if (document.querySelector('[data-barba="container"]')) { 3 pageTransitionsFrontend(); 4 } 5}); 6function pageTransitionsFrontend() { 7 const transitionsArray = []; 8 const dynamicRoutes = {}; 9 var jsonString = data_pagetransitions.data_pagetransitions.replace(/\\/g, ""); 10 var JSONobject = JSON.parse(jsonString); 11 JSONobject.animator.folders.map((folder) => { 12 folder.folder.timelines.map((timeline, index) => { 13 var timeline = timeline.timeline; 14 var leftGSAPtimeline = createTimeline(leftGSAPtimeline); 15 var rightGSAPtimeline = createTimeline(rightGSAPtimeline); 16 function createTimeline(GSAPtimeline) { 17 GSAPtimeline = gsap.timeline({ 18 paused: true, 19 }); 20 return GSAPtimeline; 21 } 22 function createLeftAnimation(animation, currentContainer){ 23 var animation = animation.animation; 24 switch (animation.method) { 25 case "from": 26 var animationFromConfig = { duration: Number(animation.duration) }; 27 if (animation.delay) { 28 animationFromConfig.delay = Number(animation.delay); 29 } 30 if (animation.easing) { 31 animationFromConfig.ease = animation.easing; 32 } 33 if (animation.staggerEnabled == "true") { 34 animationFromConfig.stagger = animation.stagger; 35 } 36 if (animation.repeatEnabled == "true") { 37 animationFromConfig.repeat = Number(animation.repeat); 38 } 39 if (animation.yoyoEnabled == "true") { 40 animationFromConfig.yoyo = !0; 41 } 42 if (animation.fromObject.opacity) { 43 animationFromConfig.opacity = animation.fromObject.opacity; 44 } 45 if (animation.fromObject.autoAlpha) { 46 animationFromConfig.autoAlpha = animation.fromObject.autoAlpha; 47 } 48 if (animation.fromObject.transformX) { 49 animationFromConfig.x = animation.fromObject.transformX; 50 } 51 if (animation.fromObject.transformY) { 52 animationFromConfig.y = animation.fromObject.transformY; 53 } 54 if (animation.fromObject.transformScale) { 55 animationFromConfig.scale = animation.fromObject.transformScale; 56 } 57 if (animation.fromObject.transformRotate) { 58 animationFromConfig.rotation = animation.fromObject.transformRotate; 59 } 60 if (animation.fromObject.transformSkewX) { 61 animationFromConfig.skewX = animation.fromObject.transformSkewX; 62 } 63 if (animation.fromObject.transformSkewY) { 64 animationFromConfig.skewY = animation.fromObject.transformSkewY; 65 } 66 if (animation.fromObject.background) { 67 animationFromConfig.backgroundColor = animation.fromObject.background; 68 } 69 if (animation.fromObject.color) { 70 animationFromConfig.color = animation.fromObject.color; 71 } 72 if (animation.fromObject.fontFamily) { 73 animationFromConfig.fontFamily = animation.fromObject.fontFamily; 74 } 75 if (animation.fromObject.fontSize) { 76 animationFromConfig.fontSize = animation.fromObject.fontSize; 77 } 78 if (animation.fromObject.fontWeight) { 79 animationFromConfig.fontWeight = animation.fromObject.fontWeight; 80 } 81 if (animation.fromObject.fontStyle) { 82 animationFromConfig.fontStyle = animation.fromObject.fontStyle; 83 } 84 if (animation.fromObject.textAlign) { 85 animationFromConfig.textAlign = animation.fromObject.textAlign; 86 } 87 if (animation.fromObject.textDecoration) { 88 animationFromConfig.textDecoration = animation.fromObject.textDecoration; 89 } 90 if (animation.fromObject.textTransform) { 91 animationFromConfig.textTransform = animation.fromObject.textTransform; 92 } 93 if (animation.fromObject.lineHeight) { 94 animationFromConfig.lineHeight = animation.fromObject.lineHeight; 95 } 96 if (animation.fromObject.letterSpacing) { 97 animationFromConfig.letterSpacing = animation.fromObject.letterSpacing; 98 } 99 if (animation.fromObject.wordSpacing) { 100 animationFromConfig.wordSpacing = animation.fromObject.wordSpacing; 101 } 102 if (animation.fromObject.width) { 103 animationFromConfig.width = animation.fromObject.width; 104 } 105 if (animation.fromObject.height) { 106 animationFromConfig.height = animation.fromObject.height; 107 } 108 if (animation.fromObject.minWidth) { 109 animationFromConfig.minWidth = animation.fromObject.minWidth; 110 } 111 if (animation.fromObject.minHeight) { 112 animationFromConfig.minHeight = animation.fromObject.minHeight; 113 } 114 if (animation.fromObject.maxWidth) { 115 animationFromConfig.maxWidth = animation.fromObject.maxWidth; 116 } 117 if (animation.fromObject.maxHeight) { 118 animationFromConfig.maxHeight = animation.fromObject.maxHeight; 119 } 120 if (animation.fromObject.paddingTop) { 121 animationFromConfig.paddingTop = animation.fromObject.paddingTop; 122 } 123 if (animation.fromObject.paddingBottom) { 124 animationFromConfig.paddingBottom = animation.fromObject.paddingBottom; 125 } 126 if (animation.fromObject.paddingLeft) { 127 animationFromConfig.paddingLeft = animation.fromObject.paddingLeft; 128 } 129 if (animation.fromObject.paddingRight) { 130 animationFromConfig.paddingRight = animation.fromObject.paddingRight; 131 } 132 if (animation.fromObject.marginTop) { 133 animationFromConfig.marginTop = animation.fromObject.marginTop; 134 } 135 if (animation.fromObject.marginBottom) { 136 animationFromConfig.marginBottom = animation.fromObject.marginBottom; 137 } 138 if (animation.fromObject.marginLeft) { 139 animationFromConfig.marginLeft = animation.fromObject.marginLeft; 140 } 141 if (animation.fromObject.marginRight) { 142 animationFromConfig.marginRight = animation.fromObject.marginRight; 143 } 144 if (animation.fromObject.positionTop) { 145 animationFromConfig.top = animation.fromObject.positionTop; 146 } 147 if (animation.fromObject.positionBottom) { 148 animationFromConfig.bottom = animation.fromObject.positionBottom; 149 } 150 if (animation.fromObject.positionLeft) { 151 animationFromConfig.left = animation.fromObject.positionLeft; 152 } 153 if (animation.fromObject.positionRight) { 154 animationFromConfig.right = animation.fromObject.positionRight; 155 } 156 if (animation.fromObject.borderColor) { 157 animationFromConfig.borderColor = animation.fromObject.borderColor; 158 } 159 if (animation.fromObject.borderStyle) { 160 animationFromConfig.borderStyle = animation.fromObject.borderStyle; 161 } 162 if (animation.fromObject.borderWidthTop) { 163 animationFromConfig.borderTopWidth = animation.fromObject.borderWidthTop; 164 } 165 if (animation.fromObject.borderWidthBottom) { 166 animationFromConfig.borderBottomWidth = animation.fromObject.borderWidthBottom; 167 } 168 if (animation.fromObject.borderWidthLeft) { 169 animationFromConfig.borderLeftWidth = animation.fromObject.borderWidthLeft; 170 } 171 if (animation.fromObject.borderWidthRight) { 172 animationFromConfig.borderRightWidth = animation.fromObject.borderWidthRight; 173 } 174 if (animation.fromObject.borderTopLeftRadius) { 175 animationFromConfig.borderTopLeftRadius = animation.fromObject.borderTopLeftRadius; 176 } 177 if (animation.fromObject.borderTopRightRadius) { 178 animationFromConfig.borderTopRightRadius = animation.fromObject.borderTopRightRadius; 179 } 180 if (animation.fromObject.borderBottomLeftRadius) { 181 animationFromConfig.borderBottomLeftRadius = animation.fromObject.borderBottomLeftRadius; 182 } 183 if (animation.fromObject.borderBottomRightRadius) { 184 animationFromConfig.borderBottomRightRadius = animation.fromObject.borderBottomRightRadius; 185 } 186 if (animation.fromObject.boxShadowOffsetX && animation.fromObject.boxShadowOffsetY && animation.fromObject.boxShadowBlur && animation.fromObject.boxShadowSpread && animation.fromObject.boxShadowColor) {
187 var boxShadowProperties = { 188 offsetX: animation.fromObject.boxShadowOffsetX, 189 offsetY: animation.fromObject.boxShadowOffsetY, 190 blur: animation.fromObject.boxShadowBlur, 191 spread: animation.fromObject.boxShadowSpread, 192 color: animation.fromObject.boxShadowColor, 193 }; 194 animationFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 195 } 196 var filterString = ""; 197 if (animation.fromObject.filterBlur) { 198 filterString += `blur(${animation.fromObject.filterBlur}) `; 199 } 200 if (animation.fromObject.filterBrightness) { 201 filterString += `brightness(${animation.fromObject.filterBrightness}) `; 202 } 203 if (animation.fromObject.filterContrast) { 204 filterString += `contrast(${animation.fromObject.filterContrast}) `; 205 } 206 if (animation.fromObject.filterGrayscale) { 207 filterString += `grayscale(${animation.fromObject.filterGrayscale}) `; 208 } 209 if (animation.fromObject.filterHueRotate) { 210 filterString += `hue-rotate(${animation.fromObject.filterHueRotate}) `; 211 } 212 if (animation.fromObject.filterInvert) { 213 filterString += `invert(${animation.fromObject.filterInvert}) `; 214 } 215 if (animation.fromObject.filterSaturate) { 216 filterString += `saturate(${animation.fromObject.filterSaturate}) `; 217 } 218 if (animation.fromObject.filterSepia) { 219 filterString += `sepia(${animation.fromObject.filterSepia}) `; 220 } 221 if (filterString != "") { 222 filterString = filterString.trim(); 223 animationFromConfig.filter = filterString; 224 } 225 if (animation.fromObject.svgFill) { 226 animationFromConfig.fill = animation.fromObject.svgFill; 227 } 228 if (animation.fromObject.svgStrokeColor) { 229 animationFromConfig.stroke = animation.fromObject.svgStrokeColor; 230 } 231 if (animation.fromObject.svgStrokeWidth) { 232 animationFromConfig.strokeWidth = animation.fromObject.svgStrokeWidth; 233 } 234 //Add custom properties to animation 235 if (animation.fromObject.customProperties && animation.fromObject.customValues) { 236 const properties = animation.fromObject.customProperties.split('d110708'); 237 const values = animation.fromObject.customValues.split('d110708'); 238 239 properties.forEach((property, index) => { 240 const value = values[index]; 241 if (property !== "" && value !== "") { 242 animationFromConfig[property] = value; 243 } 244 }); 245 } 246 if (animation.element != "") { 247 //check if current container is the element to animate 248 var elementToAnimate = animation.element; 249 if(elementToAnimate == timeline.container){ 250 elementToAnimate = currentContainer; 251 if(elementToAnimate){ 252 //SplitText 253 if(animation.splitTextEnabled == "true"){ 254 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 255 type: animation.splitText, 256 charsClass: `${animation.element}-char nb-animator-char`, 257 wordsClass: `${animation.element}-word nb-animator-word`, 258 linesClass: `${animation.element}-line nb-animator-line`, 259 }); 260 if(animation.splitText.includes('char')){ 261 leftGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationFromConfig, 0); 262 }else if(animation.splitText.includes('word')){ 263 leftGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationFromConfig, 0); 264 }else if(animation.splitText.includes('line')){ 265 leftGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationFromConfig, 0); 266 }else{ 267 leftGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 268 } 269 }else{ 270 leftGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 271 } 272 } 273 }else if (document.querySelector(elementToAnimate)) { 274 //SplitText 275 if(animation.splitTextEnabled == "true"){ 276 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 277 type: animation.splitText, 278 charsClass: `${elementToAnimate}-char nb-animator-char`, 279 wordsClass: `${elementToAnimate}-word nb-animator-word`, 280 linesClass: `${elementToAnimate}-line nb-animator-line`, 281 }); 282 if(animation.splitText.includes('char')){ 283 leftGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromConfig, 0); 284 }else if(animation.splitText.includes('word')){ 285 leftGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromConfig, 0); 286 }else if(animation.splitText.includes('line')){ 287 leftGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromConfig, 0); 288 }else{ 289 leftGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 290 } 291 }else{ 292 leftGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 293 } 294 } 295 } 296 break; 297 case "to": 298 var animationToConfig = { duration: Number(animation.duration) }; 299 if (animation.delay) { 300 animationToConfig.delay = Number(animation.delay); 301 } 302 if (animation.easing) { 303 animationToConfig.ease = animation.easing; 304 } 305 if (animation.staggerEnabled == "true") { 306 animationToConfig.stagger = animation.stagger; 307 } 308 if (animation.repeatEnabled == "true") { 309 animationToConfig.repeat = Number(animation.repeat); 310 } 311 if (animation.yoyoEnabled == "true") { 312 animationToConfig.yoyo = !0; 313 } 314 if (animation.toObject.opacity) { 315 animationToConfig.opacity = animation.toObject.opacity; 316 } 317 if (animation.toObject.autoAlpha) { 318 animationToConfig.autoAlpha = animation.toObject.autoAlpha; 319 } 320 if (animation.toObject.transformX) { 321 animationToConfig.x = animation.toObject.transformX; 322 } 323 if (animation.toObject.transformY) { 324 animationToConfig.y = animation.toObject.transformY; 325 } 326 if (animation.toObject.transformScale) { 327 animationToConfig.scale = animation.toObject.transformScale; 328 } 329 if (animation.toObject.transformRotate) { 330 animationToConfig.rotation = animation.toObject.transformRotate; 331 } 332 if (animation.toObject.transformSkewX) { 333 animationToConfig.skewX = animation.toObject.transformSkewX; 334 } 335 if (animation.toObject.transformSkewY) { 336 animationToConfig.skewY = animation.toObject.transformSkewY; 337 } 338 if (animation.toObject.background) { 339 animationToConfig.backgroundColor = animation.toObject.background; 340 } 341 if (animation.toObject.color) { 342 animationToConfig.color = animation.toObject.color; 343 } 344 if (animation.toObject.fontFamily) { 345 animationToConfig.fontFamily = animation.toObject.fontFamily; 346 } 347 if (animation.toObject.fontSize) { 348 animationToConfig.fontSize = animation.toObject.fontSize; 349 } 350 if (animation.toObject.fontWeight) { 351 animationToConfig.fontWeight = animation.toObject.fontWeight; 352 } 353 if (animation.toObject.fontStyle) { 354 animationToConfig.fontStyle = animation.toObject.fontStyle; 355 } 356 if (animation.toObject.textAlign) { 357 animationToConfig.textAlign = animation.toObject.textAlign; 358 } 359 if (animation.toObject.textDecoration) { 360 animationToConfig.textDecoration = animation.toObject.textDecoration; 361 } 362 if (animation.toObject.textTransform) { 363 animationToConfig.textTransform = animation.toObject.textTransform; 364 } 365 if (animation.toObject.lineHeight) { 366 animationToConfig.lineHeight = animation.toObject.lineHeight; 367 } 368 if (animation.toObject.letterSpacing) { 369 animationToConfig.letterSpacing = animation.toObject.letterSpacing; 370 } 371 if (animation.toObject.wordSpacing) { 372 animationToConfig.wordSpacing = animation.toObject.wordSpacing; 373 } 374 if (animation.toObject.width) { 375 animationToConfig.width = animation.toObject.width; 376 } 377 if (animation.toObject.height) { 378 animationToConfig.height = animation.toObject.height; 379 } 380 if (animation.toObject.minWidth) { 381 animationToConfig.minWidth = animation.toObject.minWidth; 382 } 383 if (animation.toObject.minHeight) { 384 animationToConfig.minHeight = animation.toObject.minHeight; 385 } 386 if (animation.toObject.maxWidth) { 387 animationToConfig.maxWidth = animation.toObject.maxWidth; 388 } 389 if (animation.toObject.maxHeight) { 390 animationToConfig.maxHeight = animation.toObject.maxHeight; 391 } 392 if (animation.toObject.paddingTop) { 393 animationToConfig.paddingTop = animation.toObject.paddingTop; 394 } 395 if (animation.toObject.paddingBottom) { 396 animationToConfig.paddingBottom = animation.toObject.paddingBottom; 397 } 398 if (animation.toObject.paddingLeft) { 399 animationToConfig.paddingLeft = animation.toObject.paddingLeft; 400 } 401 if (animation.toObject.paddingRight) { 402 animationToConfig.paddingRight = animation.toObject.paddingRight; 403 } 404 if (animation.toObject.marginTop) { 405 animationToConfig.marginTop = animation.toObject.marginTop; 406 } 407 if (animation.toObject.marginBottom) { 408 animationToConfig.marginBottom = animation.toObject.marginBottom; 409 } 410 if (animation.toObject.marginLeft) { 411 animationToConfig.marginLeft = animation.toObject.marginLeft; 412 } 413 if (animation.toObject.marginRight) { 414 animationToConfig.marginRight = animation.toObject.marginRight; 415 } 416 if (animation.toObject.positionTop) { 417 animationToConfig.top = animation.toObject.positionTop; 418 } 419 if (animation.toObject.positionBottom) { 420 animationToConfig.bottom = animation.toObject.positionBottom; 421 } 422 if (animation.toObject.positionLeft) { 423 animationToConfig.left = animation.toObject.positionLeft; 424 } 425 if (animation.toObject.positionRight) { 426 animationToConfig.right = animation.toObject.positionRight; 427 } 428 if (animation.toObject.borderColor) { 429 animationToConfig.borderColor = animation.toObject.borderColor; 430 } 431 if (animation.toObject.borderStyle) { 432 animationToConfig.borderStyle = animation.toObject.borderStyle; 433 } 434 if (animation.toObject.borderWidthTop) { 435 animationToConfig.borderTopWidth = animation.toObject.borderWidthTop; 436 } 437 if (animation.toObject.borderWidthBottom) { 438 animationToConfig.borderBottomWidth = animation.toObject.borderWidthBottom; 439 } 440 if (animation.toObject.borderWidthLeft) { 441 animationToConfig.borderLeftWidth = animation.toObject.borderWidthLeft; 442
442 } 443 if (animation.toObject.borderWidthRight) { 444 animationToConfig.borderRightWidth = animation.toObject.borderWidthRight; 445 } 446 if (animation.toObject.borderTopLeftRadius) { 447 animationToConfig.borderTopLeftRadius = animation.toObject.borderTopLeftRadius; 448 } 449 if (animation.toObject.borderTopRightRadius) { 450 animationToConfig.borderTopRightRadius = animation.toObject.borderTopRightRadius; 451 } 452 if (animation.toObject.borderBottomLeftRadius) { 453 animationToConfig.borderBottomLeftRadius = animation.toObject.borderBottomLeftRadius; 454 } 455 if (animation.toObject.borderBottomRightRadius) { 456 animationToConfig.borderBottomRightRadius = animation.toObject.borderBottomRightRadius; 457 } 458 if (animation.toObject.boxShadowOffsetX && animation.toObject.boxShadowOffsetY && animation.toObject.boxShadowBlur && animation.toObject.boxShadowSpread && animation.toObject.boxShadowColor) { 459 var boxShadowProperties = { 460 offsetX: animation.toObject.boxShadowOffsetX, 461 offsetY: animation.toObject.boxShadowOffsetY, 462 blur: animation.toObject.boxShadowBlur, 463 spread: animation.toObject.boxShadowSpread, 464 color: animation.toObject.boxShadowColor, 465 }; 466 animationToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 467 } 468 var filterString = ""; 469 if (animation.toObject.filterBlur) { 470 filterString += `blur(${animation.toObject.filterBlur}) `; 471 } 472 if (animation.toObject.filterBrightness) { 473 filterString += `brightness(${animation.toObject.filterBrightness}) `; 474 } 475 if (animation.toObject.filterContrast) { 476 filterString += `contrast(${animation.toObject.filterContrast}) `; 477 } 478 if (animation.toObject.filterGrayscale) { 479 filterString += `grayscale(${animation.toObject.filterGrayscale}) `; 480 } 481 if (animation.toObject.filterHueRotate) { 482 filterString += `hue-rotate(${animation.toObject.filterHueRotate}) `; 483 } 484 if (animation.toObject.filterInvert) { 485 filterString += `invert(${animation.toObject.filterInvert}) `; 486 } 487 if (animation.toObject.filterSaturate) { 488 filterString += `saturate(${animation.toObject.filterSaturate}) `; 489 } 490 if (animation.toObject.filterSepia) { 491 filterString += `sepia(${animation.toObject.filterSepia}) `; 492 } 493 if (filterString != "") { 494 filterString = filterString.trim(); 495 animationToConfig.filter = filterString; 496 } 497 if (animation.toObject.svgFill) { 498 animationToConfig.fill = animation.toObject.svgFill; 499 } 500 if (animation.toObject.svgStrokeColor) { 501 animationToConfig.stroke = animation.toObject.svgStrokeColor; 502 } 503 if (animation.toObject.svgStrokeWidth) { 504 animationToConfig.strokeWidth = animation.toObject.
504svgStrokeWidth; 505 } 506 //Add custom properties to animation 507 if (animation.toObject.customProperties && animation.toObject.customValues) { 508 const properties = animation.toObject.customProperties.split('d110708'); 509 const values = animation.toObject.customValues.split('d110708'); 510 511 properties.forEach((property, index) => { 512 const value = values[index]; 513 if (property !== "" && value !== "") { 514 animationToConfig[property] = value; 515 } 516 }); 517 } 518 if (animation.element != "") { 519 //check if current container is the element to animate 520 var elementToAnimate = animation.element; 521 if(elementToAnimate == timeline.container){ 522 elementToAnimate = currentContainer; 523 if(elementToAnimate){ 524 //SplitText 525 if(animation.splitTextEnabled == "true"){ 526 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 527 type: animation.splitText, 528 charsClass: `${animation.element}-char nb-animator-char`, 529 wordsClass: `${animation.element}-word nb-animator-word`, 530 linesClass: `${animation.element}-line nb-animator-line`, 531 }); 532 if(animation.splitText.includes('char')){ 533 leftGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationToConfig, 0); 534 }else if(animation.splitText.includes('word')){ 535 leftGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationToConfig, 0); 536 }else if(animation.splitText.includes('line')){ 537 leftGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationToConfig, 0); 538 }else{ 539 leftGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 540 } 541 }else{ 542 leftGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 543 } 544 } 545 }else if (document.querySelector(elementToAnimate)) { 546 //SplitText 547 if(animation.splitTextEnabled == "true"){ 548 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 549 type: animation.splitText, 550 charsClass: `${elementToAnimate}-char nb-animator-char`, 551 wordsClass: `${elementToAnimate}-word nb-animator-word`, 552 linesClass: `${elementToAnimate}-line nb-animator-line`, 553 }); 554 if(animation.splitText.includes('char')){ 555 leftGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-char`), animationToConfig, 0); 556 }else if(animation.splitText.includes('word')){ 557 leftGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-word`), animationToConfig, 0); 558 }else if(animation.splitText.includes('line')){ 559 leftGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-line`), animationToConfig, 0); 560 }else{ 561 leftGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 562 } 563 }else{ 564 leftGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 565 } 566 } 567 } 568 break; 569 case "fromto": 570 var animationFromToToConfig = { duration: Number(animation.duration) }; 571 if (animation.delay) { 572 animationFromToToConfig.delay = Number(animation.delay); 573 } 574 if (animation.easing) { 575 animationFromToToConfig.ease = animation.easing; 576 } 577 if (animation.staggerEnabled == "true") { 578 animationFromToToConfig.stagger = animation.stagger; 579 } 580 if (animation.repeatEnabled == "true") { 581 animationFromToToConfig.repeat = Number(animation.repeat); 582 } 583 if (animation.yoyoEnabled == "true") { 584 animationFromToToConfig.yoyo = !0; 585 } 586 if (animation.fromtotoObject.opacity) { 587 animationFromToToConfig.opacity = animation.fromtotoObject.opacity; 588 } 589 if (animation.fromtotoObject.autoAlpha) { 590 animationFromToToConfig.autoAlpha = animation.fromtotoObject.autoAlpha; 591 } 592 if (animation.fromtotoObject.transformX) { 593 animationFromToToConfig.x = animation.fromtotoObject.transformX; 594 } 595 if (animation.fromtotoObject.transformY) { 596 animationFromToToConfig.y = animation.fromtotoObject.transformY; 597 } 598 if (animation.fromtotoObject.transformScale) { 599 animationFromToToConfig.scale = animation.fromtotoObject.transformScale; 600 } 601 if (animation.fromtotoObject.transformRotate) { 602 animationFromToToConfig.rotation = animation.fromtotoObject.transformRotate; 603 } 604 if (animation.fromtotoObject.transformSkewX) { 605 animationFromToToConfig.skewX = animation.fromtotoObject.transformSkewX; 606 } 607 if (animation.fromtotoObject.transformSkewY) { 608 animationFromToToConfig.skewY = animation.fromtotoObject.transformSkewY; 609 } 610 if (animation.fromtotoObject.background) { 611 animationFromToToConfig.backgroundColor = animation.fromtotoObject.background; 612 } 613 if (animation.fromtotoObject.color) { 614 animationFromToToConfig.color = animation.fromtotoObject.color; 615 } 616 if (animation.fromtotoObject.fontFamily) { 617 animationFromToToConfig.fontFamily = animation.fromtotoObject.fontFamily; 618 } 619 if (animation.fromtotoObject.fontSize) { 620 animationFromToToConfig.fontSize = animation.fromtotoObject.fontSize; 621 } 622 if (animation.fromtotoObject.fontWeight) { 623 animationFromToToConfig.fontWeight = animation.fromtotoObject.fontWeight; 624 } 625 if (animation.fromtotoObject.fontStyle) { 626 animationFromToToConfig.fontStyle = animation.fromtotoObject.fontStyle; 627 } 628 if (animation.fromtotoObject.textAlign) { 629 animationFromToToConfig.textAlign = animation.fromtotoObject.textAlign; 630 } 631 if (animation.fromtotoObject.textDecoration) { 632 animationFromToToConfig.textDecoration = animation.fromtotoObject.textDecoration; 633 } 634 if (animation.fromtotoObject.textTransform) { 635 animationFromToToConfig.textTransform = animation.fromtotoObject.textTransform; 636 } 637 if (animation.fromtotoObject.lineHeight) { 638 animationFromToToConfig.lineHeight = animation.fromtotoObject.lineHeight; 639 } 640 if (animation.fromtotoObject.letterSpacing) { 641 animationFromToToConfig.letterSpacing = animation.fromtotoObject.letterSpacing; 642 } 643 if (animation.fromtotoObject.wordSpacing) { 644 animationFromToToConfig.wordSpacing = animation.fromtotoObject.wordSpacing; 645 } 646 if (animation.fromtotoObject.width) { 647 animationFromToToConfig.width = animation.fromtotoObject.width; 648 } 649 if (animation.fromtotoObject.height) { 650 animationFromToToConfig.height = animation.fromtotoObject.height; 651 } 652 if (animation.fromtotoObject.minWidth) { 653 animationFromToToConfig.minWidth = animation.fromtotoObject.minWidth; 654 } 655 if (animation.fromtotoObject.minHeight) { 656 animationFromToToConfig.minHeight = animation.fromtotoObject.minHeight; 657 } 658 if (animation.fromtotoObject.maxWidth) { 659 animationFromToToConfig.maxWidth = animation.fromtotoObject.maxWidth; 660 } 661 if (animation.fromtotoObject.maxHeight) { 662 animationFromToToConfig.maxHeight = animation.fromtotoObject.maxHeight; 663 } 664 if (animation.fromtotoObject.paddingTop) { 665 animationFromToToConfig.paddingTop = animation.fromtotoObject.paddingTop; 666 } 667 if (animation.fromtotoObject.paddingBottom) { 668 animationFromToToConfig.paddingBottom = animation.fromtotoObject.paddingBottom; 669 } 670 if (animation.fromtotoObject.paddingLeft) { 671 animationFromToToConfig.paddingLeft = animation.fromtotoObject.paddingLeft; 672 } 673 if (animation.fromtotoObject.paddingRight) { 674 animationFromToToConfig.paddingRight = animation.fromtotoObject.paddingRight; 675 } 676 if (animation.fromtotoObject.marginTop) { 677 animationFromToToConfig.marginTop = animation.fromtotoObject.marginTop; 678 } 679 if (animation.fromtotoObject.marginBottom) { 680 animationFromToToConfig.marginBottom = animation.fromtotoObject.marginBottom; 681 } 682 if (animation.fromtotoObject.marginLeft) { 683 animationFromToToConfig.marginLeft = animation.fromtotoObject.marginLeft; 684 } 685 if (animation.fromtotoObject.marginRight) { 686 animationFromToToConfig.marginRight = animation.fromtotoObject.marginRight; 687 } 688 if (animation.fromtotoObject.positionTop) { 689 animationFromToToConfig.top = animation.fromtotoObject.positionTop; 690 } 691 if (animation.fromtotoObject.positionBottom) { 692 animationFromToToConfig.bottom = animation.fromtotoObject.positionBottom; 693 } 694 if (animation.fromtotoObject.positionLeft) { 695 animationFromToToConfig.left = animation.fromtotoObject.positionLeft; 696 } 697 if (animation.fromtotoObject.positionRight) { 698 animationFromToToConfig.right = animation.fromtotoObject.positionRight; 699 } 700 if (animation.fromtotoObject.borderColor) { 701 animationFromToToConfig.borderColor = animation.fromtotoObject.borderColor; 702 } 703 if (animation.fromtotoObject.borderStyle) { 704 animationFromToToConfig.borderStyle = animation.fromtotoObject.borderStyle; 705 } 706 if (animation.fromtotoObject.borderWidthTop) { 707 animationFromToToConfig.borderTopWidth = animation.fromtotoObject.borderWidthTop; 708 } 709 if (animation.fromtotoObject.borderWidthBottom) { 710 animationFromToToConfig.borderBottomWidth = animation.fromtotoObject.borderWidthBottom; 711 } 712 if (animation.fromtotoObject.borderWidthLeft) { 713 animationFromToToConfig.borderLeftWidth = animation.fromtotoObject.borderWidthLeft; 714 } 715 if (animation.fromtotoObject.borderWidthRight) { 716 animationFromToToConfig.borderRightWidth = animation.fromtotoObject.borderWidthRight; 717 } 718 if (animation.fromtotoObject.borderTopLeftRadius) { 719 animationFromToToConfig.borderTopLeftRadius = animation.fromtotoObject.borderTopLeftRadius; 720 } 721 if (animation.fromtotoObject.borderTopRightRadius) { 722 animationFromToToConfig.borderTopRightRadius = animation.fromtotoObject.borderTopRightRadius; 723 } 724 if (animation.fromtotoObject.borderBottomLeftRadius) { 725 animationFromToToConfig.borderBottomLeftRadius = animation.fromtotoObject.borderBottomLeftRadius; 726 } 727 if (animation.fromtotoObject.borderBottomRightRadius) { 728 animationFromToToConfig.borderBottomRightRadius = animation.fromtotoObject.borderBottomRightRadius; 729 } 730 if ( 731 animation.fromtotoObject.boxShadowOffsetX && 732 animation.fromtotoObject.boxShadowOffsetY && 733 animation.fromtotoObject.boxShadowBlur && 734 animation.fromtotoObject.boxShadowSpread && 735 animation.fromtotoObject.boxShadowColor 736 ) {
737 var boxShadowProperties = { 738 offsetX: animation.fromtotoObject.boxShadowOffsetX, 739 offsetY: animation.fromtotoObject.boxShadowOffsetY, 740 blur: animation.fromtotoObject.boxShadowBlur, 741 spread: animation.fromtotoObject.boxShadowSpread, 742 color: animation.fromtotoObject.boxShadowColor, 743 }; 744 animationFromToToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 745 } 746 var filterString = ""; 747 if (animation.fromtotoObject.filterBlur) { 748 filterString += `blur(${animation.fromtotoObject.filterBlur}) `; 749 } 750 if (animation.fromtotoObject.filterBrightness) { 751 filterString += `brightness(${animation.fromtotoObject.filterBrightness}) `; 752 } 753 if (animation.fromtotoObject.filterContrast) { 754 filterString += `contrast(${animation.fromtotoObject.filterContrast}) `; 755 } 756 if (animation.fromtotoObject.filterGrayscale) { 757 filterString += `grayscale(${animation.fromtotoObject.filterGrayscale}) `; 758 } 759 if (animation.fromtotoObject.filterHueRotate) { 760 filterString += `hue-rotate(${animation.fromtotoObject.filterHueRotate}) `; 761 } 762 if (animation.fromtotoObject.filterInvert) { 763 filterString += `invert(${animation.fromtotoObject.filterInvert}) `; 764 } 765 if (animation.fromtotoObject.filterSaturate) { 766 filterString += `saturate(${animation.fromtotoObject.filterSaturate}) `; 767 } 768 if (animation.fromtotoObject.filterSepia) { 769 filterString += `sepia(${animation.fromtotoObject.filterSepia}) `; 770 } 771 if (filterString != "") { 772 filterString = filterString.trim(); 773 animationFromToToConfig.filter = filterString; 774 } 775 if (animation.fromtotoObject.svgFill) { 776 animationFromToToConfig.fill = animation.fromtotoObject.svgFill; 777 } 778 if (animation.fromtotoObject.svgStrokeColor) { 779 animationFromToToConfig.stroke = animation.fromtotoObject.svgStrokeColor; 780 } 781 if (animation.fromtotoObject.svgStrokeWidth) { 782 animationFromToToConfig.strokeWidth = animation.fromtotoObject.svgStrokeWidth; 783 } 784 //Add custom properties to animation 785 if (animation.fromtotoObject.customProperties && animation.fromtotoObject.customValues) { 786 const properties = animation.fromtotoObject.customProperties.split('d110708'); 787 const values = animation.fromtotoObject.customValues.split('d110708'); 788 789 properties.forEach((property, index) => { 790 const value = values[index]; 791 if (property !== "" && value !== "") { 792 animationFromToToConfig[property] = value; 793 } 794 }); 795 } 796 var animationFromToFromConfig = {}; 797 if (animation.fromtofromObject.opacity) { 798 animationFromToFromConfig.opacity = animation.fromtofromObject.opacity; 799 } 800 if (animation.fromtofromObject.autoAlpha) { 801 animationFromToFromConfig.autoAlpha = animation.fromtofromObject.autoAlpha; 802 } 803 if (animation.fromtofromObject.transformX) { 804 animationFromToFromConfig.x = animation.fromtofromObject.transformX; 805 } 806 if (animation.fromtofromObject.transformY) { 807 animationFromToFromConfig.y = animation.fromtofromObject.transformY; 808 } 809 if (animation.fromtofromObject.transformScale) { 810 animationFromToFromConfig.scale = animation.fromtofromObject.transformScale; 811 } 812 if (animation.fromtofromObject.transformRotate) { 813 animationFromToFromConfig.rotation = animation.fromtofromObject.transformRotate; 814 } 815 if (animation.fromtofromObject.transformSkewX) { 816 animationFromToFromConfig.skewX = animation.fromtofromObject.transformSkewX; 817 } 818 if (animation.fromtofromObject.transformSkewY) { 819 animationFromToFromConfig.skewY = animation.fromtofromObject.transformSkewY; 820 } 821 if (animation.fromtofromObject.background) { 822 animationFromToFromConfig.backgroundColor = animation.fromtofromObject.background; 823 } 824 if (animation.fromtofromObject.color) { 825 animationFromToFromConfig.color = animation.fromtofromObject.color; 826 } 827 if (animation.fromtofromObject.fontFamily) { 828 animationFromToFromConfig.fontFamily = animation.fromtofromObject.fontFamily; 829 } 830 if (animation.fromtofromObject.fontSize) { 831 animationFromToFromConfig.fontSize = animation.fromtofromObject.fontSize; 832 } 833 if (animation.fromtofromObject.fontWeight) { 834 animationFromToFromConfig.fontWeight = animation.fromtofromObject.fontWeight; 835 } 836 if (animation.fromtofromObject.fontStyle) { 837 animationFromToFromConfig.fontStyle = animation.fromtofromObject.fontStyle; 838 } 839 if (animation.fromtofromObject.textAlign) { 840 animationFromToFromConfig.textAlign = animation.fromtofromObject.textAlign; 841 } 842 if (animation.fromtofromObject.textDecoration) { 843 animationFromToFromConfig.textDecoration = animation.fromtofromObject.textDecoration; 844 } 845 if (animation.fromtofromObject.textTransform) { 846 animationFromToFromConfig.textTransform = animation.fromtofromObject.textTransform; 847 } 848 if (animation.fromtofromObject.lineHeight) { 849 animationFromToFromConfig.lineHeight = animation.fromtofromObject.lineHeight; 850 } 851 if (animation.fromtofromObject.letterSpacing) { 852 animationFromToFromConfig.letterSpacing = animation.fromtofromObject.letterSpacing; 853 } 854 if (animation.fromtofromObject.wordSpacing) { 855 animationFromToFromConfig.wordSpacing = animation.fromtofromObject.wordSpacing; 856 } 857 if (animation.fromtofromObject.width) { 858 animationFromToFromConfig.width = animation.fromtofromObject.width; 859 } 860 if (animation.fromtofromObject.height) { 861 animationFromToFromConfig.height = animation.fromtofromObject.height; 862 } 863 if (animation.fromtofromObject.minWidth) { 864 animationFromToFromConfig.minWidth = animation.fromtofromObject.minWidth; 865 } 866 if (animation.fromtofromObject.minHeight) { 867 animationFromToFromConfig.minHeight = animation.fromtofromObject.minHeight; 868 } 869 if (animation.fromtofromObject.maxWidth) { 870 animationFromToFromConfig.maxWidth = animation.fromtofromObject.maxWidth; 871 } 872 if (animation.fromtofromObject.maxHeight) { 873 animationFromToFromConfig.maxHeight = animation.fromtofromObject.maxHeight; 874 } 875 if (animation.fromtofromObject.paddingTop) { 876 animationFromToFromConfig.paddingTop = animation.fromtofromObject.paddingTop; 877 } 878 if (animation.fromtofromObject.paddingBottom) { 879 animationFromToFromConfig.paddingBottom = animation.fromtofromObject.paddingBottom; 880 } 881 if (animation.fromtofromObject.paddingLeft) { 882 animationFromToFromConfig.paddingLeft = animation.fromtofromObject.paddingLeft; 883 } 884 if (animation.fromtofromObject.paddingRight) { 885 animationFromToFromConfig.paddingRight = animation.fromtofromObject.paddingRight; 886 } 887 if (animation.fromtofromObject.marginTop) { 888 animationFromToFromConfig.marginTop = animation.fromtofromObject.marginTop; 889 } 890 if (animation.fromtofromObject.marginBottom) { 891 animationFromToFromConfig.marginBottom = animation.fromtofromObject.marginBottom; 892 } 893 if (animation.fromtofromObject.marginLeft) { 894 animationFromToFromConfig.marginLeft = animation.fromtofromObject.marginLeft; 895 } 896 if (animation.fromtofromObject.marginRight) { 897 animationFromToFromConfig.marginRight = animation.fromtofromObject.marginRight; 898 } 899 if (animation.fromtofromObject.positionTop) { 900 animationFromToFromConfig.top = animation.fromtofromObject.positionTop; 901 } 902 if (animation.fromtofromObject.positionBottom) { 903 animationFromToFromConfig.bottom = animation.fromtofromObject.positionBottom; 904 } 905 if (animation.fromtofromObject.positionLeft) { 906 animationFromToFromConfig.left = animation.fromtofromObject.positionLeft; 907 } 908 if (animation.fromtofromObject.positionRight) { 909 animationFromToFromConfig.right = animation.fromtofromObject.positionRight; 910 } 911 if (animation.fromtofromObject.borderColor) { 912 animationFromToFromConfig.borderColor = animation.fromtofromObject.borderColor; 913 } 914 if (animation.fromtofromObject.borderStyle) { 915 animationFromToFromConfig.borderStyle = animation.fromtofromObject.borderStyle; 916 } 917 if (animation.fromtofromObject.borderWidthTop) { 918 animationFromToFromConfig.borderTopWidth = animation.fromtofromObject.borderWidthTop; 919 } 920 if (animation.fromtofromObject.borderWidthBottom) { 921 animationFromToFromConfig.borderBottomWidth = animation.fromtofromObject.borderWidthBottom; 922 } 923 if (animation.fromtofromObject.borderWidthLeft) { 924 animationFromToFromConfig.borderLeftWidth = animation.fromtofromObject.borderWidthLeft; 925 } 926 if (animation.fromtofromObject.borderWidthRight) { 927 animationFromToFromConfig.borderRightWidth = animation.fromtofromObject.borderWidthRight; 928 } 929 if (animation.fromtofromObject.borderTopLeftRadius) { 930 animationFromToFromConfig.borderTopLeftRadius = animation.fromtofromObject.borderTopLeftRadius; 931 } 932 if (animation.fromtofromObject.borderTopRightRadius) { 933 animationFromToFromConfig.borderTopRightRadius = animation.fromtofromObject.borderTopRightRadius; 934 } 935 if (animation.fromtofromObject.borderBottomLeftRadius) { 936 animationFromToFromConfig.borderBottomLeftRadius = animation.fromtofromObject.borderBottomLeftRadius; 937 } 938 if (animation.fromtofromObject.borderBottomRightRadius) { 939 animationFromToFromConfig.borderBottomRightRadius = animation.fromtofromObject.borderBottomRightRadius; 940 } 941 if ( 942 animation.fromtofromObject.boxShadowOffsetX && 943 animation.fromtofromObject.boxShadowOffsetY && 944 animation.fromtofromObject.boxShadowBlur && 945 animation.fromtofromObject.boxShadowSpread && 946 animation.fromtofromObject.boxShadowColor 947 ) {
948 var boxShadowProperties = { 949 offsetX: animation.fromtofromObject.boxShadowOffsetX, 950 offsetY: animation.fromtofromObject.boxShadowOffsetY, 951 blur: animation.fromtofromObject.boxShadowBlur, 952 spread: animation.fromtofromObject.boxShadowSpread, 953 color: animation.fromtofromObject.boxShadowColor, 954 }; 955 animationFromToFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 956 } 957 var filterString = ""; 958 if (animation.fromtofromObject.filterBlur) { 959 filterString += `blur(${animation.fromtofromObject.filterBlur}) `; 960 } 961 if (animation.fromtofromObject.filterBrightness) { 962 filterString += `brightness(${animation.fromtofromObject.filterBrightness}) `; 963 } 964 if (animation.fromtofromObject.filterContrast) { 965 filterString += `contrast(${animation.fromtofromObject.filterContrast}) `; 966 } 967 if (animation.fromtofromObject.filterGrayscale) { 968 filterString += `grayscale(${animation.fromtofromObject.filterGrayscale}) `; 969 } 970 if (animation.fromtofromObject.filterHueRotate) { 971 filterString += `hue-rotate(${animation.fromtofromObject.filterHueRotate}) `; 972 } 973 if (animation.fromtofromObject.filterInvert) { 974 filterString += `invert(${animation.fromtofromObject.filterInvert}) `; 975 } 976 if (animation.fromtofromObject.filterSaturate) { 977 filterString += `saturate(${animation.fromtofromObject.filterSaturate}) `; 978 } 979 if (animation.fromtofromObject.filterSepia) { 980 filterString += `sepia(${animation.fromtofromObject.filterSepia}) `; 981 } 982 if (filterString != "") { 983 filterString = filterString.trim(); 984 animationFromToFromConfig.filter = filterString; 985 } 986 if (animation.fromtofromObject.svgFill) { 987 animationFromToFromConfig.fill = animation.fromtofromObject.svgFill; 988 } 989 if (animation.fromtofromObject.svgStrokeColor) { 990 animationFromToFromConfig.stroke = animation.fromtofromObject.svgStrokeColor; 991 } 992 if (animation.fromtofromObject.svgStrokeWidth) { 993 animationFromToFromConfig.strokeWidth = animation.fromtofromObject.svgStrokeWidth; 994 } 995 //Add custom properties to animation 996 if (animation.fromtofromObject.customProperties && animation.fromtofromObject.customValues) { 997 const properties = animation.fromtofromObject.customProperties.split('d110708'); 998 const values = animation.fromtofromObject.customValues.split('d110708'); 999 1000 properties.forEach((property, index) => { 1001 const value = values[index]; 1002 if (property !== "" && value !== "") { 1003 animationFromToFromConfig[property] = value; 1004 } 1005 }); 1006 } 1007 if (animation.element != "") { 1008 //check if current container is the element to animate 1009 var elementToAnimate = animation.element; 1010 if(elementToAnimate == timeline.container){ 1011 elementToAnimate = currentContainer; 1012 if(elementToAnimate){ 1013 //SplitText 1014 if(animation.splitTextEnabled == "true"){ 1015 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 1016 type: animation.splitText, 1017 charsClass: `${animation.element}-char nb-animator-char`, 1018 wordsClass: `${animation.element}-word nb-animator-word`, 1019 linesClass: `${animation.element}-line nb-animator-line`, 1020 }); 1021 if(animation.splitText.includes('char')){ 1022 leftGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 1023 }else if(animation.splitText.includes('word')){ 1024 leftGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 1025 }else if(animation.splitText.includes('line')){ 1026 leftGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 1027 }else{ 1028 leftGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1029 } 1030 }else{ 1031 leftGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1032 } 1033 } 1034 }else if (document.querySelector(elementToAnimate)) { 1035 //SplitText 1036 if(animation.splitTextEnabled == "true"){ 1037 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 1038 type: animation.splitText, 1039 charsClass: `${elementToAnimate}-char nb-animator-char`, 1040 wordsClass: `${elementToAnimate}-word nb-animator-word`, 1041 linesClass: `${elementToAnimate}-line nb-animator-line`, 1042 }); 1043 if(animation.splitText.includes('char')){ 1044 leftGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 1045 }else if(animation.splitText.includes('word')){ 1046 leftGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 1047 }else if(animation.splitText.includes('line')){ 1048 leftGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 1049 }else{ 1050 leftGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1051 } 1052 }else{ 1053 leftGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 1054 } 1055 } 1056 } 1057 break; 1058 } 1059 } 1060 function createRightAnimation(animation, nextContainer){ 1061 var animation = animation.animation; 1062 switch (animation.method) { 1063 case "from": 1064 var animationFromConfig = { duration: Number(animation.duration) }; 1065 if (animation.delay) { 1066 animationFromConfig.delay = Number(animation.delay); 1067 } 1068 if (animation.easing) { 1069 animationFromConfig.ease = animation.easing; 1070 } 1071 if (animation.staggerEnabled == "true") { 1072 animationFromConfig.stagger = animation.stagger; 1073 } 1074 if (animation.repeatEnabled == "true") { 1075 animationFromConfig.repeat = Number(animation.repeat); 1076 } 1077 if (animation.yoyoEnabled == "true") { 1078 animationFromConfig.yoyo = !0; 1079 } 1080 if (animation.fromObject.opacity) { 1081 animationFromConfig.opacity = animation.fromObject.opacity; 1082 } 1083 if (animation.fromObject.autoAlpha) { 1084 animationFromConfig.autoAlpha = animation.fromObject.autoAlpha; 1085 } 1086 if (animation.fromObject.transformX) { 1087 animationFromConfig.x = animation.fromObject.transformX; 1088 } 1089 if (animation.fromObject.transformY) { 1090 animationFromConfig.y = animation.fromObject.transformY; 1091 } 1092 if (animation.fromObject.transformScale) { 1093 animationFromConfig.scale = animation.fromObject.transformScale; 1094 } 1095 if (animation.fromObject.transformRotate) { 1096 animationFromConfig.rotation = animation.fromObject.transformRotate; 1097 } 1098 if (animation.fromObject.transformSkewX) { 1099 animationFromConfig.skewX = animation.fromObject.transformSkewX; 1100 } 1101 if (animation.fromObject.transformSkewY) { 1102 animationFromConfig.skewY = animation.fromObject.transformSkewY; 1103 } 1104 if (animation.fromObject.background) { 1105 animationFromConfig.backgroundColor = animation.fromObject.background; 1106 } 1107 if (animation.fromObject.color) { 1108 animationFromConfig.color = animation.fromObject.color; 1109 } 1110 if (animation.fromObject.fontFamily) { 1111 animationFromConfig.fontFamily = animation.fromObject.fontFamily; 1112 } 1113 if (animation.fromObject.fontSize) { 1114 animationFromConfig.fontSize = animation.fromObject.fontSize; 1115 } 1116 if (animation.fromObject.fontWeight) { 1117 animationFromConfig.fontWeight = animation.fromObject.fontWeight; 1118 } 1119 if (animation.fromObject.fontStyle) { 1120 animationFromConfig.fontStyle = animation.fromObject.fontStyle; 1121 } 1122 if (animation.fromObject.textAlign) { 1123 animationFromConfig.textAlign = animation.fromObject.textAlign; 1124 } 1125 if (animation.fromObject.textDecoration) { 1126 animationFromConfig.textDecoration = animation.fromObject.textDecoration; 1127 } 1128 if (animation.fromObject.textTransform) { 1129 animationFromConfig.textTransform = animation.fromObject.textTransform; 1130 } 1131 if (animation.fromObject.lineHeight) { 1132 animationFromConfig.lineHeight = animation.fromObject.lineHeight; 1133 } 1134 if (animation.fromObject.letterSpacing) { 1135 animationFromConfig.letterSpacing = animation.fromObject.letterSpacing; 1136 } 1137 if (animation.fromObject.wordSpacing) { 1138 animationFromConfig.wordSpacing = animation.fromObject.wordSpacing; 1139 } 1140 if (animation.fromObject.width) { 1141 animationFromConfig.width = animation.fromObject.width; 1142 } 1143 if (animation.fromObject.height) { 1144 animationFromConfig.height = animation.fromObject.height; 1145 } 1146 if (animation.fromObject.minWidth) { 1147 animationFromConfig.minWidth = animation.fromObject.minWidth; 1148 } 1149 if (animation.fromObject.minHeight) { 1150 animationFromConfig.minHeight = animation.fromObject.minHeight; 1151 } 1152 if (animation.fromObject.maxWidth) { 1153 animationFromConfig.maxWidth = animation.fromObject.maxWidth; 1154 } 1155 if (animation.fromObject.maxHeight) { 1156 animationFromConfig.maxHeight = animation.fromObject.maxHeight; 1157 } 1158 if (animation.fromObject.paddingTop) { 1159 animationFromConfig.paddingTop = animation.fromObject.paddingTop; 1160 } 1161 if (animation.fromObject.paddingBottom) { 1162 animationFromConfig.paddingBottom = animation.fromObject.paddingBottom; 1163 } 1164 if (animation.fromObject.paddingLeft) { 1165 animationFromConfig.paddingLeft = animation.fromObject.paddingLeft; 1166 } 1167 if (animation.fromObject.paddingRight) { 1168 animationFromConfig.paddingRight = animation.fromObject.paddingRight; 1169 } 1170 if (animation.fromObject.marginTop) { 1171 animationFromConfig.marginTop = animation.fromObject.marginTop; 1172 } 1173 if (animation.fromObject.marginBottom) { 1174 animationFromConfig.marginBottom = animation.fromObject.marginBottom; 1175 } 1176 if (animation.fromObject.marginLeft) { 1177 animationFromConfig.marginLeft = animation.fromObject.marginLeft; 1178 } 1179 if (animation.fromObject.marginRight) { 1180 animationFromConfig.marginRight = animation.fromObject.marginRight; 1181 } 1182 if (animation.fromObject.positionTop) { 1183 animationFromConfig.top = animation.fromObject.positionTop; 1184 } 1185 if (animation.fromObject.positionBottom) { 1186 animationFromConfig.bottom = animation.fromObject.positionBottom; 1187 } 1188 if (animation.fromObject.positionLeft) { 1189 animationFromConfig.left = animation.fromObject.positionLeft; 1190 } 1191 if (animation.fromObject.positionRight) { 1192 animationFromConfig.right = anima
1192tion.fromObject.positionRight; 1193 } 1194 if (animation.fromObject.borderColor) { 1195 animationFromConfig.borderColor = animation.fromObject.borderColor; 1196 } 1197 if (animation.fromObject.borderStyle) { 1198 animationFromConfig.borderStyle = animation.fromObject.borderStyle; 1199 } 1200 if (animation.fromObject.borderWidthTop) { 1201 animationFromConfig.borderTopWidth = animation.fromObject.borderWidthTop; 1202 } 1203 if (animation.fromObject.borderWidthBottom) { 1204 animationFromConfig.borderBottomWidth = animation.fromObject.borderWidthBottom; 1205 } 1206 if (animation.fromObject.borderWidthLeft) { 1207 animationFromConfig.borderLeftWidth = animation.fromObject.borderWidthLeft; 1208 } 1209 if (animation.fromObject.borderWidthRight) { 1210 animationFromConfig.borderRightWidth = animation.fromObject.borderWidthRight; 1211 } 1212 if (animation.fromObject.borderTopLeftRadius) { 1213 animationFromConfig.borderTopLeftRadius = animation.fromObject.borderTopLeftRadius; 1214 } 1215 if (animation.fromObject.borderTopRightRadius) { 1216 animationFromConfig.borderTopRightRadius = animation.fromObject.borderTopRightRadius; 1217 } 1218 if (animation.fromObject.borderBottomLeftRadius) { 1219 animationFromConfig.borderBottomLeftRadius = animation.fromObject.borderBottomLeftRadius; 1220 } 1221 if (animation.fromObject.borderBottomRightRadius) { 1222 animationFromConfig.borderBottomRightRadius = animation.fromObject.borderBottomRightRadius; 1223 } 1224 if (animation.fromObject.boxShadowOffsetX && animation.fromObject.boxShadowOffsetY && animation.fromObject.boxShadowBlur && animation.fromObject.boxShadowSpread && animation.fromObject.boxShadowColor) { 1225 var boxShadowProperties = { 1226 offsetX: animation.fromObject.boxShadowOffsetX, 1227 offsetY: animation.fromObject.boxShadowOffsetY, 1228 blur: animation.fromObject.boxShadowBlur, 1229 spread: animation.fromObject.boxShadowSpread, 1230 color: animation.fromObject.boxShadowColor, 1231 }; 1232 animationFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 1233 } 1234 var filterString = ""; 1235 if (animation.fromObject.filterBlur) { 1236 filterString += `blur(${animation.fromObject.filterBlur}) `; 1237 } 1238 if (animation.fromObject.filterBrightness) { 1239 filterString += `brightness(${animation.fromObject.filterBrightness}) `; 1240 } 1241 if (animation.fromObject.filterContrast) { 1242 filterString += `contrast(${animation.fromObject.filterContrast}) `; 1243 } 1244 if (animation.fromObject.filterGrayscale) { 1245 filterString += `grayscale(${animation.fromObject.filterGrayscale}) `; 1246 } 1247 if (animation.fromObject.filterHueRotate) { 1248 filterString += `hue-rotate(${animation.fromObject.filterHueRotate}) `; 1249 } 1250 if (animation.fromObject.filterInvert) { 1251 filterString += `invert(${animation.fromObject.filterInvert}) `; 1252 } 1253 if (animation.fromObject.filterSaturate) { 1254 filterString += `saturate(${animation.fromObject.filterSaturate}) `; 1255 } 1256 if (animation.fromObject.filterSepia) { 1257 filterString += `sepia(${animation.fromObject.filterSepia}) `; 1258 } 1259 if (filterString != "") { 1260 filterString = filterString.trim();
1261 animationFromConfig.filter = filterString; 1262 } 1263 if (animation.fromObject.svgFill) { 1264 animationFromConfig.fill = animation.fromObject.svgFill; 1265 } 1266 if (animation.fromObject.svgStrokeColor) { 1267 animationFromConfig.stroke = animation.fromObject.svgStrokeColor; 1268 } 1269 if (animation.fromObject.svgStrokeWidth) { 1270 animationFromConfig.strokeWidth = animation.fromObject.svgStrokeWidth; 1271 } 1272 //Add custom properties to animation 1273 if (animation.fromObject.customProperties && animation.fromObject.customValues) { 1274 const properties = animation.fromObject.customProperties.split('d110708'); 1275 const values = animation.fromObject.customValues.split('d110708'); 1276 1277 properties.forEach((property, index) => { 1278 const value = values[index]; 1279 if (property !== "" && value !== "") { 1280 animationFromConfig[property] = value; 1281 } 1282 }); 1283 } 1284 if (animation.element != "") { 1285 //check if current container is the element to animate 1286 var elementToAnimate = animation.element; 1287 if(elementToAnimate == timeline.container){ 1288 elementToAnimate = nextContainer; 1289 if(elementToAnimate){ 1290 //SplitText 1291 if(animation.splitTextEnabled == "true"){ 1292 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 1293 type: animation.splitText, 1294 charsClass: `${animation.element}-char nb-animator-char`, 1295 wordsClass: `${animation.element}-word nb-animator-word`, 1296 linesClass: `${animation.element}-line nb-animator-line`, 1297 }); 1298 if(animation.splitText.includes('char')){ 1299 rightGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationFromConfig, 0); 1300 }else if(animation.splitText.includes('word')){ 1301 rightGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationFromConfig, 0); 1302 }else if(animation.splitText.includes('line')){ 1303 rightGSAPtimeline.from(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationFromConfig, 0); 1304 }else{ 1305 rightGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 1306 } 1307 }else{ 1308 rightGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 1309 } 1310 } 1311 }else if (document.querySelector(elementToAnimate)) { 1312 //SplitText 1313 if(animation.splitTextEnabled == "true"){ 1314 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 1315 type: animation.splitText, 1316 charsClass: `${elementToAnimate}-char nb-animator-char`, 1317 wordsClass: `${elementToAnimate}-word nb-animator-word`, 1318 linesClass: `${elementToAnimate}-line nb-animator-line`, 1319 }); 1320 if(animation.splitText.includes('char')){ 1321 rightGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromConfig, 0); 1322 }else if(animation.splitText.includes('word')){ 1323 rightGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromConfig, 0); 1324 }else if(animation.splitText.includes('line')){ 1325 rightGSAPtimeline.from(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromConfig, 0); 1326 }else{ 1327 rightGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 1328 } 1329 }else{ 1330 rightGSAPtimeline.from(elementToAnimate, animationFromConfig, 0); 1331 } 1332 } 1333 } 1334 break; 1335 case "to": 1336 var animationToConfig = { duration: Number(animation.duration) }; 1337 if (animation.delay) { 1338 animationToConfig.delay = Number(animation.delay); 1339 } 1340 if (animation.easing) { 1341 animationToConfig.ease = animation.easing; 1342 } 1343 if (animation.staggerEnabled == "true") { 1344 animationToConfig.stagger = animation.stagger; 1345 } 1346 if (animation.repeatEnabled == "true") { 1347 animationToConfig.repeat = Number(animation.repeat); 1348 } 1349 if (animation.yoyoEnabled == "true") { 1350 animationToConfig.yoyo = !0; 1351 } 1352 if (animation.toObject.opacity) { 1353 animationToConfig.opacity = animation.toObject.opacity; 1354 } 1355 if (animation.toObject.autoAlpha) { 1356 animationToConfig.autoAlpha = animation.toObject.autoAlpha; 1357 } 1358 if (animation.toObject.transformX) { 1359 animationToConfig.x = animation.toObject.transformX; 1360 } 1361 if (animation.toObject.transformY) { 1362 animationToConfig.y = animation.toObject.transformY; 1363 } 1364 if (animation.toObject.transformScale) { 1365 animationToConfig.scale = animation.toObject.transformScale; 1366 } 1367 if (animation.toObject.transformRotate) { 1368 animationToConfig.rotation = animation.toObject.transformRotate; 1369 } 1370 if (animation.toObject.transformSkewX) { 1371 animationToConfig.skewX = animation.toObject.transformSkewX; 1372 } 1373 if (animation.toObject.transformSkewY) { 1374 animationToConfig.skewY = animation.toObject.transformSkewY; 1375 } 1376 if (animation.toObject.background) { 1377 animationToConfig.backgroundColor = animation.toObject.background; 1378 } 1379 if (animation.toObject.color) { 1380 animationToConfig.color = animation.toObject.color; 1381 } 1382 if (animation.toObject.fontFamily) { 1383 animationToConfig.fontFamily = animation.toObject.fontFamily; 1384 } 1385 if (animation.toObject.fontSize) { 1386 animationToConfig.fontSize = animation.toObject.fontSize; 1387 } 1388 if (animation.toObject.fontWeight) { 1389 animationToConfig.fontWeight = animation.toObject.fontWeight; 1390 } 1391 if (animation.toObject.fontStyle) { 1392 animationToConfig.fontStyle = animation.toObject.fontStyle; 1393 } 1394 if (animation.toObject.textAlign) { 1395 animationToConfig.textAlign = animation.toObject.textAlign; 1396 } 1397 if (animation.toObject.textDecoration) { 1398 animationToConfig.textDecoration = animation.toObject.textDecoration; 1399 } 1400 if (animation.toObject.textTransform) { 1401 animationToConfig.textTransform = animation.toObject.textTransform; 1402 } 1403 if (animation.toObject.lineHeight) { 1404 animationToConfig.lineHeight = animation.toObject.lineHeight; 1405 } 1406 if (animation.toObject.letterSpacing) { 1407 animationToConfig.letterSpacing = animation.toObject.letterSpacing; 1408 } 1409 if (animation.toObject.wordSpacing) { 1410 animationToConfig.wordSpacing = animation.toObject.wordSpacing; 1411 } 1412 if (animation.toObject.width) { 1413 animationToConfig.width = animation.toObject.width; 1414 } 1415 if (animation.toObject.height) { 1416 animationToConfig.height = animation.toObject.height; 1417 } 1418 if (animation.toObject.minWidth) { 1419 animationToConfig.minWidth = animation.toObject.minWidth; 1420 } 1421 if (animation.toObject.minHeight) { 1422 animationToConfig.minHeight = animation.toObject.minHeight; 1423 } 1424 if (animation.toObject.maxWidth) { 1425 animationToConfig.maxWidth = animation.toObject.maxWidth; 1426 } 1427 if (animation.toObject.maxHeight) { 1428 animationToConfig.maxHeight = animation.toObject.maxHeight; 1429 } 1430 if (animation.toObject.paddingTop) { 1431 animationToConfig.paddingTop = animation.toObject.paddingTop; 1432 } 1433 if (animation.toObject.paddingBottom) { 1434 animationToConfig.paddingBottom = animation.toObject.paddingBottom; 1435 } 1436 if (animation.toObject.paddingLeft) { 1437 animationToConfig.paddingLeft = animation.toObject.paddingLeft; 1438 } 1439 if (animation.toObject.paddingRight) { 1440 animationToConfig.paddingRight = animation.toObject.paddingRight; 1441 } 1442 if (animation.toObject.marginTop) { 1443 animationToConfig.marginTop = animation.toObject.marginTop; 1444 } 1445 if (animation.toObject.marginBottom) { 1446 animationToConfig.marginBottom = animation.toObject.marginBottom; 1447 } 1448 if (animation.toObject.marginLeft) { 1449 animationToConfig.marginLeft = animation.toObject.marginLeft; 1450 } 1451 if (animation.toObject.marginRight) { 1452 animationToConfig.marginRight = animation.toObject.marginRight; 1453 } 1454 if (animation.toObject.positionTop) { 1455 animationToConfig.top = animation.toObject.positionTop; 1456 } 1457 if (animation.toObject.positionBottom) { 1458 animationToConfig.bottom = animation.toObject.positionBottom; 1459 } 1460 if (animation.toObject.positionLeft) { 1461 animationToConfig.left = animation.toObject.positionLeft; 1462 } 1463 if (animation.toObject.positionRight) { 1464 animationToConfig.right = animation.toObject.positionRight; 1465 } 1466 if (animation.toObject.borderColor) { 1467 animationToConfig.borderColor = animation.toObject.borderColor; 1468 } 1469 if (animation.toObject.borderStyle) { 1470 animationToConfig.borderStyle = animation.toObject.borderStyle; 1471 } 1472 if (animation.toObject.borderWidthTop) { 1473 animationToConfig.borderTopWidth = animation.toObject.borderWidthTop; 1474 } 1475 if (animation.toObject.borderWidthBottom) { 1476 animationToConfig.borderBottomWidth = animation.toObject.borderWidthBottom; 1477 } 1478 if (animation.toObject.borderWidthLeft) { 1479 animationToConfig.borderLeftWidth = animation.toObject.borderWidthLeft; 1480 } 1481 if (animation.toObject.borderWidthRight) { 1482 animationToConfig.borderRightWidth = animation.toObject.borderWidthRight; 1483 } 1484 if (animation.toObject.borderTopLeftRadius) { 1485 animationToConfig.borderTopLeftRadius = animation.toObject.borderTopLeftRadius; 1486 } 1487 if (animation.toObject.borderTopRightRadius) { 1488 animationToConfig.borderTopRightRadius = animation.toObject.borderTopRightRadius; 1489 } 1490 if (animation.toObject.borderBottomLeftRadius) { 1491 animationToConfig.borderBottomLeftRadius = animation.toObject.borderBottomLeftRadius; 1492 } 1493 if (animation.toObject.borderBottomRightRadius) { 1494 animationToConfig.borderBottomRightRadius = animation.toObject.borderBottomRightRadius; 1495 } 1496 if (animation.toObject.boxShadowOffsetX && animation.toObject.boxShadowOffsetY && animation.toObject.boxShadowBlur && animation.toObject.boxShadowSpread && animation.toObject.boxShadowColor) {
1497 var boxShadowProperties = { 1498 offsetX: animation.toObject.boxShadowOffsetX, 1499 offsetY: animation.toObject.boxShadowOffsetY, 1500 blur: animation.toObject.boxShadowBlur, 1501 spread: animation.toObject.boxShadowSpread, 1502 color: animation.toObject.boxShadowColor, 1503 }; 1504 animationToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 1505 } 1506 var filterString = ""; 1507 if (animation.toObject.filterBlur) { 1508 filterString += `blur(${animation.toObject.filterBlur}) `; 1509 } 1510 if (animation.toObject.filterBrightness) { 1511 filterString += `brightness(${animation.toObject.filterBrightness}) `; 1512 } 1513 if (animation.toObject.filterContrast) { 1514 filterString += `contrast(${animation.toObject.filterContrast}) `; 1515 } 1516 if (animation.toObject.filterGrayscale) { 1517 filterString += `grayscale(${animation.toObject.filterGrayscale}) `; 1518 } 1519 if (animation.toObject.filterHueRotate) { 1520 filterString += `hue-rotate(${animation.toObject.filterHueRotate}) `; 1521 } 1522 if (animation.toObject.filterInvert) { 1523 filterString += `invert(${animation.toObject.filterInvert}) `; 1524 } 1525 if (animation.toObject.filterSaturate) { 1526 filterString += `saturate(${animation.toObject.filterSaturate}) `; 1527 } 1528 if (animation.toObject.filterSepia) { 1529 filterString += `sepia(${animation.toObject.filterSepia}) `; 1530 } 1531 if (filterString != "") { 1532 filterString = filterString.trim(); 1533 animationToConfig.filter = filterString; 1534 } 1535 if (animation.toObject.svgFill) { 1536 animationToConfig.fill = animation.toObject.svgFill; 1537 } 1538 if (animation.toObject.svgStrokeColor) { 1539 animationToConfig.stroke = animation.toObject.svgStrokeColor; 1540 } 1541 if (animation.toObject.svgStrokeWidth) { 1542 animationToConfig.strokeWidth = animation.toObject.svgStrokeWidth; 1543 } 1544 //Add custom properties to animation 1545 if (animation.toObject.customProperties && animation.toObject.customValues) { 1546 const properties = animation.toObject.customProperties.split('d110708'); 1547 const values = animation.toObject.customValues.split('d110708'); 1548 1549 properties.forEach((property, index) => { 1550 const value = values[index]; 1551 if (property !== "" && value !== "") { 1552 animationToConfig[property] = value; 1553 } 1554 }); 1555 } 1556 if (animation.element != "") { 1557 //check if current container is the element to animate 1558 var elementToAnimate = animation.element; 1559 if(elementToAnimate == timeline.container){ 1560 elementToAnimate = nextContainer; 1561 if(elementToAnimate){ 1562 //SplitText 1563 if(animation.splitTextEnabled == "true"){ 1564 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 1565 type: animation.splitText, 1566 charsClass: `${animation.element}-char nb-animator-char`, 1567 wordsClass: `${animation.element}-word nb-animator-word`, 1568 linesClass: `${animation.element}-line nb-animator-line`, 1569 }); 1570 if(animation.splitText.includes('char')){ 1571 rightGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationToConfig, 0); 1572 }else if(animation.splitText.includes('word')){ 1573 rightGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationToConfig, 0); 1574 }else if(animation.splitText.includes('line')){ 1575 rightGSAPtimeline.to(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationToConfig, 0); 1576 }else{ 1577 rightGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 1578 } 1579 }else{ 1580 rightGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 1581 } 1582 } 1583 }else if (document.querySelector(elementToAnimate)) { 1584 //SplitText 1585 if(animation.splitTextEnabled == "true"){ 1586 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 1587 type: animation.splitText, 1588 charsClass: `${elementToAnimate}-char nb-animator-char`, 1589 wordsClass: `${elementToAnimate}-word nb-animator-word`, 1590 linesClass: `${elementToAnimate}-line nb-animator-line`, 1591 }); 1592 if(animation.splitText.includes('char')){ 1593 rightGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-char`), animationToConfig, 0); 1594 }else if(animation.splitText.includes('word')){ 1595 rightGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-word`), animationToConfig, 0); 1596 }else if(animation.splitText.includes('line')){ 1597 rightGSAPtimeline.to(document.getElementsByClassName(`${elementToAnimate}-line`), animationToConfig, 0); 1598 }else{ 1599 rightGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 1600 } 1601 }else{ 1602 rightGSAPtimeline.to(elementToAnimate, animationToConfig, 0); 1603 } 1604 } 1605 } 1606 break; 1607 case "fromto": 1608 var animationFromToToConfig = { duration: Number(animation.duration) }; 1609 if (animation.delay) { 1610 animationFromToToConfig.delay = Number(animation.delay); 1611 } 1612 if (animation.easing) { 1613 animationFromToToConfig.ease = animation.easing; 1614 } 1615 if (animation.staggerEnabled == "true") { 1616 animationFromToToConfig.stagger = animation.stagger; 1617 } 1618 if (animation.repeatEnabled == "true") { 1619 animationFromToToConfig.repeat = Number(animation.repeat); 1620 } 1621 if (animation.yoyoEnabled == "true") { 1622 animationFromToToConfig.yoyo = !0; 1623 } 1624 if (animation.fromtotoObject.opacity) { 1625 animationFromToToConfig.opacity = animation.fromtotoObject.opacity; 1626 } 1627 if (animation.fromtotoObject.autoAlpha) { 1628 animationFromToToConfig.autoAlpha = animation.fromtotoObject.autoAlpha; 1629 } 1630 if (animation.fromtotoObject.transformX) { 1631 animationFromToToConfig.x = animation.fromtotoObject.transformX; 1632 } 1633 if (animation.fromtotoObject.transformY) { 1634 animationFromToToConfig.y = animation.fromtotoObject.transformY; 1635 } 1636 if (animation.fromtotoObject.transformScale) { 1637 animationFromToToConfig.scale = animation.fromtotoObject.transformScale; 1638 } 1639 if (animation.fromtotoObject.transformRotate) { 1640 animationFromToToConfig.rotation = animation.fromtotoObject.transformRotate; 1641 } 1642 if (animation.fromtotoObject.transformSkewX) { 1643 animationFromToToConfig.skewX = animation.fromtotoObject.transformSkewX; 1644 } 1645 if (animation.fromtotoObject.transformSkewY) { 1646 animationFromToToConfig.skewY = animation.fromtotoObject.transformSkewY; 1647 } 1648 if (animation.fromtotoObject.background) { 1649 animationFromToToConfig.backgroundColor = animation.fromtotoObject.background; 1650 } 1651 if (animation.fromtotoObject.color) { 1652 animationFromToToConfig.color = animation.fromtotoObject.color; 1653 } 1654 if (animation.fromtotoObject.fontFamily) { 1655 animationFromToToConfig.fontFamily = animation.fromtotoObject.fontFamily; 1656 } 1657 if (animation.fromtotoObject.fontSize) { 1658 animationFromToToConfig.fontSize = animation.fromtotoObject.fontSize; 1659 } 1660 if (animation.fromtotoObject.fontWeight) { 1661 animationFromToToConfig.fontWeight = animation.fromtotoObject.fontWeight; 1662 } 1663 if (animation.fromtotoObject.fontStyle) { 1664 animationFromToToConfig.fontStyle = animation.fromtotoObject.fontStyle; 1665 } 1666 if (animation.fromtotoObject.textAlign) { 1667 animationFromToToConfig.textAlign = animation.fromtotoObject.textAlign; 1668 } 1669 if (animation.fromtotoObject.textDecoration) { 1670 animationFromToToConfig.textDecoration = animation.fromtotoObject.textDecoration; 1671 } 1672 if (animation.fromtotoObject.textTransform) { 1673 animationFromToToConfig.textTransform = animation.fromtotoObject.textTransform; 1674 } 1675 if (animation.fromtotoObject.lineHeight) { 1676 animationFromToToConfig.lineHeight = animation.fromtotoObject.lineHeight; 1677 } 1678 if (animation.fromtotoObject.letterSpacing) { 1679 animationFromToToConfig.letterSpacing = animation.fromtotoObject.letterSpacing; 1680 } 1681 if (animation.fromtotoObject.wordSpacing) { 1682 animationFromToToConfig.wordSpacing = animation.fromtotoObject.wordSpacing; 1683 } 1684 if (animation.fromtotoObject.width) { 1685 animationFromToToConfig.width = animation.fromtotoObject.width; 1686 } 1687 if (animation.fromtotoObject.height) { 1688 animationFromToToConfig.height = animation.fromtotoObject.height; 1689 } 1690 if (animation.fromtotoObject.minWidth) { 1691 animationFromToToConfig.minWidth = animation.fromtotoObject.minWidth; 1692 } 1693 if (animation.fromtotoObject.minHeight) { 1694 animationFromToToConfig.minHeight = animation.fromtotoObject.minHeight; 1695 } 1696 if (animation.fromtotoObject.maxWidth) { 1697 animationFromToToConfig.maxWidth = animation.fromtotoObject.maxWidth; 1698 } 1699 if (animation.fromtotoObject.maxHeight) { 1700 animationFromToToConfig.maxHeight = animation.fromtotoObject.maxHeight; 1701 } 1702 if (animation.fromtotoObject.paddingTop) { 1703 animationFromToToConfig.paddingTop = animation.fromtotoObject.paddingTop; 1704 } 1705 if (animation.fromtotoObject.paddingBottom) { 1706 animationFromToToConfig.paddingBottom = animation.fromtotoObject.paddingBottom; 1707 } 1708 if (animation.fromtotoObject.paddingLeft) { 1709 animationFromToToConfig.paddingLeft = animation.fromtotoObject.paddingLeft; 1710 } 1711 if (animation.fromtotoObject.paddingRight) { 1712 animationFromToToConfig.paddingRight = animation.fromtotoObject.paddingRight; 1713 } 1714 if (animation.fromtotoObject.marginTop) { 1715 animationFromToToConfig.marginTop = animation.fromtotoObject.marginTop; 1716 } 1717 if (animation.fromtotoObject.marginBottom) { 1718 animationFromToToConfig.marginBottom = animation.fromtotoObject.marginBottom; 1719 } 1720 if (animation.fromtotoObject.marginLeft) { 1721 animationFromToToConfig.marginLeft = animation.fromtotoObject.marginLeft; 1722 } 1723 if (animation.fromtotoObject.marginRight) { 1724 animationFromToToConfig.marginRight = animation.fromtotoObject.marginRight; 1725 } 1726 if (animation.fromtotoObject.positionTop) { 1727 animationFromToToConfig.top = animation.fromtotoObject.positionTop; 1728 } 1729 if (animation.fromtotoObject.positionBottom) { 1730 animationFromToToConfig.bottom = animation.fromtotoObject.positionBottom; 1731 } 1732 if (animation.fromtotoObject.positionLeft) { 1733 animationFromToToConfig.left = animation.fromtotoObject.positionLeft; 1734 } 1735 if (animation.fromtotoObject.positionRight) { 1736 animationFromToToConfig.right = animation.fromtotoObject.positionRight; 1737 } 1738 if (animation.fromtotoObject.borderColor) { 1739 animationFromToToConfig.borderColor = animation.fromtotoObject.borderColor; 1740 } 1741 if (animation.fromtotoObject.borderStyle) { 1742 animationFromToToConfig.
1742borderStyle = animation.fromtotoObject.borderStyle; 1743 } 1744 if (animation.fromtotoObject.borderWidthTop) { 1745 animationFromToToConfig.borderTopWidth = animation.fromtotoObject.borderWidthTop; 1746 } 1747 if (animation.fromtotoObject.borderWidthBottom) { 1748 animationFromToToConfig.borderBottomWidth = animation.fromtotoObject.borderWidthBottom; 1749 } 1750 if (animation.fromtotoObject.borderWidthLeft) { 1751 animationFromToToConfig.borderLeftWidth = animation.fromtotoObject.borderWidthLeft; 1752 } 1753 if (animation.fromtotoObject.borderWidthRight) { 1754 animationFromToToConfig.borderRightWidth = animation.fromtotoObject.borderWidthRight; 1755 } 1756 if (animation.fromtotoObject.borderTopLeftRadius) { 1757 animationFromToToConfig.borderTopLeftRadius = animation.fromtotoObject.borderTopLeftRadius; 1758 } 1759 if (animation.fromtotoObject.borderTopRightRadius) { 1760 animationFromToToConfig.borderTopRightRadius = animation.fromtotoObject.borderTopRightRadius; 1761 } 1762 if (animation.fromtotoObject.borderBottomLeftRadius) { 1763 animationFromToToConfig.borderBottomLeftRadius = animation.fromtotoObject.borderBottomLeftRadius; 1764 } 1765 if (animation.fromtotoObject.borderBottomRightRadius) { 1766 animationFromToToConfig.borderBottomRightRadius = animation.fromtotoObject.borderBottomRightRadius; 1767 } 1768 if ( 1769 animation.fromtotoObject.boxShadowOffsetX && 1770 animation.fromtotoObject.boxShadowOffsetY && 1771 animation.fromtotoObject.boxShadowBlur && 1772 animation.fromtotoObject.boxShadowSpread && 1773 animation.fromtotoObject.boxShadowColor 1774 ) { 1775 var boxShadowProperties = { 1776 offsetX: animation.fromtotoObject.boxShadowOffsetX, 1777 offsetY: animation.fromtotoObject.boxShadowOffsetY, 1778 blur: animation.fromtotoObject.boxShadowBlur, 1779 spread: animation.fromtotoObject.boxShadowSpread, 1780 color: animation.fromtotoObject.boxShadowColor, 1781 }; 1782 animationFromToToConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 1783 } 1784 var filterString = ""; 1785 if (animation.fromtotoObject.filterBlur) { 1786 filterString += `blur(${animation.fromtotoObject.filterBlur}) `; 1787 } 1788 if (animation.fromtotoObject.filterBrightness) { 1789 filterString += `brightness(${animation.fromtotoObject.filterBrightness}) `; 1790 } 1791 if (animation.fromtotoObject.filterContrast) { 1792 filterString += `contrast(${animation.fromtotoObject.filterContrast}) `; 1793 } 1794 if (animation.fromtotoObject.filterGrayscale) { 1795 filterString += `grayscale(${animation.fromtotoObject.filterGrayscale}) `; 1796 } 1797 if (animation.fromtotoObject.filterHueRotate) { 1798 filterString += `hue-rotate(${animation.fromtotoObject.filterHueRotate}) `; 1799 } 1800 if (animation.fromtotoObject.filterInvert) { 1801 filterString += `invert(${animation.fromtotoObject.filterInvert}) `; 1802 } 1803 if (animation.fromtotoObject.filterSaturate) { 1804 filterString += `saturate(${animation.fromtotoObject.filterSaturate}) `; 1805 } 1806 if (animation.fromtotoObject.filterSepia) { 1807 filterString += `sepia(${animation.fromtotoObject.filterSepia}) `; 1808 } 1809 if (filterString != "") { 1810 filterString = filterString.trim();
1811 animationFromToToConfig.filter = filterString; 1812 } 1813 if (animation.fromtotoObject.svgFill) { 1814 animationFromToToConfig.fill = animation.fromtotoObject.svgFill; 1815 } 1816 if (animation.fromtotoObject.svgStrokeColor) { 1817 animationFromToToConfig.stroke = animation.fromtotoObject.svgStrokeColor; 1818 } 1819 if (animation.fromtotoObject.svgStrokeWidth) { 1820 animationFromToToConfig.strokeWidth = animation.fromtotoObject.svgStrokeWidth; 1821 } 1822 //Add custom properties to animation 1823 if (animation.fromtotoObject.customProperties && animation.fromtotoObject.customValues) { 1824 const properties = animation.fromtotoObject.customProperties.split('d110708'); 1825 const values = animation.fromtotoObject.customValues.split('d110708'); 1826 1827 properties.forEach((property, index) => { 1828 const value = values[index]; 1829 if (property !== "" && value !== "") { 1830 animationFromToToConfig[property] = value; 1831 } 1832 }); 1833 } 1834 var animationFromToFromConfig = {}; 1835 if (animation.fromtofromObject.opacity) { 1836 animationFromToFromConfig.opacity = animation.fromtofromObject.opacity; 1837 } 1838 if (animation.fromtofromObject.autoAlpha) { 1839 animationFromToFromConfig.autoAlpha = animation.fromtofromObject.autoAlpha; 1840 } 1841 if (animation.fromtofromObject.transformX) { 1842 animationFromToFromConfig.x = animation.fromtofromObject.transformX; 1843 } 1844 if (animation.fromtofromObject.transformY) { 1845 animationFromToFromConfig.y = animation.fromtofromObject.transformY; 1846 } 1847 if (animation.fromtofromObject.transformScale) { 1848 animationFromToFromConfig.scale = animation.fromtofromObject.transformScale; 1849 } 1850 if (animation.fromtofromObject.transformRotate) { 1851 animationFromToFromConfig.rotation = animation.fromtofromObject.transformRotate; 1852 } 1853 if (animation.fromtofromObject.transformSkewX) { 1854 animationFromToFromConfig.skewX = animation.fromtofromObject.transformSkewX; 1855 } 1856 if (animation.fromtofromObject.transformSkewY) { 1857 animationFromToFromConfig.skewY = animation.fromtofromObject.transformSkewY; 1858 } 1859 if (animation.fromtofromObject.background) { 1860 animationFromToFromConfig.backgroundColor = animation.fromtofromObject.background; 1861 } 1862 if (animation.fromtofromObject.color) { 1863 animationFromToFromConfig.color = animation.fromtofromObject.color; 1864 } 1865 if (animation.fromtofromObject.fontFamily) { 1866 animationFromToFromConfig.fontFamily = animation.fromtofromObject.fontFamily; 1867 } 1868 if (animation.fromtofromObject.fontSize) { 1869 animationFromToFromConfig.fontSize = animation.fromtofromObject.fontSize; 1870 } 1871 if (animation.fromtofromObject.fontWeight) { 1872 animationFromToFromConfig.fontWeight = animation.fromtofromObject.fontWeight; 1873 } 1874 if (animation.fromtofromObject.fontStyle) { 1875 animationFromToFromConfig.fontStyle = animation.fromtofromObject.fontStyle; 1876 } 1877 if (animation.fromtofromObject.textAlign) { 1878 animationFromToFromConfig.textAlign = animation.fromtofromObject.textAlign; 1879 } 1880 if (animation.fromtofromObject.textDecoration) { 1881 animationFromToFromConfig.textDecoration = animation.fromtofromObject.textDecoration; 1882 } 1883 if (animation.fromtofromObject.textTransform) { 1884 animationFromToFromConfig.textTransform = animation.fromtofromObject.textTransform; 1885 } 1886 if (animation.fromtofromObject.lineHeight) { 1887 animationFromToFromConfig.lineHeight = animation.fromtofromObject.lineHeight; 1888 } 1889 if (animation.fromtofromObject.letterSpacing) { 1890 animationFromToFromConfig.letterSpacing = animation.fromtofromObject.letterSpacing; 1891 } 1892 if (animation.fromtofromObject.wordSpacing) { 1893 animationFromToFromConfig.wordSpacing = animation.fromtofromObject.wordSpacing; 1894 } 1895 if (animation.fromtofromObject.width) { 1896 animationFromToFromConfig.width = animation.fromtofromObject.width; 1897 } 1898 if (animation.fromtofromObject.height) { 1899 animationFromToFromConfig.height = animation.fromtofromObject.height; 1900 } 1901 if (animation.fromtofromObject.minWidth) { 1902 animationFromToFromConfig.minWidth = animation.fromtofromObject.minWidth; 1903 } 1904 if (animation.fromtofromObject.minHeight) { 1905 animationFromToFromConfig.minHeight = animation.fromtofromObject.minHeight; 1906 } 1907 if (animation.fromtofromObject.maxWidth) { 1908 animationFromToFromConfig.maxWidth = animation.fromtofromObject.maxWidth; 1909 } 1910 if (animation.fromtofromObject.maxHeight) { 1911 animationFromToFromConfig.maxHeight = animation.fromtofromObject.maxHeight; 1912 } 1913 if (animation.fromtofromObject.paddingTop) { 1914 animationFromToFromConfig.paddingTop = animation.fromtofromObject.paddingTop; 1915 } 1916 if (animation.fromtofromObject.paddingBottom) { 1917 animationFromToFromConfig.paddingBottom = animation.fromtofromObject.paddingBottom; 1918 } 1919 if (animation.fromtofromObject.paddingLeft) { 1920 animationFromToFromConfig.paddingLeft = animation.fromtofromObject.paddingLeft; 1921 } 1922 if (animation.fromtofromObject.paddingRight) { 1923 animationFromToFromConfig.paddingRight = animation.fromtofromObject.paddingRight; 1924 } 1925 if (animation.fromtofromObject.marginTop) { 1926 animationFromToFromConfig.marginTop = animation.fromtofromObject.marginTop; 1927 } 1928 if (animation.fromtofromObject.marginBottom) { 1929 animationFromToFromConfig.marginBottom = animation.fromtofromObject.marginBottom; 1930 } 1931 if (animation.fromtofromObject.marginLeft) { 1932 animationFromToFromConfig.marginLeft = animation.fromtofromObject.marginLeft; 1933 } 1934 if (animation.fromtofromObject.marginRight) { 1935 animationFromToFromConfig.marginRight = animation.fromtofromObject.marginRight; 1936 } 1937 if (animation.fromtofromObject.positionTop) { 1938 animationFromToFromConfig.top = animation.fromtofromObject.positionTop; 1939 } 1940 if (animation.fromtofromObject.positionBottom) { 1941 animationFromToFromConfig.bottom = animation.fromtofromObject.positionBottom; 1942 } 1943 if (animation.fromtofromObject.positionLeft) { 1944 animationFromToFromConfig.left = animation.fromtofromObject.positionLeft; 1945 } 1946 if (animation.fromtofromObject.positionRight) { 1947 animationFromToFromConfig.right = animation.fromtofromObject.positionRight; 1948 } 1949 if (animation.fromtofromObject.borderColor) { 1950 animationFromToFromConfig.borderColor = animation.fromtofromObject.borderColor; 1951 } 1952 if (animation.fromtofromObject.borderStyle) { 1953 animationFromToFromConfig.borderStyle = animation.fromtofromObject.borderStyle; 1954 } 1955 if (animation.fromtofromObject.borderWidthTop) { 1956 animationFromToFromConfig.borderTopWidth = animation.fromtofromObject.borderWidthTop; 1957 } 1958 if (animation.fromtofromObject.borderWidthBottom) { 1959 animationFromToFromConfig.borderBottomWidth = animation.fromtofromObject.borderWidthBottom; 1960 } 1961 if (animation.fromtofromObject.borderWidthLeft) { 1962 animationFromToFromConfig.borderLeftWidth = animation.fromtofromObject.borderWidthLeft; 1963 } 1964 if (animation.fromtofromObject.borderWidthRight) { 1965 animationFromToFromConfig.borderRightWidth = animation.fromtofromObject.borderWidthRight; 1966 } 1967 if (animation.fromtofromObject.borderTopLeftRadius) { 1968 animationFromToFromConfig.borderTopLeftRadius = animation.fromtofromObject.borderTopLeftRadius; 1969 } 1970 if (animation.fromtofromObject.borderTopRightRadius) { 1971 animationFromToFromConfig.borderTopRightRadius = animation.fromtofromObject.borderTopRightRadius; 1972 } 1973 if (animation.fromtofromObject.borderBottomLeftRadius) { 1974 animationFromToFromConfig.borderBottomLeftRadius = animation.fromtofromObject.borderBottomLeftRadius; 1975 } 1976 if (animation.fromtofromObject.borderBottomRightRadius) { 1977 animationFromToFromConfig.borderBottomRightRadius = animation.fromtofromObject.borderBottomRightRadius; 1978 } 1979 if ( 1980 animation.fromtofromObject.boxShadowOffsetX && 1981 animation.fromtofromObject.boxShadowOffsetY && 1982 animation.fromtofromObject.boxShadowBlur && 1983 animation.fromtofromObject.boxShadowSpread && 1984 animation.fromtofromObject.boxShadowColor 1985 ) {
1986 var boxShadowProperties = { 1987 offsetX: animation.fromtofromObject.boxShadowOffsetX, 1988 offsetY: animation.fromtofromObject.boxShadowOffsetY, 1989 blur: animation.fromtofromObject.boxShadowBlur, 1990 spread: animation.fromtofromObject.boxShadowSpread, 1991 color: animation.fromtofromObject.boxShadowColor, 1992 }; 1993 animationFromToFromConfig.boxShadow = `${boxShadowProperties.offsetX} ${boxShadowProperties.offsetY} ${boxShadowProperties.blur} ${boxShadowProperties.spread} ${boxShadowProperties.color}`; 1994 } 1995 var filterString = ""; 1996 if (animation.fromtofromObject.filterBlur) { 1997 filterString += `blur(${animation.fromtofromObject.filterBlur}) `; 1998 } 1999 if (animation.fromtofromObject.filterBrightness) { 2000 filterString += `brightness(${animation.fromtofromObject.filterBrightness}) `; 2001 } 2002 if (animation.fromtofromObject.filterContrast) { 2003 filterString += `contrast(${animation.fromtofromObject.filterContrast}) `; 2004 } 2005 if (animation.fromtofromObject.filterGrayscale) { 2006 filterString += `grayscale(${animation.fromtofromObject.filterGrayscale}) `; 2007 } 2008 if (animation.fromtofromObject.filterHueRotate) { 2009 filterString += `hue-rotate(${animation.fromtofromObject.filterHueRotate}) `; 2010 } 2011 if (animation.fromtofromObject.filterInvert) { 2012 filterString += `invert(${animation.fromtofromObject.filterInvert}) `; 2013 } 2014 if (animation.fromtofromObject.filterSaturate) { 2015 filterString += `saturate(${animation.fromtofromObject.filterSaturate}) `; 2016 } 2017 if (animation.fromtofromObject.filterSepia) { 2018 filterString += `sepia(${animation.fromtofromObject.filterSepia}) `; 2019 } 2020 if (filterString != "") { 2021 filterString = filterString.trim(); 2022 animationFromToFromConfig.filter = filterString; 2023 } 2024 if (animation.fromtofromObject.svgFill) { 2025 animationFromToFromConfig.fill = animation.fromtofromObject.svgFill; 2026 } 2027 if (animation.fromtofromObject.svgStrokeColor) { 2028 animationFromToFromConfig.stroke = animation.fromtofromObject.svgStrokeColor; 2029 } 2030 if (animation.fromtofromObject.svgStrokeWidth) { 2031 animationFromToFromConfig.strokeWidth = animation.fromtofromObject.svgStrokeWidth; 2032 } 2033 //Add custom properties to animation 2034 if (animation.fromtofromObject.customProperties && animation.fromtofromObject.customValues) { 2035 const properties = animation.fromtofromObject.customProperties.split('d110708'); 2036 const values = animation.fromtofromObject.customValues.split('d110708'); 2037 2038 properties.forEach((property, index) => { 2039 const value = values[index]; 2040 if (property !== "" && value !== "") { 2041 animationFromToFromConfig[property] = value; 2042 } 2043 }); 2044 } 2045 if (animation.element != "") { 2046 //check if current container is the element to animate 2047 var elementToAnimate = animation.element; 2048 if(elementToAnimate == timeline.container){ 2049 elementToAnimate = nextContainer; 2050 if(elementToAnimate){ 2051 //SplitText 2052 if(animation.splitTextEnabled == "true"){ 2053 new SplitText(elementToAnimate, elementToAnimate.querySelectorAll('*'), { 2054 type: animation.splitText, 2055 charsClass: `${animation.element}-char nb-animator-char`, 2056 wordsClass: `${animation.element}-word nb-animator-word`, 2057 linesClass: `${animation.element}-line nb-animator-line`, 2058 }); 2059 if(animation.splitText.includes('char')){ 2060 rightGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 2061 }else if(animation.splitText.includes('word')){ 2062 rightGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 2063 }else if(animation.splitText.includes('line')){ 2064 rightGSAPtimeline.fromTo(elementToAnimate.getElementsByClassName(`${animation.element}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 2065 }else{ 2066 rightGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 2067 } 2068 }else{ 2069 rightGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 2070 } 2071 } 2072 }else if (document.querySelector(elementToAnimate)) { 2073 //SplitText 2074 if(animation.splitTextEnabled == "true"){ 2075 new SplitText(document.querySelectorAll(`${elementToAnimate}, ${elementToAnimate} *`), { 2076 type: animation.splitText, 2077 charsClass: `${elementToAnimate}-char nb-animator-char`, 2078 wordsClass: `${elementToAnimate}-word nb-animator-word`, 2079 linesClass: `${elementToAnimate}-line nb-animator-line`, 2080 }); 2081 if(animation.splitText.includes('char')){ 2082 rightGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-char`), animationFromToFromConfig, animationFromToToConfig, 0); 2083 }else if(animation.splitText.includes('word')){ 2084 rightGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-word`), animationFromToFromConfig, animationFromToToConfig, 0); 2085 }else if(animation.splitText.includes('line')){ 2086 rightGSAPtimeline.fromTo(document.getElementsByClassName(`${elementToAnimate}-line`), animationFromToFromConfig, animationFromToToConfig, 0); 2087 }else{ 2088 rightGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 2089 } 2090 }else{ 2091 rightGSAPtimeline.fromTo(elementToAnimate, animationFromToFromConfig, animationFromToToConfig, 0); 2092 } 2093 } 2094 } 2095 break; 2096 } 2097 } 2098 if (leftGSAPtimeline != "") { 2099 timeline.leftAnimations.forEach(function (animation) {
2100 if(animation.element == timeline.container){ 2101 return; 2102 }else{ 2103 createLeftAnimation(animation); 2104 } 2105 }); 2106 } 2107 if (rightGSAPtimeline != "") { 2108 timeline.rightAnimations.forEach(function (animation) { 2109 if(animation.element == timeline.container){ 2110 return; 2111 }else{ 2112 createRightAnimation(animation); 2113 } 2114 }); 2115 } 2116 2117 var transition = { 2118 name: `transition${index}`, 2119 async leave(data) { 2120 const done = this.async(); 2121 2122 timeline.leftAnimations.forEach(function (animation) { 2123 if(animation.animation.element != timeline.container){ 2124 return; 2125 }else{ 2126 createLeftAnimation(animation, data.current.container); 2127 } 2128 }); 2129 2130 leftGSAPtimeline.restart(); 2131 await delay(parseFloat(timeline.delay) * 1000); 2132 done(); 2133 }, 2134 async enter(data) { 2135 timeline.rightAnimations.forEach(function (animation) { 2136 if(animation.animation.element != timeline.container){ 2137 return; 2138 }else{ 2139 createRightAnimation(animation, data.next.container); 2140 } 2141 }); 2142 2143 rightGSAPtimeline.restart(); 2144 }, 2145 }; 2146 if (timeline.routefrom && timeline.routeto) { 2147 const myRoutes = [ 2148 { path: timeline.routefrom, name: `routeFrom${index}` }, 2149 { path: timeline.routeto, name: `routeTo${index}` }, 2150 ]; 2151 dynamicRoutes[`myRoutes${index}`] = myRoutes; 2152 transition.from = { route: [`routeFrom${index}`] }; 2153 transition.to = { route: [`routeTo${index}`] }; 2154 } 2155 transitionsArray.push(transition); 2156 }); 2157 }); 2158 const allRoutes = []; 2159 Object.keys(dynamicRoutes).forEach((key) => { 2160 allRoutes.push(...dynamicRoutes[key]); 2161 }); 2162 barba.use(barbaRouter, { routes: allRoutes }); 2163 barba.init({ sync: !0, transitions: transitionsArray }); 2164 function delay(n) { 2165 n = n || 0; 2166 return new Promise((done) => { 2167 setTimeout(() => { 2168 done(); 2169 }, n); 2170 }); 2171 } 2172 barba.hooks.beforeEnter(({ next }) => { 2173 let triggers = ScrollTrigger.getAll(); 2174 triggers.forEach((trigger) => { 2175 trigger.kill(); 2176 }); 2177 const matches = next.html.match(/<body.+?class="([^""]*)"/i); 2178 document.body.setAttribute("class", (matches && matches.at(1)) ?? ""); 2179 const nextEl = next; 2180 if (nextEl) { 2181 var htmlString = nextEl.html; 2182 var tempDiv = document.createElement("div"); 2183 tempDiv.innerHTML = htmlString; 2184 var links = tempDiv.getElementsByTagName("link"); 2185 var styles = tempDiv.getElementsByTagName("style"); 2186 function loadStylesheet(href, id, rel, type) { 2187 var existingStylesheet = document.querySelector(`link[href="${href}"]`); 2188 if (!existingStylesheet) { 2189 var stylesheet = document.createElement("link"); 2190 stylesheet.href = href; 2191 stylesheet.id = id; 2192 stylesheet.rel = rel; 2193 stylesheet.type = type; 2194 document.head.appendChild(stylesheet); 2195 } 2196 } 2197 function loadStyle(styleContent) { 2198 var existingStyles = document.querySelectorAll("style"); 2199 var exists = Array.from(existingStyles).some((style) => style.innerHTML === styleContent); 2200 if (!exists) { 2201 var styleElement = document.createElement("style"); 2202 styleElement.innerHTML = styleContent; 2203 document.head.appendChild(styleElement); 2204 } 2205 } 2206 function removeUnusedElements(existingElements, newElements, tagName) { 2207 for (var k = 0; k < existingElements.length; k++) { 2208 var existingElement = existingElements[k]; 2209 var existsInNewElements = Array.from(newElements).some((newElement) => { 2210 if (tagName === "link") { 2211 return existingElement.href === newElement.href; 2212 } else if (tagName === "style") { 2213 return existingElement.innerHTML === newElement.innerHTML; 2214 } 2215 return !1; 2216 }); 2217 if (!existsInNewElements) { 2218 existingElement.parentNode.removeChild(existingElement); 2219 } 2220 } 2221 } 2222 for (var i = 0; i < links.length; i++) { 2223 var link = links[i]; 2224 if (link.href) { 2225 loadStylesheet(link.href, link.id, link.rel, link.type); 2226 } 2227 } 2228 for (var j = 0; j < styles.length; j++) { 2229 var style = styles[j]; 2230 if (style.innerHTML) { 2231 loadStyle(style.innerHTML); 2232 } 2233 } 2234 var existingLinks = document.querySelectorAll("link"); 2235 removeUnusedElements(existingLinks, links, "link"); 2236 var existingStyles = document.querySelectorAll("style"); 2237 removeUnusedElements(existingStyles, styles, "style"); 2238 } 2239 }); 2240 barba.hooks.after(() => { 2241 if (document.querySelector(".bc-3dswap-title")) { 2242 threed_swap_title(); 2243 } 2244 if (document.querySelector(".atropos-inner")) { 2245 threedhover(); 2246 } 2247 if (document.querySelector(".bc-anyside-button")) { 2248 anysidebutton(); 2249 } 2250 if (document.querySelector(".bc-back-to-top")) { 2251 backtotop(); 2252 } 2253 if (document.querySelector(".bc-before-after-image")) { 2254 beforeafter_image(); 2255 } 2256 if (document.querySelector(".bc-blended-title")) { 2257 blended_title(); 2258 } 2259 if (document.querySelector(".bc-bubbles")) { 2260 bubbles(); 2261 } 2262 if (document.querySelector(".bc-circular-title")) { 2263 circular_title(); 2264 } 2265 if (document.querySelector(".bc-click-and-copy")) { 2266 clickandcopy(); 2267 } 2268 if (document.querySelector(".bc-codepen")) { 2269 bc_codepen(); 2270 } 2271 if (document.querySelector(".bc-core-burguer")) { 2272 coreburguer(); 2273 } 2274 if (document.querySelector(".bc-core-slider-wrapper")) { 2275 coreslider(); 2276 } 2277 if (document.querySelector(".bc-core-tabs")) { 2278 coretabs(); 2279 } 2280 if (document.querySelector(".bc-counter")) { 2281 bc_counter(); 2282 } 2283 if (document.querySelector(".bc-crystal-button")) { 2284 crystalbutton(); 2285 } 2286 if (document.querySelector(".bc-cursor")) {
2287 cursor(); 2288 } 2289 if (document.querySelector(".bc-dark-mode")) { 2290 nightmode(); 2291 } 2292 if (document.querySelector(".bc-decode-hover")) { 2293 decodehover(); 2294 } 2295 if (document.querySelector(".bc-decode-reveal")) { 2296 decode_reveal(); 2297 } 2298 if (document.querySelector(".bc-divider")) { 2299 bc_divider(); 2300 } 2301 if (document.querySelector(".bc-drawer")) { 2302 bc_drawer(); 2303 } 2304 if (document.querySelector(".bc-exchange-title")) { 2305 exchange_title(); 2306 } 2307 if (document.querySelector(".wrapper-bc-expander")) { 2308 bcexpander(); 2309 } 2310 if (document.querySelector(".bc-expanding-menu")) { 2311 expanding_menu(); 2312 } 2313 if (document.querySelector(".bc-flipbox")) { 2314 flipbox(); 2315 } 2316 if (document.querySelector(".bc-fuid-gradient")) { 2317 bc_fluid_gradient(); 2318 } 2319 if (document.querySelector(".bc-list-glitchys")) { 2320 glitchy(); 2321 } 2322 if (document.querySelector(".nb-pixels-shimmer-card")) { 2323 next_pixels_shimmer_card(); 2324 } 2325 if (document.querySelector(".nb-text-shimmer")) { 2326 next_text_shimmer(); 2327 } 2328 if (document.querySelector(".nb-countdown")) { 2329 next_countdown(); 2330 } 2331 if (document.querySelector(".nb-shiny-button")) { 2332 next_shiny_button(); 2333 } 2334 if (document.querySelector(".nb-dynamic-island")) { 2335 next_dynamic_island(); 2336 } 2337 if (document.querySelector(".nb-focus-nav")) { 2338 next_focus_nav(); 2339 } 2340 if (document.querySelector(".nb-counter-v2")) { 2341 next_counter_v2(); 2342 } 2343 if (document.querySelector(".nb-infinite-slider")) { 2344 next_infinite_slider(); 2345 } 2346 if (document.querySelector(".bc-glowing-card")) { 2347 bc_glowing_card(); 2348 } 2349 if (document.querySelector(".bc-gradiently")) { 2350 bc_gradiently(); 2351 } 2352 if (document.querySelector(".bc-grained")) { 2353 grained(); 2354 } 2355 if (document.querySelector(".bc-image-hotspots")) { 2356 imagehotspots(); 2357 } 2358 if (document.querySelector(".bc-img-reveal")) { 2359 image_reveal(); 2360 } 2361 if (document.querySelector(".bc-infinite-title")) { 2362 bc_infinite_title(); 2363 } 2364 if (document.querySelector(".bc-letter-launcher")) { 2365 letter_launcher(); 2366 } 2367 if (document.querySelector(".bc-lottie")) { 2368 bclottie(); 2369 } 2370 if (document.querySelector(".bc-mask-button")) { 2371 maskbutton(); 2372 } 2373 if (document.querySelector(".bc-media")) { 2374 bc_media(); 2375 } 2376 if (document.querySelector(".bc-microbox-button")) { 2377 microbox_button(); 2378 } 2379 if (document.querySelector(".bc-morphing-menu")) { 2380 morphingmenu(); 2381 } 2382 if (document.querySelector(".bc-mousefill-title")) { 2383 bc_mousefill_title(); 2384 } 2385 if (document.querySelector(".bc-multi-offcanvas-menu")) { 2386 multioffcanvasmenu(); 2387 } 2388 if (document.querySelector(".bc-observer")) { 2389 observer(); 2390 } 2391 if (document.querySelector(".bc-offcanvas-menu")) { 2392 offcanvasmenu(); 2393 } 2394 if (document.querySelector(".bc-overlay-menu")) { 2395 overlaymenu(); 2396 } 2397 if (document.querySelector(".bc-parallax")) { 2398 parallax(); 2399 } 2400 if (document.querySelector(".bc-random-letters")) { 2401 random_letters(); 2402 } 2403 if (document.querySelector(".bc-scribble-title")) { 2404 scribbletitle(); 2405 } 2406 if (document.querySelector(".bc-scroll-cascading")) { 2407 bc_scroll_cascading(); 2408 } 2409 if (document.querySelector(".bc-scroll-gradient")) { 2410 bc_scroll_gradient(); 2411 } 2412 if (document.querySelector(".bc-scroll-reading")) { 2413 scroll_reading(); 2414 } 2415 if (document.querySelector(".bc-spinner")) { 2416 bc_spinner(); 2417 } 2418 if (document.querySelector(".bc-split-button")) { 2419 bc_split_button(); 2420 } 2421 if (document.querySelector(".bc-stickynav-menu")) { 2422 stickynavmenu(); 2423 } 2424 if (document.querySelector(".bc-stripe")) {
2425 stripemegamenu(); 2426 } 2427 if (document.querySelector(".bc-svg-title")) { 2428 svgtitle(); 2429 } 2430 if (document.querySelector(".bc-swap-title")) { 2431 swap_hover(); 2432 } 2433 if (document.querySelector(".bc-list-tippys")) { 2434 tippys(); 2435 } 2436 if (document.querySelector(".bc-twist-title")) { 2437 twist_title(); 2438 } 2439 if (document.querySelector(".bc-typed")) { 2440 bc_typed(); 2441 } 2442 if (document.querySelector(".bc-unfold-hover")) { 2443 bc_unfold_hover(); 2444 } 2445 if (document.querySelector(".bc-unfold-reveal")) { 2446 unfoldreveal(); 2447 } 2448 if (document.querySelector(".bc-video-sequence")) { 2449 videosequence(); 2450 } 2451 if (document.querySelector(".bc-zoom-lens")) { 2452 zoom_lens(); 2453 } 2454 if (document.querySelector(".next-arrow-icon")) { 2455 next_arrow_icon(); 2456 } 2457 if (document.querySelector(".next-dropdown-mega-menu")) { 2458 next_dropdown_mega_menu(); 2459 } 2460 if (document.querySelector(".next-dropdown")) { 2461 next_dropdown(); 2462 } 2463 if (document.querySelector(".next-horizontal-scroll")) { 2464 next_horizontal_scroll(); 2465 } 2466 if (document.querySelector(".next-lamp")) { 2467 next_lamp(); 2468 } 2469 if (document.querySelector(".next-marquee-button-v2")) { 2470 marquee_button_v2(); 2471 } 2472 if (document.querySelector(".next-particles")) { 2473 next_particles(); 2474 } 2475 if (document.querySelector(".next-physics")) { 2476 next_physics(); 2477 } 2478 if (document.querySelector(".next-ripple-button-v2")) { 2479 ripple_button_v2(); 2480 } 2481 if (document.querySelector(".next-timeline")) { 2482 next_timeline(); 2483 } 2484 if (document.querySelector(".next-ripple-button-v3")) { 2485 ripple_button_v3(); 2486 } 2487 if (document.querySelector(".next-toc")) { 2488 next_table_of_contents(); 2489 } 2490 if (document.querySelector(".next-spotlight-v2")) { 2491 next_spotlight_v2(); 2492 } 2493 if (document.querySelector(".bc-reel")) { 2494 marquee(); 2495 } 2496 if (document.querySelector(".bc-blade-title")) { 2497 blade_title(); 2498 } 2499 if (document.querySelector(".bc-smooth-scroll-data")) { 2500 smoothscroll(); 2501 } 2502 if (document.querySelector(".bc-data-scrollbar")) { 2503 scrollbar(); 2504 } 2505 if (document.querySelector(".bc-sharer")) { 2506 sharer(); 2507 } 2508 if (document.querySelector(".nb-circular-menu")) { 2509 next_circular_menu(); 2510 } 2511 if (document.querySelector(".next-cookies")) { 2512 next_cookies_front(); 2513 } 2514 if (document.querySelector(".next-progress-bar")) { 2515 next_progress_bar(); 2516 } 2517 if (document.querySelector(".next-qr-code")) { 2518 next_qr_code(); 2519 } 2520 if (document.querySelector(".next-dock-menu")) { 2521 next_dock_menu(); 2522 } 2523 if (document.querySelector(".next-blur-reveal")) { 2524 next_blur_reveal(); 2525 } 2526 if (document.querySelector(".next-blur-reading")) { 2527 next_blur_reading(); 2528 } 2529 if (document.querySelector(".next-cta-nav")) { 2530 next_cta_nav(); 2531 } 2532 if (document.querySelector(".next-meteors")) { 2533 next_meteors(); 2534 } 2535 if (document.querySelector(".next-fluids")) { 2536 next_fluids(); 2537 } 2538 if (document.querySelector(".next-tiles")) { 2539 next_tiles(); 2540 } 2541 if (document.querySelector(".next-stacking-cards")) { 2542 next_stacking_cards(); 2543 } 2544 if (document.querySelector(".next-designer-cursor")) { 2545 next_designer_cursor(); 2546 } 2547 if (document.querySelector(".next-cursor-slide")) { 2548 next_cursor_slide(); 2549 } 2550 if (document.querySelector(".next-parallax-slider")) { 2551 next_parallax_slider(); 2552 } 2553 if (document.querySelector(".next-interactive-divider")) { 2554 next_interactive_divider(); 2555 } 2556 includeCustomJS(); 2557 }); 2558 function includeCustomJS() { 2559 let customJsCode = data_pagetransitions.customjs.replace(/\\/g, ""); 2560 eval(customJsCode); 2561 } 2562}
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.