結對編程1（201421123070，201421123073）

題目描述：

咱們在我的做業1中，用各類語言實現了一個命令行的四則運算小程序。進一步，本次要求把這個程序作成GUI（能夠是Windows PC 上的，也能夠是Mac、Linux，web，手機上的），成爲一個有基本功能、必定價值的程序。在下面的功能需求中實現兩個：

1. 記錄用戶的對錯總數，程序退出再啓動的時候，能把之前的對錯數量保存並在此基礎上增量計算。
2. 有計時功能，能顯示用戶開始答題後的消耗時間。
3. 界面支持中文簡體/中文繁體/英語，用戶能夠選擇一種.

簡單的分工說明：（兩人組）

畢川：

1. 負責算法的設計，中綴表達式的計算。（緣由）在第一次我的做業中，我舍友說：「我點了你的連接，我輸入了10000道題......誒，你的服務器好像崩了！！！！！！，用戶體驗太差」吸收上次的教訓，決定改變一下本身用程序生成式子和計算結果這種方式。因此咱們討論決定用題庫的方式解決速度慢的問題。本來想在網上找一下題庫的，找了好久都只有題沒有答案，因此決定用算法本身算答案。
2. 記錄用戶的對錯總數，程序退出再啓動的時候，能把之前的對錯數量保存並在此基礎上增量計算。

我：

1. 界面支持中文簡體/中文繁體/英語，用戶能夠選擇一種.
2. 有計時功能，能顯示用戶開始答題後的消耗時間。

最後封裝成一種替代第一次做業中生成題目的方法（也就是從數據庫中取）。

實現過程：（我）

1. 界面支持中文簡體/中文繁體/英語，用戶能夠選擇一種

對於這題，我畫了一個簡單的表面流程圖，描述了這個切換語言的過程。（無技術基礎看）

關於具體實現過程參考下面的執行過程：（有技術基礎看）

流程圖分解說明：

（1）語言單選框點擊事件的發生，使用的是jquery中的click方法觸發

（2）lanaguage參數設置爲三個，也就是單選框的value值，分別對應簡體中文simpleChinese，繁體中文traditionalChinese,英語English。

（3）使用ajax異步傳輸

/*
firstPage1:表示第一個頁面從上往下第一個文字語言須要動態變化的位置
firstPage2:表示第一個頁面從上往下第二個文字語言須要動態變化的位置
result.firstPage1：表示從後臺獲取的對應語言對應位置的配置文件內容
result.firstPage2：表示從後臺獲取的對應語言對應位置的配置文件內容
*/

<script type="text/javascript">
$(function(){
    var lanaguage1=$('input:radio:checked').val();
    $.ajax({
        dataType:"json",
        type:"post", 
        data : {
            lanaguage : lanaguage1
        },
        url : "LanguageServlet?page=firstPage",
        success : function(result) {
            $("#firstPage1").html(result.firstPage1);
            $("#firstPage2").val(result.firstPage2);
        }
        }); 
 });
</script>

（4)根據傳入的語言參數，用properties對象的方法加載對應的語言配置文件的內容

因爲涉及三種語言，因此設置了三個配置文件，分別是simpleChinese。properties，traditionalChinese.properties，English.properties.大概的內容以下圖

/*
    加載語言配置文件代碼
*/

if(lanaguage.trim().equals("simpleChinese")){
    InputStream  inputStream= Test.class.getClassLoader().getResourceAsStream("simpleChinese.properties");
    prop.load(inputStream);     ///加載屬性列表
}       
else if(lanaguage.trim().equals("traditionalChinese")){
    InputStream  inputStream= Test.class.getClassLoader().getResourceAsStream("traditionalChinese.properties");
    prop.load(inputStream);     ///加載屬性列表
}       
else{
    InputStream  inputStream= Test.class.getClassLoader().getResourceAsStream("English.properties");
    prop.load(inputStream);     ///加載屬性列表           
}
    String firstPage1=prop.getProperty("firstPage1");
    String firstPage2=prop.getProperty("firstPage2");

（5）獲取內容轉化爲JSON並返回頁面

/*
PrintWriter pw = response.getWriter();
JSON用到的包是阿里巴巴的fastJSON.jar
*/

    Map<String,String>map=new HashMap<>();
    map.put("firstPage1", firstPage1);
    map.put("firstPage2", firstPage2);
    String json=JSON.toJSONString(map);
    pw.print(json);//返回數據

（6）在用jquery中的html方法在對應的地方填充JSON數據也就是第（3）中success成功後中的方法。

以上就是功能一的所有描述。

2. 有計時功能，能顯示用戶開始答題後的消耗時間。

（1）對於這一功能我也畫一個很是簡單流程圖表示

（2）具體實現過程

（該功能沒有使用數據庫，利用cookie功能實現存儲，存儲時間爲一年）

①設置了一個TimerReturn類來表示（便於數據處理）

②前端js主要時間代碼（百度而來，修改了一點點，本應附上連接後面沒找到（PS：若有侵權告知刪除））

/*
timeShow爲顯示時間的位置。

document.getElementById("time").value=two_char(h) + ":" + two_char(m) + ":" + two_char(s);

因爲時間不在答案提交的form中，因此使用form中添加<input type="hidden" id="time" name="time">進行所需的時間提交
*/
<script>
    function two_char(n) {
        return n >= 10 ? n : "0" + n;
    }
    function time_fun() {
        var sec=0;
        setInterval(function () {
            sec++;
            var date = new Date(0, 0)
            date.setSeconds(sec);
            var h = date.getHours(), m = date.getMinutes(), s = date.getSeconds();
            document.getElementById("timeShow").innerText = two_char(h) + ":" + two_char(m) + ":" + two_char(s);
            document.getElementById("time").value=two_char(h) + ":" + two_char(m) + ":" + two_char(s);
        }, 1000);      
    }
</script>

③後臺進行返回結果的處理，把結果session而且把結果存儲到cookie中。

String time=(String)request.getParameter("time");       
    List<TimerReturn>timeList=(List<TimerReturn>) request.getSession().getAttribute("timeList");
    if(timeList==null){
        timeList=new ArrayList<>();
    }
    TimerReturn timeReturn=new TimerReturn(list.size()+"",time,list.size()-count+"",count*1.0/list.size()*100+"%");
    timeList.add(timeReturn);
    request.getSession().setAttribute("flag", "true");//控制前端時間記錄的表頭是否顯示，若是沒有獲取到flag則不顯示
    request.getSession().setAttribute("timeList", timeList);

/*
寫入Cookie
*/
    boolean flag=true;//用於斷定是不是第一存入cookie，true表示第一次存
    for(int i=0;i<c.length;i++){
        if(c[i].getName().equals("timeList")){
    String totalTimeList=c[i].getValue()+"M"+perTimeList;//用M拼接每次的結果
    Cookie c1=new Cookie("timeList", totalTimeList);
    c1.setMaxAge(3600*24*30*12);//設置cookie存在時間單位s
    response.addCookie(c1);
    flag=false;
        }
    }
    if(flag==true){
    Cookie c1=new Cookie("timeList", perTimeList);
    c1.setMaxAge(3600*24*30*12);
    response.addCookie(c1);
    }

④前端用c標籤獲取

<c:forEach var="Result" items="${timeList}">
    <c:if test="${!empty Result.time}">
    <tr>
        <td>${Result.totalCount}</td>
        <td>${Result.time}</td>
        <td>${Result.errorCount}</td>
            <td>${Result.correctRate}</td>
    </tr>
    </c:if>
</c:forEach>

效果動圖:

附上具體的網頁連接：我也本身試試

結對細節

事前討論的代碼規則

1. 變量命名的規則：以變量的功能命名，使用完整的英文描述，採用駝峯命名法。
2. 函數傳參過程當中儘可能採用形式傳值
3. 花括號「{}」不容許省略，即便只有一段代碼。
4. 使用括號「()」來強調運算符優先級。
5. 記得格式化代碼，eclipse裏面Ctrl+Shilft+F

代碼共同提交記錄

實驗總結

• 實驗方面的不足：
  • 雖然出題的速度能夠比第一次做業快不少，可是沒有找不少題庫（可是有時間應該是不成問題的）只有390+題。
  • 前端技術差，沒有好的排版（也沒有找一個好的樣式）。
  • 本能夠不跳轉頁面都用ajax的，而後沒有改。
• 結對方面不足：
  • 雖然以前一塊兒合做過，可是仍是缺少更多的交流，和事前的討論，以致於在編程方面都修改了某個東西，後面整合出了問題。後面仍是把計時和錯誤的統計結合在一塊兒。
  • 太缺乏一塊兒開發的經歷，之前都是一我的作完。除非一些項目結構，每一部分沒有什麼聯繫的一塊兒開發還能夠。
  • 命名方面仍是須要事先規定，有的命名仍是不夠清晰，以致於隊友看不懂。
  • 簡單的項目我認爲1+1不必定大於1，可是項目稍微大的，1+1必定大於2，兩我的的考慮總比單獨的兩我的更周全。
• 對隊友的見解：
  • 合做中沒有遇到意見不一致，討論的結果都是兩我的贊同的。
  • 隊友的實力是很是強的，並且速度快，合做過程當中遇到問題一塊兒討論，而後交流本身的意見，說出本身方案的優缺點，而後選擇一種較好的方案一致經過。
  • 若是要說建議的話，在後面合做中遇到不合了才能提出，此次合做上沒有遇到什麼不合的地方。
  • 對隊友說的話就是：合做愉快。
• 遇到的問題：
  • 在cookie拼接的時候原本用了||分割每次要存儲的結果。但是在java提取時，用split（）分割時被當成了特殊符號，一直沒有成功，後來通過檢查發現，最後用一個不會涉及到的字符M來分割，就能夠了。
  • 在數據庫寫入時，一直沒有寫入成功。也沒有錯誤，苦惱了好久，後面重啓了一下IDE，而後就。。。。。成功了。這種莫名其妙的問題常常遇到。

代碼倉庫：https://github.com/hts-technology/hts.git