【提交内容】：场景测试

display-server/etc/server-data.xml

	
	<action name="FileUpDownload.upload" class="com.ai.server.bean.FileUpDownload" method="upload" verify="false"></action>
	
	<!-- ##################################场景演示########################################################### -->
	
	<!-- 登录场景*******************初始化验证码 -->
	<action name="SceneBean.initVerifyCode" class="com.ai.server.bean.SceneBean" method="initVerifyCode" verify="false"></action>
	<!-- 登陆 -->
	<action name="SceneBean.login" class="com.ai.server.bean.SceneBean" method="login" verify="false"></action>
	<!-- 刷新验证码 -->
	<action name="SceneBean.refreshVerifyCode" class="com.ai.server.bean.SceneBean" method="refreshVerifyCode" verify="false"></action>
	
	<!-- 数据请求场景***************测试您的人品 -->
	<action name="SceneBean.dataRequestScene" class="com.ai.server.bean.SceneBean" method="dataRequestScene" verify="false"></action>
	
</datas>

display-server/etc/server-page.xml

    
    <!-- Scene Demo -->
	<action name="Scene" template="template/webapp/scene/Scene.html"></action>
	<action name="Login" template="template/webapp/scene/Login.html"></action>
	<action name="DataRequest" template="template/webapp/scene/DataRequest.html"></action>
	<action name="TemplateRedirect" template="template/webapp/scene/TemplateRedirect.html"></action>
	<action name="SceneBean_login_init" template="template/webapp/scene/Login.html"></action>
	<action name="SceneBean_dataRequest" template="template/webapp/scene/DataRequest.html"></action>
	<action name="SceneBean_templateRedirect" template="template/webapp/scene/TemplateRedirect.html"></action>
	<action name="PageRedirect" template="template/webapp/scene/PageRedirect.html"></action>
	<action name="TemplateRefresh" template="template/webapp/scene/TemplateRefresh.html"></action>
	<action name="PageRefresh" template="template/webapp/scene/PageRefresh.html"></action>

display-server/src/com/ai/server/bean/SceneBean.java

package com.ai.server.bean;
import java.awt.image.BufferedImage;
import java.util.Random;
import com.ai.server.core.bean.DisplayBean;
import com.ai.server.core.context.DisplayContextData;
import com.ai.server.core.session.DisplaySessionManager;
import com.ai.server.util.ImageVerify;
import com.ailk.common.data.IData;
import com.ailk.common.data.impl.DataMap;
import com.ailk.mobile.util.MobileUtility;
public class SceneBean extends DisplayBean {
	/**
	 * 数据请求场景
	 * 
	 * @param param
	 * @return
	 * @throws Exception
	 */
	public IData dataRequestScene(IData param) throws Exception {
		IData result = new DataMap();
		// 获取从前台传过来的数据
		String data = param.getString("data");
		// 获取人品--随机数
		Random random = new Random();
		int testCharacter = random.nextInt(100);
		
		StringBuffer retMsg = new StringBuffer();
		if (testCharacter > 0 && testCharacter < 20) {
			retMsg.append("是我不好...不应该和你谈人品问题的...");
		} else if (testCharacter >= 20 && testCharacter < 40) {
			retMsg.append("您的人品之低下实在让人惊讶啊...");
		} else if (testCharacter >= 40 && testCharacter < 60) {
			retMsg.append("您的人品太差了..稍不小心就会去干坏事了吧？");
		} else if (testCharacter >= 60 && testCharacter < 80) {
			retMsg.append("您的人品勉勉强强...要自己好自为之...");
		} else if (testCharacter >= 80 && testCharacter <= 100) {
			retMsg.append("您的人品太好了...你就是当代活雷锋啊...");
		}
		result.put("retName", data);
		result.put("retMsg", retMsg);
		return result;
	}
	/**
	 * 初始化验证码
	 * 
	 * @param param
	 * @return
	 * @throws Exception
	 */
	public IData initVerifyCode(IData param) {
		IData result = new DataMap();
		try {
			// 获取验证码
			String verifyCode = ImageVerify.getVerifyCode(4, 2);
			BufferedImage image = ImageVerify.getImageVerify(verifyCode);
			String imageVerifyCode = ImageVerify.getImageBase64(image);
			// 创建session
			DisplayContextData contextData = new DisplayContextData();
			String sessionId = DisplaySessionManager.getInstance()
					.createSession(contextData);
			contextData.setVerifyCode(verifyCode.toUpperCase());
			result.put("VERIFY_IMG", imageVerifyCode);
			result.put("SESSION_ID", sessionId);
		} catch (Exception e) {
			e.printStackTrace();
		}
public class SceneBean extends DisplayBean{
	
	public IData dataRequestScene(IData param) throws Exception{
		return null;
		return result;
	}
	/**
	 * 
	 * @Title: refreshVerifyCode
	 * @Description: 刷新验证码
	 * @author 王玉娟
	 * @param prama
	 * @return
	 * @throws Exception
	 * @throws
	 */
	public IData refreshVerifyCode(IData prama) throws Exception {
		// 获取验证码
		String verifyCode = ImageVerify.getVerifyCode(4, 2);
		BufferedImage image = ImageVerify.getImageVerify(verifyCode);
		String imageVerifyCode = ImageVerify.getImageBase64(image);
		if (getContextData() == null) {
			// 创建session
			DisplayContextData contextData = new DisplayContextData();
			DisplaySessionManager.getInstance().createSession(contextData);
		}
		getContextData().setVerifyCode(verifyCode);
		IData result = new DataMap();
		result.put("VERIFY_IMG", imageVerifyCode);
		return result;
	}
	/**
	 * 登陆
	 * 
	 * @param param
	 * @return
	 */
	public IData login(IData param) {
		IData result = new DataMap();
		// 校验验证码是否输入正确
		if (!checkLoginVerifyCode(param)) {
			MobileUtility.error("登陆失败，验证码输入错误!");
			return result;
		}
		// 将用户信息保存至session
		try {
			getContextData().setAccount(param.getString("USER_NAME"));
			return getContextData().getData();
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			return result;
		}
	}
	/**
	 * 
	 * @Title: checkLoginVerifyCode
	 * @Description: 校验登陆的验证码
	 * @author 王玉娟
	 * @param param
	 * @return true:验证码正确；false:验证码输入错误
	 * @throws
	 */
	private boolean checkLoginVerifyCode(IData param) {
		try {
			String verifyCode = getContextData().getVerifyCode();
			String clientVerifyCode = param.getString("VERIFY_CODE");
			if (clientVerifyCode == null || verifyCode == null
					|| !verifyCode.equalsIgnoreCase(clientVerifyCode)) {
				return false;
			}
			return true;
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			return false;
		}
	}
}

display-server/src/com/ai/server/core/context/DisplayContextData.java

@SuppressWarnings("serial")
public class DisplayContextData extends DefaultContextData{
	public DisplayContextData() {
		
	}
	public DisplayContextData(String account) {
		// TODO Auto-generated constructor stub
		getData().put(Constant.Context.ACCOUNT, account);
		// TODO Auto-generated method stub
		put(Constant.Context.ACCOUNT, account);
	}
	
	public String getVerifyCode()
    {
        return getData().getString("VERIFY_CODE");
    }
    public void setVerifyCode(String verifyCode)
    {
        put("VERIFY_CODE", verifyCode);
    }
}

display-server/src/com/ai/server/util/ImageVerify.java

package com.ai.server.util;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.util.Random;
public class ImageVerify {
	private static Random random=new Random();
	
	public static BufferedImage getImageVerify(String randomCode) {
		int width=100;
		int height=45;                     //验证图片的宽度，高度
		Color back=getBack();
		Color front=getFront(back);
		String code=randomCode;
        BufferedImage bi=new BufferedImage(width,height,BufferedImage.TYPE_INT_BGR);
        Graphics2D g=bi.createGraphics();   //得到画布
        g.setFont(new Font(Font.SANS_SERIF,Font.BOLD,20));  //设置字体
        g.setColor(back);
        g.fillRect(0, 0, width, height);    //画背景
        g.setColor(front);
        g.drawString(code,18,20);           //画字符
        for(int i=0,n=random.nextInt(20);i<n;i++){
        	g.fillRect(random.nextInt(width),random.nextInt(height),1,1);
        }                                  //产生至多20个噪点
        return bi;
	}
	
	 //得到图片背景色
	protected static Color getBack(){
		return new Color(random.nextInt(255),random.nextInt(255),random.nextInt(255));
	}
	
	//生成颜色的反色
	protected static Color getFront(Color c){
		return new Color(255-c.getRed(),255-c.getGreen(),255-c.getBlue());
	}
}
package com.ai.server.util;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.util.Random;
import javax.imageio.ImageIO;
import org.apache.commons.codec.binary.Base64;
/**
 * @author huangbo
 * 图片验证码类库
 */
public class ImageVerify {
	private static Random random = new Random();
	/**得到图片背景色*/
	private static Color getBack() {
		return new Color(random.nextInt(255), random.nextInt(255), random.nextInt(255));
	}
	/**生成颜色的反色*/
	private static Color getFront(Color c) {
		return new Color(255 - c.getRed(), 255 - c.getGreen(),
				255 - c.getBlue());
	}
	
	/**
	 * 图片转化成Base64编码
	 * @param filePath 文件过大可能内存溢出
	 */
	public static String getImageBase64(BufferedImage image) throws IOException {
		ByteArrayOutputStream baos = new ByteArrayOutputStream();
		ImageIO.write(image, "jpg", baos);
		byte[] jpegData = baos.toByteArray();
		return new String(Base64.encodeBase64(jpegData), "utf-8");
	}
	
	/**
	 * 生成校验图片
	 */
	public static BufferedImage getImageVerify(String code) {
		int width = 100;
		int height = 45; // 验证图片的宽度，高度
		Color back = getBack();
		Color front = getFront(back);
		BufferedImage bi = new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
		Graphics2D g = bi.createGraphics(); // 得到画布
		g.setFont(new Font(Font.SANS_SERIF, Font.BOLD, 20)); // 设置字体
		g.setColor(back);
		g.fillRect(0, 0, width, height); // 画背景
		g.setColor(front);
		g.drawString(code, 18, 20); // 画字符
		for (int i = 0, n = random.nextInt(20); i < n; i++) {
			g.fillRect(random.nextInt(width), random.nextInt(height), 1, 1);
		} // 产生至多20个噪点
		return bi;
	}
	/**
	 * 作用：获取六位随机码
	 */
	public static String getVerifyCode(int length, int verifyCodeType) throws Exception {
		String num = "0123456789";
		String ch = "abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNOPQRSTUVWXYZ";
		String vc = "";
		if (verifyCodeType == 0)
			vc = num;
		else if (verifyCodeType == 1)
			vc = ch;
		else
			vc = num + ch;
		char[] chs = vc.toCharArray();
		String code = "";
		for (int i = 0; i < length; i++) {
			code += chs[(int) (Math.random() * vc.length())];
		}
		
		return code;
	}
}

display-server/web/biz/js/scene/DataRequest.js

require(["mobile"], function(Mobile) {
	
	
	$("#direct").tap(function(){
	// 测测你的人品按钮
	$("#testCharacter").tap(function(){
		
		var param = new Wade.DataMap();
		param.put("data", $("#input-text").val());
		param.put("data", $("#J_username").val());
		
		Mobile.dataRequest("TestBean.reverse", param, function(result){
			//对于返回值result，有2种取值方式：
			//1.生成JSON对象
//			var obj = JSON.parse(result);
//			var textVal = obj["DATA"];
			
			//2.生成Map对象
		// 数据请求
		Mobile.dataRequest("SceneBean.dataRequestScene", param, function(result){
			// 获取返回的数据
			var obj = new Wade.DataMap(result);
			textVal = obj.get("DATA");
			var retName = obj.get("retName");
			var retMsg = obj.get("retMsg");
			
			$("#output-text").val(textVal);
			$("#retName").text(retName);
			$("#retMsg").text(retMsg);
			$("#mainTestCharacterContent").hide();
			$("#retTestCharacterContent").show();
		});
	});
	
	// 再测一次按钮
	$("#testCharacterAgain").tap(function(){
		$("#retName").text("");
		$("#retMsg").text("");
		$("#J_username").val("");
		$("#retTestCharacterContent").hide();
		$("#mainTestCharacterContent").show();
	});
	
});

display-server/web/biz/js/scene/Login.js

require(["wmTabbar","common","mobile"], function(WmTabbar,Common,Mobile) {
	Common.callSvc("SceneBean.initVerifyCode", null, function(resultData){
		if(typeof(resultData) == "string" ){
			resultData = new Wade.DataMap(resultData);
		}
		$("#J_ver_img").attr("src", "data:image/png;base64, " + resultData.get("VERIFY_IMG"));
		// 保存session_id
		Common.put("SESSION_ID", resultData.get("SESSION_ID"));
	});
	
	// 刷新验证码
	$("#J_ver_img").tap(function(){
		Common.callSvc("SceneBean.refreshVerifyCode", null, function(resultData){
			if(typeof(resultData) == "string" ){
				resultData = new Wade.DataMap(resultData);
			}
			$("#J_ver_img").attr("src", "data:image/png;base64, " + resultData.get("VERIFY_IMG"));
			$("#J_ver").val("");
			$("#J_ver").select();
		});
	})
	
	$("#submit").tap(function(){
	$("#sceneLoginBtn").tap(function(){
		var loginData = new Wade.DataMap();
		loginData.put("ACCOUNT", $("#userName").val());
		loginData.put("PASSWORD", $("#password").val());
		loginData.put("USER_NAME", $("#J_username").val());
		loginData.put("USER_PASSWORD", $("#J_pwd").val());
		loginData.put("VERIFY_CODE", $("#J_ver").val());
		
		Common.callSvc("LoginBean.login",loginData,function(data){
		Common.callSvc("SceneBean.login",loginData,function(data){
			console.log("结果[用户登陆]：" + data);
			//校验不正确
			if("0" != data.get("X_RESULTCODE")){
			
			//校验正确	
			}else{
				Mobile.openPage("Basic");
				Mobile.tip("亲爱的【"+data.get("ACCOUNT")+"】用户，登陆成功");
			}
		});
	});

display-server/web/biz/js/scene/TemplateRedirect.js

require(["mobile"], function(Mobile) {
	
	// 开始游戏
	$("#startGame").tap(function(){
		
		// 页面跳转
		var param = new Wade.DataMap();
		Mobile.openTemplate("SceneBean_dataRequest",param);
	});
	
});

display-server/web/res/js/mobile/expand-mobile.js

			},downloadWithServlet:function(savePath,dataAction,param,callback,err){
				storageCallback("downloadWithServlet",callback);
				execute("downloadWithServlet",[savePath,dataAction,param],err);	
			}uploadFile:function(filePath,servletUrl,callback,err){
			},uploadFile:function(filePath,servletUrl,callback,err){
				storageCallback("uploadFile",callback);
				execute("uploadFile",[filePath,servletUrl],err);	
			},downloadFile:function(savePath,servletUrl,callback,err){

display-server/web/template/webapp/scene/DataRequest.html

	{%>template/common/Head.html%}
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="biz/js/scene/DataRequest.js"></script>
<style>
.ui-input {
	padding: 6px 9px;
	line-height: 0.22rem;
    height: 0.4rem;
	width: 3rem;
	border: 1px solid #BBBBBB;
	font-size: 0.22rem;
    color: #777;
    background: transparent;
    font-size: 0.22rem;
}
.reg_form {
	background-color: #fff;
	font-size: 0.22rem;
	padding-top: 0.12rem;
	box-shadow: 0 0.02rem 0 rgba(0,0,0,0.1);
    line-height: 1;
    border: 1px solid #ccc;
    overflow: hidden;
    background: #fff;
}
.reg_form .reg_table {
}
.reg_form .reg_table td {
	padding: 0 0 8px 0;
	height: 32px;
}
.reg_form .reg_table td label.des {
	text-align: right;
	display: table-cell;
    width: 1.5rem;
    padding: 0.16rem;
    line-height: 0.28rem;
}
.reg_form .reg_table .J_ver-wrap .ui-input {
	width: 2rem;
}
</style>
</head>
<body>
<div class="c_navBar">
		</div>
	</div>
</div>
<div class="m_content m_content-nofooter" id="content">
<div>
	<div class="c_list">
		<ul>
			<li tapfor="input-text">
				<div class="content">
					<div class="value"><input type="text" placeholder="请输入文字" id="input-text"/></div>
					<button class="e_button-cancel" id="direct" style="float:right">反转</button>
				</div>
			</li>
		</ul>
		<ul>
			<li tapfor="input-text">
				<div class="content">
					<div class="value"><input type="text" placeholder="输出内容" id="output-text"/></div>
					<div class="label" style="float:right"></div>
				</div>
			</li>
			<li></li>
		</ul>
	</div>
</div>
	<form class="reg_form">
		<div id="mainTestCharacterContent">
			<table class="reg_table" cellpadding="0" cellspacing="0" border="0" width="100%">
				<tbody>
					<tr>
						<td width="30%"><label class="des">输入人名：</label></td>
						<td><input value="" type="text" id="J_username" name="J_username" class="ui-input ui-nt" maxlength="20" title="姓名"></td>
					</tr>
					<tr>
						<td>&nbsp;</td>
						<td>
							<button class="e_button-ok" id="testCharacter" onclick="javascript:return false;">开始计算</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		
		<div id="retTestCharacterContent" style="display: none">
			<table class="reg_table" cellpadding="0" cellspacing="0" border="0" width="100%">
				<tbody>
					<tr>
						<td width="30%"><label class="des">您的大名：</label></td>
						<td id="retName"></td>
					</tr>
					<tr>
						<td width="30%"><label class="des">评价：</label></td>
						<td id="retMsg"></td>
					</tr>
					<tr>
						<td>&nbsp;</td>
						<td>
							<button class="e_button-ok" id="testCharacterAgain" onclick="javascript:return false;">再测一次</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</form>
	
</div>
</body>

display-server/web/template/webapp/scene/Login.html

	{%>template/common/Head.html%}
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="biz/js/scene/Login.js"></script>
	
<style>
.ui-input {
	padding: 6px 9px;
	line-height: 0.22rem;
    height: 0.4rem;
	width: 3rem;
	border: 1px solid #BBBBBB;
	font-size: 0.22rem;
    color: #777;
    background: transparent;
    font-size: 0.22rem;
}
.reg_form {
	background-color: #fff;
	font-size: 0.22rem;
	padding-top: 0.12rem;
	box-shadow: 0 0.02rem 0 rgba(0,0,0,0.1);
    line-height: 1;
    border: 1px solid #ccc;
    overflow: hidden;
    background: #fff;
}
.reg_form .reg_table {
}
.reg_form .reg_table td {
	padding: 0 0 8px 0;
	height: 32px;
}
.reg_form .reg_table td label.des {
	text-align: right;
	display: table-cell;
    width: 1.5rem;
    padding: 0.16rem;
    line-height: 0.28rem;
}
.reg_form .reg_table .J_ver-wrap .ui-input {
	width: 2rem;
}
.J_ver_img {
	width: 1rem;
	height: 0.4rem;
}
</style>
</head>
<body>
	<div class="c_navBar">
		</div>
	</div>
	
	<div class="c_list">
		<ul>
			<li ontap=";">
				<div class="content">
					<div class="main" id="mention"></div>
				</div>
			</li>
		</ul>
	</div>
	
	<div class="c_table">
		<table border="none">
			<tbody id="tbody">
				<tr>
					<td></td>
					<td><input type="text" id="userName" required placeholder="用户名"></td>
					<td></td>
				</tr>
				<tr>
					<td></td>
					<td><input type="password" id="password" required placeholder="密码"></td>
					<td></td>
				</tr>
				<tr>
					<td></td>
					<td><input type="button" value="提交" id="submit"/></td>
					<td><a href="#">忘记密码？</a></td>
				</tr>
			</tbody>
		</table>
	<div class="m_content m_content-nofooter" id="content">
		<form class="reg_form">
			<table class="reg_table" cellpadding="0" cellspacing="0" border="0" width="100%">
				<tbody>
					<tr>
						<td width="30%"><label class="des">用户名：</label></td>
						<td><input value="" type="text" id="J_username" name="J_username" class="ui-input ui-nt" maxlength="20" title="用户名"></td>
					</tr>
					<tr>
						<td><label class="des">密码：</label></td>
						<td><input value="" type="password" id="J_pwd" name="J_pwd" class="ui-input" maxlength="50" title="密码"></td>
					</tr>
					<tr>
						<td><label class="des">验证码：</label></td>
						<td class="J_ver-wrap">
							<input value="" type="text" id="J_ver" name="J_ver" class="ui-input" maxlength="4" require="true" title="验证码">
							<img src="" id="J_ver_img" class="J_ver_img">
						</td>
					</tr>
					<tr>
						<td>&nbsp;</td>
						<td>
							<button class="e_button-ok" id="sceneLoginBtn" onclick="javascript:return false;">登录</button>
						</td>
					</tr>
				</tbody>
			</table>
		</form>
	</div>
</body>
</html>

display-server/web/template/webapp/scene/Scene.html

<div>
	<div class="c_list">
		<ul id="scene-menu">
			<li action="Login">
			<li action="SceneBean_login_init">
				<div class="content">
					<div class="main">
						<div class="title">登陆</div>
					</div>
				</div>
			</li>
			<li action="DataRequest">
			<li action="SceneBean_dataRequest">
				<div class="content">
					<div class="main">
						<div class="title">数据请求</div>
					</div>
				</div>
			</li>
			<li action="TemplateRedirect">
			<li action="SceneBean_templateRedirect">
				<div class="content">
					<div class="main">
						<div class="title">页面跳转(直接数据渲染)</div>

display-server/web/template/webapp/scene/TemplateRedirect.html

	<title>页面跳转</title>
	{%>template/common/Head.html%}
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="biz/js/scene/TemplateRedirect.js"></script>
<style>
.m_content {
	text-align: center;
}
.m_content img {
	display: inline-block;
	margin-bottom: 0.2rem;
}
</style>
</head>
<body>
<div class="c_navBar">
		</div>
	</div>
</div>
<div class="c_submit">
	<ul>
		<li></li>
		<li><button class="e_button-ok" id="call">跳转</button></li>
		<li></li>
	</ul>
</div>
<div class="m_content m_content-nofooter" id="content">
	<img src="biz/img/scene/test_character.png" width="100%"/>	
	<button class="e_button-ok" id="startGame">开始游戏</button>
</div>
</body>
<script type="text/javascript">
require(["mobile"], function(Mobile) {
	
	$(".e_button-ok").tap(function(){
		
		Mobile.openTemplate("Basic");
	});
});
</script>
</html>