1(function ($) { 2 "use strict"; 3 4 gsap.registerPlugin(ScrollTrigger); 5 // DOM Content Loaded (pure JS) 6 7 jQuery(document).ready(function () { 8 setTimeout(function () { 9 initGSAP(); 10 faqSlider(); 11 valueSlider(); 12 appDownloadEventHandler(); 13 }, 1000); // 1 second delay 14 }); 15 16 17 /** 18 * Create GSAP timeline and retuns it 19 * @param {object} trigger 20 * @param {integer} duration 21 * @param {integer} stagger 22 * @param {string} ease 23 * @param {boolean} showMarkers Show markers 24 * @returns 25 */ 26 const createGsapTimeline = (trigger, duration, stagger, ease, showMarkers = false) => { 27 28 const animationSection = gsap.timeline({ 29 scrollTrigger: { 30 trigger: trigger, 31 start: "top bottom-=25%", 32 end: 'bottom bottom-=25%', 33 markers: showMarkers 34 }, 35 defaults: { 36 ease: ease, 37 duration: duration, 38 stagger: stagger, 39 } 40 }); 41 42 return animationSection; 43 } 44 45 /** 46 * Activate index page GSAP animations 47 */ 48 const initGSAP = () => { 49 50 heroGSAP('.hero-section', false); 51 manualGSAP('.manual-section', false); 52 fadeInGSAP('.faq-section', '.faq', false); 53 fadeInGSAP('.value-section', '.value', false); 54 moreGSAP('.more-section', false); 55 56 } 57 58 /** 59 * GSAP animation for hero section 60 * @param {string} trigger 61 * @param {boolean} markers Show markers 62 */ 63 const heroGSAP = (trigger, markers = false) => { 64 65 const animationSection = createGsapTimeline(trigger, 1.5, 0, "expo.out", markers); 66 67 animationSection 68 .from(`${trigger} .hero-content_blinking`, { opacity: 0, xPercent: -20, }, 0) 69 .from(`${trigger} .hero-content_car`, { xPercent: 200, yPercent: -50, scaleX: 0.5, scaleY: 0.5 }, 0) 70 .from(`${trigger} .hero-content_btn a`, { opacity: 0, scaleX: 0.5, scaleY: 0.5, transformOrigin: "50% 50%" }, 0.8) 71 72 } 73 74 /** 75 * GSAP animation for fadeing section in 76 * @param {string} trigger 77 * @param {string} section 78 * @param {boolean} markers Show markers 79 */ 80 const fadeInGSAP = (trigger, section, markers = false) => { 81 82 const animationSection = createGsapTimeline(trigger, 1, 0, "expo.out", markers); 83 84 animationSection 85 .from(`${trigger} ${section}-container`, { opacity: 0, yPercent: 5, }, 0) 86 87 } 88 89 /** 90 * GSAP animation for more section 91 * @param {string} trigger 92 * @param {boolean} markers Show markers 93 */ 94 const moreGSAP = (trigger, markers = false) => { 95 96 const animationSection = createGsapTimeline(trigger, 1.5, 0, "expo.out", markers); 97 98 ScrollTrigger.matchMedia({ 99 100 // big 101 "(min-width: 768px)": function () { 102 animationSection 103 .from(`${trigger} .more-content_car`, { xPercent: 200, scaleX: 0.8, scaleY: 0.8 }, 0) 104 .from(`${trigger} .more-content_left`, { opacity: 0, xPercent: -20, }, 0.2) 105 .from(`${trigger} .more-content_btn a`, { scaleX: 0.9, scaleY: 0.9, transformOrigin: "50% 50%" }, 0.2) 106 107 }, 108 109 // small 110 "(max-width: 767px)": function () { 111 animationSection 112 .from(`${trigger} .more-content_left`, { opacity: 0, yPercent: 20, }, 0) 113 .from(`${trigger} .more-content_car`, { opacity: 0, scaleX: 0.95, scaleY: 0.95 }, 0) 114 .from(`${trigger} .more-content_btn a`, { scaleX: 0.9, scaleY: 0.9, transformOrigin: "50% 50%" }, 0.2) 115 116 } 117 118 }); 119 120 } 121 122 /** 123 * GSAP animation for manual blocks 124 * @param {string} trigger 125 * @param {boolean} markers Show markers 126 */ 127 const manualGSAP = (trigger, markers = false) => { 128 129 const animationSection = createGsapTimeline(trigger, 0.5, 0.4, "power1.In", markers); 130 131 ScrollTrigger.matchMedia({ 132 133 // big 134 "(min-width: 578px)": function () { 135 animationSection 136 .from(`${trigger} .manual-title`, { ease: "expo.Out", opacity: 0, duration: 1 }, 0) 137 .from(`${trigger} .manual-content_left`, { ease: "expo.Out", opacity: 0, xPercent: -20, }, 0) 138 .from(`${trigger} .manual-list_item-img`, { opacity: 0, scaleX: 0.8, scaleY: 0.8 }, 0) 139 .from(`${trigger} .manual-list_item-text`, { ease: "none", opacity: 0, xPercent: -1 }, 0) 140 .from(`${trigger} .manual-list_item-line`, { height: 0, opacity: 0 }, 0.1) 141 }, 142 143 // small 144 "(max-width: 576px)": function () { 145 animationSection 146 .from(`${trigger} .manual-title`, { ease: "expo.Out", opacity: 0, duration: 1 }, 0) 147 .from(`${trigger} .manual-content_left`, { ease: "expo.Out", opacity: 0 }, 0) 148 .from(`${trigger} .manual-list_item-img`, { opacity: 0, scaleX: 0.8, scaleY: 0.8 }, 0) 149 .from(`${trigger} .manual-list_item-text`, { ease: "none", opacity: 0, yPercent: -20 }, 0) 150 .from(`${trigger} .manual-list_item-line`, { height: 0, opacity: 0 }, 0.1) 151 } 152 153 }); 154 155 } 156 157 158 const faqSlider = () => { 159 $('.faq-slider').slick({ 160 infinite: true, 161 dots: true, 162 slidesToShow: 1, 163 slidesToScroll: 1, 164 adaptiveHeight: true 165 }); 166 } 167 168 const valueSlider = () => { 169 $('.value-slider').slick({ 170 infinite: true, 171 dots: true, 172 slidesToShow: 3, 173 slidesToScroll: 1, 174 adaptiveHeight: true, 175 responsive: [ 176 { 177 breakpoint: 768, 178 settings: { 179 slidesToShow: 2, 180 }, 181 }, 182 { 183 breakpoint: 577, 184 settings: { 185 slidesToShow: 1, 186 }, 187 }, 188 ], 189 }); 190 } 191 192 const appDownloadEventHandler = () => { 193 194 $('.market-link').on('click', function (e) { 195 196 e.preventDefault(); 197 198 const device = getMobileOperatingSystem(); 199 200 if (device == 'iOS') { 201 window.location.href = "https://itunes.apple.com/lt/app/spark-your-electric-drive/id1095645824?mt=8"; 202 } else if (device == 'iOS') { 203 window.location.href = "https://itunes.apple.com/lt/app/spark-your-electric-drive/id1095645824?mt=8"; 204 } else if (device == 'Android') { 205 customPopupShow(); 206 } else if (device == 'Windows Phone') { 207 customPopupShow(); 208 } else { 209 customPopupShow(); 210 } 211 }); 212 213 } 214 215 /** 216* Determine the mobile operating system. 217* This function returns one of 'iOS', 'Android', 'Windows Phone', or 'unknown'. 218* 219* @returns {String} 220*/ 221 function getMobileOperatingSystem() { 222 var userAgent = navigator.userAgent || navigator.vendor || window.opera; 223 224 // Windows Phone must come first because its UA also contains "Android" 225 if (/windows phone/i.test(userAgent)) { 226 return "Windows Phone"; 227 } 228 229 if (/android/i.test(userAgent)) { 230 return "Android"; 231 } 232 233 // iOS detection from: http://stackoverflow.com/a/9039885/177710 234 if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) { 235 return "iOS"; 236 } 237 238 return "unknown"; 239 } 240 241 242 /** 243 * Modal popup function 244 */ 245 246 function customPopupShow() { 247 248 const modal = $('.popup'); 249 const close = $('.popup-close__link');
250 const overlay = $('.popup-overlay'); 251 252 if (modal.length && modal.hasClass('show')) { 253 254 // Show popup section 255 modal.addClass('active'); 256 $('body').css("overflow", "hidden"); 257 258 259 // Show modal window 260 setTimeout(function () { 261 $('.popup-container').addClass('animatedFromTop'); 262 }, 200); 263 } 264 265 // Close modal window on overlay click 266 overlay.on('click touchstart', function () { 267 $('.popup').removeClass('active'); 268 $('.popup-container').removeClass('animatedFromTop'); 269 $('body').css("overflow", "auto"); 270 }); 271 272 // Close modal window on overlay click 273 close.on('click touchstart', function () { 274 $('.popup').removeClass('active'); 275 $('.popup-container').removeClass('animatedFromTop'); 276 $('body').css("overflow", "auto"); 277 }); 278 279 } 280 281 282 283 284})(jQuery);
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.