添加自定义相机按钮

show-server/src/main/resources/server-page.xml

@@ -9,6 +9,8 @@
    <action name="Map" 		template="template/webapp/plugins/map.html"></action>
    <action name="Photo" 	template="template/webapp/plugins/photo.html"></action>
    <action name="CustomCamera" template="template/webapp/plugins/customCamera.html"></action>
    <!-- 自定义拍照插件可根据参数旋转图片 -->
    <action name="CustomCameraOrientation" template="template/webapp/plugins/customCameraOrientation.html"></action>
    <action name="File" 	template="template/webapp/plugins/file/file.html"></action>
    <action name="FileDetail" template="template/webapp/plugins/file/fileDetail.html"></action>
    <action name="Storage" 	template="template/webapp/plugins/storage.html"></action>

show-server/src/main/webapp/biz/js/plugins/customCameraOrientation.js

@@ -0,0 +1,49 @@
require(["domReady!","wadeMobile","jcl","iScroll","tap"], function(doc,WadeMobile,$,iScroll) {
	var iscroll = new iScroll("scroll-container");
	// 调用手机的照相功能，返回相片的路径或相片的Base64编码
	$("#face_picture").tap(function() {
		var width = $("#pic").width();
		var height = $("#pic").height();
		
		// 默认0；0：返回相片的路径，1：返回相片的Base64编码
		var resultType=0;
		// 相框类型，0(默认)：头像；1：身份证正面；2：身份证反面
		var frameType=0;
		// 图片方向，0(默认)：up；1：down；2：left；3：right
		var orientationType=0;
		WadeMobile.getIdentifyPhotoWithOrientation(function(path) {
			$("#path").html("路径：" + path);
//			$("#pic").removeClass("e_imagePlaceHolder");
			$("#pic").removeClass("fa").removeClass("fa-image");
			$("#pic").attr("class","");
			$("#pic").html("<img height='" + height + "' width='" + width + "' src='" + path + "'/>");
			iscroll.refresh();
		},frameType,resultType,orientationType);
	});
	
	$("#take_id_picture_front").tap(function() {
		var width = $("#pic_id_front").width();
		WadeMobile.getIdentifyPhotoWithOrientation(function(path) {
			$("#path_front").html("路径：" + path);
			$("#pic_id_front").removeClass("fa").removeClass("fa-image");
			$("#pic_id_front").attr("class","");
			$("#pic_id_front").html("<img width='" + width + "' src='" + path + "'/>");
			iscroll.refresh();
		},1,1,1);
	});
	
	$("#take_id_picture_back").tap(function() {
		var width = $("#pic_id_back").width();
		WadeMobile.getIdentifyPhotoWithOrientation(function(path) {
			$("#path_back").html("路径：" + path);
			$("#pic_id_back").removeClass("fa").removeClass("fa-image");
			$("#pic_id_back").attr("class","");
			$("#pic_id_back").html("<img width='" + width + "' src='" + path + "'/>");
			iscroll.refresh();
		},2,1,2);
	});
});

show-server/src/main/webapp/biz/js/plugins/pageHandler/pageHandler.js

@@ -24,16 +24,17 @@ require([ "wadeMobile", "mobile", "jcl" ], function(WadeMobile, Mobile, $) {
		// 可选按钮：isShare,isSearch,isCoppLink；分享、 搜索、复制链接。
		// color1,color2,color3：顶部背景色、图标颜色、字体颜色。
		$("#openUrl").click(function() {
			var url = "https://www.baidu.com";
//			var url = "https://www.baidu.com";
			var url = "https://hs.zxpt.vsens.com/mobile/homepage";
			var title = "自定义主题";
			var style = [ "#8BCBE4", "#FFFFFF", "#FFFFFF" ];
			var buttons = [ true, false, false ];
			var buttons = [ true, true, true ];
			WadeMobile.openUrl(url, function(result) {
			}, title, buttons, style);
		});
		$("#openUrlNoStyle").click(function() {
			var url = "https://www.baidu.com";
			var url = "https://hs.zxpt.vsens.com/mobile/homepage";
			WadeMobile.openUrl(url, function(result) {
			});
		});

show-server/src/main/webapp/ipu/frame/mobile/expand-mobile.js

@@ -43,10 +43,16 @@ define(["require","jcl"],function(require,Wade) {
				}
				storageCallback("getPhoto",callback);
				execute("getPhoto", [type],err);
			},getIdentifyPhoto:function(callback,frameType,resultType,err){//获取照片
			},
			getIdentifyPhoto:function(callback,frameType,resultType,err){//获取照片
				storageCallback("getIdentifyPhoto",callback);
				execute("getIdentifyPhoto", [frameType,resultType],err);
			},getPicture:function(callback,type,err){//获取照片
			},
			getIdentifyPhotoWithOrientation:function(callback,frameType,resultType,orientationType,err){//获取照片可根据参数旋转
				storageCallback("getIdentifyPhotoWithOrientation",callback);
				execute("getIdentifyPhotoWithOrientation", [frameType,resultType,orientationType],err);
			},
			getPicture:function(callback,type,err){//获取照片
				if(type==undefined){
					type = 1;//0-Base64编码的字符串 1- 文件路径
				}

show-server/src/main/webapp/template/webapp/plugins/customCameraOrientation.html

@@ -0,0 +1,73 @@
<!DOCTYPE HTML>
<html>
<head>
	<title>图片/自定义相机带图片旋转</title>
	{%>template/common/Head.html%}
	<script type="text/javascript" src="biz/js/plugins/customCameraOrientation.js"></script>
</head>
<body>
<div class="ipu-row-flex ipu-row-flex-ver">
		<div class="ipu-col ipu-col-auto">
			<header class="ipu-toolbar">
				<span class="ipu-icon fa fa-chevron-left ipu-fn-left" id="left-btn"></span> 
				<span class="ipu-icon fa fa-home  ipu-fn-right" id="right-btn"></span>
				<h1 class="ipu-toolbar-title">带头像框的拍照</h1>
			</header>
		</div>
		
		<div id="scroll-container" class="ipu-col">
			<div>
				<div class="demo-desc">拍照</div>
				<div class="ipu-card ">
					<div class="ipu-content ipu-border-b">
						<div class="label">人脸拍照</div>
						<div class="fn" id="face_picture"><span class="fa fa-camera"></span></div>
					</div>
					<div class="ipu-content ipu-content-vertical">
						<div class="label">返回结果</div>
						<div class="value">
							<span class="fa fa-image ipu-image-holder" id="pic" ></span>
						</div>
						<div class="info" id="path">路径：</div>
					</div>
					
				</div>
				
				<div class="ipu-card ">
					<div class="ipu-content ipu-border-b">
						<div class="label">身份证正面拍照</div>
						<div class="fn" id="take_id_picture_front"><span class="fa fa-camera"></span></div>
					</div>
					<div class="ipu-content ipu-content-vertical">
						<div class="label">返回结果</div>
						<div class="value">
							<span class="fa fa-image ipu-image-holder" id="pic_id_front" ></span>
						</div>
						<div class="info" id="path_front">路径：</div>
					</div>
					
				</div>
				
				<div class="ipu-card ">
					<div class="ipu-content ipu-border-b">
						<div class="label">身份证反面拍照</div>
						<div class="fn" id="take_id_picture_back"><span class="fa fa-camera"></span></div>
					</div>
					<div class="ipu-content ipu-content-vertical">
						<div class="label">返回结果</div>
						<div class="value">
							<span class="fa fa-image ipu-image-holder" id="pic_id_back" ></span>
						</div>
						<div class="info" id="path_back">路径：</div>
					</div>
					
				</div>
			</div>
		</div>
</div>
</body>
</html>

show-server/src/main/webapp/template/webapp/plugins/pluginIndex.html

@@ -20,6 +20,16 @@
	        <p>相机</p>
	    </li>
	    
	    <li class="ipu-col-33 ipu-text-center" data-action="CustomCamera">
	        <span class="ipu-icon fa fa-camera"></span>
	        <p>自定义相机</p>
	    </li>
	    
	    <li class="ipu-col-33 ipu-text-center" data-action="CustomCameraOrientation">
	        <span class="ipu-icon fa fa-camera"></span>
	        <p>自定义相机带图片旋转</p>
	    </li>
	    
	    <li class="ipu-col-33 ipu-text-center" data-action="File">
	        <span class="ipu-icon fa fa-folder-open"></span>
	        <p>文件</p>