https://5ugol.ru/extra/prodowl/init.js

1const open_preview = (e) => {
2    preview.style.removeProperty('display')
3    document.getElementsByTagName('html')[0].style.setProperty('overflow-y', 'hidden')
4}
5
6const close_preview = (e) => {
7    preview.style.setProperty('display', 'none')
8    document.getElementsByTagName('html')[0].style.removeProperty('overflow-y')
9    console.log(unsafe_videos)
10
11    for (let i = 0; i < unsafe_videos.length; i += 1){
12        unsafe_videos[i].pause()
13    }
14}
15
16
17const create_images = (user_fragment, is_small) => {
18
19    for (let i = 0; i < images.length; i++){
20        let ref = images[i]
21
22        const div = document.createElement('div')
23        const subdiv = document.createElement('img')
24
25        if (is_small){
26            div.classList.add('item')
27            subdiv.style.objectFit = 'cover'
28
29        }
30        else{
31            div.classList.add('item-big')
32            subdiv.style.objectFit = 'contain'
33
34        }
35
36        subdiv.src = ref
37
38
39        subdiv.style.backgroundRepeat = 'no-repeat'
40
41        subdiv.classList.add('custom-image')
42        div.append(subdiv)
43
44        div.addEventListener('click', open_preview)
45        user_fragment.append(div);
46    }
47}
48
49
50const create_videos = (user_fragment, is_small) => {
51
52    for (let i = 0; i < videos.length; i++){
53        let ref = videos[i]
54        const div = document.createElement('div');
55        const video = document.createElement('video')
56
57        video.src=ref
58        video.classList.add('custom-video')
59        video.controls = 'true'
60        if (is_small){
61            div.classList.add('item')
62        }
63        else{
64            div.classList.add('item-big')
65            unsafe_videos = [...unsafe_videos, video]
66        }
67        div.append(video)
68        // '<div class="item"><video controls class="custom-video" src="' + ref + '"></video></div>'
69        user_fragment.append(div);
70    }
71}
72
73
74
75let unsafe_videos = []
76
77const fragment = new DocumentFragment();
78const preview_fragment = new DocumentFragment();
79
80const carousel_root = document.getElementById('carousel-root')
81const fullscreen_carousel_root = document.getElementById('fullscreen-carousel')
82
83const preview = document.getElementById('custom-preview')
84const close_preview_cross = document.getElementById('fullscreen-preview-cross')
85
86close_preview_cross.addEventListener('click', close_preview)
87
88
89
90create_images(fragment, true)
91create_videos(fragment, true)
92
93
94create_images(preview_fragment, false)
95create_videos(preview_fragment, false)
96
97
98carousel_root.append(fragment)
99fullscreen_carousel_root.append(preview_fragment)