342 lines
15 KiB
Plaintext
342 lines
15 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WelderTrain.aspx.cs" Inherits="FineUIPro.Web.RLSB.WelderTrain" %>
|
||
|
||
<!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 runat="server">
|
||
<title>人脸识别训练</title>
|
||
<script src="../Scripts/jquery-1.8.3.js" type="text/javascript"></script>
|
||
<script src="../Scripts/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script>
|
||
<link href="../Styles/Site.css" rel="stylesheet" type="text/css" />
|
||
<link href="../Styles/sunny/jquery-ui-1.9.2.custom.min.css" rel="stylesheet" type="text/css" />
|
||
<script language="JavaScript" for="videoctrl" event="OnServerResult(param,type)">
|
||
if(type==0){
|
||
//人脸识别结果，param的格式为 "OK:LABEL,IMAGE;LABEL,IMAGE" 或 "ERR:2错误号";
|
||
if ( param.indexOf('OK:') == 0 )
|
||
{
|
||
var ret = param.substr(3).split(';');
|
||
if(ret.length>0){
|
||
if( ret[0] == ""){
|
||
$('#idet .tips').html('未能识别出，请检查人脸库!');
|
||
return;
|
||
}
|
||
//目前只使用第一个;
|
||
var subret = ret[0].split(',');
|
||
var label = subret[0];
|
||
var jidu = parseFloat(subret[1]);
|
||
var image = subret[2];
|
||
ShowShiBieResult(label,jidu,image);
|
||
}else{
|
||
$('#idet .tips').html('未能识别出，请检查人脸库!');
|
||
}
|
||
}else{
|
||
$('#idet .tips').html('识别出错:'+param);
|
||
}
|
||
}else if(type ==1){
|
||
//操作方式的返回结果!
|
||
$('#idet .tips').html(param);
|
||
}
|
||
</script>
|
||
<script type="text/javascript">
|
||
$("#upload").attr("src", "uploadimg.aspx?identityCard=" + $('input[name=xunlianlabel]').val())
|
||
|
||
if (!String.prototype.trim) {
|
||
String.prototype.trim = function () {
|
||
return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
|
||
};
|
||
}
|
||
function GetServerUrl() {
|
||
var pos = window.location.href.lastIndexOf('/');
|
||
var url = window.location.href.substr(0, pos) + "/RLSBProccess.ashx";
|
||
return url;
|
||
}
|
||
/*
|
||
jidu = 0.0 ~ 1.0
|
||
*/
|
||
function SetFilterJidu(jidu) {
|
||
/*
|
||
* SetSameDetectJidu 设置相同人脸过滤的精确度（0到1之间， 1是完全同一张脸100%，0==%0
|
||
* 当自动识别模式开启时，会自动检测人脸，如果上一张人脸与当前人脸相似度大于某个值时就不会上传服务器验证，认为是同一个，如果低于某个值就
|
||
* 认为是不相同的人，则要上传验证，此选项可以降低频繁向服务器发送作用不大的请求。
|
||
* 手工验证不受此值影响。
|
||
*/
|
||
//默认此项
|
||
|
||
if (!jidu || jidu == '') { jidu = '0.85'; }
|
||
videoctrl.SetSameDetectJidu(parseFloat(jidu));
|
||
}
|
||
function OpenCamera() {
|
||
|
||
videoctrl.OpenCamera(parseInt($('select[name=cameraIdx]').val()));
|
||
}
|
||
function SetServerUrl() {
|
||
|
||
videoctrl.SetRequestUrl(GetServerUrl());
|
||
}
|
||
function CloseCamera() {
|
||
videoctrl.CloseCamera();
|
||
}
|
||
function ShowUploading(uploading) {
|
||
$('.mask').css('display', uploading ? '' : 'none');
|
||
$('.uploadifrm').css('display', !uploading ? '' : 'none');
|
||
}
|
||
function OnBeginUpload() {
|
||
ShowUploading(true);
|
||
}
|
||
function OnUploadOver() {
|
||
ShowUploading(false);
|
||
}
|
||
function ReLoadUploadImg() {
|
||
ShowUploading(false);
|
||
$('#importface iframe').attr('src', 'uploadimg.aspx');
|
||
}
|
||
//通过标签删除
|
||
function DeleteLabel() {
|
||
var label = $('input[name=dellabel]').val();
|
||
label = label.trim();
|
||
if ('' == label) {
|
||
$('<p>请输入要删除的标签!</p>').dialog({ autoOpen: true, width: 300, title: '操作提示' });
|
||
return;
|
||
}
|
||
if (!confirm("确定要删除吗？删除不可恢复！"))
|
||
return;
|
||
$('#facelib .tips').html('正删除中……');
|
||
$.post('RLSBProccess.ashx', { action: 'delliblabel', label: label }, function (data) {
|
||
$('#facelib .tips').html(data.desc);
|
||
LoadFaceLibLabel();
|
||
});
|
||
}
|
||
//通过文件名删除人脸库
|
||
function DelLibByFile(file, idx) {
|
||
if (!confirm("确定要删除吗？删除不可恢复！"))
|
||
return;
|
||
$('#facelib .tips').html('正删除中……');
|
||
$.post('RLSBProccess.ashx', { action: 'dellibfile', filename: file }, function (data) {
|
||
$('#facelib .tips').html(data.desc);
|
||
});
|
||
$('.labellist tr[data=img_tr_' + idx + ']').remove();
|
||
}
|
||
function ShowRetInfo(a) {
|
||
function Alert(s) { $('#idet .tips').html(s); }
|
||
if (a != 0) {
|
||
switch (a) {
|
||
case 1:
|
||
Alert("未打开摄像头！");
|
||
break;
|
||
case 2:
|
||
Alert("当前帧未检测到人脸，请重试！");
|
||
break;
|
||
case 3:
|
||
Alert("存储临时文件失败!");
|
||
break;
|
||
case 4:
|
||
Alert('处理正忙……');
|
||
break;
|
||
}
|
||
//alert("failed UploadImageAndCheck " + a);
|
||
} else {
|
||
//Alert("正上传服务验证中……");
|
||
}
|
||
}
|
||
function XunLianRenLian() {
|
||
ShowTips('...');
|
||
|
||
var label = $('input[name=xunlianlabel]').val();
|
||
label = label.trim();
|
||
if ('' == label) {
|
||
$('#idet .tips').html('请输入标签后再训练!'); return;
|
||
}
|
||
|
||
//接口是异步，需要回调消息里面得结果
|
||
var ret = videoctrl.UploadImageAndTrain(GetServerUrl(), label);
|
||
|
||
// ShowRetInfo(ret);
|
||
}
|
||
function ShiBie() {
|
||
ShowTips('...');
|
||
//接口是异步，需要回调消息里面得结果
|
||
var ret = videoctrl.UploadImageAndCheck(GetServerUrl());
|
||
// ShowRetInfo(ret);
|
||
}
|
||
//是否启动自动检测人脸并上传验证
|
||
function OnAutoDecete() {
|
||
if ($('input[name=auto_decete]').prop('checked')) {
|
||
videoctrl.EnableAutoDetect(1);
|
||
} else {
|
||
videoctrl.EnableAutoDetect(0);
|
||
}
|
||
}
|
||
function OnQuickMode() {
|
||
if ($('input[name=quick_mode]').prop('checked')) {
|
||
if (!confirm('启动快速模式将有可能降低精确度，确定要启动吗？')) {
|
||
$('input[name=quick_mode]').prop('checked', false);
|
||
return;
|
||
}
|
||
videoctrl.EnableQuickMode(1);
|
||
} else {
|
||
videoctrl.EnableQuickMode(0);
|
||
}
|
||
}
|
||
function ShowTips(txt) { $('#idet .tips').html(txt); }
|
||
function ShowShiBieResult(label, jidu, image) {
|
||
var filter = parseFloat($('input[name=jidu]:checked').val());
|
||
if (filter <= jidu) {
|
||
ShowTips('识别出【<strong>' + label + '</strong>】,精准度:' + Math.floor(jidu * 100) + '%');
|
||
} else {
|
||
ShowTips('无法识别，但系统猜测结果是【<strong>' + label + '</strong>】,精准度:' + Math.floor(jidu * 100) + '%');
|
||
}
|
||
|
||
}
|
||
var g_bFirstLoadFace = true;
|
||
function LoadFaceLibLabel() {
|
||
$('#facelib .tips').html('');
|
||
$('#facelibpane').html('加载中……');
|
||
|
||
function PrompEmpty() {
|
||
// $('#facelibpane').html('<font color=red>人脸库为空，需要先增加！</font>');
|
||
if (g_bFirstLoadFace) {
|
||
g_bFirstLoadFace = false;
|
||
// $('<font color=red>人脸库为空，需要先增加！</font>').dialog({ autoOpen: true, width: 400, title: '提示' });
|
||
ShowTips('人脸库为空，需要先增加！');
|
||
}
|
||
}
|
||
function parseLabel(data) {
|
||
var html = '<div class="labellist"><table>';
|
||
$(data.list).each(function (i, o) {
|
||
html += '<tr data="img_tr_' + i + '" onmouseover="javascript:this.style.backgroundColor=\'#FFD54A\'" onmouseout="javascript:this.style.backgroundColor=\'\'">';
|
||
html += '<td>' + o.Label + '</td>';
|
||
html += '<td><img src="' + GetServerUrl() + '?action=getimage&name=' + o.Image + '"/></td>';
|
||
html += '<td><a href="javascript:DelLibByFile(\'' + o.Image + '\',' + i + ');">删除</a></td>';
|
||
html += '</tr>';
|
||
});
|
||
html += '</table></div>';
|
||
$('#facelibpane').html(html);
|
||
}
|
||
//get method
|
||
|
||
$.ajax(GetServerUrl() + '?action=alllabelimage&t=' + (new Date()).getTime(), {
|
||
success: function (data) {
|
||
$("#upload").attr("src", "uploadimg.aspx?identityCard=" + $('input[name=xunlianlabel]').val());
|
||
if ('' == data) {
|
||
PrompEmpty();
|
||
} else {
|
||
var o = eval('(' + data + ')');
|
||
if (o.err == 0) {
|
||
if (o.list == null || o.list.length == 0) {
|
||
PrompEmpty();
|
||
} else {
|
||
parseLabel(o);
|
||
}
|
||
} else {
|
||
$('#facelibpane').html("加载失败:" + e.desc);
|
||
}
|
||
}
|
||
},
|
||
error: function (data) {
|
||
$('#facelibpane').html("加载失败请<a href='javascript:LoadFaceLibLabel();'>重试</a>!");
|
||
}
|
||
});
|
||
}
|
||
//初始化
|
||
function OnInitLoad() {
|
||
LoadFaceLibLabel(); //加载人脸图库
|
||
SetServerUrl(); //一定要设置之后，自动识别才有效果
|
||
setTimeout(OpenCamera, 3000); //自动打开摄像头
|
||
|
||
SetFilterJidu(0.85); //设置默认过滤相同人脸
|
||
OnAutoDecete(); //自动识别检测
|
||
//由于快速会影响识别的精确度，所以先取消掉
|
||
///OnQuickMode(); //启动快速模式
|
||
}
|
||
$(function () {
|
||
$('#tabsmain').tabs({
|
||
beforeActivate: function (event, ui) {
|
||
if (ui.newTab) {
|
||
|
||
if (ui.newTab.find('a[href=#facelib]').length == 1) {
|
||
LoadFaceLibLabel();
|
||
}
|
||
}
|
||
}
|
||
});
|
||
$("#vdo_options,#faceliboption").accordion({ collapsible: true, heightStyle: "content" });
|
||
$('#radiosetjidu').buttonset();
|
||
$('input[type=button]').button();
|
||
$('#sliderjidu').slider({
|
||
min: 1, max: 100, value: 85,
|
||
slide: function (event, ui) {
|
||
$("#sliderjidutips").val(ui.value + '%');
|
||
var fjidu = parseFloat(ui.value);
|
||
fjidu /= 100;
|
||
SetFilterJidu(fjidu);
|
||
}
|
||
});
|
||
//var vdoCtrl = document.getElementById('videoctrl');
|
||
OnInitLoad();
|
||
});
|
||
</script>
|
||
</head>
|
||
<body style="margin-left: 50px">
|
||
<div id="wapper">
|
||
<div class="main">
|
||
<div id="tabsmain">
|
||
<ul>
|
||
<li><a href="#idet">人脸识别</a></li>
|
||
<li><a href="#facelib">人脸库</a></li>
|
||
<li><a href="#importface">导入人脸库</a></li>
|
||
</ul>
|
||
<div id="idet">
|
||
<div class="tips">
|
||
</div>
|
||
<div class="video">
|
||
<object id="videoctrl" width="500" height="380" classid="CLSID:423B9F4C-A606-450D-9151-B44B511B4DC3">
|
||
此控件需在IE下面才能正常运行！
|
||
</object>
|
||
</div>
|
||
<div class="vdotool">
|
||
<select name="cameraIdx">
|
||
<option value="0">摄像头1</option>
|
||
<option value="1">摄像头2</option>
|
||
</select>
|
||
<input value="打开摄像头" onclick="OpenCamera()" type="button" />
|
||
<input type="button" value="关闭摄像头" onclick="CloseCamera()" />
|
||
</div>
|
||
<div id="vdo_options">
|
||
<h3>
|
||
训练人脸</h3>
|
||
<div>
|
||
标签：<input type="text" runat="server" id="xunlianlabel" name="xunlianlabel" readonly="readonly" /> <input
|
||
type="button" value="训练当前帧" onclick="XunLianRenLian()" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="facelib">
|
||
<div class="tips">
|
||
</div>
|
||
<div id="facelibpane">
|
||
</div>
|
||
<div id="faceliboption">
|
||
<h3>
|
||
按标签删除</h3>
|
||
<div>
|
||
输入要删除的标签:<input type="text" name="dellabel" /> <input type="button" value="删除标签"
|
||
onclick="DeleteLabel()" /></div>
|
||
</div>
|
||
</div>
|
||
<div id="importface">
|
||
<div class="desc">
|
||
你可以针对某人上传一张图片并设置一标签对应，可以一个标签对应多张图片!<br />
|
||
请尽量使用正脸照片!</div>
|
||
<div class="mask" style="display: none;">
|
||
上传处理中……</div>
|
||
<iframe class="uploadifrm" id="upload" frameborder="0" scrolling="no" width="80%"
|
||
height="400"></iframe>
|
||
<div class="tool">
|
||
<input type="button" value="终止或重新上传" onclick="ReLoadUploadImg()" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|