1window.addEventListener('load', onLoad); 2gsap.registerPlugin(ScrollTrigger); 3function onLoad() { 4 $headerplx(); 5 $pinnedbackgroundimage(); 6 $bigsmallimage_pin(); 7 $bigsmallimage_plx(); 8 $sidebarheadlines_fixedsidebar(); 9 $sidebarheadlines_fixedheadlines(); 10 $sidebarheadlines_changeheadlines(); 11 $parallaximage(); 12 $headerslider(); 13 $mainnavslider(); 14 $productcarousel(); 15 $productgallery(); 16 $imageslider(); 17} 18 19// HAS TOUCHSCREEN 20var hasTouchScreen = false; 21if ("maxTouchPoints" in navigator) { 22 hasTouchScreen = navigator.maxTouchPoints > 0; 23} else if ("msMaxTouchPoints" in navigator) { 24 hasTouchScreen = navigator.msMaxTouchPoints > 0; 25} else { 26 var mQ = window.matchMedia && matchMedia("(pointer:coarse)"); 27 if (mQ && mQ.media === "(pointer:coarse)") { 28 hasTouchScreen = !!mQ.matches; 29 } else if ('orientation' in window) { 30 hasTouchScreen = true; // deprecated, but good fallback 31 } else { 32 // Only as a last resort, fall back to user agent sniffing 33 var UA = navigator.userAgent; 34 hasTouchScreen = ( 35 /\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(UA) || 36 /\b(Android|Windows Phone|iPad|iPod)\b/i.test(UA) 37 ); 38 } 39} 40 41// SMOOTH SCROLLING 42/* 43 if(!hasTouchScreen){ 44 const scroller = document.querySelector('#root'); 45 const bodyScrollBar = Scrollbar.init(scroller,{damping:0.1,renderByPixels:!0,continuousScrolling:!1}); 46 ScrollTrigger.scrollerProxy("#root",{ 47 scrollTop(value){ 48 if(arguments.length){bodyScrollBar.scrollTop = value;} 49 return bodyScrollBar.scrollTop; 50 } 51 }); 52 bodyScrollBar.addListener(ScrollTrigger.update); 53 ScrollTrigger.defaults({scroller:scroller}); 54 }else{ 55 $('html').addClass('touchscreen'); 56 } 57 */ 58 59 60 61// VIMEO GRID 62$('.bg-img').each(function () { 63 var t = $(this); 64 var src = t.attr('src'); 65 t.ready(function () { 66 t.parent().css('backgroundImage', 'url(' + src + ')'); 67 }); 68}); 69 70 71$('.vimeovideogrid .img,.the-video-img').click(function () { 72 console.log('clicked'); 73 var videoiFrame = $(this).siblings('iframe'), 74 video = new Vimeo.Player(videoiFrame); 75 $(this).hide(); 76 $(this).parent().parent().find('h3').hide(); 77 video.play(); 78 video.setVolume(1); 79 $(this).css('background','transparent'); 80}); 81 82 83$('.the-slider-video').click(function() 84{ 85 console.log('clicked2'); 86 var img = $(this).find('.img'); 87 88 var videoiFrame = $(img).siblings('iframe'), 89 video = new Vimeo.Player(videoiFrame); 90 $(img).hide(); 91 $(img).parent().parent().find('h3').hide(); 92 video.play(); 93 video.setVolume(1); 94 $(img).css('background','transparent'); 95 96 $(videoiFrame).css('z-index','7'); 97 98}); 99 100 101var pauseButton = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve"><metadata> Svg Vector Icons : http://www.onlinewebfonts.com/icon </metadata><g><g><g><path d="M500,990C229.8,990,10,770.2,10,500C10,229.8,229.8,10,500,10c270.2,0,490,219.8,490,490C990,770.2,770.2,990,500,990z M500,69.3C262.5,69.3,69.3,262.5,69.3,500c0,237.5,193.2,430.7,430.7,430.7c237.5,0,430.7-193.2,430.7-430.7C930.7,262.5,737.5,69.3,500,69.3z"/><rect x="549.2" y="314.7" width="59.3" height="378.7"/><rect x="391.5" y="314.7" width="59.3" height="378.8"/></g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></g></svg>'; 102var playButton = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 60 60" style="enable-background:new 0 0 60 60;" xml:space="preserve"><path d="M45.563,29.174l-22-15c-0.307-0.208-0.703-0.231-1.031-0.058C22.205,14.289,22,14.629,22,15v30 c0,0.371,0.205,0.711,0.533,0.884C22.679,45.962,22.84,46,23,46c0.197,0,0.394-0.059,0.563-0.174l22-15 C45.836,30.64,46,30.331,46,30S45.836,29.36,45.563,29.174z M24,43.107V16.893L43.225,30L24,43.107z"></path><path d="M30,0C13.458,0,0,13.458,0,30s13.458,30,30,30s30-13.458,30-30S46.542,0,30,0z M30,58C14.561,58,2,45.439,2,30 S14.561,2,30,2s28,12.561,28,28S45.439,58,30,58z"></path></svg>'; 103 104$('.vimeovideogrid .inner .item .i').click(function () { 105 106 var videoiFrame = $(this).find('iframe'); 107 video = new Vimeo.Player(videoiFrame); 108 $(this).find('.img').css('background','transparent'); 109 110 111 $(this).find('img').css('display','none'); 112 $(this).find('iframe').css('z-index','10'); 113 114 $(this).prev('h3').hide(); 115 $(this).find('.img svg').remove(); 116 117 if($(this).hasClass('play')) 118 { 119 video.pause(); 120 $(this).removeClass('play'); 121 $(this).find('.img').append(playButton); 122 } 123 else 124 { 125 video.play(); 126 $(this).addClass('play'); 127 $(this).find('.img').append(pauseButton); 128 } 129}); 130 131 132 133// VIMEO BUTTON 134 135$('.vimeobutton .play').on('click', function () { 136 $(this).closest('.vimeobutton').find('.iframe').slideDown(); 137 var videoiFrame = $(this).closest('.vimeobutton').find('iframe'), 138 video = new Vimeo.Player(videoiFrame); 139 video.play(); 140 video.setVolume(1); 141 $(this).closest('.vimeobutton').find('.vimeobutton__play').addClass('hide'); 142$(this).closest('.vimeobutton').find('.vimeobutton__close').removeClass('hide'); 143 144}); 145 146$('.vimeobutton .vimeobutton__close').on('click', function () { 147 $(this).closest('.vimeobutton').find('.iframe').slideUp(); 148 var videoiFrame = $(this).closest('.vimeobutton').find('iframe'), 149 video = new Vimeo.Player(videoiFrame); 150 video.pause(); 151 video.setVolume(0); 152 $(this).closest('.vimeobutton').find('.vimeobutton__close').addClass('hide'); 153$(this).closest('.vimeobutton').find('.vimeobutton__play').removeClass('hide'); 154 155}); 156 157 158// COOKIES 159function setCookie(cname, cvalue, exdays) { 160 var d = new Date(); 161 d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); 162 var expires = "expires=" + d.toUTCString(); 163 document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; 164} 165 166//POPUPFORM 167$('button.plz').on('click', function () { 168 var $plz = $('.popupform input.plz').val(); 169 //alert('$plz'); // Zum testen 170 $('.modal.roadtrip .plz input').val($plz); 171 $('.modal.roadtrip').css("display", "flex"); 172 $('.modal.roadtrip').hide(); 173 $('.modal.roadtrip').fadeIn(); 174}); 175 176$('button.close').on('click', function () { 177 $('.modal.roadtrip').hide(); 178 $('.modal.roadtrip').fadeOut(); 179}); 180 181/*function getCookie(cname){ 182 var name = cname + "="; 183 var decodedCookie = decodeURIComponent(document.cookie); 184 var ca = decodedCookie.split(';'); 185 for(var i = 0; i <ca.length; i++) { 186 var c = ca[i]; 187 while (c.charAt(0) == ' '){ 188 c = c.substring(1); 189 } 190 if (c.indexOf(name) == 0){ 191 return c.substring(name.length, c.length); 192 } 193 } 194 return ""; 195 }*/ 196$('#revokeCookies').click(function () {
197 setCookie('acceptedCookies', '', 0); 198 setCookie('acceptedNecessaryCookies', '', 0); 199 $('#cookies').fadeIn(250); 200 $('#optional-scripts').html(''); 201}); 202/* 203 $.ajax({ 204 type: 'POST', 205 url: '/wp-content/themes/remjnd/contents/includes/vimeo-script.php', 206 success: function (data) { 207 $("#optional-scripts").html(data); 208 } 209 });*/ 210 211function cookiesAccepted() 212{ 213 $('#cookies').fadeOut(250); 214 setCookie('acceptedCookies', 'yes', 182); 215 setCookie('acceptedNecessaryCookies', '', 182); 216 $.ajax({ 217 type: 'POST', 218 url: '/wp-content/themes/remjnd/contents/includes/optional-scripts.php', 219 success: function (data) { 220 $("#optional-scripts").html(data); 221 } 222 }); 223 $('newsfield.news-video, .section.video .wrapper, #video .wrapper').each(function () { 224 var t = $(this), 225 $input = t.find('input.video-id'), 226 $videoid = $input.val(); 227 t.find('.cookiebanner').remove(); 228 $input.remove(); 229 /*if ($.isNumeric($videoid)) { 230 t.html('<div class="inner"><iframe src="https://player.vimeo.com/video/' + $videoid + '?color=7ebab5&title=0&byline=0&portrait=0?dnt=1" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe></div>'); 231 } else { 232 t.html('<div class="inner"><iframe src="https://www.youtube-nocookie.com/embed/' + $videoid + '" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>') 233 }*/ 234 }); 235} 236 237$('.acceptCookies').click(function () { 238 239 cookiesAccepted(); 240 //$("#promotion").modal({ 241 // fadeDuration: 100 242 //}); 243 244}); 245 246cookiesAccepted(); 247 $('#cookies').css('display','none'); 248 249// MAINNAV 250$('#mainnav .mainnav ul.cf > li.menu-item-has-children > a').click(function (e) { 251 "use strict"; 252 if ($(window).width() < 1000) { 253 e.preventDefault(); 254 $(this).parent().addClass('open').parent().parent().addClass('hidden'); 255 } 256}); 257$('#mainnav .mainnav ul.cf > li.menu-item-has-children > ul').prepend('<li class="back"><a href="#" title="Eine Ebene zurück">Zurück</a></li>'); 258$('#mainnav .mainnav ul.cf > li.menu-item-has-children li.back a').on('click', function (e) { 259 "use strict"; 260 e.preventDefault(); 261 $(this).parent().parent().parent().removeClass('open').parent().parent().removeClass('hidden'); 262}); 263$('#toggle-mainnav, #mainnav-overlay').click(function () { 264 "use strict"; 265 $('html').toggleClass('mainnav-open'); 266 $('#mainnav *').removeClass('hidden').removeClass('open'); 267}); 268 269 270$(document).ready(function ($) { 271 var pgurl = window.location.href; 272 $(".subnav ul.news li").each(function () { 273 if ($(this).find('a').attr("href") == pgurl || $(this).find('a').attr("href") == '') 274 $(this).addClass("current_page_parent"); 275 }) 276}); 277 278// INFONAV & INFOTEXT 279$('#open-infonav').click(function () { 280 $('#infonav').toggle(); 281}); 282$('#open-infotext').click(function () { 283 $('#infotext').toggle(); 284}); 285 286 287// SCROLL TO HASH 288$(window).on('load', function () { 289 if (window.location.hash) { 290 var $navH = $('#mainnav').outerHeight(), 291 hash = window.location.hash, 292 $hash = $(hash), 293 oT = $hash.offset().top; 294 $('html, body').scrollTop(0); 295 $('html, body').stop().delay(300).animate({'scrollTop': oT - $navH}, 600); 296 } 297}); 298 299 300// HIDE AND SHOW NAVBAR ON SCROLL 301var prev = 0; 302var $window = $(window); 303var nav = $('#mainnav'); 304var btn = $('.stickybutton'); 305 306$window.on('scroll', function () { 307 var scrollTop = $window.scrollTop(); 308 nav.toggleClass('hidden', scrollTop > prev); 309 btn.toggleClass('hidden', scrollTop > prev); 310 prev = scrollTop; 311}); 312 313 314 315$(window).scroll(function () { 316 var sT = $(window).scrollTop(); 317 318 if (sT > 100) { 319 $('html').addClass('scrolled-100'); 320 } else { 321 $('html').removeClass('scrolled-100'); 322 } 323}); 324 325// HEADER 326function $headerplx() { 327 /*ScrollTrigger.matchMedia({"(min-width: 801px)":function(){ 328 $('#header.header-image, #header.header-video, #header.header-slider').each(function(){ 329 var t = $(this); 330 gsap.to(t,{scrollTrigger:{ 331 trigger: t, 332 start: 'top 100px', 333 end: 'bottom top', 334 scrub: true, 335 anticipatePin: 1, 336 invalidateOnRefresh: true 337 },y:'50%',ease:'power0'}); 338 }); 339 }});*/ 340} 341; 342 343// PINNED BACKGROUND IMAGE 344function $pinnedbackgroundimage() { 345 $('.pinnedbackgroundimage').each(function () { 346 var t = $(this); 347 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 348 gsap.to(t.find('img'), {scrollTrigger: { 349 trigger: t, 350 start: 'top top', 351 end: '+300', 352 toggleActions: 'restart resume reverse reset', 353 scrub: true 354 }, opacity: 0.1, y: '-10vh', ease: 'quint.out'}); 355 }, "(max-width: 799px)": function () { 356 gsap.to(t.find('img'), {scrollTrigger: { 357 trigger: t, 358 start: 'top top', 359 end: '+300', 360 toggleActions: 'restart resume reverse reset', 361 scrub: false 362 }, opacity: 0.1, duration: 1, ease: 'quint.out'}); 363 }}); 364 ScrollTrigger.create({ 365 trigger: t, 366 start: 'top top', 367 end: '+99999', 368 pin: true, 369 anticipatePin: 1, 370 pinSpacing: false 371 }); 372 }); 373} 374 375// ACCORDION 376$('.accordion h4').on('click', function () { 377 $(this).parent().toggleClass('open').siblings().removeClass('open'); 378}); 379 380// BIG + SMALL IMAGE 381function $bigsmallimage_pin() { 382 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 383 $('.bigsmallimage .inner').each(function () { 384 var t = $(this); 385 gsap.to(t.find('img.pin'), {scrollTrigger: { 386 trigger: t, 387 start: 'top 50%', 388 end: 'bottom 50%', 389 scrub: true, 390 anticipatePin: 1, 391 invalidateOnRefresh: true 392 }, y: () => t.find('img.big').height() - t.find('img.pin').height() + 'px', ease: 'sine.inOut'}); 393 }); 394 }}); 395} 396function $bigsmallimage_plx() { 397 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 398 $('.bigsmallimage').each(function () { 399 var t = $(this), 400 animation = gsap.timeline({ 401 scrollTrigger: { 402 trigger: t, 403 start: 'top bottom', 404 end: 'bottom top', 405 scrub: true, 406 anticipatePin: 1, 407 invalidateOnRefresh: true 408 }, 409 }); 410 animation.fromTo(t.find('img.plx'), {y: () => t.find('img.big').height() - t.find('img.plx').height() + 'px'}, {y: 0, ease: 'power0'}); 411 }); 412 }}); 413} 414 415// SIDEBAR HEADLINES 416function $sidebarheadlines_fixedsidebar() { 417 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 418 $('.sidebarheadlines.fixedsidebar').each(function () { 419 var t = $(this); 420 ScrollTrigger.create({ 421 trigger: t.find('.sidebar'), 422 start: 'top 200px', 423 end: () => '+' + t.find('.content').height() - 200 - t.find('.sidebar').outerHeight() + 'px', 424 pin: true, 425 pinSpacing: false, 426 invalidateOnRefresh: true 427 }); 428 t.find('.content .item:not(:last-child)').each(function () { 429 var t = $(this); 430 ScrollTrigger.create({ 431 trigger: t, 432 start: 'top 50%', 433 end: 'bottom 50%', 434 toggleActions: 'play reverse reverse reverse', 435 toggleClass: {targets: t, className: "active"} 436 }); 437 }); 438 var t2 = t.find('.content .item:last-child'); 439 ScrollTrigger.create({ 440 trigger: t2, 441 start: 'top 50%', 442 end: '+999999px', 443 toggleActions: 'play reverse none reverse', 444 toggleClass: {targets: t2, className: "active"} 445 }); 446 t.find('.sidebar h3:not(:last-child)').each(function () { 447 var t = $(this), 448 i = t.index() + 1; 449 ScrollTrigger.create({ 450 trigger: t.parent().parent().parent().find('.item:nth-child(' + i + ')'), 451 start: 'top 50%', 452 end: 'bottom 50%', 453 toggleActions: 'play reverse none reverse', 454 toggleClass: {targets: t, className: "active"} 455 }); 456 }); 457 var t3 = t.find('.sidebar h3:last-child'), 458 i = t3.index() + 1; 459 ScrollTrigger.create({ 460 trigger: t3.parent().parent().parent().find('.item:nth-child(' + i + ')'), 461 start: 'top 50%', 462 end: '+999999px', 463 toggleActions: 'play reverse none reverse', 464 toggleClass: {targets: [t3], className: "active"} 465 }); 466 }); 467 }, "(max-width: 800px)": function () { 468 $('.sidebarheadlines.fixedsidebar').each(function () { 469 var t = $(this); 470 ScrollTrigger.create({ 471 trigger: t.find('.sidebar'), 472 start: 'top 100px', 473 endTrigger: t.find('.content'), 474 end: 'bottom 100px', 475 pin: true, 476 pinSpacing: false, 477 invalidateOnRefresh: true 478 }); 479 t.find('.content .item:not(:last-child)').each(function () { 480 var t = $(this); 481 ScrollTrigger.create({ 482 trigger: t, 483 start: 'top 70%', 484 end: 'bottom 70%', 485 toggleActions: 'play reverse reverse reverse', 486 toggleClass: {targets: t, className: "active"} 487 }); 488 }); 489 var t2 = t.find('.content .item:last-child'); 490 ScrollTrigger.create({ 491 trigger: t2, 492 start: 'top 70%', 493 end: '+999999px', 494 toggleActions: 'play reverse none reverse', 495 toggleClass: {targets: t2, className: "active"} 496 }); 497 t.find('.sidebar h3:not(:last-child)').each(function () { 498 var t = $(this), 499 i = t.index() + 1; 500 ScrollTrigger.create({ 501 trigger: t.parent().parent().parent().find('.item:nth-child(' + i + ')'), 502 start: 'top 70%', 503 end: 'bottom 70%', 504 toggleActions: 'play reverse none reverse', 505 toggleClass: {targets: t, className: "active"} 506 }); 507 }); 508 var t3 = t.find('.sidebar h3:last-child'), 509 i = t3.index() + 1; 510 ScrollTrigger.create({ 511 trigger: t3.parent().parent().parent().find('.item:nth-child(' + i + ')'), 512 start: 'top 70%', 513 end: '+999999px', 514 toggleActions: 'play reverse none reverse', 515 toggleClass: {targets: [t3], className: "active"} 516 }); 517 var t4 = t.find('.sidebar h3:first-child'), 518 i = t4.index() + 2; 519 ScrollTrigger.create({ 520 trigger: t4.parent().parent().parent().find('.item:nth-child(' + i + ')'), 521 start: 'top 70%', 522 end: '+999999px', 523 toggleActions: 'play reverse none reverse', 524 toggleClass: {targets: [t4], className: "hidden"} 525 }); 526 }); 527 }}); 528} 529function $sidebarheadlines_changeheadlines() { 530 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 531 $('.sidebarheadlines.changeheadlines').each(function () { 532 var t = $(this); 533 ScrollTrigger.create({ 534 trigger: t.find('.sidebar'), 535 start: 'top 50%', 536 endTrigger: t.find('.content'), 537 end: 'bottom 50%', 538 pin: true, 539 pinSpacing: false, 540 invalidateOnRefresh: true 541 }); 542 t.find('.content .item:not(:last-child)').each(function () { 543 var t = $(this); 544 ScrollTrigger.create({ 545 trigger: t, 546 start: 'top 50%', 547 end: 'bottom 50%', 548 toggleActions: 'play reverse reverse reverse', 549 toggleClass: {targets: t, className: "active"} 550 }); 551 }); 552 var t2 = t.find('.content .item:last-child'); 553 ScrollTrigger.create({ 554 trigger: t2, 555 start: 'top 50%', 556 end: '+999999px', 557 toggleActions: 'play reverse none reverse', 558 toggleClass: {targets: t2, className: "active"} 559 }); 560 t.find('.sidebar h3:not(:last-child)').each(function () { 561 var t = $(this), 562 i = t.index() + 1; 563 ScrollTrigger.create({ 564 trigger: t.parent().parent().parent().find('.item:nth-child(' + i + ')'), 565 start: 'top 50%', 566 end: 'bottom 50%', 567 toggleActions: 'play reverse none reverse', 568 toggleClass: {targets: t, className: "active"} 569 }); 570 }); 571 var t3 = t.find('.sidebar h3:last-child'), 572 i = t3.index() + 1; 573 ScrollTrigger.create({ 574 trigger: t3.parent().parent().parent().find('.item:nth-child(' + i + ')'), 575 start: 'top 50%', 576 end: '+999999px', 577 toggleActions: 'play reverse none reverse', 578 toggleClass: {targets: [t3], className: "active"} 579 }); 580 var t4 = t.find('.sidebar h3:first-child'), 581 i = t4.index() + 2; 582 ScrollTrigger.create({ 583 trigger: t4.parent().parent().parent().find('.item:nth-child(' + i + ')'), 584 start: 'top 50%', 585 end: '+999999px', 586 toggleActions: 'play reverse none reverse', 587 toggleClass: {targets: [t4], className: "hidden"} 588 }); 589 gsap.to(t.find('h3'), {scrollTrigger: { 590 trigger: t, 591 start: 'top 50%', 592 endTrigger: t.find('.content'), 593 end: 'bottom 50%', 594 scrub: true, 595 anticipatePin: 1, 596 invalidateOnRefresh: true 597 }, y: '-100%', ease: 'power0'}); 598 }); 599 }, "(max-width: 800px)": function () { 600 $('.sidebarheadlines.changeheadlines').each(function () { 601 var t = $(this); 602 ScrollTrigger.create({ 603 trigger: t.find('.sidebar'), 604 start: 'top 100px', 605 endTrigger: t.find('.content'), 606 end: 'bottom 150px', 607 pin: true
607, 608 pinSpacing: false, 609 invalidateOnRefresh: true 610 }); 611 t.find('.content .item:not(:last-child)').each(function () { 612 var t = $(this); 613 ScrollTrigger.create({ 614 trigger: t, 615 start: 'top 70%', 616 end: 'bottom 70%', 617 toggleActions: 'play reverse reverse reverse', 618 toggleClass: {targets: t, className: "active"} 619 }); 620 }); 621 var t2 = t.find('.content .item:last-child'); 622 ScrollTrigger.create({ 623 trigger: t2, 624 start: 'top 70%', 625 end: '+999999px', 626 toggleActions: 'play reverse none reverse', 627 toggleClass: {targets: t2, className: "active"} 628 }); 629 t.find('.sidebar h3:not(:last-child)').each(function () { 630 var t = $(this), 631 i = t.index() + 1; 632 ScrollTrigger.create({ 633 trigger: t.parent().parent().parent().find('.item:nth-child(' + i + ')'), 634 start: 'top 70%', 635 end: 'bottom 70%', 636 toggleActions: 'play reverse none reverse', 637 toggleClass: {targets: t, className: "active"} 638 }); 639 }); 640 var t3 = t.find('.sidebar h3:last-child'), 641 i = t3.index() + 1; 642 ScrollTrigger.create({ 643 trigger: t3.parent().parent().parent().find('.item:nth-child(' + i + ')'), 644 start: 'top 70%', 645 end: '+999999px', 646 toggleActions: 'play reverse none reverse', 647 toggleClass: {targets: [t3], className: "active"} 648 }); 649 var t4 = t.find('.sidebar h3:first-child'), 650 i = t4.index() + 2; 651 ScrollTrigger.create({ 652 trigger: t4.parent().parent().parent().find('.item:nth-child(' + i + ')'), 653 start: 'top 70%', 654 end: '+999999px', 655 toggleActions: 'play reverse none reverse', 656 toggleClass: {targets: [t4], className: "hidden"} 657 }); 658 }); 659 }}); 660} 661function $sidebarheadlines_fixedheadlines() { 662 ScrollTrigger.matchMedia({"(min-width: 801px)": function () { 663 $('.sidebarheadlines.fixedheadlines .item').each(function () { 664 var t = $(this); 665 ScrollTrigger.create({ 666 trigger: t, 667 start: 'top 150px', 668 end: () => '+' + t.height() - t.find('h3').outerHeight() - 150 + 'px', 669 pin: t.find('h3'), 670 pinSpacing: false, 671 invalidateOnRefresh: true 672 }); 673 }); 674 }, "(max-width: 800px)": function () { 675 $('.sidebarheadlines.fixedheadlines .item').each(function () { 676 var t = $(this); 677 ScrollTrigger.create({ 678 trigger: t, 679 start: 'top 100px', 680 end: () => '+' + t.height() - t.find('h3').outerHeight() - 30 + 'px', 681 pin: t.find('h3'), 682 pinSpacing: false, 683 invalidateOnRefresh: true 684 }); 685 }); 686 } 687 }); 688} 689 690// PARALLAX IMAGE 691function $parallaximage() { 692 $('.parallaximage').each(function () { 693 var t = $(this).find('img'); 694 gsap.to(t, {scrollTrigger: { 695 trigger: t, 696 start: 'top bottom', 697 end: 'bottom top', 698 scrub: true 699 }, bottom: '-50%', ease: 'power0'}); 700 }); 701} 702 703// HEADER SLIDER 704function $headerslider() { 705 $('.header-slider:not(.dont-slide)').slick({ 706 dots: false, 707 autoplay: true, 708 autoplaySpeed: 4000, 709 arrows: true, 710 slide: '.slide', 711 touchThreshold: 10, 712 }); 713} 714 715// MAINNAV SLIDER 716function $mainnavslider() { 717 $('.mainnav-slider').slick({ 718 dots: true,
719 arrows: false 720 }); 721} 722 723// IMAGE SLIDER 724function $imageslider() { 725 $('.imageslider .slides').slick({ 726 adaptiveHeight: true 727 }); 728} 729 730 731 732 733// PRODUCT CAROUSEL 734function $productcarousel() { 735 $('.productcarousel .products').slick({ 736 infinite: false, 737 slidesToShow: 4, 738 slidesToScroll: 4, 739 responsive: [{ 740 breakpoint: 770, 741 settings: { 742 infinite: false, 743 slidesToShow: 2.5, 744 slidesToScroll: 2, 745 arrows: false, 746 dots: true 747 }}, 748 { 749 breakpoint: 420, 750 settings: { 751 slidesToShow: 1.5, 752 slidesToScroll: 1, 753 arrows: false, 754 dots: true 755 } 756 }] 757 }); 758} 759 760// PRODUCT SINGLE GALLERY 761function $productgallery() { 762 $('.product-gallery .main .inner').slick({ 763 slidesToShow: 1, 764 slidesToScroll: 1, 765 asNavFor: '.product-gallery .thumbs .inner', 766 infinite: true, 767 adaptiveHeight: true, 768 arrows: false 769 }); 770 $('.product-gallery .thumbs .inner').slick({ 771 slidesToShow: 100, 772 slidesToScroll: 1, 773 asNavFor: '.product-gallery .main .inner', 774 focusOnSelect: true, 775 infinite: true, 776 vertical: true, 777 arrows: false, 778 lazyLoad: 'ondemand', 779 responsive: [{ 780 breakpoint: 800, 781 settings: { 782 vertical: false, 783 draggable: false 784 } 785 }] 786 }); 787 $(document).ready(function () { 788 $('.product-gallery .main img').parent().zoom({on: 'click', touch: false}); 789 }); 790} 791 792 793// SEARCH 794$('#toggle-search').on('click', function () { 795 $('#search').slideToggle(200); 796 $('div.asl_w .probox .proinput input[type=search]').focus(); 797}); 798 799// SHOPNAV MOBILE 800$('#toggle-subnavmobile').on('click', function () { 801 $('.subnavmobile ul').slideToggle(200); 802}); 803 804 805 806$(window).on('load', function () { 807 $(".team ul.cf li").each(function () { 808 $(this).on('click', function () { 809 var i = $(this).index() + 1; 810 var i2 = $(this).parent().parent().parent().index('.team') + 1; 811 $('.team-overlays-wrapper .team-overlays:nth-child(' + i2 + ') ul.cf li:nth-child(' + i + ')').fadeIn(300); 812 }); 813 }); 814 815 $('.team-overlays ul.cf li').on('click', function () { 816 $(this).fadeOut(300); 817 }); 818}); 819 820$(document).on('click','.menu-btn', function(){ 821 $(this).toggleClass('active'); 822 $(this).next('.wrapper').slideToggle('fast'); 823}); 824 825 826/* 827setTimeout(function() 828{ 829 if($(window).width()<575 && $('#check-size-on-mobile').length>0) 830 { 831 var height = parseInt($('#check-size-on-mobile').css('height'))-100; 832 833 $('#check-size-on-mobile').css('height',height+'px'); 834 } 835},3000);*/ 836 837 838 839 840/* 841 842 const maxRot = 50; 843 const setRotX = gsap.quickSetter(".followcursor", "x", "px"); 844 const setRotY = gsap.quickSetter(".followcursor", "y", "px"); 845 846 gsap.set(".followcursor", {transformOrigin: "center center"}); 847 848 let getPercent; 849 function resize() { 850 getPercent = gsap.utils.mapRange(0, innerWidth, -1, 1); 851 } 852 853 window.addEventListener("mousemove", e => { 854 const percentX = getPercent(e.pageX); 855 const percentY = getPercent(e.pageY); 856 setRotX(percentX * maxRot); 857 setRotY(percentY * maxRot); 858 }); 859 860 window.addEventListener("resize", resize); 861 resize(); 862 863 */ 864 865 866/* 867 $(document).mousemove(function(event){ 868 $(".wrapper").each(function(index, element){ 869 var xPos = (event.clientX/$(window).width())-0.5, 870 yPos = (event.clientY/$(window).height())-0.5, 871 box = element; 872 873 TweenLite.to(box, 0.6, { 874 rotationY: xPos * 100, 875 rotationX: -yPos * 100, 876 ease: Power4.easeOut, 877 }); 878 879 }) 880 }); 881 */ 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896/* 897 let proxy = { y: 0 }, 898 ySetter = gsap.quickSetter(".wrapper", "y", "px"), // fast 899 clamp = gsap.utils.clamp(-200, 200); // don't let the y go beyond 20 degrees. 900 901 ScrollTrigger.create({ 902 onUpdate: (self) => { 903 let y = clamp(self.getVelocity() / 25); 904 if (Math.abs(y) > Math.abs(proxy.y)) { 905 proxy.y = y; 906 gsap.to(proxy, {y: 0, duration: 2, ease: "power4.out", overwrite: true, onUpdate: () => ySetter(proxy.y)}); 907 } 908 } 909 }); 910 911 gsap.set('.wrapper', {transformOrigin: "right center", force3D: true}); 912 */ 913 914 915 916 917 918 919 920/* 921 922 function $scrubvideo(){ 923 924 925 var canvas = document.getElementById("canvas"); 926 var context = canvas.getContext("2d"); 927 928 canvas.width = 1920; 929 canvas.height = 1080; 930 931 const frameCount = 144; 932 const currentFrame = index => ( 933 // `https://www.apple.com/105/media/us/airpods-pro/2019/1299e2f5_9206_4470_b28e_08307a42f19b/anim/sequence/large/01-hero-lightpass/${(index + 1).toString().padStart(4, '0')}.jpg`
934 `http://master21.remjnd.com/wp-content/themes/remjnd/primetest/primetest-${(index + 1).toString().padStart(3, '0')}.jpg` 935 ); 936 937 const images = [] 938 const airpods = { 939 frame: 0 940 }; 941 942 for (let i = 0; i < frameCount; i++) { 943 const img = new Image(); 944 img.src = currentFrame(i); 945 images.push(img); 946 } 947 948 gsap.to(airpods, { 949 frame: frameCount - 1, 950 snap: "frame", 951 scrollTrigger: { 952 trigger: '#canvas-wrapper', 953 start: "top top", 954 end:'+1500px', 955 scrub: 0.5 956 }, 957 onUpdate: render 958 }); 959 960 961 ScrollTrigger.create({ 962 trigger: "#canvas-wrapper", 963 start: 'top top', 964 end: '+1500px', 965 pin: true, 966 anticipatePin: 1, 967 pinSpacing: true 968 }); 969 970 images[0].onload = render; 971 972 function render() { 973 context.clearRect(0, 0, canvas.width, canvas.height); 974 context.drawImage(images[airpods.frame], 0, 0); 975 } 976 */ 977 978 979 980 981 982 983 984 985 986 987 988 989/* 990 gsap.registerPlugin(ScrollTrigger); 991 //ScrollTrigger.saveStyles(".move, .line, .fade-fromMarginRight, .fade-fromMarginLeft"); 992 993 const rows = 15; 994 const columns = 10; 995 const missingImages = 3; // The number of missing images in the last row 996 const frame_count = rows * columns - missingImages - 1; 997 const imageWidth = 11580; 998 const imageHeight = 11550; 999 const horizDiff = imageWidth / columns; 1000 const vertDiff = imageHeight / rows; 1001 1002 gsap.set(".viewer-one", {width: horizDiff, height: vertDiff}); 1003 1004 const setPos = gsap.quickSetter(".viewer-one", "background-position"); 1005 1006 const obj = {num: 0}; 1007 gsap.to(obj, { 1008 num: frame_count, 1009 ease: "steps(" + frame_count + ")", 1010 scrollTrigger: { 1011 trigger: ".section-one", 1012 start: "top top", 1013 end: "+=" + imageHeight, 1014 pin: true, 1015 anticipatePin: 1, 1016 scrub: 1 1017 }, 1018 onUpdate: () => setPos(` 1019 ${-Math.round((obj.num % columns) * horizDiff)}px 1020 ${-Math.round(Math.floor(obj.num / columns) * vertDiff)}px 1021 `) 1022 }); 1023 1024 1025 */ 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042/* 1043 1044 var spriteSheet = { 1045 width: 165, 1046 height: 292, 1047 total: 64, 1048 cols: 12, 1049 rows: 6, 1050 duration: 1 1051 }; 1052 1053 var tl = gsap.timeline({ 1054 scrollTrigger: { 1055 scrub: 0.25 1056 } 1057 }); 1058 1059 tl.from(".container", { 1060 scale: 0.5, 1061 duration: 0.25 1062 }, 0) 1063 .to(".container", { 1064 scale: 0.5, 1065 duration: 0.25 1066 }, 0.75) 1067 1068 for (var i = 0; i < spriteSheet.total; i++) { 1069 tl.set(".frames", { 1070 x: (i % spriteSheet.cols) * -spriteSheet.width, 1071 y: Math.floor(i / spriteSheet.cols) * -spriteSheet.height 1072 }, i / (spriteSheet.total - 1) * spriteSheet.duration); 1073 } 1074 } 1075 */
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.