https://simraceshop.de/plugins/dzm_resources/frontend/js/dzm-videoTitle.js?v=5.3.8

1class DZMVideoHeroPlayer{
2    constructor(){
3        this.videoHeroPlayers = [];
4
5        this.selectors = {
6            play: ".dzm-videoTitle-play>svg",
7            playtext: ".dzm-videoTitle-playText",
8            videoHeroPlayer: "#dzm-videoTitle-video-container",
9            backgroundVideo: "#dzm-videoTitle-backgroundvideo",
10            mainVideo: "#dzm-videoTitle-mainvideo",
11            container: ".dzm-videoTitle-mainvideo-container",
12            text: ".dzm-videoTitle-text",
13            button: ".dzm-videoTitle-play",
14            closeButton: ".dzm-video-close",
15        }
16        this.timer;
17        this.fadeInBuffer = false;
18    }
19
20    init(){
21        this.videoHeroPlayers = document.querySelectorAll(this.selectors.videoHeroPlayer);
22
23        this.videoHeroPlayers.forEach(videoHeroPlayer=>{
24            let play = videoHeroPlayer.querySelector(this.selectors.play)
25            let playtext = videoHeroPlayer.querySelector(this.selectors.playtext)
26            let backgroundVideo = videoHeroPlayer.querySelector(this.selectors.backgroundVideo)
27            let mainVideo = videoHeroPlayer.querySelector(this.selectors.mainVideo)
28            let container = videoHeroPlayer.querySelector(this.selectors.container)
29            let text = videoHeroPlayer.querySelector(this.selectors.text)
30            let button = videoHeroPlayer.querySelector(this.selectors.button)
31            let closeButton = videoHeroPlayer.querySelector(this.selectors.closeButton)
32
33
34            play.addEventListener("click",(e) => {
35                this.playVideo(e, backgroundVideo, mainVideo, container, text, button)
36            })
37            playtext.addEventListener("click",(e) => {
38                this.playVideo(e, backgroundVideo, mainVideo, container, text, button)
39            })
40            closeButton.addEventListener("click", (e) => {
41                this.closeVideo(e, backgroundVideo, mainVideo, container, text, button)
42            })
43
44
45            if (/Mobi/.test(navigator.userAgent)) {
46                // The device is a mobile device
47                videoHeroPlayer.addEventListener("touchstart", (e) => {
48                    closeButton.style.display = '';
49                    setTimeout(function() {
50                        closeButton.style.display = 'none';
51                    }, 3000);
52                })
53            } else {
54                // The device is a desktop device
55                videoHeroPlayer.addEventListener('mousemove', (e) => {
56                    this.fadeOut(e, closeButton)
57                })
58            }
59
60
61
62        })
63    }
64
65    playVideo(e, backgroundVideo, mainVideo, container, text, button){
66        e.preventDefault()
67
68        container.style.bottom = 0;
69        text.style.transform = "translateX(-200px)";
70        text.style.opacity = 0;
71        button.style.transform = "translateX(200px)";
72        button.style.opacity = 0;
73        backgroundVideo.pause();
74        mainVideo.style.zIndex = "1";
75        mainVideo.muted = false;
76        mainVideo.preload = "auto";
77        mainVideo.load();
78        setTimeout(() => {
79            mainVideo.play();
80
81        }, 2000);
82        mainVideo.onended = () => {
83            this.closeVideo(e, backgroundVideo, mainVideo, container, text, button)
84        }
85
86    }
87
88    closeVideo(e, backgroundVideo, mainVideo, container, text, button){
89        mainVideo.style.zIndex = "0";
90        mainVideo.muted = true;
91
92        container.style.bottom = "100%";
93        backgroundVideo.play();
94        text.style.transform = "translateX(0)";
95        text.style.opacity = 1;
96        button.style.transform = "translateX(0)";
97        button.style.opacity = 1;
98    }
99
100    fadeOut(e, closeButton){
101        if (!this.fadeInBuffer) {
102            if (this.timer) {
103                clearTimeout(this.timer);
104                this.timer = 0;
105            }
106            closeButton.style.display = '';
107        } else {
108            this.fadeInBuffer = false;
109        }
110
111        this.timer = setTimeout(function() {
112            closeButton.style.display = 'none';
113            this.fadeInBuffer = true;
114        }, 3000);
115    }
116}
117
118let videoHeroPlayers = new DZMVideoHeroPlayer();
119videoHeroPlayers.init()