jam-cloud/web/app/assets/javascripts/web/session_info.js

(function(context, $) {

  "use strict";

  context.JK = context.JK || {};

  context.JK.ShowSessionInfo = function(app, musicSessionId) {
    var EVENTS = context.JK.EVENTS;
    var logger = context.JK.logger;
    var rest = JK.Rest();
    var ui = new context.JK.UIHelper(app);
    var $btnAction = $("#btn-action");

    var LATENCY = {
      GOOD : {description: "GOOD", style: "latency-green", min: 0.0, max: 20.0},
      MEDIUM : {description: "MEDIUM", style: "latency-yellow", min: 20.0, max: 40.0},
      POOR : {description: "POOR", style: "latency-red", min: 40.0, max: 10000000000.0},
      UNREACHABLE: {description: "UNREACHABLE", style: "latency-grey", min: -1, max: -1},
      UNKNOWN: {description: "UNKNOWN", style: "latency-grey", min: -2, max: -2}
    };

    function addComment() {
      var comment = $("#txtSessionInfoComment").val();
      if ($.trim(comment).length > 0) {
        rest.addSessionInfoComment(musicSessionId, comment)
          .done(function(response) {
            renderComment(comment, context.JK.currentUserId, context.JK.currentUserName,
              context.JK.currentUserAvatarUrl, $.timeago(Date.now()), false);

            $("#txtSessionInfoComment").val('');
          });
      }
    }

    function renderComment(comment, userId, userName, userAvatarUrl, timeago, append) {
      var template = $('#template-landing-comment').html();
      var commentHtml = context.JK.fillTemplate(template, {
        avatar_url: userAvatarUrl,
        user_id: userId,
        hoverAction: "musician",
        name: userName,
        comment: comment,
        timeago: timeago
      });

      if (append) {
        $(".landing-comment-scroller").append(commentHtml);
      }
      else {
        $(".landing-comment-scroller").prepend(commentHtml);
      }

      context.JK.bindProfileClickEvents();
      context.JK.bindHoverEvents($(".landing-comment-scroller"));
    }

    function registerScheduledSessionComment() {
      context.JK.JamServer.registerMessageCallback(context.JK.MessageType.SCHEDULED_SESSION_COMMENT, function(header, payload) {
        logger.debug("Handling SCHEDULED_SESSION_COMMENT msg " + JSON.stringify(payload));
        app.notify({
          "title": "Session Comment",
          "text": payload.msg,
          "icon_url": context.JK.resolveAvatarUrl(payload.photo_url)
        });
      });
    }

    // this is done post-page load to allow websocket connection to be established
    function addLatencyDetails() {
      rest.getSessionHistory(musicSessionId)
        .done(function(session) {
          if (session.approved_rsvps && session.approved_rsvps.length > 0) {
            // loop through each record in RSVPs, which has already been rendered, and extract
            // the user ID
            $('.rsvp-details').each(function(index) {
              var $user = $(this).find('div[hoveraction="musician"]');
              var userId = $user.attr('user-id');
              var latency = null;
              var latencyStyle = LATENCY.UNKNOWN.style;
              var latencyDescription = LATENCY.UNKNOWN.description;

              // default current user to GOOD
              if (userId === context.JK.currentUserId) {
                latencyStyle = LATENCY.GOOD.style;
                latencyDescription = LATENCY.GOOD.description;
              }
              else {
                // find the corresponding user in the API response payload
                for (var i=0; i < session.approved_rsvps.length; i++) {
                  if (session.approved_rsvps.id === userId) {
                    latency = session.approved_rsvps[i].latency;
                    break;
                  }
                }
                if (latency) {
                  if (latency <= LATENCY.GOOD.max) {
                    latencyDescription = LATENCY.GOOD.description;
                    latencyStyle = LATENCY.GOOD.style;
                  }
                  else if (latency > LATENCY.MEDIUM.min && latency <= LATENCY.MEDIUM.max) {
                    latencyDescription = LATENCY.MEDIUM.description;
                    latencyStyle = LATENCY.MEDIUM.style;
                  }
                  else {
                    latencyDescription = LATENCY.POOR.description;
                    latencyStyle = LATENCY.POOR.style;
                  }
                }
                else {
                  latencyStyle = LATENCY.UNKNOWN.style;
                  latencyDescription = LATENCY.UNKNOWN.description;
                }
              }

              // add the latency details for this user to the UI
              var latencyHtml = context.JK.fillTemplate($('#template-latency-detail').html(), {
                latencyStyle: latencyStyle,
                latencyDescription: latencyDescription
              });

              $(this).find('.latency-tags').append(latencyHtml);
            });
          }
        });
    }

    function initialize() {
      registerScheduledSessionComment();

      var $parent = $('.landing-sidebar');
      context.JK.bindHoverEvents($parent);
      context.JK.setInstrumentAssetPath($('.instrument-icon', $parent));

      // render comments
      $(".landing-comment-scroller").empty();
      rest.getSessionHistory(musicSessionId)
        .done(function(response) {
          if (response && response.session_info_comments) {
            $.each(response.session_info_comments, function(index, val) {
              renderComment(val.comment, val.creator.id, val.creator.name, 
                context.JK.resolveAvatarUrl(val.creator.photo_url), $.timeago(val.created_at), true);
            });
          }
        })
        .fail(function(xhr) {

        });

      // retrieve RSVP requests for this user to determine which CTA to display
      rest.getRsvpRequests(musicSessionId)
        .done(function(rsvps) {
          if (rsvps && rsvps.length > 0) {
            // should only be 1 RSVP for this session and user
            var rsvp = rsvps[0];
            if (rsvp.canceled) {
              $('.call-to-action').html('Your RSVP request to this session has been cancelled.');
              $btnAction.hide();
            }
            else {
              var declined = true;
              if (rsvp.rsvp_requests_rsvp_slots) {
                for (var x=0; x < rsvp.rsvp_requests_rsvp_slots.length; x++) {
                  if (rsvp.rsvp_requests_rsvp_slots[x].chosen || rsvp.rsvp_requests_rsvp_slots[x].chosen == null) {
                    declined = false;
                  }
                }
              }

              if (declined) {
                $('.call-to-action').html('Your RSVP request to this session has been declined.');
                $btnAction.hide();
              }
              else {
                $('.call-to-action').html('Tell the session organizer if you can no longer join this session');
                $btnAction.html('CANCEL RSVP');
                $btnAction.click(function(e) {
                  ui.launchRsvpCancelDialog(musicSessionId, rsvp.id)
                    .one(EVENTS.DIALOG_CLOSED, function() {
                      location.reload();
                    });
                });
              }
            }
          }
          // no RSVP
          else {
            $('.call-to-action').html("Tell the session organizer you'd like to play in this session");
            $btnAction.html('RSVP NOW!');
            $btnAction.click(function(e) {
              ui.launchRsvpSubmitDialog(musicSessionId)
                .one(EVENTS.RSVP_SUBMITTED, function() {
                  location.reload();
                })
            });
          }
        })
        .fail(function(xhr) {

        });

      $("#btnPostComment").click(function(e) {
        if ($.trim($("#txtSessionInfoComment").val()).length > 0) {
          addComment();
          $("#txtSessionComment").val('');
          $("#txtSessionComment").blur();
        }
      });

      addLatencyDetails();
    }
    
    this.initialize = initialize;
  }

})(window, jQuery);