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を作りましょう。