railsでriotjsをセットアップする＋riotjsからjsonをとってくる(via jQuery.get)

なんか巷ではriotjs-railsを使うらしいが、これが何故かGem installedなのにファイルがコピーされずに、assets/application.jsからrequireしても怒られる。

くっそいので、違うのをさがしたらあった。

Gemfile

gem 'riot_js-rails'

$ bundle install

assets/application.js

//= require riot
//= require riot_rails

これで動くようになる。あとは、タグファイル(filename.tag)をassets/javascript内に置けば、riot.tag()としてコンパイルして読み込んでくれるようになる（もちろん、.tagもrequireされないとダメだとおもう）

Riot.jsではAjaxしたかったので、jsonを取得してデータをとってくるちょっと怪しいサイトを参考にして以下の様な感じ。

assets/javascript/sample.tag

<fuck>
  <h2>{opts.header}<h2>
  <ol>
    <li each={list}>
      {user.name.first}
    </li>
  </ol>
  <script>
    var self = this;
    this.list = []; 
    opts.dataRequest.done( function(data){ 
      self.list = data.results;
      self.update(this.list) 
    })
  </script>
</fuck>

view/fuck/index.slim

fuck
javascript:
  riot.mount('fuck', 'テスト'
    dataRequest: $.get("http://api.randomuser.me/?results=3") 
  });

このsample.tagはコンパイルされると以下の様な感じである

sample.js

riot.tag('large_categories', '<h2>{opts.header}</h2> <ol> <li each="{list}"> {user.name.first} </li> </ol>', function(opts) {
    var self = this;
    this.list = []; 
    opts.dataRequest.done( function(data){ 
      self.list = data.results;
      self.update(this.list) 
    })
});

しかしこのタグファイル、以下の問題がある

HTMLとJSが共存しているのをriot_js-railsがコンパイルするので、

• slimで書けない
• coffeescript で書けなくもない（<script type="coffee">でイケルが、gemが直指定されてる？のかcoffee-scriptなんて無え！とエラーになる）
• Bracketsではカラースニペットが効かない（.tagという拡張子だから…）

うーん、.slimではカスタムタグだけ宣言しておいて、riot.mount()については、コントローラとして、単独の.js.coffeeファイルで書いて、カスタムタグはホントにコンポーネントとして、表示するだけにするのが、意図通り綺麗かも？

assets/javascriptにViewが居るのが…

コントローラかどっかルーティング弄ればviews/の中でもコンパイルしてくれるようにできるかも

まあ、でもそのぐらいでしょうか。ちょっとおもしろそうなので、もう少しがんばっていじってみる。