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

(function(context,$) {

  "use strict";

  context.JK = context.JK || {};
  context.JK.SessionList = function(app) {
    var gearUtils = context.JK.GearUtils;
    var logger = context.JK.logger;
    var rest = context.JK.Rest();
    var ui = new context.JK.UIHelper(app);
    var $activeSessionTemplate = $('#template-active-session-row');
    var $inactiveSessionTemplate = $('#template-inactive-session-row');
    var $notationFileTemplate = $('#template-notation-files');
    var $openSlotsTemplate = $('#template-open-slots');
    var $latencyTemplate = $('#template-latency');
    var $musicianTemplate = $('#template-musician-info');
    var showJoinLink = true;
    var showRsvpLink = true;

    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 renderActiveSession(session, tbGroup) {

      $('#actionHeader', tbGroup).html('JOIN');

      var i = 0;
      var inSessionUsersHtml = '', rsvpUsersHtml = '', openSlotsHtml = '', latencyHtml = '', notationFileHtml = '';

      // this is used to track which users are already in the session so we can exclude them from the
      // "RSVPs" section
      var inSessionUsers = [];

      showJoinLink = session.musician_access;

      // render musicians who are already in the session
      if (session.active_music_session && "participants" in session.active_music_session && session.active_music_session.participants.length > 0) {
        for (i=0; i < session.active_music_session.participants.length; i++) {
          inSessionUsers.push(session.active_music_session.participants[i].user.id);
          var inSessionUserInfo = createInSessionUser(session.active_music_session.participants[i]);
          inSessionUsersHtml += inSessionUserInfo[0];
          latencyHtml += inSessionUserInfo[1];
        }
      }
      // this provides a buffer at the top to shift the first latency tag down in the event there are NO in-session musicians
      else {
        latencyHtml += "<div style='height:15px;'>&nbsp;</div>";
      }

      // render users who have approved RSVPs
      if (session.approved_rsvps) {
        for (i=0; i < session.approved_rsvps.length; i++) {
          // do not show the user in this section if he is already in the session
          if ($.inArray(session.approved_rsvps[i].id, inSessionUsers) === -1) {
            if (session.approved_rsvps[i].id === context.JK.currentUserId) {
              showJoinLink = true;
            }
            var rsvpUserInfo = createRsvpUser(session.approved_rsvps[i], session);
            rsvpUsersHtml += rsvpUserInfo[0];
            latencyHtml += rsvpUserInfo[1];
          }
          else {
            showJoinLink = true;
          }
        }
      }

      // render if anyone interested
      if(session['is_unstructured_rsvp?']) {
        openSlotsHtml += createOpenSlot({description: 'Any Instrument'})
      }

      // render open slots
      if (session.open_slots) {
        for (i=0; i < session.open_slots.length; i++) {
          openSlotsHtml += createOpenSlot(session.open_slots[i]);
        }
      }

      // notation files
      if (session.music_notations) {
        for (i=0; i < session.music_notations.length; i++) {
          notationFileHtml += createNotationFile(session.music_notations[i]);
        }
      }

      var sessionVals = buildSessionObject(session, notationFileHtml, rsvpUsersHtml, openSlotsHtml, latencyHtml);
      sessionVals.in_session_musicians = inSessionUsersHtml.length > 0 ? inSessionUsersHtml : 'N/A';
      sessionVals.join_link_display_style = showJoinLink ? "block" : "none";

      var row = context.JK.fillTemplate($activeSessionTemplate.html(), sessionVals);
      $(tbGroup).append(row);

      if (showJoinLink) {
        // wire up the Join Link to the T&Cs dialog
        var $parentRow = $('tr[id=' + session.id + ']', tbGroup);
        $('.join-link', $parentRow).click(function(evt) {
          if(!context.JK.guardAgainstBrowser(app)) {
            return false;
          }

          if (!context.JK.JamServer.connected) {
            app.notifyAlert("Not Connected", 'To create or join a session, you must be connected to the server.');
            return false;
          }

          gearUtils.guardAgainstInvalidConfiguration(app)
            .fail(function() {
              app.notify(
                { title: "Unable to Join Session",
                  text: "You can only join a session once you have working audio gear and a tested internet connection."
                })
            })
            .done(function(){
              joinClick(session.id);
            })

          return false;
        });
      }
    }

    function renderInactiveSession(session, tbGroup) {

      var openSlots = false;
      var hasInvitation = false;
      var hasApprovedRsvp = false;
      var currentUserHasRsvp = session.user_has_rsvp;
      var hasPendingOrDeclinedRsvp = false;
      var openRsvps = session.open_rsvps;

      $('#actionHeader', tbGroup).html('RSVP');

      var i = 0;
      var rsvpUsersHtml = '', openSlotsHtml = '', latencyHtml = '', notationFileHtml = '';

      // render users who have approved RSVPs
      if (session.approved_rsvps && session.approved_rsvps.length > 0) {
        for (i=0; i < session.approved_rsvps.length; i++) {
          if (session.approved_rsvps[i].id === context.JK.currentUserId) {
            hasApprovedRsvp = true;
          }
          var rsvpUserInfo = createRsvpUser(session.approved_rsvps[i], session);
          rsvpUsersHtml += rsvpUserInfo[0];
          latencyHtml += rsvpUserInfo[1];
        }
      }
      // this provides a buffer at the top to shift the first latency tag down in the event there are NO RSVP musicians
      else {
        latencyHtml += "<div style='height:15px;'>&nbsp;</div>";
      }

      if(session['is_unstructured_rsvp?']) {
        openSlots = true;
        openSlotsHtml += createOpenSlot({description: 'Any Instrument'})
      }

      // render open slots
      if (session.open_slots) {
        for (i=0; i < session.open_slots.length; i++) {
          openSlots = true;
          openSlotsHtml += createOpenSlot(session.open_slots[i]);
        }
      }

      // render pending invitations
      if (session.pending_invitations) {
        for (i=0; i < session.pending_invitations.length; i++) {
          if (session.pending_invitations[i].id === context.JK.currentUserId) {
            hasInvitation = true;
          }
        }
      }

      if ( (openRsvps || hasInvitation) && openSlots && !hasApprovedRsvp && !currentUserHasRsvp ) {
        showRsvpLink = true;
      }
      else {
        showRsvpLink = false;
      }

      // notation files
      if (session.music_notations) {
        for (i=0; i < session.music_notations.length; i++) {
          notationFileHtml += createNotationFile(session.music_notations[i]);
        }
      }

      var sessionVals = buildSessionObject(session, notationFileHtml, rsvpUsersHtml, openSlotsHtml, latencyHtml);
      

      if (session.scheduled_start) {
        // format scheduled start time
        sessionVals.scheduled_start = new Date(session.scheduled_start).toDateString() + ', ' +
          context.JK.formatUtcTime(new Date(session.scheduled_start), false);// + '-' +
          //context.JK.formatUtcTime(new Date(session.scheduled_start + session.scheduled_duration), false);
      }
      else {
        sessionVals.scheduled_start = "Date and time TBD"
      }

      sessionVals.rsvp_link_display_style = showRsvpLink ? "block" : "none";

      var row = context.JK.fillTemplate($inactiveSessionTemplate.html(), sessionVals);
      $(tbGroup).append(row);
      var $parentRow = $('tr[id=' + session.id + ']', tbGroup);
      if (showRsvpLink) {
        $('.rsvp-msg', $parentRow).hide();
        var $parentRow = $('tr[id=' + session.id + ']', tbGroup);
        $('.rsvp-link', $parentRow).click(function(evt) {
          ui.launchRsvpSubmitDialog(session.id);
        });
      }
      else {
        $('.rsvp-msg', $parentRow).show();
      }
    }

    function buildSessionObject(session, notationFileHtml, rsvpUsersHtml, openSlotsHtml, latencyHtml) {
      return {
        id: session.id,
        name: session.name,
        description: session.description || "(No description)",
        notation_files: notationFileHtml.length > 0 ? notationFileHtml : 'N/A',
        genres: session.genres.join (', '),
        rsvp_musicians: rsvpUsersHtml.length > 0 ? rsvpUsersHtml : 'N/A',
        open_slots: openSlotsHtml.length > 0 ? openSlotsHtml : 'No slots available',
        latency: latencyHtml,
        language: session.language_description,
        musician_access: session.musician_access_description,
        fan_access: session.fan_access_description,
        legal_policy: session.legal_policy
      };
    }

    function createInSessionUser(participant) {
      var instrumentLogoHtml = '';
      var j;

      // loop through the tracks to get the instruments
      for (j=0; j < participant.tracks.length; j++) {
        var track = participant.tracks[j];
        logger.debug("Find:Finding instruments. Participant tracks:", participant.tracks);
        var inst = context.JK.getInstrumentIcon24(track.instrument_id);
        instrumentLogoHtml += '<img src="' + inst + '" width="24" height="24" />&nbsp;';
      }

      var id = participant.user.id;
      var name = participant.user.name;
      var musicianVals = {
        userId: id,
        avatar_url: context.JK.resolveAvatarUrl(participant.user.photo_url),
        profile_url: "/client#/profile/" + id,
        musician_name: name,
        instruments: instrumentLogoHtml
      };

      var musicianHtml = context.JK.fillTemplate($musicianTemplate.html(), musicianVals);
      var latencyHtml = context.JK.fillTemplate($latencyTemplate.html(), createLatency(participant.user));

      return [musicianHtml, latencyHtml];
    }

    function createRsvpUser(user, session) {

      var instrumentLogoHtml = '';

      var j;

      // loop through the tracks to get the instruments
      if ("instrument_list" in user) {
        for (j=0; j < user.instrument_list.length; j++) {
          var instrument = user.instrument_list[j];
          var inst = context.JK.getInstrumentIcon24(instrument.id);
          instrumentLogoHtml += '<img src="' + inst + '" width="24" height="24" />&nbsp;';
        }
      }

      var id = user.id;
      var name = user.name;
      var musicianVals = {
        userId: id,
        avatar_url: context.JK.resolveAvatarUrl(user.photo_url),
        profile_url: "/client#/profile/" + id,
        musician_name: name,
        instruments: instrumentLogoHtml
      };

      var musicianHtml = context.JK.fillTemplate($musicianTemplate.html(), musicianVals);
      var latencyHtml = context.JK.fillTemplate($latencyTemplate.html(), createLatency(user));

      return [musicianHtml, latencyHtml];
    }

    function createLatency(user) {
      var latencyStyle = LATENCY.UNREACHABLE.style, latencyDescription = LATENCY.UNREACHABLE.description
      if (user.id === context.JK.currentUserId) {
        latencyStyle = LATENCY.GOOD.style, latencyDescription = LATENCY.GOOD.description;
      }

      else {
        var latency = user.latency;

        if (!latency || latency === 1000) {
          // 1000 is a magical number returned by new scoring API to indicate one or more people in the session have an unknown score
          latencyDescription = LATENCY.UNKNOWN.description;
          latencyStyle = LATENCY.UNKNOWN.style;
        }
        else {
          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;
          }
        }
      }

      return {
        latency_style: latencyStyle,
        latency_text: latencyDescription
      };
    }

    function createOpenSlot(slot) {
      var inst = context.JK.getInstrumentIcon24(slot.instrument_id);

      var proficiency_desc = slot.proficiency_desc;
      if(!proficiency_desc) {
        // this is to allow unstructured RSVPs to not specify proficiency_desc
        proficiency_desc = "Any Skill Level";
      }

      if(!slot.proficiency_desc) {
        proficiency_desc
      }
      var slot = {
        instrument_url: inst,
        instrument: slot.description,
        proficiency: proficiency_desc
      };

      return context.JK.fillTemplate($openSlotsTemplate.html(), slot);
    }

    function createNotationFile(notation) {
      var notationVals = {
        file_url: notation.file_url,
        file_name: notation.file_name
      };

      return context.JK.fillTemplate($notationFileTemplate.html(), notationVals);
    }

    function joinClick(sessionId) {
      var hasInvitation = false;
      var session = null;
      // we need to do a real-time check of the session in case the settings have
      // changed while the user was sitting on the Find Session screen
      rest.getSession(sessionId)
        .done(function(response) {
          session = response;
          if ("invitations" in session) {
            var invitation;
            // user has invitations for this session
            for (var i=0; i < session.invitations.length; i++) {
              invitation = session.invitations[i];
              // session contains an invitation for this user
              if (invitation.receiver_id === JK.currentUserId) {
                hasInvitation = true;
                break;
              }
            }
          }

          if (session) {
            // if user has an invitation, always open terms and allow joining regardless of settings
            if (hasInvitation) {
              logger.debug("Found invitation for user " + JK.currentUserId + ", session " + sessionId);
              openTerms(sessionId);
            }
            else {
              if(session.user_id == JK.currentUserId) {
                openTerms(sessionId);
              }
              else if (session.musician_access) {
                if (session.approval_required) {
                  openAlert(sessionId);
                }
                else {
                  openTerms(sessionId);
                }
              }
            }
          }
        })
        .fail(function(xhr, textStatus, errorMessage) {
          logger.debug("xhr.status = " + xhr.status);
          if (xhr.status === 404) {
            sessionNotJoinableAlert();
          }
          else {
            JK.app.notify(
              {   title: "Unable to Join Session",
                  text: "There was an unexpected error while attempting to join the session."
              },
              null,
              true);
          }
        });
    }

    function openAlert(sessionId) {
      var alertDialog = new context.JK.AlertDialog(app, "YES",
        "You must be approved to join this session. Would you like to send a request to join?",
        sessionId, onCreateJoinRequest);

      alertDialog.initialize();
      app.layout.showDialog('alert');
    }

    function sessionNotJoinableAlert() {
      var alertDialog = new context.JK.AlertDialog(app, "OK",
        "This session is over or is no longer public and cannot be joined. Please click Refresh to update the session list.",
        null,
        function(evt) {
            app.layout.closeDialog('alert');
        }
      );

      alertDialog.initialize();
      app.layout.showDialog('alert');
    }

    function onCreateJoinRequest(sessionId) {
      var joinRequest = {};
      joinRequest.music_session = sessionId;
      joinRequest.user = context.JK.currentUserId;
      rest.createJoinRequest(joinRequest)
        .done(function(response) {

        }).error(app.ajaxError);

      app.layout.closeDialog('alert');
    }

    function openTerms(sessionId) {
      var termsDialog = new context.JK.TermsDialog(app, sessionId, onTermsAccepted);
      termsDialog.initialize();
      app.layout.showDialog('terms');
    }

    function onTermsAccepted(sessionId) {
      context.location = '/client#/session/' + sessionId;
    }

    this.renderActiveSession = renderActiveSession;
    this.renderInactiveSession = renderInactiveSession;

    return this;
}})(window,jQuery);