初步完成月曆版本的編輯界面，而資料傳輸部份尚未實作

4 files changed, 209 insertions, 5 deletions

diff --git a/jinhtml/month.html b/jinhtml/month.html
index 3e1ddbe..401a9a2 100644
--- a/jinhtml/month.html
+++ b/jinhtml/month.html
@@ -31,6 +31,34 @@
     #timeedit_month, #timeedit_year{
       width: 50px;
     }
+    #caledit_left, #caledit_right{
+      float: left;
+      width: 42%;
+      margin: 3%;
+      min-width: 350px;
+    }
+    #caledit_select{
+      width: 100%;
+      min-width: 350px;
+    }
+    #caledit_static_year, #caledit_static_month, #caledit_static_date,
+    #caledit_static_hour, #caledit_static_minute
+    {
+      display: inline-block;
+      width: 40px;
+    }
+    #caledit_dyn_year, #caledit_dyn_month, #caledit_dyn_date,
+    #caledit_dyn_hour, #caledit_dyn_minute
+    {
+      width: 40px;
+    }
+    #caledit_dyn_content{
+      width: 100%;
+      resize: vertical;
+    }
+    [name=caledit_write] {
+      display: none;
+    }
   </style>
 {% endblock %}
 
@@ -41,17 +69,19 @@
   switchmonthobj.className += "selected";
   switchmonthobj.onclick = "";
   status_bar_append("(Ctrl-L)清單模式 (Ctrl-左右)切換月份 (y)修改年 (m)修改月");
+  status_bar_append("(0-9)快速選擇日期");
 {% endblock %} 
   
 {% block headjs %}
   <script src="js/month.js" type="text/javascript"></script>
+  <script src="js/caledit.js" type="text/javascript"></script>
   <script type="text/javascript">
   	shortcut_bind();
   </script>
 {% endblock %}
 
 {% block body %}
-  <div id="timeselect">
+  <div name="calbrowse" id="timeselect">
     <input type="button" value="<" id="timeselect_prev" onclick="timeselect_prev()">
     <span id="timeselect_year" onclick="timeselect_direct()">XXXX</span>
     <input type="text" maxlength="4" id="timeedit_year">
@@ -64,10 +94,10 @@
     <input type="button" value="確定" id="timeedit_apply" onclick="timeedit_apply()">
     <input type="button" value="取消" id="timeedit_cancel" onclick="timeedit_cancel()">
   </div>
-  <div style="text-align: center;">
-  	<input type="text" maxlength="2" id="focusjumper" style="display: none;">
+  <div name="calbrowse" style="text-align: center;">
+      <input type="text" maxlength="2" id="focusjumper" style="display: none;">
   </div>
-  <div id="monthcal">
+  <div name="calbrowse" id="monthcal">
     <table id="cal">
       <thead>
         <tr>
@@ -84,4 +114,52 @@
       </tbody>
     </table>
   </div>
+  <div name="caldetail" id="caleditor" style="display: none;">
+    <div style="text-align: center;">
+        <input type="button" value="返回月曆" style="background-color: #00FF00; font-size: large;" onclick="caledit_quit()">
+    </div>
+    <div id="caledit_left">
+      <select id="caledit_select" size="20">
+      </select>
+    </div>
+    <div id="caledit_right">
+      <form id="cal" name="caleditform" onsubmit="">
+        <input id="caledit_switchedit" type="button" value="編輯" onclick="caledit_edit()">
+        <span id="caledit_enabled"></span>
+        <fieldset>
+          <legend>詳細資料</legend>
+          日期：
+          <span name="caledit_read" id="caledit_static_year"></span>
+          <input name="caledit_write" id="caledit_dyn_year" type="text" maxlength="4">
+          年
+          <span name="caledit_read" id="caledit_static_month"></span>
+          <input name="caledit_write" id="caledit_dyn_month" type="text" maxlength="2">
+          月
+          <span name="caledit_read" id="caledit_static_date"></span>
+          <input name="caledit_write" id="caledit_dyn_date" type="text" maxlength="2">
+          日
+          <br>
+          時間：
+          <span name="caledit_read" id="caledit_static_hour"></span>
+          <input name="caledit_write" id="caledit_dyn_hour" type="text" maxlength="2">
+          時
+          <span name="caledit_read" id="caledit_static_minute"></span>
+          <input name="caledit_write" id="caledit_dyn_minute" type="text" maxlength="2">
+          分
+          <br>
+          標題：
+          <span name="caledit_read" id="caledit_static_title"></span>
+          <input name="caledit_write" id="caledit_dyn_title" type="text">
+          <br>
+          內容：
+          <div name="caledit_read_block" id="caledit_static_content"></div>
+          <textarea name="caledit_write_block" id="caledit_dyn_content" rows="6"></textarea>
+          資料來源：
+          <span id="caledit_datafrom"></span>
+        </fieldset>
+        <input type="submit" value="儲存">
+        <input type="button" value="取消">
+      </form>
+    </div>
+  </div>
 {% endblock %}
diff --git a/jinhtml/skel.html b/jinhtml/skel.html
index d664a3f..496767c 100644
--- a/jinhtml/skel.html
+++ b/jinhtml/skel.html
@@ -38,7 +38,7 @@
     <div id="controlright">
       <input type="button" value="匯入" id="buttonimport">
       <input type="button" value="匯出" id="buttonexport">
-      <input type="button" value="登出" onclick="google_logout()" style="background-color: darkgray">
+      <input type="button" value="登出" id="googlelogout" onclick="google_logout()" style="background-color: darkgray">
     </div>
   </div>
   <div id="statusbar">
diff --git a/js/caledit.js b/js/caledit.js
new file mode 100644
index 0000000..73b4c4b
--- /dev/null
+++ b/js/caledit.js
@@ -0,0 +1,117 @@
+function caledit(year, month, date){
+	var allbrowseobj = document.getElementsByName("calbrowse");
+	var alldetailobj = document.getElementsByName("caldetail");
+	var i;
+	$(document).unbind("keydown.main");
+	$(document).bind("keydown.caledit", "ctrl+e", caledit_edit);
+	$(document).bind("keydown.caledit", "ctrl+1", caledit_focus_left);
+	$(document).bind("keydown.caledit", "ctrl+2", caledit_focus_right);
+	$(document).bind("keydown.caledit", "alt+q", caledit_quit);
+	status_bar_save();
+	status_bar_set("(Alt-Q)返回 (Ctrl-E)切換編輯 (Ctrl-1)左側 (Ctrl-2)右側 ");
+	caledit_switchedit_disable();
+	for(i=0; i<allbrowseobj.length; i++){
+		allbrowseobj[i].style.display = "none";
+	}
+	for(i=0; i<alldetailobj.length; i++){
+		alldetailobj[i].style.display = "block";
+	}
+	document.getElementById("switchlist").style.display = "none";
+	document.getElementById("googlelogout").style.display = "none";
+}
+
+function caledit_quit(){
+	var allbrowseobj = document.getElementsByName("calbrowse");
+	var alldetailobj = document.getElementsByName("caldetail");
+	var i;
+	$(document).unbind("keydown.main");
+	$(document).unbind("keydown.caledit");
+	for(i=0; i<allbrowseobj.length; i++){
+		allbrowseobj[i].style.display = "block";
+	}
+	for(i=0; i<alldetailobj.length; i++){
+		alldetailobj[i].style.display = "none";
+	}
+	shortcut_bind();
+	status_bar_restore();
+	document.getElementById("switchlist").style.display = "inline";
+	document.getElementById("googlelogout").style.display = "inline";
+}
+
+function caledit_edit()
+{   
+	var buttonobj;
+	buttonobj = document.getElementById("caledit_switchedit");
+	document.getElementById("caledit_dyn_year").style.display = "inline";
+	switch(buttonobj.value){
+		case "編輯":
+			caledit_switchedit_enable();
+			break;
+		case "唯讀":
+			caledit_switchedit_disable();
+			break;
+	}
+}
+
+function caledit_switchedit_enable()
+{
+	var buttonobj;
+	var msgobj;
+	var roobj, rwobj, robobj, rwbobj;
+	var i;
+	buttonobj = document.getElementById("caledit_switchedit");
+	msgobj = document.getElementById("caledit_enabled");
+	roobj = document.getElementsByName("caledit_read");
+	rwobj = document.getElementsByName("caledit_write");
+	robobj = document.getElementsByName("caledit_read_block");
+	rwbobj = document.getElementsByName("caledit_write_block");
+	buttonobj.value = "唯讀";
+	msgobj.innerHTML = "編輯模式";
+	for(i=0; i<roobj.length; i++){
+		roobj[i].style.display = "none";
+	}
+	for(i=0; i<rwobj.length; i++){
+		rwobj[i].style.display = "inline";
+	}
+	for(i=0; i<robobj.length; i++){
+		robobj[i].style.display = "none";
+	}
+	for(i=0; i<rwbobj.length; i++){
+		rwbobj[i].style.display = "block";
+	}
+}
+
+function caledit_switchedit_disable()
+{
+	var buttonobj;
+	var msgobj;
+	var roobj, rwobj, robobj, rwbobj;
+	buttonobj = document.getElementById("caledit_switchedit");
+	msgobj = document.getElementById("caledit_enabled");
+	roobj = document.getElementsByName("caledit_read");
+	rwobj = document.getElementsByName("caledit_write");
+	robobj = document.getElementsByName("caledit_read_block");
+	rwbobj = document.getElementsByName("caledit_write_block");
+	buttonobj.value = "編輯";
+	msgobj.innerHTML = "檢視模式";
+	for(i=0; i<roobj.length; i++){
+		roobj[i].style.display = "inline-block";
+	}
+	for(i=0; i<rwobj.length; i++){
+		rwobj[i].style.display = "none";
+	}
+	for(i=0; i<robobj.length; i++){
+		robobj[i].style.display = "block";
+	}
+	for(i=0; i<rwbobj.length; i++){
+		rwbobj[i].style.display = "none";
+	}
+}
+
+function caledit_focus_left(){
+	$("#caledit_select").focus();
+}
+
+function caledit_focus_right(){
+	$("#caledit_switchedit").focus();
+}
diff --git a/js/month.js b/js/month.js
index 4e0ef21..dc334ee 100644
--- a/js/month.js
+++ b/js/month.js
@@ -299,6 +299,9 @@ function setmonthcal(){
 			objcal.setAttribute("name", "date" + todate);
 			objcal.setAttribute("onclick", 
 				"setfocusblock(" + todate + ", true)");
+			objcal.setAttribute("ondblclick",
+				"caledit(" + value_year + ", " + value_month + ", " +
+				todate + ")");
 			objcaldate.innerHTML = todate;
 			alldata[todate] = new Object();
 			alldata[todate].row = i;
@@ -421,6 +424,11 @@ function setfocusbykbdinput_apply(){
 	setfocusbykbdinput_terminate();
 }
 
+function call_caledit_kbd(evt){
+	evt.preventDefault();
+	caledit(value_year, value_month, value_date);
+}
+
 function shortcut_bind(){
 	$(document).bind("keydown.main", "m", timeedit_month_kbd);
 	$(document).bind("keydown.main", "y", timeedit_year_kbd);
@@ -432,6 +440,7 @@ function shortcut_bind(){
 	$(document).bind("keydown.main", "down", movefocus_down);
 	$(document).bind("keydown.main", "left", movefocus_left);
 	$(document).bind("keydown.main", "right", movefocus_right);
+	$(document).bind("keydown.main", "return", call_caledit_kbd);
 	$(document).bind("keydown.main", "0", direct0);
 	$(document).bind("keydown.main", "1", direct1);
 	$(document).bind("keydown.main", "2", direct2);