Opalのgemをつくる

  • 0
    いいね
  • 0
    コメント

    この記事は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を作りましょう。

    この投稿は Opal Advent Calendar 201610日目の記事です。