結對編程 黃金點遊戲

    1、實現功能：

    10個玩家同時遊戲，系統根據規則計算出G值，而且給相應玩家分數，遊戲能夠進行多輪，由玩家自行控制，每一輪的分數都會累計下來除非從新開始

    2、 設計過程：

    最開始打算用b/s來作這個遊戲，後臺鏈接數據庫，一個表用來記錄玩家的用戶名密碼（登陸形式），另外一個來記錄遊戲信息。可是後來發現帶有數據庫

的b/s結構過於複雜，好比系統如何斷定全部玩家都已經結束輸入而後開始計算。對於一個雙人項目反覆登陸多個用戶在測試上也是個不小的負擔。只要有

用戶登陸，就要在filter中設置過濾選項，保證沒有登陸的遊客無論訪問那個界面都會自動跳轉到登錄界面，這對於雙人項目來講也是個不小的工做量，因此

咱們放棄了接入數據庫，打算將遊戲數據存到內存中，後臺用java處理。因而着手搭建了springMVC框架

    在WEB-INF文件夾中配置好springMVC後出現了新的問題，js的json數組不能傳到後臺，咱們認爲是框架配置的問題，通過兩天時間沒有解決，因此也放棄了後臺的java

利用前端完成了全部的功能，下圖爲以前寫的後臺java代碼和玩家類

 

    關於框架配置的問題我會在團隊項目以前解決的。

    最終版本

    遊戲的所有功能在Input.js中實現

    3、功能展現：

    進入首頁

    點擊開始按鈕進入遊戲

    規定遊戲共有10名玩家，每一個玩家點擊本身對應的按鈕輸入數值，全部人輸入完畢後點擊輸入結束將數據提交給後臺，點擊查看結果按鈕查看本輪遊戲結果和每名玩家的積分

    輸入完畢後會進行提示

 

    所有輸入完畢點擊「輸入結束」按鈕

    點擊「查看結果」按鈕

    查看玩家分數

    查看G值

    點擊繼續遊戲按鈕回到遊戲界面

    多輪遊戲以後

    4、服務器的配置

    咱們使用的服務器爲tomcat6.0.44版本，單擊「window」菜單，選擇下方的「Preferences」，找到Server下方的Tomcat，

單擊右方的Add按鈕，選擇已經成功安裝的Tomcat版本，單擊Next，設置好tomcat的安裝目錄點擊ok即完成安裝

    虛擬路徑的配置

    劃線部分改成workspace中項目的webroot路徑，該路徑用auto代替，至此配置完成

    啓動服務器

    

    啓動成功

    5、編寫過程

    前臺模板藉助bootstrap3.3.2，開始界面Start.jsp直接經過一個標籤跳轉游戲界面Input.jsp，因此不須要Start.js，

在Input.js中初始化了三個數組分別用來存儲玩家輸入的數值，輸入數值跟G相差的絕對值，玩家的分數，玩家分數所有初

始化爲0。

var mynum=new Array(10)
var score=new Array(10)
var res=new Array(10)
var flag=0;
res[0]=0;
res[1]=0;
res[2]=0;
res[3]=0;
res[4]=0;
res[5]=0;
res[6]=0;
res[7]=0;
res[8]=0;
res[9]=0;

　　前臺共有十個button，每個button對應一個prom()函數，10個函數結構相似

<button type="button" class="btn btn-lg btn-primary" onClick="prom0()">Player_0</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom1()">Player_1</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom2()">Player_2</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom3()">Player_3</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom4()">Player_4</button><br><br>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom5()">Player_5</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom6()">Player_6</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom7()">Player_7</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom8()">Player_8</button>
          <button type="button" class="btn btn-lg btn-primary" onClick="prom9()">Player_9</button>

　　輸入的數若是不符合要求還會要求用戶從新輸入

function prom0() 
{ 
 var number=prompt("Please enter your num","")

 	if (number<100 && number>0)
 	{
	//alert(flag);
	mynum[0]=number;
	//document.write(mynum[flag]);
	alert("your number is :"+mynum[0]);
 	}
 	else
 	{
	alert("輸入的數不符合要求")
	prom0();
 	}
}  

　　每一個玩家經過點擊按鈕將數值傳遞給後臺的mynum[]數組，輸入完畢後點擊「輸入結束」按鈕，觸發send()函數，計算出G的值，如下爲send()的部分代碼

第一個循環用來報錯，檢測未輸入的玩家並提示，以後算出G值

for(var i=0;i<10;i++)//報錯
		if(!(mynum[i]>0&&mynum[i]<100))
		{
			alert("player_"+i+"未輸入，請重試")
			return 0;
		}
	var ave=0;
	for(var i=0;i<10;i++)
	{
		ave=parseFloat(mynum[i])+parseFloat(ave);
		//alert(ave);
	}
	//alert(ave);
	ave=ave/i;
	G=parseFloat(ave)*0.618;

　　由於javascript是一種弱語言，定義的var變量有的時候會被當成字符串，也就是說1+2=3有時候會被算成"1"+"2"="12"，因此在計算前要將變量類型進行規定

此處用到了parseFloat()函數。不然算出的結果會顯示NaN，即表明非數字值的特殊值。

    計算完G值，用數組score[]存放mynum[]-G的絕對值，分別計算出最大值最小值，再經過一個新的for循環找出離G最遠的玩家和離G最近的玩家，進行給分，用

res[]數組存放玩家的分數。

for(var i=0;i<10;i++)
	{
		score[i]=parseFloat(mynum[i])-parseFloat(G);
		if(score[i]<0)
			score[i]=0-parseFloat(score[i]);
	}
	var max=score[0];
	var min=score[0];
	for(var i=1;i<10;i++)
	{
		if(max<score[i])
			max=score[i];
		if(min>score[i])
			min=score[i];
	}
	for(var i=0;i<10;i++)
	{
		if(score[i]==max){
			res[i]=parseInt(res[i])-2;}
		if(score[i]==min){
			res[i]=parseInt(res[i])+10;}
	}

　　前臺jsp由我修改，js代碼由我和唐翔宜同窗共同完成

    編寫過程當中和編寫完成後出現的問題及解決方案請見唐翔宜同窗的博客

    http://www.cnblogs.com/tangxiangyi/p/5357833.html

    代碼已上傳到coding