https://dfence.ru/bitrix/templates/aspro-allcorp3/js/video_banner.js

1var players = {};
2
3function pauseMainBanner() {
4  // $(".banners-big .owl-carousel").trigger("stop.owl.autoplay");
5  $(".banners-big .main-slider").data("swiper").autoplay.stop();
6}
7
8function playMainBanner() {
9  /*$(".banners-big .owl-carousel").trigger("play.owl.autoplay");
10  if ($(".banners-big .owl-carousel").is(":hover")) {
11    $(".banners-big .owl-carousel").trigger("mouseover.owl.autoplay");
12  }
13  */
14  if ($(".banners-big .main-slider").data("swiper").params.autoplay.enabled) {
15    $(".banners-big .main-slider").data("swiper").autoplay.start();
16  }
17}
18
19function nextSlideMainBanner() {
20  $(".banners-big .main-slider").data("swiper").slideNext();
21}
22
23function startMainBannerSlideVideo($slide) {
24  var slideActiveIndex = $slide.attr("data-slide_index");
25  var $slides = $slide.closest(".main-slider").find('.main-slider__item[data-slide_index="' + slideActiveIndex + '"]'); // current slide & cloned
26  var videoSource = $slide.attr("data-video_source");
27
28  if (videoSource) {
29    $slides.addClass("loading");
30    pauseMainBanner();
31
32    // var $slider = $slide.closest(".owl-carousel");
33    var $slider = $slide.closest(".main-slider");
34    var slidesIndexesWithVideo = $slider.data("slidesIndexesWithVideo");
35    if (typeof slidesIndexesWithVideo === "undefined") {
36      slidesIndexesWithVideo = [];
37    }
38    slidesIndexesWithVideo.push(slideActiveIndex);
39    $slider.data("slidesIndexesWithVideo", slidesIndexesWithVideo);
40
41    var videoPlayerSrc = $slide.attr("data-video_src");
42    var videoSoundDisabled = $slide.attr("data-video_disable_sound");
43    var bVideoSoundDisabled = videoSoundDisabled == 1;
44    var videoLoop = $slide.attr("data-video_loop");
45    var bVideoLoop = videoLoop == 1;
46    var bVideoAutoPlay = $slide.attr("data-video_autoplay") == 1;
47    var videoCover = $slide.attr("data-video_cover");
48    var bVideoCover = videoCover == 1;
49    var videoUnderText = $slide.attr("data-video_under_text");
50    var bVideoUnderText = videoUnderText == 1;
51    var videoPlayer = $slide.attr("data-video_player");
52    var bVideoPlayerYoutube = videoPlayer === "YOUTUBE";
53    var bVideoPlayerVimeo = videoPlayer === "VIMEO";
54    var bVideoPlayerRutube = videoPlayer === "RUTUBE";
55    var bVideoPlayerHtml5 = videoPlayer === "HTML5";
56    var videoWidth = bVideoPlayerHtml5 ? false : $slide.attr("data-video_width");
57    var videoHeight = bVideoPlayerHtml5 ? false : $slide.attr("data-video_height");
58
59    if (videoPlayerSrc && !$slide.find(".video").length) {
60      var InitPlayer = function () {
61        // prepare videoID
62        var videoIDs = [];
63        for (var i = 0; i < $slides.length; ++i) {
64          var videoID = getRandomInt(100, 1000);
65          videoIDs.push(videoID);
66        }
67
68        $slides.each(function (i, node) {
69          var $_slide = $(node);
70          var videoID = videoIDs[i];
71          var videoClass = $_slide.attr("id") + " player_" + videoID + (bVideoCover ? " cover" : "");
72
73          if (!$_slide.find(".video." + videoClass).length) {
74            if (bVideoPlayerYoutube) {
75              $_slide.append(
76                '<div class="wrapper_video"><iframe id="player_' +
77                  videoID +
78                  '" class="video ' +
79                  videoClass +
80                  '" src="' +
81                  videoPlayerSrc +
82                  '" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="accelerometer; encrypted-media; gyroscope; fullscreen;"' +
83                  (videoWidth && videoHeight ? ' data-video_proportion="' + videoWidth / videoHeight + '"' : "") +
84                  "></iframe></div>"
85              );
86            } else if (bVideoPlayerVimeo) {
87              $_slide.append(
88                '<div class="wrapper_video"><iframe id="player_' +
89                  videoID +
90                  '" class="video ' +
91                  videoClass +
92                  '" src="' +
93                  videoPlayerSrc +
94                  '" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="accelerometer; encrypted-media; gyroscope; fullscreen;"' +
95                  (videoWidth && videoHeight ? ' data-video_proportion="' + videoWidth / videoHeight + '"' : "") +
96                  "></iframe></div>"
97              );
98            } else if (bVideoPlayerRutube) {
99              videoPlayerSrc = videoPlayerSrc + "&playerid=" + videoID;
100              $_slide.append(
101                '<div class="wrapper_video"><iframe id="player_' +
102                  videoID +
103                  '" class="video ' +
104                  videoClass +
105                  '" src="' +
106                  videoPlayerSrc +
107                  '" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="encrypted-media; gyroscope; fullscreen;"' +
108                  (videoWidth && videoHeight ? ' data-video_proportion="' + videoWidth / videoHeight + '"' : "") +
109                  "></iframe></div>"
110              );
111            } else if (bVideoPlayerHtml5) {
112              $_slide.append(
113                '<div class="wrapper_video"><video ' + (bVideoAutoPlay ? 'autoplay ' : '') + 'autobuffer playsinline webkit-playsinline id="player_' +
114                  videoID +
115                  '" class="video ' +
116                  videoClass +
117                  '"' +
118                  (bVideoLoop ? " loop " : "") +
119                  (bVideoSoundDisabled ? " muted " : "") +
120                  '><source src="' +
121                  videoPlayerSrc +
122                  '" type=\'video/mp4; codecs="avc1.42E01E, mp4a.40.2"\' /><p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p></iframe></div>'
123              );
124            }
125          }
126
127          if (typeof players !== "undefined" && players) {
128            players[videoID] = {
129              id: "player_" + videoID,
130              mute: bVideoSoundDisabled,
131              loop: bVideoLoop,
132              cover: bVideoCover,
133              videoPlayer: videoPlayer,

134              slideIndex: slideActiveIndex,
135              playing: false,
136              clones: videoIDs,
137              videoWidth: videoWidth,
138              videoHeight: videoHeight,
139              videoProportion: videoWidth && videoHeight ? videoWidth / videoHeight : false,
140              src: videoPlayerSrc,
141            };
142
143            if (bVideoPlayerYoutube) {
144              window[players[videoID].id] = new YT.Player(players[videoID].id, {
145                events: {
146                  onReady: function (e) {
147                    if (videoID) {
148                      var mute = players[videoID].mute;
149                      var cover = players[videoID].cover;
150                      var $slide = $("#player_" + videoID).closest(".main-slider__item");
151                      var hidden = !$("#player_" + videoID).closest(".swiper-slide-active").length;
152                      // var hidden = !$("#player_" + videoID).closest(".owl-item.active").length;
153                      // console.log("onReady", videoID, hidden);
154
155                      // mute sound
156                      if (mute || hidden) {
157                        window[players[videoID].id].mute();
158                      }
159
160                      // cover video
161                      if (cover) {
162                        // get video`s original size
163                        if (!players[videoID].videoProportion) {
164                          var embedHtml = e.target.getVideoEmbedCode();
165                          if (embedHtml.length) {
166                            var match = embedHtml.match(/width="(\d*)"[^>]*height="(\d*)"/);
167                            if (match !== null) {
168                              var videoWidth = match[1];
169                              var videoHeight = match[2];
170
171                              players[videoID].videoWidth = videoWidth;
172                              players[videoID].videoHeight = videoHeight;
173                              players[videoID].videoProportion = videoWidth / videoHeight;
174
175                              $slide.find(".video").attr("data-video_proportion", players[videoID].videoProportion);
176                            }
177                          }
178                        }
179
180                        CoverPlayer();
181                      }
182
183                      if (hidden) {
184                        // not start hidden video playing
185                        // console.log("pause hidden", videoID);
186                        setTimeout(function () {
187                          e.target.pauseVideo();
188                        }, 100);
189                      } else {
190                        // stop slider
191                        // console.log("play visible", videoID);
192                        pauseMainBanner();
193                        window[players[videoID].id].seekTo(0, true);
194                        //e.target.playVideo();
195                      }
196
197                      // update slide class
198                      $slide.addClass("started");
199                      // $slide.removeClass('loading')
200                    }
201                  },
202                  onStateChange: function (e) {
203                    if (videoID) {
204                      var loop = players[videoID].loop;
205                      var $slide = $("#player_" + videoID).closest(".main-slider__item");
206                      var hidden = !$("#player_" + videoID).closest(".swiper-slide-active").length;
207                      // var hidden = !$("#player_" + videoID).closest(".owl-item.active").length;
208                      // console.log("onStateChange", videoID, hidden, e.data);
209
210                      if (!hidden) {
211                        if (e.data === YT.PlayerState.PLAYING) {
212                          players[videoID].playing = true;
213                          setSlideClasses(videoID, true);
214
215                          // stop slider
216                          pauseMainBanner();
217
218                          var videoClones = players[videoID].clones;
219                          for (var j in videoClones) {

220                            if (videoClones[j] != videoID) {
221                              if (players[videoClones[j]].playing) {
222                                // console.log("pause one of clone", videoClones[j]);
223                                window[players[videoClones[j]].id].pauseVideo();
224                              }
225                            }
226                          }
227
228                          //e.target.playVideo();
229                        } else if (e.data === YT.PlayerState.PAUSED) {
230                          players[videoID].playing = false;
231
232                          // sync time in cloned players & pause
233                          var time = Math.floor(window[players[videoID].id].getCurrentTime() * 10) / 10;
234
235                          setSlideClasses(videoID, false);
236
237                          window[players[videoID].id].seekTo(time, true);
238
239                          var videoClones = players[videoID].clones;
240                          for (var j in videoClones) {
241                            if (videoClones[j] != videoID) {
242                              if (players[videoClones[j]].playing) {
243                                // console.log("pause one of clone", videoClones[j]);
244                                window[players[videoClones[j]].id].pauseVideo();
245                              }
246
247                              if ("getCurrentTime" in window[players[videoClones[j]].id]) {
248                                window[players[videoClones[j]].id].seekTo(time, true);
249                              }
250                            }
251                          }
252
253                          playMainBanner();
254                        } else if (e.data === YT.PlayerState.ENDED) {
255                          players[videoID].playing = false;
256                          if (loop) {
257                            e.target.playVideo();
258                          } else {
259                            // play slider
260                            playMainBanner();
261                          }
262                        } else if (e.data === YT.PlayerState.UNSTARTED) {
263                          players[videoID].playing = false;
264                          setSlideClasses(videoID, false);
265                          // window[players[videoID].id].mute()
266                          e.target.playVideo();
267                        }
268                      } else {
269                        players[videoID].playing = false;
270                        setSlideClasses(videoID, false);
271                      }
272                    }
273                  },
274                },
275              });
276            } else if (bVideoPlayerVimeo) {
277              window[players[videoID].id] = new Vimeo.Player(document.getElementById(players[videoID].id), {
278                autopause: false,
279                byline: false,
280                loop: false,
281                title: false,
282              });
283              window[players[videoID].id].on("loaded", onVimeoPlayerReady);
284              window[players[videoID].id].on("play", onVimeoPlayerStateChange);
285              window[players[videoID].id].on("pause", onVimeoPlayerStateChange);
286              window[players[videoID].id].on("ended", onVimeoPlayerStateChange);
287            } else if (bVideoPlayerRutube) {
288              document.getElementById(players[videoID].id).onload = function (e) {
289                var videoID = this.id.replace("player_", "");
290                players[videoID].contentWindow = this.contentWindow;
291                onRutubePlayerReady(videoID);
292              };
293            } else if (bVideoPlayerHtml5) {
294              document.getElementById(players[videoID].id).addEventListener("loadeddata", onHtml5PlayerReady);
295              document.getElementById(players[videoID].id).addEventListener("play", onHtml5PlayerStateChange);
296              document.getElementById(players[videoID].id).addEventListener("pause", onHtml5PlayerStateChange);
297              document.getElementById(players[videoID].id).addEventListener("ended", onHtml5PlayerStateChange);
298            }
299          }
300        });
301      };
302
303      if (!bVideoPlayerHtml5) {
304        var obPlayerVariable = "";
305        var fnPlayerVariable = "";

306        if (typeof window["YoutubePlayerScriptLoaded"] === "undefined") {
307          window["YoutubePlayerScriptLoaded"] = false;
308        }
309        if (typeof window["VimeoPlayerScriptLoaded"] === "undefined") {
310          window["VimeoPlayerScriptLoaded"] = false;
311        }
312        if (typeof window["RutubePlayerListnersAdded"] === "undefined") {
313          window["RutubePlayerListnersAdded"] = false;
314        }
315
316        // load script
317        if (bVideoPlayerYoutube) {
318          obPlayerVariable = "YT";
319          fnPlayerVariable = "Player";
320          if (!window["YoutubePlayerScriptLoaded"]) {
321            var script = document.createElement("script");
322            script.src = "https://www.youtube.com/iframe_api";
323            var firstScriptTag = document.getElementsByTagName("script")[0];
324            firstScriptTag.parentNode.insertBefore(script, firstScriptTag);
325            window["YoutubePlayerScriptLoaded"] = true;
326          }
327        } else if (bVideoPlayerVimeo) {
328          obPlayerVariable = "Vimeo";
329          if (!window["VimeoPlayerScriptLoaded"]) {
330            var script = document.createElement("script");
331            script.src = "https://player.vimeo.com/api/player.js";
332            (document.head || document.documentElement).appendChild(script);
333            window["VimeoPlayerScriptLoaded"] = true;
334          }
335        } else if (bVideoPlayerRutube) {
336          if (!window["RutubePlayerListnersAdded"]) {
337            window.addEventListener("message", function (e) {
338              if (e.origin.indexOf("rutube.ru") !== -1) {
339                var message = JSON.parse(e.data);
340                if (typeof message === "object" && message) {
341                  if (typeof message.type !== "undefined" && message.type) {
342                    var videoID = false;
343
344                    for (var j in players) {
345                      if (typeof players[j].contentWindow !== "undefined") {
346                        if (players[j].contentWindow == e.source) {
347                          videoID = j;
348                          break;
349                        }
350                      }
351                    }
352
353                    if (videoID) {
354                      switch (message.type) {
355                        case "player:changeState":
356                          onRutubePlayerStateChange(videoID, message.data.state);
357                          break;
358                        case "player:currentTime":
359                          onRutubePlayerCurrentTime(videoID, message.data.time);
360                          break;
361                      }
362                    }
363                  }
364                }
365              }
366            });
367          }
368        }
369
370        if (!obPlayerVariable.length) {
371          InitPlayer();
372        } else {
373          // wait player class
374          if (typeof window[obPlayerVariable] === "object") {
375            if (
376              !fnPlayerVariable.length ||
377              (fnPlayerVariable.length && typeof window[obPlayerVariable][fnPlayerVariable] === "function")
378            ) {
379              InitPlayer();
380            }
381          } else {
382            var waitPlayerInterval = setInterval(function () {
383              if (typeof window[obPlayerVariable] === "object") {
384                if (
385                  !fnPlayerVariable.length ||
386                  (fnPlayerVariable.length && typeof window[obPlayerVariable][fnPlayerVariable] === "function")
387                ) {
388                  clearInterval(waitPlayerInterval);
389
390                  InitPlayer();
391                }
392              }
393            }, 50);
394          }
395        }
396      } else {
397        InitPlayer();
398      }
399    } else {
400      // console.log(players);
401      // pause video
402      if (typeof players !== "undefined" && players) {
403        for (var j in players) {
404          if (typeof window[players[j].id] == "object") {
405            if (players[j].playing) {
406              if (players[j].videoPlayer === "YOUTUBE") {
407                // console.log("pause", j);
408                window[players[j].id].pauseVideo();
409              } else if (players[j].videoPlayer === "VIMEO") {
410                window[players[j].id].pause();
411              } else if (players[j].videoPlayer === "RUTUBE") {
412                document.getElementById(players[j].id).contentWindow.postMessage(
413                  JSON.stringify({
414                    type: "player:pause",
415                    data: {},
416                  }),
417                  "*"
418                );
419              } else if (players[j].videoPlayer === "HTML5") {
420                document.getElementById(players[j].id).pause();
421              }
422            } else if (players[j].slideIndex == slideActiveIndex) {
423              if (players[j].videoPlayer === "YOUTUBE") {
424                if (typeof window[players[j].id]["playVideo"] == "function") {
425                  window[players[j].id].playVideo();
426                }
427              } else if (players[j].videoPlayer === "VIMEO") {
428                window[players[j].id].play();
429              } else if (players[j].videoPlayer === "RUTUBE") {
430                document.getElementById(players[j].id).contentWindow.postMessage(
431                  JSON.stringify({
432                    type: "player:play",
433                    data: {},
434                  }),
435                  "*"
436                );
437              } else if (players[j].videoPlayer === "HTML5") {
438                document.getElementById(players[j].id).play();
439              }
440            }
441          }
442        }
443      }
444    }
445  }
446}
447
448var CoverPlayer = function () {
449  $(".banners-big .video.cover:visible").each(function () {
450    // var $slide = $(this).closest(".main-slider__item");
451    var $slide = $(this).closest(".wrapper_video");
452    var slideHeight = $slide[0].getBoundingClientRect().height; // outer height with padding
453    var slideWidth = $slide[0].getBoundingClientRect().width;
454    var videoProportion = $(this).attr("data-video_proportion");
455    if (videoProportion === undefined) {
456      videoProportion = 16 / 9;
457    }
458
459    // set video width = 100% of slide width
460    var videoWidth = slideWidth;
461    // calculate video height proportional
462    var videoHeight = slideWidth / videoProportion;
463    // video minimal  height = 100% slide height
464    if (videoHeight < slideHeight) {
465      // increase video width proportional
466      videoWidth = slideHeight * videoProportion;
467      videoHeight = slideHeight;
468    }
469
470    $(this).width(videoWidth).height(videoHeight);
471  });
472};
473
474function onVimeoPlayerReady(e) {

475  var videoID = this.element.id.replace("player_", "");
476  if (videoID) {
477    var mute = players[videoID].mute;
478    var cover = players[videoID].cover;
479    //var clone = players[videoID].clone;
480    var $slide = $("#player_" + videoID).closest(".main-slider__item");
481    var clone = $("#player_" + videoID).closest(".main-slider__item:not(.swiper-slide-active)").length;
482    // var clone = $("#player_" + videoID).closest(".owl-item:not(.active)").length;
483
484    // mute sound
485    if (mute || clone) {
486      window[players[videoID].id].setVolume(0);
487    }
488
489    // cover video
490    if (cover) {
491      // get video`s original size
492      if (!players[videoID].videoProportion) {
493        var widthPromise = window[players[videoID].id].getVideoWidth();
494        var heightPromise = window[players[videoID].id].getVideoHeight();
495        widthPromise.then(function (value) {
496          var videoWidth = value;
497
498          heightPromise.then(function (value) {
499            var videoHeight = value;
500
501            players[videoID].videoWidth = videoWidth;
502            players[videoID].videoHeight = videoHeight;
503            players[videoID].videoProportion = videoWidth / videoHeight;
504
505            $slide.find(".video").attr("data-video_proportion", players[videoID].videoProportion);
506
507            CoverPlayer();
508          });
509        });
510      }
511    }
512
513    // not start clone video playing
514    if (clone) {
515      setTimeout(function () {
516        window[players[videoID].id].pause();
517      }, 100);
518    } else {
519      // stop slider
520      pauseMainBanner();
521
522      // start video
523      var promise = window[players[videoID].id].play();
524      if (typeof promise !== "undefined") {
525        promise.catch(function () {
526          setTimeout(function () {
527            window[players[videoID].id].setVolume(0);
528            window[players[videoID].id].play();
529          }, 100);
530        });
531      }
532    }
533
534    // update slide class
535    $slide.addClass("started");
536    // $slide.removeClass('loading')
537  }
538}
539
540function onVimeoPlayerStateChange(e) {
541  var videoID = this.element.id.replace("player_", "");
542  if (videoID) {
543    var cover = players[videoID].cover;
544    //var clone = players[videoID].clone;
545    var loop = players[videoID].loop;
546    var slideIndex = players[videoID].slideIndex;
547    var clone = $("#player_" + videoID).closest(".main-slider__item:not(.swiper-slide-active)").length;
548    // var clone = $("#player_" + videoID).closest(".owl-item:not(.active)").length;
549
550    window[players[videoID].id].getPaused().then(function (paused) {
551      if (paused) {
552        players[videoID].playing = false;
553        setSlideClasses(videoID, false);
554
555        // sync time in cloned players & pause
556        window[players[videoID].id].getCurrentTime().then(function (seconds) {
557          var time = Math.floor(seconds * 10) / 10;
558          window[players[videoID].id].setCurrentTime(time).then(function (seconds) {
559            for (var j in players) {
560              if (
561                players[j].slideIndex == slideIndex &&
562                (j != videoID || (clone && j == videoID)) &&
563                window[players[j].id]
564              ) {
565                window[players[j].id].pause();
566                window[players[j].id].setCurrentTime(time).then(function (seconds) {});
567              }
568            }
569          });
570        });
571      } else {
572        setSlideClasses(videoID, true);
573        window[players[videoID].id].getEnded().then(function (ended) {
574          if (ended) {
575            players[videoID].playing = false;
576            if (loop) {
577              window[players[videoID].id].play();
578            } else {
579              // play slider
580              playMainBanner();
581            }
582          } else {
583            players[videoID].playing = true;
584
585            // stop slider
586            pauseMainBanner();
587          }
588        });
589      }
590    });
591  }
592}
593
594function onRutubePlayerReady(videoID) {
595  if (videoID) {
596    var mute = players[videoID].mute;
597    var cover = players[videoID].cover;
598    //var clone = players[videoID].clone;
599    var player = document.getElementById(players[videoID].id);
600    var $slide = $("#player_" + videoID).closest(".main-slider__item");
601    var clone = $(player).closest(".main-slider__item:not(.swiper-slide-active)").length;
602    // var clone = $(player).closest(".owl-item:not(.active)").length;
603
604    // mute sound
605    if (mute || clone) {
606      player.contentWindow.postMessage(
607        JSON.stringify({
608          type: "player:mute",

609          data: {},
610        }),
611        "*"
612      );
613    }
614
615    // cover video
616    if (cover) {
617      CoverPlayer();
618    }
619
620    // not start clone video playing
621    if (clone) {
622      setTimeout(function () {
623        player.contentWindow.postMessage(
624          JSON.stringify({
625            type: "player:pause",
626            data: {},
627          }),
628          "*"
629        );
630      }, 100);
631    } else {
632      // stop slider
633      pauseMainBanner();
634
635      player.contentWindow.postMessage(
636        JSON.stringify({
637          type: "player:play",
638          data: {},
639        }),
640        "*"
641      );
642    }
643
644    // update slide class
645    $slide.addClass("started");
646    // $slide.removeClass('loading')
647  }
648}
649
650function onRutubePlayerCurrentTime(videoID, time) {
651  if (videoID) {
652    players[videoID].time = time;
653  }
654}
655
656function onRutubePlayerStateChange(videoID, state) {
657  if (videoID) {
658    //var clone = players[videoID].clone;
659    var loop = players[videoID].loop;
660    var slideIndex = players[videoID].slideIndex;
661    var player = document.getElementById(players[videoID].id);
662    var clone = $(player).closest(".main-slider__item:not(.swiper-slide-active)").length;
663    // var clone = $(player).closest(".owl-item:not(.active)").length;
664
665    if (state === "playing") {
666      setSlideClasses(videoID, true);
667      players[videoID].playing = true;
668
669      // stop slider
670      pauseMainBanner();
671    } else if (state === "paused") {
672      setSlideClasses(videoID, false);
673      players[videoID].playing = false;
674
675      // sync time in cloned players & pause
676      var time = Math.floor(players[videoID].time * 10) / 10;
677      player.contentWindow.postMessage(
678        JSON.stringify({
679          type: "player:setCurrentTime",
680          data: { time: time },
681        }),
682        "*"
683      );
684      for (var j in players) {
685        if (
686          players[j].slideIndex == slideIndex &&
687          (j != videoID || (clone && j == videoID)) &&
688          document.getElementById(players[j].id)
689        ) {
690          document.getElementById(players[j].id).contentWindow.postMessage(
691            JSON.stringify({
692              type: "player:pause",
693              data: {},
694            }),
695            "*"
696          );
697          document.getElementById(players[j].id).contentWindow.postMessage(
698            JSON.stringify({
699              type: "player:setCurrentTime",
700              data: { time: time },
701            }),
702            "*"
703          );
704        }
705      }
706    } else if (state === "stopped") {
707      setSlideClasses(videoID, false);
708      players[videoID].playing = false;
709      if (loop) {
710        player.contentWindow.postMessage(
711          JSON.stringify({
712            type: "player:play",
713            data: {},
714          }),
715          "*"
716        );
717      } else {
718        // play slider
719        playMainBanner();
720      }
721    }
722  }
723}
724
725function onHtml5PlayerReady(e) {
726  var videoID = e.target.id.replace("player_", "");
727  if (videoID) {
728    var mute = players[videoID].mute;
729    var cover = players[videoID].cover;
730    var clone = $(e.target).closest(".main-slider__item:not(.swiper-slide-active)").length;
731    // var clone = $(e.target).closest(".owl-item:not(.active)").length;
732    var $slide = $("#player_" + videoID).closest(".main-slider__item");
733
734    // mute sound
735    if (mute || clone) {
736      $("#" + players[videoID].id).prop("muted", true);
737    }
738
739    // cover video
740    if (cover) {
741      // get video`s original size
742      if (!players[videoID].videoProportion) {
743        var videoWidth = $slide.find(".video")[0].videoWidth;
744        var videoHeight = $slide.find(".video")[0].videoHeight;
745
746        players[videoID].videoWidth = videoWidth;
747        players[videoID].videoHeight = videoHeight;
748        players[videoID].videoProportion = videoWidth / videoHeight;
749
750        $slide.find(".video").attr("data-video_proportion", players[videoID].videoProportion);
751      }
752
753      CoverPlayer();
754    }
755
756    // not start clone video playing
757    if (clone) {
758      // console.log("stop clone");
759      e.target.pause();
760    } else {
761      // stop slider
762      pauseMainBanner();
763
764      var promise = e.target.play();
765      if (typeof promise !== "undefined") {
766        promise.catch(function () {
767          setTimeout(function () {
768            $("#" + players[videoID].id).prop("muted", true);
769            e.target.play();
770          }, 100);
771        });
772      }
773    }
774
775    // update slide class
776    $slide.addClass("started");
777    // $slide.removeClass('loading')
778  }
779}
780
781function onHtml5PlayerStateChange(e) {
782  var videoID = e.target.id.replace("player_", "");

783  if (videoID) {
784    var cover = players[videoID].cover;
785    var clone = $(e.target).closest(".main-slider__item:not(.swiper-slide-active)").length;
786    // var clone = $(e.target).closest(".owl-item:not(.active)").length;
787    var loop = players[videoID].loop;
788    var slideIndex = players[videoID].slideIndex;
789
790    if (e.target.paused && !e.target.ended) {
791      players[videoID].playing = false;
792
793      setSlideClasses(videoID, false);
794
795      // sync time in cloned players & pause
796      var time = Math.floor(e.target.currentTime * 10) / 10;
797      e.target.currentTime = time;
798      for (var j in players) {
799        if (
800          players[j].slideIndex == slideIndex &&
801          (j != videoID || (clone && j == videoID)) &&
802          document.getElementById(players[j].id)
803        ) {
804          // console.log("stop some clone");
805          document.getElementById(players[j].id).pause();
806          document.getElementById(players[j].id).currentTime = time;
807        }
808      }
809      pauseMainBanner(); //need for correct autoplay timeout
810      playMainBanner();
811    } else if (e.target.ended) {
812      players[videoID].playing = false;
813      if (loop) {
814        setSlideClasses(videoID, false);
815        e.target.play();
816      } else {
817        // play slider
818        pauseMainBanner(); //need for correct autoplay timeout
819        playMainBanner();
820        nextSlideMainBanner();
821      }
822    } else {
823      players[videoID].playing = true;
824      setSlideClasses(videoID, true);
825      // stop slider
826      pauseMainBanner();
827    }
828  }
829}
830
831function setSlideClasses(id, active) {
832  const $playerSlide =  document.querySelector(`#player_${id}`).closest('.main-slider__item');
833  const $playerSlideButton = $playerSlide.querySelector('.banners-big__inner .btn-video');
834  const $playerSliderButtonSprite = $playerSlideButton.querySelector('use');
835
836  const spritePath = `${arAsproOptions.SITE_TEMPLATE_PATH}/images/svg/video_buttons_sprite.svg`;
837
838  if (active) {
839    $playerSlide.classList.add('loading');
840    $playerSlideButton.classList.add('loading');
841    $playerSliderButtonSprite.setAttribute('href', `${spritePath}#video-pause-13-13`);
842  } else {
843    $playerSlide.classList.remove('loading');
844    $playerSlideButton.classList.remove('loading');
845    $playerSliderButtonSprite.setAttribute('href', `${spritePath}#video-play-13-13`);
846  }
847}
848
849waitYTPlayer = function (delay, callback) {
850  if (typeof YT !== "undefined" && YT && YT.Player) {
851    if (typeof callback == "function") callback();
852  } else {
853    setTimeout(function () {
854      waitYTPlayer(delay, callback);
855    }, delay);
856  }
857};
858
859// click on HTML5 video
860$(document).on("click", "video.video", function (e) {
861  var videoID = e.target.id.replace("player_", "");
862  if (videoID) {
863    if (players[videoID].playing) {
864      e.target.pause();
865    } else {
866      e.target.play();
867    }
868  }
869});
870
871// START VIDEO BUTTON
872$(document).on("click", ".banners-big .btn-video", function (e) {
873  e.stopPropagation();
874  startMainBannerSlideVideo($(this).closest(".main-slider__item"));
875});
876
877// START VIDEO BY BANNER OR GOTO LINK
878$(document).on("click", ".banners-big .banners-big__item", function (e) {
879  var $item = $(this);
880  var vvideo = $item.hasClass("vvideo");
881  var wurl = $item.hasClass("wurl");
882
883  if (!$(e.target).hasClass("btn")) {
884    if (wurl) {
885      var href = $item.find(".target").attr("href");
886      if (href.length) {
887        var target = $item.find(".target").attr("target");
888        if (typeof target === "undefined" || target === "_self") {
889          location.href = href;
890        } else {
891          window.open(href);
892        }
893      }
894    } else {
895      if (vvideo) {
896        e.stopPropagation();
897        $(this).find(".btn-video").trigger("click");
898      }
899    }
900  }
901});
902
903getRandomInt = function (min, max) {
904  return Math.floor(Math.random() * (max - min)) + min;
905};
906
907var ignoreResize = [];
908
909BX.addCustomEvent("onWindowResize", function (eventdata) {
910  try {
911    CoverPlayer();
912  } catch (e) {
913  } finally {
914    ignoreResize.pop();

915  }
916});
917
918BX.addCustomEvent("onSlideEnd", function (eventdata) {
919  try {
920    ignoreResize.push(true);
921    if (eventdata) {
922      var slider = eventdata.slider;
923      if (slider) {
924        setTimeout(function () {
925          $(".banners-big.front .btn-video, .banners-big.front .banners-big__item").removeClass("loading");
926        }, 300);
927      }
928    }
929  } catch (e) {
930  } finally {
931    ignoreResize.pop();
932  }
933});
934
935var lastSlideIndex;
936BX.addCustomEvent("onSlide", function (eventdata) {
937  try {
938    ignoreResize.push(true);
939    if (eventdata) {
940      var slider = eventdata.slider;
941      if (slider) {
942        /*if (slider.data("owl.carousel")) {
943          var curSlideIndex = slider.data("owl.carousel").current();
944          var curSlide = slider.find(".owl-item").eq(curSlideIndex).find(".banners-big__item");
945        } else if (slider.find(".owl-item.active").length) {
946          var curSlide = slider.find(".owl-item.active").first().find(".banners-big__item");
947        } else {
948          var curSlide = slider.find(".owl-item:not(.cloned)").eq(0).find(".banners-big__item");
949        }*/
950
951        let curSlide = '';
952        if (slider.data("swiper")) {
953          const curSlideIndex = slider.data("swiper").realIndex;
954          curSlide = slider.find(`.main-slider__item[data-slide_index=${curSlideIndex}]`);
955        } else if (slider.find(".swiper-slide-active").length) {
956          curSlide = slider.find(".swiper-slide-active").first();
957        } else {
958          curSlide = slider.find(".main-slider__item:not(.swiper-slide-duplicate)").eq(0);
959        }        
960
961        if (!curSlide.length) {          
962          curSlide = slider.find(".box.swiper-slide-active");        
963        }
964        var dataSlideIndex = curSlide.attr("data-slide_index");
965
966        // prevent overlaping events of slider
967        if (lastSlideIndex === dataSlideIndex) return;
968        lastSlideIndex = dataSlideIndex;
969
970        if (typeof curSlide !== "undefined" && curSlide.length) {
971          var slidesIndexesWithVideo = slider.data("slidesIndexesWithVideo");
972          if (typeof slidesIndexesWithVideo === "undefined") {
973            slidesIndexesWithVideo = [];
974          }
975
976          var bVideoVisible = slidesIndexesWithVideo.indexOf(dataSlideIndex) != -1;
977          if (bVideoVisible) {
978            slider.addClass("video_visible");
979          } else {
980            slider.removeClass("video_visible");
981          }
982
983          setTimeout(function () {
984            CoverPlayer();
985          }, 200);
986
987          // pause play video
988          if (typeof players !== "undefined" && players) {
989            for (var j in players) {
990              if (/*players[j].playing && */players[j].slideIndex != dataSlideIndex) {
991                if (typeof window[players[j].id] == "object") {
992                  if (players[j].videoPlayer === "YOUTUBE") {
993                    window[players[j].id].pauseVideo();
994                  } else if (players[j].videoPlayer === "VIMEO") {
995                    window[players[j].id].pause();
996                  } else if (players[j].videoPlayer === "RUTUBE") {
997                    document.getElementById(players[j].id).contentWindow.postMessage(
998                      JSON.stringify({
999                        type: "player:pause",
1000                        data: {},
1001                      }),
1002                      "*"
1003                    );
1004                  } else if (players[j].videoPlayer === "HTML5") {
1005                    document.getElementById(players[j].id).pause();
1006                  }
1007                }
1008              }
1009            }
1010          }
1011
1012          // autoplay video
1013          var bVideoAutoPlay = curSlide.attr("data-video_autoplay") == 1;
1014          if (bVideoAutoPlay) {
1015            startMainBannerSlideVideo(curSlide);
1016          }
1017        }
1018
1019        if (curSlide.find("video").length && !curSlide.find(".btn-video").length) {
1020          var videoID = curSlide.find("video").attr("id");
1021          document.getElementById(videoID).play();
1022        }
1023      }
1024    }
1025  } catch (e) {
1026  } finally {
1027    ignoreResize.pop();

1028  }
1029});