はじめに
2014年春にslコマンドをEmscriptenでjs化してjsdo.itに公開したり、githubにもコードを上げた。当時は、右も左も分からない状態で、ただただslコマンドをEmscriptenで変換してWebブラウザで本物のslコマンドを動かしたい一心で作業をしていたので、あまり整理出来ていなかった。
また、当時よりEmscriptenも進化が進み、js化の為に使用していたPDCursesライブラリのjs版も更新されていたので、今回、これらに合わせて改めて、slコマンドのjs化を行った。
OSX Yosemiteで以下を試した。WindowsやLinuxでも同様の事が可能なはず。
この記事を試すに当たり必要なもの
Emscripten SDK
以下のURLの指示に従い、インストールする。
source ./emsdk_env.sh
まで実行して、以降の作業はこのシェル内で行う事。
SDL
Emscripten本体でsdl2やsdl3対応が進んでいるような噂を目にした気がするが、sdlは1.x系で作業を進める。
brew install sdl
PDCurses-emscriptenが改名してた
PDCurses.jsになり、Readmeからビルド方法すらなくなってた！
でもbuild.shを読めばOK
git clone https://github.com/coolwanglu/PDCurses.js.git cd PDCurses.js
emscripten portable SDKつかってsourceしてれば、emccのパスとか不要なので
build.shを以下の様に書き換えて実行する。
#!/bin/bash #EM_DIR=~/src/emscripten #PATH=$EM_DIR/system/bin:$PATH pushd sdl1 #$EM_DIR/emmake make -j4 CFLAGS=-Os emmake make -j4 CFLAGS=-Os popd mkdir web || true build_demo () { pushd web cp ../sdl1/$1 $1.bc emcc -s ASYNCIFY=1 -Oz -o $1.html $1.bc --preload-file pdcfont.bmp popd } for demo in firework newdemo ptest rain testcurs tuidemo worm xmas sdltest; do echo "Building $demo" build_demo $demo done
PDCurses.jsライブラリのビルド
./build.sh cd ..
emscripten_sleepとASYNCIFYオプション
emscripten_sleepとASYNCIFYが導入されたので、emscripten_set_main_loopを使わずに、オリジナルのコードに近い書き方が出来る。
slコマンドの場合
#ifndef EMSCRIPTEN usleep(40000); #else emscripten_sleep(40); #endif
以前は、メインループを別関数に切り出して、その関数へのポインタを登録するコードにする必要があったが、ASYNCIFYオプションが導入されたので、めちゃくちゃスッキリ書けるようになった。
slコマンドをjs化する
Emscripten対応版のslのソースを用意する
git clone https://github.com/kjunichi/sl.git
PDCurses関連のファイルをコピーする
cd sl cp ../PDCurses.js/pdcfont.bmp . cp ../PDCurses.js/sdl/libpdcurses.a .
ビルド
emcc -s ASYNCIFY=1 -O2 -Wall -fPIC -I. -DEMSCRIPTEN -o sl.html sl.c libpdcurses.a `sdl-config --libs` --preload-file pdcfont.bmp
Js化したslコマンドを動かす
httpサーバーを立てる
平均年収の一番高いプログラム言語のPythonを使っとくか
python -m SimpleHTTPServer 8000
Ctrl-Zを押して、bgと入力して、裏で動かしておき、以降の作業を続ける。
Webブラウザを起動する
open http://localhost:8000/sl.html
Link
- https://github.com/coolwanglu/PDCurses.js
- kjunichiさんはTwitterを使っています: "”-s ASYNCIFY=1”に加えてSDL_Delayみたいなsleep読んでる箇所をemscripten_sleep()に書き換える必要があるのかぁ、さっきのライブラリの作者がemscriptenのwikiに解説書いてた http://t.co/f2MUN7XCzk"
関連記事
