[SOLVED] Accessing DOM using Opal Ruby : how to install gems properly?

Accessing DOM using Opal Ruby : how to install gems properly?

I'd like to test some simple SVG animations with the help of Opal Ruby, that stands as a Ruby to Javascript transpiler.

However my first steps in using Opal are awkward. I can't access the the dom (document object model) at all.

It seems that my install (gems) is probably suspicious. I missed something :

opal --compile test.rb > app.js

Returns :

/home/jcll/.rvm/gems/opal/gems/opal-1.1.1/lib/opal/builder.rb:182:in `read': can't find file: "opal-browser" in: (Opal::Builder::MissingRequire)

Here are the gem listed :

ls ~/.rvm/gems/opal/gems/

ast-2.4.2 opal-1.0.5 opal-1.1.1 opal-browser-0.2.0 opal-jquery-0.4.4 paggio-0.2.6 parser-2.7.2.0 parser-3.0.1.1 rake-13.0.4

Here is my ruby test :

require 'opal'
require 'opal-browser'

# prints ok on the browser console
puts "hello world".center(30,'=')

# prints ok on the browser console
(1..5).each{|i| puts "#{i*2}"}

#p $window.document.class

And finally my Html code :

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>SVG Animation with Opal Ruby</title>
  </head>
  <body>
    <script src="app.js"></script>
    <svg id="svg_root" width="800" height="600">
      <circle id="circle" cx="100" cy="200" r=10 fill="blue" />
    </svg>
  </body>
</html>

(My first intent was to move the SVG circle or react to browser events using Opal Ruby)

Solution

As of now, we can't release opal-browser as a Gem.

Please use gem "opal-browser", github: "opal/opal-browser"