Scala.jsでCreateJSを使うためのライブラリを作った

Scala

JavaScriptでインタラクティブなコンテンツを作成するためのオープンソースライブラリとしてCreateJSというものがあります。このライブラリを使用するとスプライトやトゥイーンアニメーション、サウンドなどを手軽に扱うことができます。*1

このライブラリを使用して作成しているコンテンツをScala.jsに移植するにあたって、先日紹介したscala-js-ts-importerでTypeScript用の定義ファイルから自動生成したコードをもとにScala.js用のライブラリを作成してみました。

https://github.com/takezoe/scalajs-createjs

まずはbuild.sbtに以下の依存関係を追加します。

resolvers += "amateras-repo" at "http://amateras.sourceforge.jp/mvn-snapshot/"

libraryDependencies += "com.scalawarrior" %%% "scalajs-createjs" % "0.0.1-SNAPSHOT"

Scala.jsプログラムには以下のimport文を追加します。

import com.scalawarrior.scalajs.createjs._

すると以下のようにScala.jsでCreateJSを使えるようになります。

// Declare the stage
val stage = new Stage("demoCanvas")
val w = stage.canvas.width
val h = stage.canvas.height

// Define images
val manifest = js.Array(
  js.Dictionary("src" -> "dummy.png", "id" -> "dummy"),
  js.Dictionary("src" -> "knight.png", "id" -> "knight")
)

// Pre-load images
val loader = new LoadQueue(false)
loader.addEventListener("complete", (e: Object) => {
  // Assemble shapes on the stage
  val background = new Shape()
  background.graphics.beginBitmapFill(loader.getResult("dummy")).drawRect(0, 0, w, h)

  var spriteSheet = new SpriteSheet(js.Dictionary(
    "framerate" -> 30,
    "images"    -> js.Array(loader.getResult("knight")),
    "frames"    -> js.Dictionary("regX" -> -70, "height" -> 88, "count" -> 64, "regY" -> -60, "width" -> 74)
  ))
  val knight = new Sprite(spriteSheet);

  stage.addChild(background, knight);
  stage.update();
  true
}

ただ、CreateJSにはEaselJS、TweenJS、PreloadJS、SoundJSという4種類のライブラリがあるのですが、いまのところSoundJSはサポートしていません（単純に現在作っているコンテンツで使っていないだけなのでマッピングを作成していないというだけなのでそのうち追加しようと思います）。

*1:CreateJSは著名なFlashデベロッパーであるGrant Skinner氏によって開発されたもので、ActionScriptに似たAPIを持っているためFlashデベロッパーが移行しやすいという特徴があるそうです。