140 lines
4.8 KiB
HTML
140 lines
4.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="description" content="WebRTC code samples">
|
|
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1, maximum-scale=1">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<base target="_blank">
|
|
<title>AI验真</title>
|
|
<link rel="stylesheet" href="css/main.css">
|
|
<link rel="stylesheet" href="css/loading.css">
|
|
</head>
|
|
|
|
<body>
|
|
<div class="loading" id="loading">
|
|
<div>
|
|
<div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
|
|
</div>
|
|
<div>
|
|
AI摄像头加载中...
|
|
</div>
|
|
</div>
|
|
<div id="container">
|
|
<div>
|
|
<div class="camoverlay">
|
|
<div class="upper overlay">
|
|
<div>
|
|
<div class="qrarc">
|
|
<img class="topleft arc" src="images/arc.png" />
|
|
<img class="topright arc" src="images/arc.png" />
|
|
<img class="bottomleft arc" src="images/arc.png" />
|
|
<img class="bottomright arc" src="images/arc.png" />
|
|
</div>
|
|
<img class="qrmarkers" src="images/qrmarkers.png" alt=""/>
|
|
</div>
|
|
<div class="hint wrapper">
|
|
<div id="hint" class="upper text" onclick="debug_countdown()">
|
|
对齐定位点
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<video class="preview" id="video" autoplay muted playsinline></video>
|
|
</div>
|
|
<div class="bottomfixed">
|
|
<div class="play action" onclick="show_modal('scanguide')">
|
|
<img
|
|
class="play"
|
|
src="images/play-button.png"
|
|
/>
|
|
验证演示
|
|
</div>
|
|
<div class="torch action" onclick="toggle_torch()">
|
|
<img
|
|
class="torch"
|
|
src="images/flash-button.png"
|
|
/>
|
|
开启补光
|
|
</div>
|
|
<div class="hidden tooltip"><span class="tooltiptext">遇到困难?</span></div>
|
|
</div>
|
|
<div class="hidden debug" id="debug_div">
|
|
<div class="buttons">
|
|
<button onclick="location.reload()">reload</button>
|
|
<button onclick="set_zoom(4)">4x zoom</button>
|
|
<button onclick="set_zoom(2)">2x zoom</button>
|
|
<button onclick="wx_submit('debug')">WX OK</button>
|
|
<button onclick="torch_onoff()">Torch</button>
|
|
<button onclick="hide_debug()">Hide</button>
|
|
</div>
|
|
<div>
|
|
<canvas class="hidden" id="original" width="2000" height="2000">
|
|
</canvas>
|
|
<canvas class="hidden" id="grayscale" width="2000" height="2000">
|
|
</canvas>
|
|
</div>
|
|
<div id="logs" class="bordered">
|
|
</div>
|
|
<div class="bordered">
|
|
Caps: <span id="caps"></span>
|
|
</div>
|
|
<div class="bordered">
|
|
Constraints: <span id="cons"></span>
|
|
</div>
|
|
</div>
|
|
<div class="modal hidden">
|
|
<div class="panel">
|
|
<div class="scanguide hidden">
|
|
<div id="scanguide">
|
|
</div>
|
|
</div>
|
|
<div class="serviceqr hidden">
|
|
<div class="imgbox">
|
|
<img id="service_img" src="https://emblem-resources.oss-accelerate.aliyuncs.com/service-qr2.png" alt=""/>
|
|
</div>
|
|
<div class="title">
|
|
长按识别二维码，添加人工客服
|
|
</div>
|
|
</div>
|
|
<div class="verifyfailed hidden">
|
|
<div class="circle">
|
|
!
|
|
</div>
|
|
<div class="title">验证未通过</div>
|
|
<div class="hints">
|
|
<div>
|
|
请按照验证指引
|
|
</div>
|
|
<div>重新验证</div>
|
|
<div>
|
|
-
|
|
</div>
|
|
<div>如反复验证仍无法通过</div>
|
|
<div>请联系人工客服</div>
|
|
</div>
|
|
</div>
|
|
<div class="actions">
|
|
<button onclick="show_modal('serviceqr')" class="service">人工客服</button>
|
|
<button onclick="hide_modal()" class="back">
|
|
<img class="return" src="images/return.png" alt=""/>
|
|
采集</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="verifyspin hidden">
|
|
<div class="spinner">
|
|
<img src="images/spinner.png" class="spin-image spin-and-shrink">
|
|
</div>
|
|
<div class="loading">
|
|
Loading
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
|
|
<script type="text/javascript" src="js/lottie.min.js"></script>
|
|
<script type="text/javascript" src="js/main.js"></script>
|
|
<script type="text/javascript" src="js/qrtool.web.js"></script>
|
|
</body>
|
|
</html>
|