-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbarcode-ui.html
More file actions
38 lines (38 loc) · 2.36 KB
/
barcode-ui.html
File metadata and controls
38 lines (38 loc) · 2.36 KB
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
<template>
<div style="position:relative;width:100%;height:100%;min-width:100px;min-height:100px;background:#ddd;">
<svg class="dce-bg-loading"
style="display:none;position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;width:40%;height:40%;fill:#aaa;animation:1s linear infinite dce-rotate;"
viewBox="0 0 1792 1792">
<path d="M1760 896q0 176-68.5 336t-184 275.5-275.5 184-336 68.5-336-68.5-275.5-184-184-275.5-68.5-336q0-213 97-398.5t265-305.5 374-151v228q-221 45-366.5 221t-145.5 406q0 130 51 248.5t136.5 204 204 136.5 248.5 51 248.5-51 204-136.5 136.5-204 51-248.5q0-230-145.5-406t-366.5-221v-228q206 31 374 151t265 305.5 97 398.5z" />
</svg>
<svg class="dce-bg-camera"
style="display:none;position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;width:40%;height:40%;fill:#aaa;"
viewBox="0 0 2048 1792">
<path d="M1024 672q119 0 203.5 84.5t84.5 203.5-84.5 203.5-203.5 84.5-203.5-84.5-84.5-203.5 84.5-203.5 203.5-84.5zm704-416q106 0 181 75t75 181v896q0 106-75 181t-181 75h-1408q-106 0-181-75t-75-181v-896q0-106 75-181t181-75h224l51-136q19-49 69.5-84.5t103.5-35.5h512q53 0 103.5 35.5t69.5 84.5l51 136h224zm-704 1152q185 0 316.5-131.5t131.5-316.5-131.5-316.5-316.5-131.5-316.5 131.5-131.5 316.5 131.5 316.5 316.5 131.5z" />
</svg>
<div class="dce-video-container" style="position:absolute;left:0;top:0;width:100%;height:100%;"></div>
<div class="dce-scanarea" style="position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;">
<div class="dce-scanlight"
style="display:none;position:absolute;width:100%;height:3px;background:#ff0000;animation:2s infinite dce-scanlight alternate ease-in-out;user-select:none;"></div>
</div>
<div style="position: absolute;left: 0;top: 0;">
<select class="dce-sel-camera" style="display: block;"></select>
<select class="dce-sel-resolution" style="display: block;margin-top: 5px;">
<option class="dce-opt-gotResolution" value="got"></option>
<option data-width="1920" data-height="1080">ask 1920x1080</option>
<option data-width="1280" data-height="720">ask 1280x720</option>
<option data-width="640" data-height="480">ask 640x480</option>
</select>
</div>
</div>
<style>
@keyframes dce-rotate {
from { transform: rotate(0turn); }
to { transform: rotate(1turn); }
}
@keyframes dce-scanlight {
from { top: 0; }
to { top: 100%; }
}
</style>
</template>