カテゴリー
ネットのサービス

Never-Blink ウェブカメラ対戦型の「まばたき我慢」ゲーム

Never-Blink は、まばたきを我慢し合うゲームです。

サーバにつながった中からランダムな相手が決まり、その相手とwebカメラがついたブラウザ経由でにらめっこのように向き合います。

最初に持っているヒットポイントは、まばたきをするたびに減っていき、ゼロになると負け。

類似の先行例として、2017年にBBCが人気ドラマ「ドクター・フー」のプロモーションで短期公開した、“Don’t Blink”(まばたきするな)があるそうです。こちらは他人との対戦ではなく、ウェブカメラをみながらどれだけまばたきを我慢できるかというゲームだったよう。

ランダムにつながるというあたりは、一時期世界中で話題となった Chatroulette を思い出しますね。単にランダムにつなげるより、そこにゲームが有った方が楽しいという人はいるかもしれません。

ソースコードがGitHub に公開されていますが、今のバージョンは処理が重いそうで、どこかのサーバに載せて一般公開はできていないということ。自分でインストールした上で相手を探して遊ぶのはちょと大変かもしれませんね。

モバイルゲームとして手軽に遊べれば、そこそこ流行るかもしれません。

via Hacker News

カテゴリー
技術

css-only-chat CSSだけで動くブラウザチャット

ケビン・クッチャさん(Kevin Kuchta)のkkuchta/css-only-chat は、JavaScript を使わない非同期ウェブチャットサーバーです。

二つ(以上)のブラウザからこのサーバに接続し、アルファベットをクリックしてメッセージを作り送信すると、同じサーバに接続した他のブラウザでも即時表示される、いわゆるブラウザチャットです。しかし面白いのは、このページで JavaScript は使われていないというところ。

送信側

CSS の :active 疑似クラスを使うことで、ある領域をクリックした際に、はじめて画像ファイルを読み込ませることができます。つまり、ボタンが押されたタイミングを画像ファイルの読み込みでサーバ側から検知できるということ。

「同じボタンが2度目押された時は(画像はもうブラウザ側にロード済なので)サーバはわからないのでは?」となりますが、たとえば “a””a” と押した時は、接続しっぱなしの状態で、元のボタンを隠し、新たに「”a”を押した」という情報を持った別の画像ファイル名を持つボタンを表示しているようです。これをすべてのボタンに対して行うことで、ボタンが持つ画像ファイルのパスが、過去のすべてのタイプ内容を保持することになります。

受信側

表示はどうやって更新してるのか、も解説されています。接続しっぱなしの状態で、これまで送った html が不要になったら、style タグを送って過去の要素を display:none で隠し、新たにページ内容を追記します。

これを、自身か他のブラウザから新たなデータが届くまで待機しながら繰り返しているということ。じゃあソースコードはとても長くなるのでは、と思って Chrome でソースを表示しようとしましたが、何も表示されません。Firefox では何千桁もある一行のソースコードを確認できました。

今のところデモサイトは用意されていないので、試すには自分で動かす必要があります。

via Hacker News

カテゴリー
fun

ブラウザのファビコンでライブストリーム

ファビコンでアニメーションとかは以前からあるネタなので、その延長にあるアイデアというか。ファビコンでカメラが映した映像を表示させるというプログラムです。

作者の方がツイッターに動画を上げています。

ウェブカムに向かって手を振ってる様子がわかるでしょうか?

自分で試したい場合、こちらのサイトをChrome/Firefoxなどで開き、カメラへのアクセスを許可する必要があります。

# Safari では動かないというレポートがあります

ソースコードはこちら。短いですね。

via Hacker News