Posted at
OpalDay 10

Opalのgemをつくる

More than 1 year has passed since last update.

この記事はOpal Advent Calendar 2016の10日目の投稿として書いています。

またまた遅れてしまいました…

当初、「JavaScriptのライブラリをOpalから利用できるようなラッパーをつくってみましょう。」という予告をしておいたのですが、そのまえにOpalからつかえるgemをつくるほうが先な気がしたので、今日は「Opalのgemをつくる」ということをします。

まずは、通常のgemをつくるように、

$ bundle gem opal-audio

これか作るgemはOpalからWeb Audioを使うgemなので、opal-audioという名前にします。

http://opalrb.org/docs/guides/v0.10.3/configuring_gems.html

このへんを参考にgemを作成していきます。

Opalのgemでは、


  1. 通常のOpalのコンパイルの対象となる.rbファイル

  2. サーバーサイドでgemとして扱われるブートストラップコード

を用意する必要があります。

Opalの多くのgemでは、この2種類のファイル群をopalディレクトリとlibディレクトリに分ける方法と、libディレクトリに入れて、Opalの中で呼ばれているコードかそうでないか(サーバーサイド)で分岐する方法とがあるようです。

チュートリアルにはディレクトリを分けずに、RUBY_VERSIONで分岐するようになっているのでそちらの例でやります。


ブートストラップ

ブートストラップというか、サーバーからOpalのコードが読めるように、append_pathするコードを置きます。

lib/opal/audio.rb

require "opal/audio/version"

require "opal"

Opal.append_path File.expand_path('..', __FILE__)


Opalのコードを書く

Opal側ではrequire_relativeでロードするファイルを指定します。

今回はExampleというファイルをロードすることにしましょう。

require_relative "audio/example"

先ほどのブートストラップのコードとRUBY_ENGINEという定数を見て分岐させます。

lib/opal/audio.rb

if RUBY_ENGINE == 'opal'

require_relative 'audio/example'
else
require "opal/audio/version"
require "opal"

Opal.append_path File.expand_path('..', __FILE__)
end

サンプルコードは以下のようなものを使います。

lib/opal/audio/example.rb

require 'native'

module Opal
module Audio
class Example
def alert
$$.alert('Hello Opal-audio')
end
end
end
end


gemを使うサンプル

このgemを使うサンプルをつくましょう。examplesディレクトリを作って、8日目のサンプルに倣って以下のようなファイルを作りましょう。

Gemfile

gem 'rack'

gem 'opal-sprockets'
gem 'opal-audio', path: '..'

config.ru

require 'opal-sprockets'

Opal.use_gem 'opal-audio'

run Opal::Server.new { |server|
server.main = 'application'
server.append_path 'app'
}

app/application.rb

require 'opal'

require 'opal/audio'

Opal::Audio::Example.new.alert

$ bundle install

$ bundle exex rackup

http://localhost:9292を開くとアラートは表示されましたでしょうか?

次回は満を持して、Web Audioラッパーのgemを作りましょう。