大事なのは、コンピューターと人をつなぐインターフェイス！
ネット対戦もいいですが、リアルに集まりその場でひとつの画面をみんなで囲んで盛り上がるオフライン対戦ゲームの方がレイテンシ0、膨大な帯域が使えるので、より熱い！
今でも人気なスマブラ、その元祖は NINTENDO64 で発売されました（もっと元を辿るとアーケードやファミコンでのマリオブラザーズ！）。使い勝手良いコントローラーをたくさんつないでみんなで遊ぶと楽しそう！
Switch用のコントローラー、ファミコンだけでなく、スーファミ、メガドライブ、NINTENDO64のコントローラーまで発見！ロクヨンのコントローラー、大きい！しかも、ちゃんと振動対応！
ファミコンや、リングコンをつないだオープンソースのライブラリ「joy-con-webhid」を改造して、これらのコントローラーにも対応！
ひとまず作成、つないだコントローラーの数だけ、十字キーで動き回れるアプリ！
<script type="module">
import { createEgCanvas } from "https://js.sabae.cc/egcanvas.js";
import * as JoyCon from "https://tomayac.github.io/joy-con-webhid/src/index.js";
class Player {
constructor(joyCon) {
this.joyCon = joyCon;
}
}
const players = [];
document.body.addEventListener('click', async () => {
await JoyCon.connectJoyCon();
});
setInterval(async () => {
for (const joyCon of JoyCon.connectedJoyCons.values()) {
if (joyCon.eventListenerAttached) {
continue;
}
joyCon.eventListenerAttached = true;
const player = new Player(joyCon);
players.push(player);
await joyCon.setLEDState(players.length);
joyCon.addEventListener('hidinput', ({ detail }) => {
const btn = detail.buttonStatus;
if (btn.left) {
player.x--;
} else if (btn.right) {
player.x++;
}
if (btn.up) {
player.y--;
} else if (btn.down) {
player.y++;
}
});
}
}, 2000);
const c = createEgCanvas();
c.draw = (g, cw, ch) => {
g.setColor(255, 255, 255);
g.fillRect(0, 0, cw, ch);
for (let i = 0; i < players.length; i++) {
const p = players[i];
if (isNaN(p.x)) {
p.x = 20; // rnd(cw);
p.y = i * 20; // rnd(ch);
}
g.setColorHSL(i * 30, .6, .5);
g.fillCircle(p.x, p.y, 10);
}
};
const loop = () => {
c.redraw();
requestAnimationFrame(loop);
};
loop();
</script>
大乱闘ゲームづくり、いかがでしょう？
今月末、サイバーフライデーはお休みですが、10/1-2のメガネフェスにて展示します！
2024-04-26 Fri Night
