rschneider/fitness-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add serial api

Browse Source
This commit is contained in:
Schneider Roland 2023-08-24 07:02:43 +02:00
parent d0dfd677d0
commit 691eb0cf23
1 changed files with 85 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
frontend/views/customer/reception.php
View File

@ -1,11 +1,14 @@
<?php
<?php
use frontend\components\ReceptionWidget;
?>
<?php
\frontend\assets\AppAsset::register($this);
<?php
\frontend\assets\AppAsset::register($this);
?>
<h1>Recepció</h1>
<?php echo ReceptionWidget::widget( ['form' => $model, 'route' => ['customer/reception'] ] )?>
<?php
echo ReceptionWidget::widget(['form' => $model, 'route' => ['customer/reception']]) ?>
<script>
const qrcodeReader = {
usbVendorId: 0x0c2e, usbProductId: 0x1094, name: 'qrcode'
@ -15,6 +18,8 @@ use frontend\components\ReceptionWidget;
usbVendorId: 0x09d8, usbProductId: 0x0420, name: 'rfid'
};
const readers = [qrcodeReader,rfidReader];
let defaultOptions = {
device: {
name: '',
@ -44,15 +49,15 @@ use frontend\components\ReceptionWidget;
value = null;
options = null;
constructor(options){
constructor(options) {
this.options = options;
}
initialize = async () =>{
initialize = async () => {
await this.connect();
}
listen = async (options) => {
listen = async (options) => {
const port = options.port;
console.info("listening device", options?.device?.name);
while (port.readable) {
@ -82,15 +87,13 @@ use frontend\components\ReceptionWidget;
const ports = await navigator.serial.getPorts([device]);
return ports.find(value => {
const info = value.getInfo();
return info.usbProductId === device.usbProductId
&& info.usbVendorId === device.usbVendorId;
return info.usbVendorId === device.usbVendorId;
});
}
connect = async () => {
const options = this.options;
this.port = await this.getPortByDevice({
usbProductId: options.device.usbProductId,
usbVendorId: options.device.usbVendorId
});
if (!this.port) {
@ -113,7 +116,6 @@ use frontend\components\ReceptionWidget;
};
isConnected = () => {
return this.connected;
}
@ -142,50 +144,95 @@ use frontend\components\ReceptionWidget;
}
const ready = async () => {
const pikcAPort =
async () =>
{
const vendors = document.getElementById('vendors');
const deviceGroupName = vendors.value;
let filters = undefined;
const usbVendorId = readers.find(reader => reader.name === deviceGroupName)
if (deviceGroupName) {
let vendor = (deviceGroupName == 'rfid') ? rfidReader.usbVendorId : qrcodeReader.usbVendorId;
const qrcode = new SerialReader({
...defaultOptions,
device: qrcodeReader,
onChange: (value) => {
console.info(value)
filters = [{
usbVendorId
}];
}
});
const rfid = new SerialReader({
...defaultOptions,
device: rfidReader,
onChange: (value) => {
console.info(value)
}
});
const requestedPort = await navigator.serial
.requestPort({
filters
})
await qrcode.initialize();
await rfid.initialize();
}
const btnRfid = document.getElementById("rfid");
const btnQRcode = document.getElementById("qrcode");
}
btnRfid.addEventListener('click', async () =>{
await rfid.requestPair();
});
const qrcode = new SerialReader({
...defaultOptions,
device: qrcodeReader,
onChange: (value) => {
console.info(value)
}
});
btnQRcode.addEventListener('click', async () =>{
await qrcode.requestPair();
})
const rfid = new SerialReader({
...defaultOptions,
device: rfidReader,
onChange: (value) => {
console.info(value)
}
});
await qrcode.initialize();
await rfid.initialize();
const btnRfid = document.getElementById("rfid");
const btnQRcode = document.getElementById("qrcode");
btnRfid.addEventListener('click', async () => {
await rfid.requestPair();
});
btnQRcode.addEventListener('click', async () => {
await qrcode.requestPair();
})
const sleep = m => new Promise(r => setTimeout(r, m))
const readStatus = async (millis) => {
const serialPorts = await navigator.serial.getPorts();
const infoDiv = document.getElementById('allowed_devices');
infoDiv.innerHTML = '';
for (let port of serialPorts) {
const {usbVendorId, usbProductId} = port.getInfo();
const infoDiv = document.createElement('div');
infoDiv.innerHTML = '' + usbVendorId + '|' + usbProductId;
infoDiv.append(infoDiv);
}
await sleep(millis);
await readStatus(millis);
}
}
document.addEventListener('DOMContentLoaded', ready);
</script>
<div class="mt-3 ">
<h3>Engedélyezett eszközök</h3>
<div id="allowed_devices"></div>
<label for="vendors">Gyártók</label>
<select name="vendors" id="vendors" class="vendors">
<option value="">Mind</option>
<option value="qrcode">QRCode</option>
<option value="rfid">RFID</option>
</select>
<button class="btn btn-primary" id="rfid">Kártya Olvasó engedélyezése</button>
<button class="btn btn-primary" id="qrcode">QRCode Olvasó engedélyezése</button>
<button class="btn btn-primary" id="rfid">Kártya Olvasó engedélyezése</button>
<button class="btn btn-primary" id="qrcode">QRCode Olvasó engedélyezése</button>
</div>
<?php
<?php
// echo "Timezone:" . date_default_timezone_get();
//echo date("Y-m-d H:i");
//echo date("Y-m-d H:i");
?>