TestWebUSB-SerialPort/index.html at master · aaronsalva27/TestWebUSB-SerialPort · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script type="text/javascript" src="librarys/bops.js"></script>
    <script type="text/javascript" src="librarys/events.js"></script>
    <script type="text/javascript" src="librarys/util.js"></script>
    <script type="text/javascript" src="librarys/serialport.js"></script>
    <script type="text/javascript" src="librarys/firmata.js"></script>
    <script type="text/javascript" src="librarys/serial.js"></script>
    <script type="text/javascript" src="librarys/webusb-serial.js"></script>

</head>

<body>
    <h1>WebUsb</h1>
    <button id="connect">Connect</button>
    <button id="testBoard">Test Board</button>


    <script>
        /*Generate Board object from firmata library with a serial port object
        from demo of arduino (file serial.js)
        */
        var board;

        function generateFirmataBoard(port) {
            board = new Board(port, function (err) { console.log(err) });
            console.log(board);
            return board;
        }


        document.addEventListener('DOMContentLoaded', event => {
            let connectButton = document.querySelector('#connect');
            function connect() {
                console.log('Connecting to ' + port.device_.productName + '...');
                port.connect().then(() => {
                    console.log(port);
                    console.log('Connected.');
                    connectButton.textContent = 'Disconnect';
                    ////////
                    generateFirmataBoard(port);
                    ////////
                    port.onReceive = data => {
                        console.log(data);
                    }
                    port.onReceiveError = error => {
                        console.log('Receive error: ' + error);
                    };
                }, error => {
                    console.log('Connection error: ' + error);
                });
            };

            connectButton.addEventListener('click', function () {
                if (port) {
                    port.disconnect();
                    connectButton.textContent = 'Connect';
                } else {
                    serial.requestPort().then(selectedPort => {
                        port = selectedPort;
                        connect();
                    }).catch(error => {
                        console.log('Connection error: ' + error);
                    });
                }
            });

            serial.getPorts().then(ports => {
                if (ports.length == 0) {
                    console.log('No devices found.');
                } else {
                    port = ports[0];
                    connect();
                }
            });
        });

        document.getElementById("testBoard").addEventListener("click", function () {
            console.log("board");
            board.reset();
        });


    </script>
</body>

</html>