asciinema.org/app/views/asciicasts/show.html.erb

<div class="asciicast">
  <h2><%= asciicast_title(@asciicast) %></h2>
  <p class="meta">
    <%= asciicast_author(@asciicast) %>
    <%= asciicast_time(@asciicast) %>
  </p>

  <div class="wrapper">
    <div class="player"></div>
    <div class="clear"></div>
  </div>

  <div class="description">
    <p>I’ve been doing some reflecting this week on how I can work smarter (instead of harder), and one of the things I came up with was adding a few more tools to my Vim repertoire. I spend more than half of my engineering time in Vim (the other half usually being in a web browser), so I figured that a few minutes here and there would eventually add up in a big way.</p>
    <p>But like anything else with Vim, there are always multiple ways of accomplishing the very same thing, so I make no guarantees that there aren’t simpler ways of getting this done — but I can say that this way gets the job done, and is pretty easy to get working on your own system.</p>
  </div>
</div>

<%= player_script(@asciicast) %>

<h2>Comments</h2>

<div class="comments-container">
  <ul id="comments">
  </ul>

  <% if current_user %>
    <form id="new-comment">
      <p>
      <textarea type="text" name="body" id="comment-body"></textarea>
      </p>

      <input type="submit" value="Post">
    </form>
  <% else %>
    <div><%= link_to "Login in", login_path %> to create a comment.</div>
  <% end %>
</div>

<script type="text/javascript">
  jQuery( function(){
      var comments = new AsciiIo.Collections.Comments();
      var asciicast_id = <%= @asciicast.id %>

      comments.url = ['/api/asciicasts/', asciicast_id, '/comments'].join('');
      comments.fetch();

      new AsciiIo.Views.CommentsIndex({ collection: comments });
      })
    </script>