improve robot pen canvas layout

set default ws port to 605 modify the extinput command data

improve robot pen canvas layout
set default ws port to 605 modify the extinput command data
胡斌
Commit 6badcb9e1d040c6b0cc5561b91561f9be9a9fccc 6badcb9e 1 parent 1689ddf3
demo.html
--- a/demo.html
查看文件 @6badcb9
+++ b/demo.html
查看文件 @6badcb9
@@ -52,10 +52,10 @@
 			text-align: center;
 		}
 		.header {
-			top: 60px;
+			top: 40px;
 			left: 0px;
 			right: 0px;
-			height: 32px;
+			height: 28px;
 			padding:6px;
 		}
 		.footer {
@@ -97,7 +97,7 @@
 		#content{
 			position: absolute;
-			top: 100px;
+			top: 80px;
 			left: 0px;
 			right: 0px;
 			bottom: 46px;
@@ -341,7 +341,8 @@
 		var ctx, color = "#000";	
-		var voffset = 100;
+		var voffset = 80;
+		var footerheight = 50;
 		var canvas_width,canvas_height;
 		var ext_input_panel_width,ext_input_panel_height;
 		var ratio_x,ratio_y;
@@ -350,7 +351,7 @@
 		function newCanvas() {
 			//define and resize canvas
 			canvas_width =  window.innerWidth;
-			canvas_height = window.innerHeight - 90;
+			canvas_height = window.innerHeight - voffset - footerheight ;
 			document.getElementById("content").style.height = canvas_height;
 			var canvas = '<canvas id="canvas" width="' + window.innerWidth + '" height="' + canvas_height + '"></canvas>';
 			document.getElementById("content").innerHTML = canvas;
@@ -760,8 +761,8 @@
 								ext_input_panel_height = dv.getUint16(11, true);
 								ratio_x = (canvas_width + 0.0) / ext_input_panel_width;
 								ratio_y = (canvas_height + 0.0) / ext_input_panel_height;
+								writeToScreen('<span style="color: green;">panel resolution: ' + ext_input_panel_width + ',' + ext_input_panel_height + '</span>');
 								ext_input_open = true;
-								writeToScreen('<span style="color: green;">panel resolution: ' + width + ',' + height + '</span>');
 							}
 							else if(2 == type ){
 								var nPress = dv.getUint16(9, true);
@@ -771,7 +772,8 @@
 							//	writeToScreen('<span style="color: green;">pen position: ' + x + ',' + y + ',' + nPress + '</span>');
 							}
 							else if( 3 == type ) {
-								ext_input_open = false;
+								var status = dv.getUint8(9, true);
+								writeToScreen('<span style="color: green;">ext_input_status: ' + status + '</span>');
 							}
 						}
 						else {
@@ -829,6 +831,7 @@
 			}
 			else {
 				doCmd("close_ext_input");
+				ext_input_open = false;
 			}
 			ext_input_connecting = !ext_input_connecting;
 		} 
@@ -855,7 +858,7 @@
 				var pos = document.getElementById("mov_pos").value;
 				if (pos.length > 0) {
 					cmd.data_len = 4;
-					var buffer = new ArrayBuffer(cmd.data_len);
+					var buffer = new ArrayBuffer(cmd.data_len);4
 					var Uint32param = new Uint32Array(buffer, 0, 1);
 					Uint32param[0] = parseInt(pos);
 					cmd.data = new Uint8Array(buffer, 0, 4);
@@ -1067,27 +1070,25 @@
 			}
 			else if(cmdName == "open_ext_input") {
 			    cmd.type = 57;
-				cmd.data_len = 4;
+				cmd.data_len = 1;
 				var buffer = new ArrayBuffer(cmd.data_len);
-				var Uint32param = new Uint32Array(buffer, 0, 1);
-				Uint32param[0] = 0;
 				cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
+				cmd.data[0] = 0;
+				
 		    }
 			else if(cmdName == "close_ext_input") {
 				cmd.type = 57;
-				cmd.data_len = 4;
+				cmd.data_len = 1;
 				var buffer = new ArrayBuffer(cmd.data_len);
-				var Uint32param = new Uint32Array(buffer, 0, 1);
-				Uint32param[0] = 1;
 				cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
+				cmd.data[0] = 1;
 			}
 			else if(cmdName == "rotate_ext_input") {
 				cmd.type = 57;
-				cmd.data_len = 4;
+				cmd.data_len = 1;
 				var buffer = new ArrayBuffer(cmd.data_len);
-				var Uint32param = new Uint32Array(buffer, 0, 1);
-				Uint32param[0] = 2;
 				cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
+				cmd.data[0] = 2;
 			}
 			doSendWSCmd(cmd);
@@ -1163,7 +1164,7 @@
 		window.onload = function () {
 			output = document.getElementById("output");
-			document.getElementById('websocketURL').value = "ws://127.0.0.1:8090";
+			document.getElementById('websocketURL').value = "ws://127.0.0.1:605";
 			document.getElementById('inputURL').value = queryParameters['source'];
@@ -1565,8 +1566,6 @@
 														<td width="27%" align="left"><a id="disconnectBtn" onclick="javascript:disconnectLiveServ();"><img src="images/disconnect.gif" width="104" height="25" />  
 					  <td><img src="images/spacer.gif" width="50" height="10" /></td>
 					  <td width="27%" align="left"><a id="clearBtn" onclick="javascript:clearOutput();"><img src="images/clear.gif" width="104" height="25" /></a></td>
-					  <td colspan="2" align="center"><button type="button" id="open_ext_input" onclick="onTestClick(this)">open_ext_input</button></td>
-					  <td colspan="2" align="center"><button type="button" id="close_ext_input" onclick="onTestClick(this)">close_ext_input</button></td>
 													</tr>
 												</table>
 											</td>
@@ -1586,8 +1585,9 @@
 			<div id="page">
 				<div class="header">
 					<a id="new" class="navbtn" onclick="newCanvas()">New</a>
-					<a id="rotate_ext_input" class="navbtn" onclick="rotateExtInput()">Rotate</a>
-					<div class="title">Sketch Pad</div>
+					<a id="open_ext_input"  class="navbtn" onclick="onTestClick(this)">open_ext_input</a>
+					<a id="close_ext_input"  class="navbtn" onclick="onTestClick(this)">close_ext_input</a>
+					<a id="rotate_ext_input" class="navbtn" onclick="rotateExtInput()">Rotate 90</a>
 				</div>
 				<div id="content">
 					<p style="text-align:center">Loading Canvas...</p>