DUT2PTUT/v/video.html

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf8" />
        <link rel="stylesheet" type="text/css" href="style/styles.css">
        <title>Acces camera</title>
        <script src="js/jquery-2.1.0.min.js"></script>
        <script >
            var ws = new WebSocket ("{{ url }}");
            ws.onmessage = function (evt) {
                console.log("data receive");
                if(evt.data != "error") {
                    console.log("data OK !");
                    var str = "<img src='data:image/jpeg;base64,"+evt.data+"'>";
                }
                else {
                    console.log("data NOK !");
                    var str = "<p>Erreur : image camera indisponible</p>";
                }
                $('.image').html(str);
            }
            ws.onopen = function () {
                console.log("websocket engage");
                document.cookie = encodeURIComponent("user") + "=deleted; expires=" + new Date(0).toUTCString();
            };
            ws.onclose = function () {
                console.log("connection closed");
            };
            window.onbeforeunload=function(){
                ws.close();
            };
            function refresh() {
                console.log("Data send");
                ws.send("next");
            }
        </script>
    </head>
    <body onload="javascript:setInterval('refresh();',2000)">
        <h2>Vue camera</h2>
        <div class="image"></div>
        <form action="/disconnection" method="get">
            <input type="submit" value="Deconnexion">
        </form>
    </body>
</html>