changer addEventListener click en autoload

a marqué ce sujet comme résolu.
Auteur du sujet

Bonjour

Le code qui suit me permet de lancer le streaming de la camera de mon raspberry pi en cliquant sur un bouton start.

Comment faire pour lancer le streaming dès l’ouverture de la page web ?

(function () {

    var signalObj = null;



    window.addEventListener('DOMContentLoaded', function () {

        var isStreaming = false;

        var start = document.getElementById('start');

        var stop = document.getElementById('stop');

        var video = document.getElementById('v');

        var canvas = document.getElementById('c');

        var ctx = canvas.getContext('2d');

        var effect = document.getElementById('effect');

        var isEffectActive = false;



        start.addEventListener('click', function (e) {

            var wsurl = document.getElementById('address').value;

           

            if (!isStreaming) {

                signalObj = new signal(wsurl,

                        function (stream) {

                            console.log('got a stream!');

                            //var url = window.URL || window.webkitURL;

                            //video.src = url ? url.createObjectURL(stream) : stream; // deprecated

                            video.srcObject = stream;

                            var playPromise = video.play();
                     if (playPromise !== undefined) {
                        playPromise.then(_ => {})
                           .catch(error => {});
                     }

                        },

                        function (error) {

                            alert(error);

                        },

                        function () {

                            console.log('websocket closed. bye bye!');

                            video.srcObject = null;

                            //video.src = ''; // deprecated

                            ctx.clearRect(0, 0, canvas.width, canvas.height);

                            isStreaming = false;

                        },

                        function (message) {

                            alert(message);

                        }

                );

            }

        }, false);



        stop.addEventListener('click', function (e) {

            if (signalObj) {

                signalObj.hangup();

                signalObj = null;

            }

        }, false);



        // Wait until the video stream can play

        video.addEventListener('canplay', function (e) {

            if (!isStreaming) {

                canvas.setAttribute('width', video.videoWidth);

                canvas.setAttribute('height', video.videoHeight);

                isStreaming = true;

            }

        }, false);



        // Wait for the video to start to play

        video.addEventListener('play', function () {

            // Every 33 milliseconds copy the video image to the canvas

            setInterval(function () {

                if (video.paused || video.ended) {

                    return;

                }

                var w = canvas.getAttribute('width');

                var h = canvas.getAttribute('height');

                ctx.fillRect(0, 0, w, h);

                ctx.drawImage(video, 0, 0, w, h);

                if (isEffectActive) {

                    detectFace(canvas);

                }

            }, 33);

        }, false);



        effect.addEventListener('click', function () {

            isEffectActive = !isEffectActive;

        }, false);

    });

})();

Je n’ai pas la solution mais j’admire le problème…

+0 -0

Tu as déjà une fonction qu’est exécutée quand tu cliques sur le bouton. À première vue, change simplement l’événement pour que ce soit DOMContentLoaded (ou en sortant la fonction de celle déjà exécutée au DOMContentLoaded, ou en intégrant son contenu directement à la fonction exécutée au DOMContentLoaded, comme tu préfères) :) .

#JeSuisArius ⋅ Mon blog scientifiqueLe Pitit Bac

+0 -0
Auteur du sujet

J’ai essayé en commentant la ligne 27 et la ligne 85.

ou en sortant la fonction du DOMContentLoaded

La connexion ce fait mais la vidéo ne s’affiche pas.

Je n’ai pas la solution mais j’admire le problème…

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte