Emscriptenでcursesなコードを動かすには

Last updated at 2019-04-19Posted at 2014-04-18

はじめに

cursesを使ったプログラムもEmscriptenで
PDCurses-emscriptenを使えば、白黒表示ながら動く。

slコマンドをEmscriptenで動かそうとして、悪戦苦闘した際のメモです。

PDCurses-emscriptenをビルド

まずbuild.shを編集して実行

emscriptenのインストール場所を自分の環境に合わせて書き直して、ビルド実行

./build.sh

自分のコードを動かすのに必要となるファイル

以下の2ファイルが以降の作業で必要となる。

pdcfont.bmp
libpdcurses.a

自分が動かしたいコードをPDCurses-emscriptenを使てビルドするには

メインループ相当の処理を関数にして切り出す

# ifdef EMSCRIPTEN
void my_end()
{
    mvcur(0, COLS - 1, LINES - 1, 0);
    endwin();
}

void my_main(void);

void my_main()
{
	if (LOGO == 1) {
	  if (add_sl(x) == ERR) {my_end();return;}
	}
	else if (C51 == 1) {
	  if (add_C51(x) == ERR) {my_end();return;}
	}
	else {
	  if (add_D51(x) == ERR) {my_end();return;}
	}
	refresh();
  x--;
}
# endif

emscripten_set_main_loopに登録

切出した関数ポインタをemscripten_set_main_loopに登録する。

この作業により、Canvasに描画するタイミングをウェブブラウザに与えることが可能になる。
これをやらないと、ビルドできて、いざ表示しても真っ黒い画面という残念な結果になる。

# ifndef EMSCRIPTEN
    for (x = COLS - 1; ; --x) {
	if (LOGO == 1) {
	    if (add_sl(x) == ERR) break;
	}
	else if (C51 == 1) {
	    if (add_C51(x) == ERR) break;
	}
	else {
	    if (add_D51(x) == ERR) break;
	}
    getch();
	refresh();
	usleep(40000);
    }
    mvcur(0, COLS - 1, LINES - 1, 0);
    endwin();
# else
  x=COLS - 1;
  emscripten_set_main_loop(my_main,50,1);
# endif

本体のビルド

pdcfont.bmpとlibpdcurses.aをコピーするなりして、持ってくる

~/local/emscripten/emcc -O2 -Wall -fPIC -I.  -o sl.bc sl.c libpdcurses.a `sdl-config --libs`

ブラウザで動かすのに必要なHTMLファイルを生成

~/local/emscripten/emcc -o sl.html sl.bc --preload-file pdcfont.bmp

まとめ

それほど手間なくcurses.hなコードをjs化することが出来ました。

slコマンドをJsdo.itで動かしてみました。

追記

どうも手元のMavericks環境ではビルドは出来ても
js実行時に参照しているシンボルが未解決なエラーがでて
動きませんでした。

Ubuntu12.04な環境で動いてます。

という状況でしたが、
Mavericks環境のEmscriptenは古かったようで、
EmscriptenSDKを導入したら、無事動かすことが出来ました。