--
進行媒介
- 為了有網路就能玩所以
- 使用網頁 (我也只會網頁)
- 不需要登入
--
系統架構
- 網頁：HTML + JavaScript + CSS
- 通訊使用 EMQX MQTT + WebSocket 方案
- 儲存因為不需要永久儲存又怕阻塞所以選擇 Redis
--
網頁技術
作答使用手寫，所以需要一個網頁塗鴉的功能，經過搜尋之後有
- 10 Best Signature Pad Plugins In JavaScript
- thread-pond / signature-pad
- 用100行實現HTML5可存檔塗鴉版
- HTML5 Canvas Freehand Drawing w/ jQuery (touch + mouse)
因為手寫後要給出題者評分，所以功能實現除了要可以手寫之外還要有「重現」的功能，一開始使用 signature-pad 簽名相關的套件，後來因為沒有清除、換顏色功能又換回一般塗鴉功能。
參考了黑暗大加上 Google 的手機 touch 修正才可以使用
--
聲音播放
只需要播放、暫停控制，所以使用 HTML5 DOM 控制就可以了
--
235 total views, 7 views today