barcode4nodejs/examples/desktop-electron/index.htm at main · yushulx/barcode4nodejs · 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
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Dynamsoft Barcode Reader</title>
    <link type="text/css" rel="stylesheet" href="../web/assets/css/style.css" />

    <script type="text/javascript">


        function fileSelected() {
            var count = document.getElementById('fileToUpload').files.length;
            if (count > 0) {
                var file = document.getElementById('fileToUpload').files[0];
                document.getElementById('filename').value = file.name;
            }
        }

        function getSelectedBarcodeTypes() {
            var vType = 0;
            var barcodeType = document.getElementsByName("BarcodeType");
            for (i = 0; i < barcodeType.length; i++) {
                if (barcodeType[i].checked == true)
                    vType = vType | (barcodeType[i].value * 1);
            }

            return vType;
        }

        function doReadBarcode() {
            var dbr = require('../../index.js');
            // Get a license key from https://www.dynamsoft.com/customer/license/trialLicense/?product=dcv&package=cross-platform
            dbr.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAxLTE2NDk4Mjk3OTI2MzUiLCJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSIsInNlc3Npb25QYXNzd29yZCI6IndTcGR6Vm05WDJrcEQ5YUoifQ==");
            var fileName = document.getElementById('fileToUpload').files[0].path;
            dbr.decodeFileAsync(fileName, getSelectedBarcodeTypes(), function (err, msg) {
                var response = 'Totol count: ' + msg.length;
                var result = null;
                for (index in msg) {
                    result = msg[index]
                    response += '<p>' + result['format'] + ': ';
                    response += result['value'] + '<p>';
                }
                document.getElementById('resultBox').innerHTML = response;
            }, "");
        }
    </script>
</head>

<body>
    <div id="wrapper">
        <div id="dbr-nodejs">
            <!--<form action="">-->
            <div class="step step1">
                <div id="fileUpload" class="getFile">
                    <span class="num">1</span>
                    <h4>
                        Upload from local:</h4>
                    <input type="file" id="fileToUpload" onchange="fileSelected();" />
                    <input type="text" readonly="readonly" id="filename" />
                    <input type="button" />
                </div>
                <div id="fileDownload" class="hidden getFile">
                    <span class="num">1</span>
                    <h4>
                        Specify an URL:</h4>
                    <input type="text" id="imageURL" />
                    <!--<input type="button"/>-->
                    <a class="clickSwitch" href="javascript:void(0);">or, Upload from local</a>
                </div>
            </div>
            <div class="step step2">
                <span class="num">2</span>
                <h4>
                    Barcode Types:</h4>
                <ul class="barcodeType">
                    <li class="on">
                        <label for="chkLinear">
                            <input id="chkLinear" name="BarcodeType" type="checkbox" checked="true" value="0x3FF">
                            <span>Linear</span>
                            <br />
                            <div class="imgWrapper">
                                <img src="../web/assets/images/oned.gif" width="90" alt="Barcode Type Linear" />
                            </div>
                        </label>
                    </li>
                    <li>
                        <label for="chkQRCode">
                            <input id="chkQRCode" name="BarcodeType" type="checkbox" value="0x4000000">
                            <span>QRCode</span>
                            <br />
                            <div class="imgWrapper">
                                <img src="../web/assets/images/qr.gif" width="60" alt="Barcode Type QRCode" />
                            </div>
                        </label>
                    </li>
                    <li>
                        <label for="chkPDF417">
                            <input id="chkPDF417" name="BarcodeType" type="checkbox" value="0x2000000">
                            <span>PDF417</span>
                            <br />
                            <div class="imgWrapper">
                                <img src="../web/assets/images/pdf417.gif" width="100" height="38"
                                    alt="Barcode Type PDF417" />
                            </div>
                        </label>
                    </li>
                    <li>
                        <label for="chkDataMatrix">
                            <input id="chkDataMatrix" name="BarcodeType" type="checkbox" value="0x8000000">
                            <span>DataMatrix</span>
                            <br />
                            <div class="imgWrapper">
                                <img src="../web/assets/images/dm.gif" width="60" alt="Barcode Type DataMatrix" />
                            </div>
                        </label>
                    </li>
                    <li>
                        <label for="chkDataMatrix">
                            <input id="chkDataMatrix" name="BarcodeType" type="checkbox" value="0x10000000">
                            <span>Aztec Code</span>
                            <br />
                            <div class="imgWrapper">
                                <img src="../web/assets/images/aztec.png" width="60" alt="Aztec Code" />
                            </div>
                        </label>
                    </li>
                </ul>
            </div>
            <div class="step step3">
                <span class="num">3</span>
                <a id="readBarcode" name="RecgabtnCssBarcode" onclick="doReadBarcode();">
                </a>
                <div id="resultBox">
                </div>
            </div>
            <!--</form>-->
        </div>
    </div>

</body>

</html>