胡斌

improve robot pen canvas layout

set default ws port to 605
modify the extinput command data
正在显示 1 个修改的文件 包含 23 行增加23 行删除
@@ -52,10 +52,10 @@ @@ -52,10 +52,10 @@
52 text-align: center; 52 text-align: center;
53 } 53 }
54 .header { 54 .header {
55 - top: 60px; 55 + top: 40px;
56 left: 0px; 56 left: 0px;
57 right: 0px; 57 right: 0px;
58 - height: 32px; 58 + height: 28px;
59 padding:6px; 59 padding:6px;
60 } 60 }
61 .footer { 61 .footer {
@@ -97,7 +97,7 @@ @@ -97,7 +97,7 @@
97 97
98 #content{ 98 #content{
99 position: absolute; 99 position: absolute;
100 - top: 100px; 100 + top: 80px;
101 left: 0px; 101 left: 0px;
102 right: 0px; 102 right: 0px;
103 bottom: 46px; 103 bottom: 46px;
@@ -341,7 +341,8 @@ @@ -341,7 +341,8 @@
341 341
342 342
343 var ctx, color = "#000"; 343 var ctx, color = "#000";
344 - var voffset = 100; 344 + var voffset = 80;
  345 + var footerheight = 50;
345 var canvas_width,canvas_height; 346 var canvas_width,canvas_height;
346 var ext_input_panel_width,ext_input_panel_height; 347 var ext_input_panel_width,ext_input_panel_height;
347 var ratio_x,ratio_y; 348 var ratio_x,ratio_y;
@@ -350,7 +351,7 @@ @@ -350,7 +351,7 @@
350 function newCanvas() { 351 function newCanvas() {
351 //define and resize canvas 352 //define and resize canvas
352 canvas_width = window.innerWidth; 353 canvas_width = window.innerWidth;
353 - canvas_height = window.innerHeight - 90; 354 + canvas_height = window.innerHeight - voffset - footerheight ;
354 document.getElementById("content").style.height = canvas_height; 355 document.getElementById("content").style.height = canvas_height;
355 var canvas = '<canvas id="canvas" width="' + window.innerWidth + '" height="' + canvas_height + '"></canvas>'; 356 var canvas = '<canvas id="canvas" width="' + window.innerWidth + '" height="' + canvas_height + '"></canvas>';
356 document.getElementById("content").innerHTML = canvas; 357 document.getElementById("content").innerHTML = canvas;
@@ -760,8 +761,8 @@ @@ -760,8 +761,8 @@
760 ext_input_panel_height = dv.getUint16(11, true); 761 ext_input_panel_height = dv.getUint16(11, true);
761 ratio_x = (canvas_width + 0.0) / ext_input_panel_width; 762 ratio_x = (canvas_width + 0.0) / ext_input_panel_width;
762 ratio_y = (canvas_height + 0.0) / ext_input_panel_height; 763 ratio_y = (canvas_height + 0.0) / ext_input_panel_height;
763 - ext_input_open = true;  
764 - writeToScreen('<span style="color: green;">panel resolution: ' + width + ',' + height + '</span>'); 764 + writeToScreen('<span style="color: green;">panel resolution: ' + ext_input_panel_width + ',' + ext_input_panel_height + '</span>');
  765 + ext_input_open = true;
765 } 766 }
766 else if(2 == type ){ 767 else if(2 == type ){
767 var nPress = dv.getUint16(9, true); 768 var nPress = dv.getUint16(9, true);
@@ -771,7 +772,8 @@ @@ -771,7 +772,8 @@
771 // writeToScreen('<span style="color: green;">pen position: ' + x + ',' + y + ',' + nPress + '</span>'); 772 // writeToScreen('<span style="color: green;">pen position: ' + x + ',' + y + ',' + nPress + '</span>');
772 } 773 }
773 else if( 3 == type ) { 774 else if( 3 == type ) {
774 - ext_input_open = false; 775 + var status = dv.getUint8(9, true);
  776 + writeToScreen('<span style="color: green;">ext_input_status: ' + status + '</span>');
775 } 777 }
776 } 778 }
777 else { 779 else {
@@ -829,6 +831,7 @@ @@ -829,6 +831,7 @@
829 } 831 }
830 else { 832 else {
831 doCmd("close_ext_input"); 833 doCmd("close_ext_input");
  834 + ext_input_open = false;
832 } 835 }
833 ext_input_connecting = !ext_input_connecting; 836 ext_input_connecting = !ext_input_connecting;
834 } 837 }
@@ -855,7 +858,7 @@ @@ -855,7 +858,7 @@
855 var pos = document.getElementById("mov_pos").value; 858 var pos = document.getElementById("mov_pos").value;
856 if (pos.length > 0) { 859 if (pos.length > 0) {
857 cmd.data_len = 4; 860 cmd.data_len = 4;
858 - var buffer = new ArrayBuffer(cmd.data_len); 861 + var buffer = new ArrayBuffer(cmd.data_len);4
859 var Uint32param = new Uint32Array(buffer, 0, 1); 862 var Uint32param = new Uint32Array(buffer, 0, 1);
860 Uint32param[0] = parseInt(pos); 863 Uint32param[0] = parseInt(pos);
861 cmd.data = new Uint8Array(buffer, 0, 4); 864 cmd.data = new Uint8Array(buffer, 0, 4);
@@ -1067,27 +1070,25 @@ @@ -1067,27 +1070,25 @@
1067 } 1070 }
1068 else if(cmdName == "open_ext_input") { 1071 else if(cmdName == "open_ext_input") {
1069 cmd.type = 57; 1072 cmd.type = 57;
1070 - cmd.data_len = 4; 1073 + cmd.data_len = 1;
1071 var buffer = new ArrayBuffer(cmd.data_len); 1074 var buffer = new ArrayBuffer(cmd.data_len);
1072 - var Uint32param = new Uint32Array(buffer, 0, 1);  
1073 - Uint32param[0] = 0;  
1074 cmd.data = new Uint8Array(buffer, 0, cmd.data_len); 1075 cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
  1076 + cmd.data[0] = 0;
  1077 +
1075 } 1078 }
1076 else if(cmdName == "close_ext_input") { 1079 else if(cmdName == "close_ext_input") {
1077 cmd.type = 57; 1080 cmd.type = 57;
1078 - cmd.data_len = 4; 1081 + cmd.data_len = 1;
1079 var buffer = new ArrayBuffer(cmd.data_len); 1082 var buffer = new ArrayBuffer(cmd.data_len);
1080 - var Uint32param = new Uint32Array(buffer, 0, 1);  
1081 - Uint32param[0] = 1;  
1082 cmd.data = new Uint8Array(buffer, 0, cmd.data_len); 1083 cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
  1084 + cmd.data[0] = 1;
1083 } 1085 }
1084 else if(cmdName == "rotate_ext_input") { 1086 else if(cmdName == "rotate_ext_input") {
1085 cmd.type = 57; 1087 cmd.type = 57;
1086 - cmd.data_len = 4; 1088 + cmd.data_len = 1;
1087 var buffer = new ArrayBuffer(cmd.data_len); 1089 var buffer = new ArrayBuffer(cmd.data_len);
1088 - var Uint32param = new Uint32Array(buffer, 0, 1);  
1089 - Uint32param[0] = 2;  
1090 cmd.data = new Uint8Array(buffer, 0, cmd.data_len); 1090 cmd.data = new Uint8Array(buffer, 0, cmd.data_len);
  1091 + cmd.data[0] = 2;
1091 } 1092 }
1092 1093
1093 doSendWSCmd(cmd); 1094 doSendWSCmd(cmd);
@@ -1163,7 +1164,7 @@ @@ -1163,7 +1164,7 @@
1163 window.onload = function () { 1164 window.onload = function () {
1164 output = document.getElementById("output"); 1165 output = document.getElementById("output");
1165 1166
1166 - document.getElementById('websocketURL').value = "ws://127.0.0.1:8090"; 1167 + document.getElementById('websocketURL').value = "ws://127.0.0.1:605";
1167 1168
1168 document.getElementById('inputURL').value = queryParameters['source']; 1169 document.getElementById('inputURL').value = queryParameters['source'];
1169 1170
@@ -1565,8 +1566,6 @@ @@ -1565,8 +1566,6 @@
1565 <td width="27%" align="left"><a id="disconnectBtn" onclick="javascript:disconnectLiveServ();"><img src="images/disconnect.gif" width="104" height="25" /> 1566 <td width="27%" align="left"><a id="disconnectBtn" onclick="javascript:disconnectLiveServ();"><img src="images/disconnect.gif" width="104" height="25" />
1566 <td><img src="images/spacer.gif" width="50" height="10" /></td> 1567 <td><img src="images/spacer.gif" width="50" height="10" /></td>
1567 <td width="27%" align="left"><a id="clearBtn" onclick="javascript:clearOutput();"><img src="images/clear.gif" width="104" height="25" /></a></td> 1568 <td width="27%" align="left"><a id="clearBtn" onclick="javascript:clearOutput();"><img src="images/clear.gif" width="104" height="25" /></a></td>
1568 - <td colspan="2" align="center"><button type="button" id="open_ext_input" onclick="onTestClick(this)">open_ext_input</button></td>  
1569 - <td colspan="2" align="center"><button type="button" id="close_ext_input" onclick="onTestClick(this)">close_ext_input</button></td>  
1570 </tr> 1569 </tr>
1571 </table> 1570 </table>
1572 </td> 1571 </td>
@@ -1586,8 +1585,9 @@ @@ -1586,8 +1585,9 @@
1586 <div id="page"> 1585 <div id="page">
1587 <div class="header"> 1586 <div class="header">
1588 <a id="new" class="navbtn" onclick="newCanvas()">New</a> 1587 <a id="new" class="navbtn" onclick="newCanvas()">New</a>
1589 - <a id="rotate_ext_input" class="navbtn" onclick="rotateExtInput()">Rotate</a>  
1590 - <div class="title">Sketch Pad</div> 1588 + <a id="open_ext_input" class="navbtn" onclick="onTestClick(this)">open_ext_input</a>
  1589 + <a id="close_ext_input" class="navbtn" onclick="onTestClick(this)">close_ext_input</a>
  1590 + <a id="rotate_ext_input" class="navbtn" onclick="rotateExtInput()">Rotate 90</a>
1591 </div> 1591 </div>
1592 <div id="content"> 1592 <div id="content">
1593 <p style="text-align:center">Loading Canvas...</p> 1593 <p style="text-align:center">Loading Canvas...</p>