Updated README.

2024-12-25 11:18:55 +00:00 · 2022-11-02 10:57:37 +08:00 · 2022-11-02 10:57:37 +08:00 · 0cbf968228
commit 0cbf968228
parent ec2a21dbe7
5 changed files with 11 additions and 3 deletions
--- a/README.md
+++ b/README.md
@ -1,7 +1,14 @@
 # Preface 

-This project is a demo for a websocket-based input synchronization method inspired by [GGPO](https://www.ggpo.net/).   
-![screenshot-1](./screenshot-1.png)
+This project is a demo for a websocket-based input synchronization method inspired by [GGPO](https://www.ggpo.net/).
+
+_(how input delay roughly works)_
+
+![input_delay_intro](./charts/InputDelayIntro.jpg)
+
+_(in game screenshot)_
+
+![screenshot-1](./charts/screenshot-1.png)

 Please checkout [this demo video](https://pan.baidu.com/s/123LlWcT9X-wbcYybqYnvmA?pwd=qrlw) to see whether the source codes are doing what you expect for synchronization.

@ -67,7 +74,7 @@ The easy way is to try out 2 players with test accounts on a same machine.
 - Open one browser instance, visit _http://localhost:7456?expectedRoomId=1_, input `add`on the username box and click to request a captcha, this is a test account so a captcha would be returned by the backend and filled automatically (as shown in the figure below), then click and click to proceed to a matching scene.
 - Open another browser instance, visit _http://localhost:7456?expectedRoomId=1_, input `bdd`on the username box and click to request a captcha, this is another test account so a captcha would be returned by the backend and filled automatically, then click and click to proceed, when matched a `battle`(but no competition rule yet) would start.
 - Try out the onscreen virtual joysticks to move the cars and see if their movements are in-sync.
-![screenshot-2](./screenshot-2.png)
+![screenshot-2](./charts/screenshot-2.png)

 ## 2 Troubleshooting

--- a/charts/DelayNoMore.drawio
+++ b/charts/DelayNoMore.drawio
@ -0,0 +1 @@
+<mxfile host="Electron" modified="2022-11-02T02:36:13.192Z" agent="5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/16.0.2 Chrome/96.0.4664.55 Electron/16.0.5 Safari/537.36" etag="E9i2AzTRyd2uchrfaZPV" version="16.0.2" type="device"><diagram id="TvRU_T4V9W8q_-9leCnt" name="InputDelayIntro">7Vxbk5s2FP41nm4fdgdJgOFxL9m0D52mTWbSPHWIETYNBgfLu+v++kqAbNCR114bEHHtTHbgAEL6zqdzk+wRuZ+/vM+Dxey3LKTJCFvhy4g8jDD2XJ//FYJ1KUBjp5JM8zisZFvBx/hfWgmtSrqKQ7ps3MiyLGHxoimcZGlKJ6whC/I8e27eFmVJ862LYEqB4OMkSKD0cxyyWTUuPN7Kf6HxdCbfjOSI54G8uRrJchaE2XNNRN6NyH2eZaw8mr/c00SAJ3Epn3vccXXTsZym7JAHvj/97nx6H/7zx4e/7z7h68R7R1fXVStPQbKizd6ytYQgz1ZpSEUr1ojcPc9iRj8ugom4+syVzmUzNk/4GeKHUZwk91mS5cWzxLIci0ZcvmR59o02rqCHu3vxRJaymjwqPlxe9YzmjL7sHDLaAMkZSLM5Zfma31I9YFeDqcjnVafPW0XKO2Y1HUpZUFFnuml3iy4/qAB+A9gYgA2wpml4K1jLzyZJsFzGkya8TV2Uj9MQUFgBiM+ZIJ9S9krfiB7IGlSOBiopy2kSsPip2Q0dftUbPmQx7+AuPUmgZAPLbJVPaPVMneFKM67/ejslCKCdQpebMR+vXgLUy+I5BSrmdGZNpTbnRpqlVJlIlShI4mkqmMG1S7n8TkyOmNuq2+rCPA5D8RrtJNVR56TZNXYUuNEYzC9XQxrS1fwaAwWg04xZCyB5wzJBHoAI2qC+IUJ4WBj5ACNiHiN3WBjJ8KwGkn0aSIMKHLA1MLhhnOYY5+TQwisE4yvXPEgDcwAIRilj4yCRgXkAZAOQvDOybmRozsQBcPvGOWkPzQW4ACTphE2iNDQfoMkBTkwClKkbOeKfbuq6xQdO3fLTEt5DcycwoUDmo2VnaAYOphQyWDkLh+IMzH/L7tTxPjE9aQEld2AeBcNQkA8lpPljHszpryEA7GwqV2qh0LOBJjyNJojblSZgvHlTfM5YBaSpAt8BKui1dohhDNruSkgUTSa+r7PQxCU+CTtZ8djUMYzZGI3n+wFhRb7XwBX5vllcCbTd7QYU/eCqZqLmcYXx7InhrBFc1YDMOK42jMjidLFi5x9qeE3LgS1iNtawYSn57GMNrOgAwXiv12DDxkAHAP3lLFiIw8kqT9Z3eTD5Jtbv91mbLXblGQtYnAnE/ZawRAjdOA00r7eSGp4S4jqeyH1lZ8BpgEJ3WJiXB5oE68LGLPnV4oLFO8Zf4iYCza85P5qKoyskbsBuMBeIFhfVM6tostgbVDb5c73N1idPQiNmfOoQZeZoFC03PPUzc2CmBKB/2x4a+hKzv8TxjVOdfanuE8cPL7XbHtbyJOVjqT0kTr/Ur20fK87Wo7fu1ym3vLwCxKH7ekqNmdrYQ5RyJbIUYhy6tcdW0kVHaafjrT02zA7PkHamWILR+MbBTaLgI4miaQurpOuaLHCl5nlG09K/FL5ElGJHYs+qDP7d76usdDLE4p8oqotKB6WU5irH48kmeU/LVsu7Cx9nQTcnJatElSSxlASHdjWKPEtgq3a1GdlXPb0CA5DuddpwttO9zhbvHLMVCzc/pSnNA8anWuHoy2bTr8tFMbawNjjewHbYEIiY/STai+J8KTAIFoskFq1aLDtRmUGasRnN/9Tq9ErF74ioBG+u6EIgtBvCJlya893AcWGdVucZECkObZM31FMJXWaNUGchESyxdZ1MXBfZBKhgPD4S/r+tPAMreYbtG08zHFjFOMxOEqKzAmkmJ2nduuyYmINMzpU1RWHu2iKAS27GTQIgAudaLR3tJf9wYPXkUD+g85TSVS1/aLW3Mu+lknUGtc/ajANLCWcY6h+SYVamdf9XR4x+d4TPLZA8qOQ4NHnQtIVVv91x8uBcChzNPTP76eeZpJ8j6/mbxFUp3B/KPbUhbDn9Eq/1EocmOLDqhEQ1OlqH0hE3+Ij28FGzG+ru1mqZqbIoupeppSkxZiiRkrocW4sDi7Y9F+McWF+5MLVlphqtByq7s4ALPrgWqK6Cq3FB10SFm5EvRG2ZqPgsiKpa1L6JCne9XIjaMlGNJkltEZVYhokKa51l3UzUtkVV/kcolyg8PK1MqipEs5W51/KJfNnFlLzZlBya8JaFGWOLtUTJU4+2Ja6SOfdsS1xdKffC1FaZanTzyblEZy6+ELVrorrnQFTT0Znb+tLJhaja7zcb8/3KLz5tCixvL3YrTFW/eNA1U1tfZfm/MFVGf/uZ6ptkqk3sJlPlxuE3M9V1m0x1+12WcS/LMp0z1egCog2WZfwjmWob9v6XZZmumVr73VgT3t9Wv8p2JFPtzhIqfrr9Qd3y9u3PEpN3/wE=</diagram></mxfile>
--- a/charts/InputDelayIntro.jpg
+++ b/charts/InputDelayIntro.jpg
--- a/charts/screenshot-1.png
+++ b/charts/screenshot-1.png
--- a/charts/screenshot-2.png
+++ b/charts/screenshot-2.png
				`@ -0,0 +1 @@`
				<mxfile host="Electron" modified="2022-11-02T02:36:13.192Z" agent="5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/16.0.2 Chrome/96.0.4664.55 Electron/16.0.5 Safari/537.36" etag="E9i2AzTRyd2uchrfaZPV" version="16.0.2" type="device"><diagram id="TvRU_T4V9W8q_-9leCnt" name="InputDelayIntro">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</diagram></mxfile>