作ったもの
脳トレゲーム（仮）
(このタイトル画像のためにOffice365契約しました)
https://sugawani.github.io/elm-brain-traning/
コード
github.com
推奨解像度WQHDのクソゲーが出来上がりました
お題
- 何度でも
- サラダ
- コイン
- アンパン
- ゴルディアスの結び目(？)
がお題一覧で、この中からサラダが選ばれたらしいけど
それに気づかず全部入れるものだと思っててゴリ押しで作った
解説
解説するほどのことはない簡単なゲーム
キー入力受付
toKey : String -> KeyType toKey key = case key of "ArrowUp" -> Up "w" -> Up "ArrowDown" -> Down "s" -> Down "ArrowLeft" -> Left "a" -> Left "ArrowRight" -> Right "d" -> Right "Enter" -> Enter _ -> Other
最初↑↓←→だけだったんだけど、wasdでプレイさせてくれって要望があったので急遽雑対応した
developer.mozilla.org
を見る感じkeyWとかで行けそうだったんだけど、上手く動かなかったのでwで指定した
画像とか音楽をビルドする
github.com
これを使ってアセットディレクトリすべてコピーするようにした
便利、神に感謝
音楽の自動再生
, audio
[ Attr.src "nando_loop.mp3"
, Attr.type_ "audio/mp3"
, Attr.autoplay True
, Attr.loop True
]
[]
HTML5のaudioタグを使って自動再生しようと思ったらChromeだと上手く動かなかった
developer.mozilla.org
メモ: 自動的に音声 (あるいは音声トラックを含む動画) を再生するサイトはユーザーにとって不快な体験になる可能性がありますので、可能な限り避けるべきです。自動再生機能が必須である場合は、オプトイン (ユーザーが明示的に有効化することを求める) にするべきです。ただし、ユーザーの制御下で後からソースを設定するメディア要素を作成するときは、この方法が役に立つでしょう。自動再生ガイドには autoplay の正しい使い方についての追加情報があります。
これが原因だった
つまるところスパムサイト対策としてユーザが意図しないデフォルトの自動再生はNGらしい
抜け道として無音の音声ファイルをiframeで埋め込んで自動再生すると行けるという方法もあったみたいだけど、いつの間に防がれていたらしい
仕方ないのでChromeユーザにはサイト設定から音声許可してもらうことにした(今思うとダイアログ出せると良かった)
hbsnowさんから聞いたけどhowler使うとサクッと行けるらしい
howlerjs.com
バグ
雑に作ったせいで10問目は正解不正解問わずクリアになる
これ頓挫してるSTACKERゲームに繋がる部分な気がする
まとめ
みんなUnityで凄いゲーム作ってて提出するの気が引けたけど、チームの人が
「すがわにさんがクソゲー提出することでハードル下がるから提出すべき」って言ってくれて勇気が出た
完成したからエラい！ヨシ！
