https://learnn.com/wp-content/themes/lucamastella/js/video-custom-controls.js?v=1790250580

1
2//var video = false;
3//var btn_playPause = document.getElementById("playPause");
4//var btn_forward15 = document.getElementById("forward15");
5//var btn_back15 = document.getElementById("back15");
6
7//var video_started = false;
8
9
10function playPause(element_id) {
11    var video = document.querySelector('#'+element_id+' .video-stream');
12    var btn_playPause = document.querySelector('#'+element_id+' .playPause');
13    var btn_forward15 = document.querySelector('#'+element_id+' .forward15');
14    var btn_back15 = document.querySelector('#'+element_id+' .back15');
15
16    if(!video){
17        return false;
18    }
19
20    if(!video.classList.contains('started')){
21        video.muted = false;
22        video.currentTime = 0;
23        btn_forward15.style.display = "flex";
24        btn_back15.style.display = "flex";
25        btn_playPause.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="6" y="4" width="4" height="16"></rect><rect x="14" y="4" width="4" height="16"></rect></svg>';
26        //video_started = true;
27        video.classList.add("started");
28        /*
29        setTimeout(function(){ 
30            btn_forward15.classList.add("inactive");
31            btn_back15.classList.add("inactive");
32        }, 2000);
33        */
34        
35    } else {
36        if (video.paused) {
37            video.play();
38            btn_playPause.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="6" y="4" width="4" height="16"></rect><rect x="14" y="4" width="4" height="16"></rect></svg>';
39            btn_forward15.style.display = "flex";
40            btn_back15.style.display = "flex";
41            /*
42            setTimeout(function(){ 
43                btn_forward15.classList.add("inactive");
44                btn_back15.classList.add("inactive");
45            }, 2000);
46            */
47            
48        } else {
49            video.pause();
50            btn_playPause.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>';
51            btn_forward15.style.display = "none";
52            btn_back15.style.display = "none";
53
54            //btn_forward15.classList.remove("inactive");
55            //btn_back15.classList.remove("inactive");
56
57        }
58    }
59}
60
61
62function videoPause(element_id) {
63    var video = document.querySelector('#'+element_id+' .video-stream');
64    var btn_playPause = document.querySelector('#'+element_id+' .playPause');
65    var btn_forward15 = document.querySelector('#'+element_id+' .forward15');
66    var btn_back15 = document.querySelector('#'+element_id+' .back15');
67
68    if(!video){
69        return false;
70    }
71
72    video.pause();
73    btn_playPause.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>';
74    btn_forward15.style.display = "none";
75    btn_back15.style.display = "none";
76    
77}
78
79
80
81function back15(element_id) {
82    var video = document.querySelector('#'+element_id+' .video-stream');
83    video.currentTime -= 5;
84}
85function forward15(element_id) {
86    var video = document.querySelector('#'+element_id+' .video-stream');
87    video.currentTime += 5;
88}
89
90/*
91function logAllEvents(element) {
92    var allEvents = [
93        'click',
94        'keydown', 'keypress', 'keyup',
95        'change', 'focus', 'blur',
96        'submit', 'reset',
97        'hide.bs.modal', 'hidden.bs.modal', 'show.bs.modal', 'shown.bs.modal'
98    ];
99    
100    allEvents.forEach(function(eventName) {
101        element.addEventListener(eventName, function(event) {
102            console.log('Evento:', eventName, 'scattato');
103            console.log('event:', event);
104        });
105    });
106}
107
108// Seleziona l'elemento modal e chiama la funzione logAllEvents
109var modalElement = document.getElementById('modal_corsi');
110logAllEvents(modalElement);
111*/
112
113    jQuery(document).ready(function($){
114        
115        
116        $('.course-description').on('click', function(){
117            $('.course-description').toggleClass('showmore');
118        });
119
120        $("a[href='#lezioni']").on('click', function() {
121            $('html, body').animate({
122                scrollTop: $("#lezioni").offset().top
123            }, "slow");
124            return false;

125        });
126
127        $("a[href='#info-corso-new']").on('click', function() {
128            $('html, body').animate({
129                scrollTop: $("#info-corso-new").offset().top
130            }, "slow");
131            return false;
132        });
133
134        $('#close-modal-btn').click();
135        $("#menu-modal a").on('click', function() {
136            $('#close-modal-btn').click();
137        });
138
139
140        $("#modal_corsi").on('blur', function() {
141            // Verifica se l'elemento ha la classe 'show'
142            if ($("#modal_corsi").hasClass('show')) {
143                //videoPause('courseVideo');
144                //console.log('ha show');
145            } else {
146                videoPause('courseVideo');
147                //console.log('--> MODAL CLOSE & VIDEO PAUSED');
148            }
149        });
150
151        
152        $("#modal_corsi").on('click', function(event) {
153
154            var targetElement = event.target;  // Ottieni l'elemento target dell'evento come elemento del DOM nativo
155
156            //console.log('TARGET1: ' + targetElement.id);  // Stampa l'ID dell'elemento
157            //console.log('TARGET2: ' + targetElement.className);  // Stampa le classi dell'elemento come stringa
158
159            if(targetElement.id == 'modal_corsi' && targetElement.className == 'modal fade modal-corsi show'){
160                //console.log('METTI IN PAUSA VIDEO');  // Stampa l'ID dell'elemento
161                videoPause('courseVideo');
162            }
163
164        });
165        
166
167        
168        /*
169        $(window).on('load', function () {
170            //console.log("window loaded");
171            
172            setTimeout(function(){ 
173                console.log('trailer loaded');
174
175                var videoElement = $('<video id="myVideo" class="video-trailer"  preload="metadata" autoplay="" muted="" loop="" playsinline="" onclick="playPause()"><source src="<?php echo $courseTrailer; ?>#t=0.1" type="video/mp4" /></video>');
176                $('#trailer-container').prepend(videoElement); 
177                
178                $('#trailer-container').addClass('loaded');
179
180                
181                
182                /*
183                $('.video-trailer').parent().click(function () {
184                    if($(this).children(".video-trailer").get(0).paused){
185                        $(this).children(".video-trailer").get(0).play();
186                        $(this).children(".playpause").fadeOut();
187                        //$(this).children(".videocta").fadeOut();
188                    }else{
189                       $(this).children(".video-trailer").get(0).pause();
190                        $(this).children(".playpause").fadeIn();
191                        //$(this).children(".videocta").fadeIn();
192                    }
193                });
194                */
195                /*
196                function trailerActions() {
197                    // Azione al click sul video
198                    console.log('video_started',video_started);
199
200                    var video_trailer = $('.video-trailer');
201
202                    if(!video_started){
203                        $(video_trailer).get(0).currentTime = 0; // Ripartire il video dall'inizio
204                        $(video_trailer).get(0).muted = false; // Attivare l'audio
205                        video_started = true;
206                    }
207
208                    $('.playpause').hide(); // Nascondere il pulsante play/pausa
209                    
210                    // Azione al secondo click sul video
211                    $(video_trailer).click(function(){
212                    if ($(video_trailer).get(0).paused){ // Se il video è in pausa
213                        $(video_trailer).get(0).play(); // Riprendere il video
214                        $('.prev15sec').show();
215                        $('.next15sec').show(); 
216                        $('.playpause').show();
217                    } else { // Se il video è in riproduzione
218                        $(video_trailer).get(0).pause(); // Mettere in pausa il video
219                        $('.playpause').hide();
220                        $('.prev15sec').hide(); 
221                        $('.next15sec').hide(); 
222                    }
223                    });
224                }
225                //gpt
226                var video_started = false;

227                $('.playpause').click(function(){
228                    trailerActions();
229                });
230                $('.video-trailer').click(function(){
231                    trailerActions();
232                });
233                */
234                //video = document.getElementById("myVideo");
235
236                /*
237                btn_playPause.style.display = "flex";
238
239            }, 100);
240        });
241        */
242        
243    
244        
245    });