321 lines
10 KiB
JavaScript
321 lines
10 KiB
JavaScript
(function (context, $) {
|
|
|
|
"use strict";
|
|
|
|
|
|
context.JK = context.JK || {};
|
|
context.JK.AccountSessionDetail = function (app) {
|
|
var logger = context.JK.logger;
|
|
var rest = context.JK.Rest();
|
|
var sessionId = null;
|
|
var sessionData = null;
|
|
var $screen = null;
|
|
var $cancelRsvpBtn = null;
|
|
var $inviteOthersBtn = null;
|
|
var $sessionDetail = null;
|
|
var instrument_logo_map = context.JK.getInstrumentIconMap24();
|
|
var invitationDialog = null;
|
|
|
|
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 beforeShow(data) {
|
|
sessionId = data.id;
|
|
loadSessionData();
|
|
}
|
|
|
|
function afterShow(data) {
|
|
}
|
|
|
|
function inviteMusicians(e) {
|
|
e.preventDefault();
|
|
|
|
invitationDialog.showEmailDialog();
|
|
}
|
|
|
|
function cancelRsvpRequest(e) {
|
|
e.preventDefault();
|
|
|
|
var rsvpCancelDlg = new context.JK.RsvpCancelDialog(app, sessionData.id, sessionData.rsvpId);
|
|
rsvpCancelDlg.initialize();
|
|
context.JK.app.layout.showDialog('rsvp-cancel-dialog');
|
|
}
|
|
|
|
function approveRsvpRequest(e) {
|
|
e.preventDefault();
|
|
|
|
var rsvpId = $(e.target).attr('request-id');
|
|
}
|
|
|
|
function declineRsvpRequest(e) {
|
|
e.preventDefault();
|
|
}
|
|
|
|
function events() {
|
|
$inviteOthersBtn.on('click', inviteMusicians);
|
|
$cancelRsvpBtn.on('click', cancelRsvpRequest);
|
|
$screen.find(".approveRsvpRequest").on('click', approveRsvpRequest);
|
|
$screen.find(".declineRsvpRequest").on('click', declineRsvpRequest);
|
|
}
|
|
|
|
function loadSessionData() {
|
|
rest.getSessionHistory(sessionId)
|
|
.done(renderSession)
|
|
.fail(app.ajaxError);
|
|
}
|
|
|
|
function renderSession(data) {
|
|
sessionData = data;
|
|
|
|
var hasPending = false;
|
|
var isOwner = false;
|
|
if (sessionData.user_id == context.JK.currentUserId) {
|
|
if (sessionData.pending_rsvp_requests.length > 0) {
|
|
hasPending = true;
|
|
}
|
|
if (hasPending)
|
|
sessionData.notification_msg = "You have new RSVPs to review and approve, see details.";
|
|
else
|
|
sessionData.notification_msg = "";
|
|
isOwner = true;
|
|
}
|
|
else {
|
|
$.each(sessionData.pending_rsvp_requests, function(request) {
|
|
if (request.user_id == context.JK.currentUserId) {
|
|
hasPending = true;
|
|
sessionData.rsvpId = request.id;
|
|
}
|
|
});
|
|
if (hasPending)
|
|
sessionData.notification_msg = "Your RSVP has not been processed by session organizer yet";
|
|
else
|
|
sessionData.notification_msg = "";
|
|
isOwner = false;
|
|
}
|
|
|
|
if (isOwner) {
|
|
$inviteOthersBtn.show();
|
|
$cancelRsvpBtn.hide();
|
|
}
|
|
else if (hasPending) {
|
|
$inviteOthersBtn.hide();
|
|
$cancelRsvpBtn.show();
|
|
}
|
|
|
|
var pendingRsvpHtml = "";
|
|
if (isOwner) {
|
|
pendingRsvpHtml = generatePendingRsvps();
|
|
}
|
|
var sessionRsvpsHtml = generateSessionRsvps();
|
|
var sessionNeededHtml = generateSessionNeeded();
|
|
var sessionInvitedHtml = generateSessionInvited();
|
|
var sessionPropertiesHtml = generateSessionProperties();
|
|
|
|
var template = context._.template(
|
|
$('#template-account-session-detail').html(),
|
|
{ has_pending: hasPending, is_owner: isOwner, notification_msg: sessionData.notification_msg,
|
|
pending_rsvps: pendingRsvpHtml, session_rsvps: sessionRsvpsHtml, still_needed: sessionNeededHtml,
|
|
invited_users: sessionInvitedHtml, session_properties: sessionPropertiesHtml, id: sessionData.id},
|
|
{variable: 'data'}
|
|
);
|
|
|
|
$sessionDetail.html(template);
|
|
|
|
events();
|
|
}
|
|
|
|
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;
|
|
console.log("latency = %o", 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 generatePendingRsvps() {
|
|
var resultHtml = "";
|
|
var rsvpHtml = "";
|
|
var instrumentLogoHtml = "";
|
|
var latencyHtml = "";
|
|
$.each(sessionData.pending_rsvp_requests, function(index, request) {
|
|
if (request.user_id != context.JK.currentUserId) {
|
|
if ("instrument_list" in request.user && request.user.instrument_list != null) {
|
|
$.each(request.user.instrument_list, function (index, instrument) {
|
|
var inst = '../assets/content/icon_instrument_default24.png';
|
|
if (instrument.id in instrument_logo_map) {
|
|
inst = instrument_logo_map[instrument.id].asset;
|
|
}
|
|
instrumentLogoHtml += '<img src="' + inst + '" width="24" height="24" /> ';
|
|
})
|
|
}
|
|
|
|
latencyHtml = context._.template(
|
|
$("#template-account-session-latency").html(),
|
|
createLatency(request.user),
|
|
{variable: 'data'}
|
|
);
|
|
|
|
var avatar_url = context.JK.resolveAvatarUrl(request.user.photo_url);
|
|
|
|
rsvpHtml = context._.template(
|
|
$("#template-account-pending-rsvp").html(),
|
|
{user_id: request.user_id, avatar_url: avatar_url,
|
|
user_name: request.user.name, instruments: instrumentLogoHtml,
|
|
latency: latencyHtml, request_id: request.id},
|
|
{variable: 'data'}
|
|
);
|
|
|
|
resultHtml += rsvpHtml;
|
|
instrumentLogoHtml = "";
|
|
}
|
|
});
|
|
|
|
return resultHtml;
|
|
}
|
|
|
|
function generateSessionRsvps() {
|
|
var resultHtml = "";
|
|
var rsvpHtml = "";
|
|
var instrumentLogoHtml = "";
|
|
var latencyHtml = "";
|
|
$.each(sessionData.approved_rsvps, function(index, request) {
|
|
if ("instrument_list" in request) {
|
|
$.each(request.instrument_list, function(index, instrument) {
|
|
var inst = '../assets/content/icon_instrument_default24.png';
|
|
if (instrument.id in instrument_logo_map) {
|
|
inst = instrument_logo_map[instrument.id].asset;
|
|
}
|
|
instrumentLogoHtml += '<img src="' + inst + '" width="24" height="24" /> ';
|
|
});
|
|
}
|
|
|
|
latencyHtml = context._.template(
|
|
$("#template-account-session-latency").html(),
|
|
createLatency(request),
|
|
{variable: 'data'}
|
|
);
|
|
|
|
var avatar_url = request.resolved_photo_url;
|
|
|
|
rsvpHtml = context._.template(
|
|
$("#template-account-session-rsvp").html(),
|
|
{id: request.id, avatar_url: avatar_url,
|
|
user_name: request.name, instruments: instrumentLogoHtml,
|
|
latency: latencyHtml},
|
|
{variable: 'data'}
|
|
);
|
|
|
|
resultHtml += rsvpHtml;
|
|
instrumentLogoHtml = "";
|
|
});
|
|
|
|
return resultHtml;
|
|
}
|
|
|
|
function generateSessionNeeded() {
|
|
var resultHtml = "";
|
|
var slotHtml = "";
|
|
$.each(sessionData.open_slots, function(index, slot) {
|
|
var inst = '../assets/content/icon_instrument_default24.png';
|
|
if ("instrument_id" in slot) {
|
|
inst = instrument_logo_map[slot.instrument_id].asset;
|
|
}
|
|
|
|
slotHtml = context._.template(
|
|
$("#template-account-open-slot").html(),
|
|
{instrument_url: inst, instrument: slot.description,
|
|
proficiency: slot.proficiency_desc},
|
|
{variable: 'data'}
|
|
);
|
|
|
|
resultHtml += slotHtml;
|
|
});
|
|
|
|
return resultHtml;
|
|
}
|
|
|
|
function generateSessionInvited() {
|
|
var resultHtml = "";
|
|
var avatar_url = "";
|
|
$.each(sessionData.invitations, function(index, invitation) {
|
|
avatar_url = invitation.receiver_avatar_url;
|
|
|
|
resultHtml += context._.template(
|
|
$("#template-account-invited").html(),
|
|
{avatar_url: avatar_url, user_id: invitation.reciever_id},
|
|
{variable: 'data'}
|
|
);
|
|
});
|
|
|
|
return resultHtml;
|
|
}
|
|
|
|
function generateSessionProperties() {
|
|
var resultHtml = "";
|
|
resultHtml = context._.template(
|
|
$("#template-account-session-properties").html(),
|
|
sessionData,
|
|
{variable: 'data'}
|
|
);
|
|
return resultHtml;
|
|
}
|
|
|
|
function initialize(invitationDlg) {
|
|
var screenBindings = {
|
|
'beforeShow': beforeShow,
|
|
'afterShow': afterShow
|
|
};
|
|
|
|
app.bindScreen('account/sessionDetail', screenBindings);
|
|
app.bindScreen('account/sessionDetail', screenBindings);
|
|
|
|
$screen = $(".account-session-detail");
|
|
$inviteOthersBtn = $screen.find("#invite-others");
|
|
$cancelRsvpBtn = $screen.find("#cancel-rsvp");
|
|
$inviteOthersBtn.hide(); $cancelRsvpBtn.hide();
|
|
$sessionDetail = $screen.find("#account-session-detail-div");
|
|
invitationDialog = invitationDlg;
|
|
}
|
|
|
|
this.initialize = initialize;
|
|
this.beforeShow = beforeShow;
|
|
this.afterShow = afterShow;
|
|
|
|
return this;
|
|
};
|
|
|
|
})(window, jQuery); |