第二のsusパーサ「sus-analyzer」を作りました

2019年8月14日雑記

※この記事は前のブログで2018年11月25日に投稿されたものです。最新の情報ではない可能性があります

こんにちは、水珈琲です。

今回は最近作ったnpmパッケージ「sus-analyzer」とそれを用いた「sus-2-image」、サービス化した「Sus2Image」をまとめて紹介しちゃいたいと思います。

Sponsored Links

sus-analyzer

概要

BMSフォーマットベースでkb10uy氏によって考案されたSeaurchin用譜面ファイル、通称「sus」というものがあります。Seaurchinの開発が始まったのが2016年9月なのですが、開発が始まって2年経った今でもSeaurhcin以外の(派生含む)シミュレータは登場していません。

Seaurchinはこちら

Seaurchin一強というのも面白いのですが、ユーザーに選択肢があるもの良いと思うので色々なパーツから作る事にしました。ちなみに作者さんは、Seaurchin以外のsusパーサには肯定的みたいですね。

余談ですが、sus-analyzerを実装するにあたってSeaurchinの挙動をいろいろ眺めていました。変な挙動や仕様にない(設計上の)仕様等が見つかって面白かったです。

リポジトリ

GitHub

https://github.com/mizucoffee/sus-analyzer

npmパッケージ

https://www.npmjs.com/package/sus-analyzer

何が出来るの?

主に2つの事をする為に作りました。

  1. メタデータの解析
  2. 譜面データの解析

この2つ以外にもバリデーションチェックも機能として搭載していますが、まだ仕様が固まっていないです…

susファイルを渡すとjsで扱いやすい感じのオブジェクトを返してくれます。詳しい内容は実際に使ってもらうのが一番分かりやすいと思うので省きますが、最低限プレイヤーを作れるレベルの形になっていると思います。(ハイスピ系、REQUEST構文等を除く)

sus-2-image

概要

sus-2-imageは上記sus-analyzerを用いた別のnpmパッケージです。名前のとおり、susファイルから譜面画像を生成します。

node-canvasを使用して実装しているのですが、なんといっても遅いです。これでも最適化した方なんですがね…どこかのタイミングで解消したいですね。

GitHub

https://github.com/mizucoffee/sus-2-image

npmパッケージ

https://www.npmjs.com/package/sus-2-image

Sus2Image

概要

https://sus2image.mizucoffee.net/

Sus2Imageは上記sus-2-imageのフロントエンドの実装です。まあ要するにsusファイルを画像に変換するサービスです。

下の画像のように出力されます。特徴は、ベジェ曲線対応・(設計上は)Seaurchinと同等の出力が可能・拍子が違っても小節辺りの幅は同じアップデートで時間軸ベースに変更しました、といった感じです。

まとめ

まあざっくりまとめるとSeaurchinのsus実装を作りましたーっていう感じの記事でした。
結構楽しかったです。

sus-analyzerはnodeの実装ですが、それ以外の言語での実装も面白そうなので皆さんも作ってみてください…!