Skin:
[NORMAL]
[BLUE] [DOS] [LIGHT]  / コピーするための表示 / 実行
このファイル: /home/web6047/www/js/20210909-logicanalyzer/web6047document - snapshot 20210912.html
1 <html><!--ESCAPEPROCESS-->
2 <head>
3 <meta content="text/html; charset=UTF-8" http-equiv="content-type">
4 <script>
5 console.clear();
6 onclick = function() { location.reload( true ) }
7 ondblclick = function() { location.assign( "https://192.168.11.3" + location.pathname ) }
8 </script>
9 <script src="a - snapshot 20210912.js"></script>
10 <script>
11 async function onloadx() {
12
13 cc = document.getElementById( "test" ).getContext( "2d" );
14 cc.canvas.width = 512;
15 cc.canvas.height = 442;
16
17 //上のタイミングチャート
18
19 test();
20
21
22 //下のタイミングチャート
23
24 LA = new LogicAnalyzer( cc, {
25 cellHeight : 32,
26 palseHeight : 8,
27 horizontalDiv : 2,
28 horizontalShift : 100,
29 bottom : 96,
30 } );
31
32 keys = new Array();
33 onkeydown = function( e ) {
34 if( keys.indexOf( e.which ) == -1 ) keys.push( e.which );
35 LA.hi( "key", "press" );
36 }
37 onkeyup = function( e ) {
38 LA.low( "key", "release" );
39 LA.stop();
40 let idx = keys.indexOf( e.which );
41 if( idx != -1 ) keys.splice( idx, 1 );
42 }
43 frame();
44 }
45 function frame() {
46 LA.hi( "frame" );
47 for( let key of keys ) {
48 senseKey( key );
49 }
50 if( 1 ) requestAnimationFrame( frame );
51 else setTimeout( frame, 100 );
52 LA.low( "frame" );
53 }
54 function senseKey( key ) {
55 console.log( key );
56 }
57
58 function test() {
59 LA2 = new LogicAnalyzer( cc, {
60 cellHeight : 48,
61 palseHeight : 8,
62 horizontalDiv : 0.2,
63 horizontalShift : 10,
64 bottom : 192,
65 } );
66
67 LA2.hi( "parent func 'test()'", "called async func" );
68 story();
69 LA2.low( "parent func 'test()'", "returned from async func" );
70 }
71 async function story() {
72
73 LA2.hi( "async func 'story()'", "await" );
74
75 await new Promise( function( sigotoOk ) {
76 setTimeout( sigotoOk, 50 );
77 } );
78
79 LA2.low( "async func 'story()'", "resolved" );
80 LA2.stop();
81 }
82
83 </script>
84 <style>
85 </style>
86 </head>
87 <body onload="onloadx()">
88 <canvas id="test" style="
89 border : solid 1px black;
90 ">
91 </canvas><BR>
92 キーボードのキーを1回チョンと押すと、キーの動きを表示します。<BR>
93 (連打はできますが、長押しするとうまく動きません)
94 </body>
95 </html>