jam-cloud/web/app/views/music_sessions/show.html.erb

<% provide(:title, "#{@music_session.description}") %>

<div class="landing-band">
  <% unless @music_session.band.nil? %>
    <div class="landing-avatar">
      <% unless @music_session.band.photo_url.blank? %>
        <%= image_tag "#{@music_session.band.photo_url}", {:alt => ""} %>
      <% else %>
        <%= image_tag "shared/avatar_generic_band.png", {:alt => ""} %>
      <% end %>
    </div>
    <%= @music_session.band.name %>
  <% else %>
    <div class="landing-avatar">
      <% unless @music_session.user.photo_url.blank? %>
        <%= image_tag "#{@music_session.user.photo_url}", {:alt => ""} %>
      <% else %>
        <%= image_tag "shared/avatar_generic.png", {:alt => ""} %>
      <% end %>
    </div>
    <%= @music_session.user.name %>
  <% end %>
</div>

<div class="landing-details">
  <div class="left f20 teal"><strong>SESSION</strong></div>
  <div class="right f14 grey"><%= @music_session.created_at.strftime("%b %e %Y, %l:%M %p") %></div>
  <br clear="all" /><br />
  <div class="left w70"><%= @music_session.description %><br /><br /></div>
  <% if @music_session.session_removed_at.blank? %>
    <div class="right">
      <a id="btnLike"><%= image_tag "content/icon_like.png", {:width => 12, :height => 12, :alt => ""} %>&nbsp;LIKE</a>&nbsp;&nbsp;&nbsp;
      <a id="btnShare"><%= image_tag "content/icon_share.png", {:width => 13, :height => 15, :alt => ""} %>&nbsp;SHARE</a>
    </div>
  <% end %>
  <br clear="all" />
  <div class="w100">
    <div class="recording-controls">
      <a class="left mr20" href="#"><%= image_tag "content/icon_playbutton.png", {:width => 20, :height => 20, :alt => ""} %></a>
      <% if @music_session.session_removed_at.blank? %>
        <div class="session-status">SESSION IN PROGRESS</div>
        <div class="recording-current">1:23</div>
      <% else %>
        <div class="session-status-ended">LIVE SESSION ENDED</div>
      <% end %>
    </div>

    <div class="left white"><%= @music_session.genres.split('|').first.capitalize %></div>
    <div class="right white">

      <span id="spnCommentCount"><%= @music_session.comment_count %></span>
      <%= image_tag "content/icon_comment.png", {:width => 13, :height => 12, :align => "absmiddle", :style => "vertical-align:middle", :alt => ""} %>&nbsp;&nbsp;&nbsp;&nbsp;

      <span id="spnLikeCount"><%= @music_session.like_count %></span>
      <%= image_tag "content/icon_like.png", {:width => 12, :height => 12, :align => "absmiddle", :style => "vertical-align:middle", :alt => ""} %>

    </div>
  </div>
  <br clear="all" /><br />
  <%= render :partial => "shared/track_details", :locals => {:tracks => @music_session.tracks} %>
</div>
<br clear="all" />

<% if signed_in? %>
  <% unless @music_session.band.nil? %>
    <%= render :partial => "shared/landing_sidebar", :locals => {:user => @music_session.band, :recent_history => @music_session.band.recent_history} %>
  <% else %>
    <%= render :partial => "shared/landing_sidebar", :locals => {:user => @music_session.user, :recent_history => @music_session.user.recent_history} %>
  <% end %>
<% else %>
  <%= render :partial => "shared/cta_sidebar" %>
<% end %>

<% content_for :after_black_bar do %>
  <br />
  <%= render :partial => "shared/comments", :locals => {:comments => @music_session.comments, :id => "txtSessionComment"} %>
<% end %>

<%= javascript_include_tag "web/sessions" %>

<%= render :partial => "clients/shareDialog", :locals => {:session => @music_session} %>

<script type="text/javascript">
  $(function () {

      JK = JK || {};

      <% if current_user %>
        JK.currentUserId = '<%= current_user.id %>';
      <% else %>
        JK.currentUserId = null;
      <% end %>

      if (JK.currentUserId) {
          JK.app = JK.JamKazam();
          JK.app.initialize({inClient: false, layoutOpts: {layoutFooter: false}});

          var shareDialog = new JK.ShareDialog(JK.app);
          shareDialog.initialize();

          $("#btnShare").click(function(e) {
            shareDialog.showDialog();
          });

          $("#txtSessionComment").keypress(function(e) {
            if (e.which === 13) {
              addComment();
            }
          });
      }
      else {
        $("#txtSessionComment").attr("disabled", "disabled");
        $("#txtSessionComment").val("You must be logged in to add a comment.");
      }

      JK.sessionId = "<%= @music_session.music_session_id %>";

      var rest = new JK.Rest();

      $("#btnLike").click(like);

      function like() {
        rest.addSessionLike(JK.sessionId, JK.currentUserId)
          .done(function(response) {
            $("#spnLikeCount").html(parseInt($("#spnLikeCount").text()) + 1);
            $("#btnLike").unbind("click");
          });
      }

      function addComment() {
        var comment = $("#txtSessionComment").val();
        if ($.trim(comment).length > 0) {
          rest.addSessionComment(JK.sessionId, JK.currentUserId, comment)
            .done(function(response) {
              $("#spnCommentCount").html(parseInt($("#spnCommentCount").text()) + 1);
              $(".landing-comment-scroller").prepend(comment);
            });
        }
      }
  })
</script>