pages/index.html at main · wessels2/pages · 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
<html>
    <body>
        <div id="div_supported">Support: --</div>
        <div id="div_read">
            <div id="div_read_x">x: --</div>
            <div id="div_read_y">y: --</div>
            <div id="div_read_z">z: --</div>
            <div id="div_read_t">time: --</div>
        </div>

    <button id="btn_start" style="display: none;">Start</button>
    </body>

    <script>
        const div_supported = document.getElementById('div_supported');
        const div_read_x = document.getElementById('div_read_x');
        const div_read_y = document.getElementById('div_read_y');
        const div_read_z = document.getElementById('div_read_z');
        const div_read_t = document.getElementById('div_read_t');
        const btn_start = document.getElementById('btn_start');

        let accelerometer = null;
        function setupAccelerometer() {
            if(!('Accelerometer' in window)) {
                div_supported.innerText = 'Support: Accelerometer is not supported';
                return
            }
            div_supported.innerText = 'Support: Accelerometer is supported';
            btn_start.style.display = 'block';

            accelerometer = new Accelerometer();

            accelerometer.addEventListener("reading", () => {
                div_read_x.innerText = accelerometer.x;
                div_read_y.innerText = accelerometer.y;
                div_read_z.innerText = accelerometer.z;
                div_read_t.innerText = accelerometer.timestamp;
            });
        }

        setupAccelerometer()

        btn_start.addEventListener('click', () => {
            if(!accelerometer){
                return;
            }

            if(!accelerometer.activated) {
                accelerometer.start();
                btn_start.innerText = 'Stop';
                return
            }

            if(accelerometer.activated) {
                accelerometer.stop();
                btn_start.innerText = 'Start';
                return
            }
        });
    </script>
</html>