1073 lines
41 KiB
JavaScript
1073 lines
41 KiB
JavaScript
(function(context, $) {
|
|
|
|
"use strict";
|
|
|
|
context.JK = context.JK || {};
|
|
|
|
context.JK.CreateScheduledSession = function(app) {
|
|
var logger = context.JK.logger;
|
|
var rest = JK.Rest();
|
|
var invitationDialog = null;
|
|
var inviteMusiciansUtil = null;
|
|
var instrumentSelector = null;
|
|
var instrumentRSVP = null;
|
|
var MAX_GENRES = 1;
|
|
var createSessionSettings = {
|
|
createType: 'start-scheduled',
|
|
timezone: {},
|
|
recurring_mode: {},
|
|
language: {},
|
|
musician_access: {},
|
|
fans_access: {}
|
|
};
|
|
var friendInput = null;
|
|
|
|
// Main layout
|
|
var $screen = null;
|
|
var $wizardSteps = null;
|
|
var $currentWizardStep = null;
|
|
var step = 0;
|
|
var $templateSteps = null;
|
|
var $templateButtons = null;
|
|
var $sessionButtons = null;
|
|
|
|
// Step1 layout
|
|
var $screenStep1 = null;
|
|
var $createTypes = null;
|
|
var $createTypeHelpers = null;
|
|
var $scheduledSessions = null;
|
|
var scheduledSessions = {};
|
|
|
|
// Step4 layout
|
|
var $policyTypes = null;
|
|
|
|
var TOTAL_STEPS = 5;
|
|
var STEP_SELECT_TYPE = 0;
|
|
var STEP_SELECT_PLAYING = 1;
|
|
var STEP_SELECT_INVITE = 2;
|
|
var STEP_SELECT_POLICY = 3;
|
|
var STEP_SELECT_CONFIRM = 4;
|
|
|
|
var ONE_HOUR = 3600 * 1000;
|
|
var ONE_MINUTE = 60 * 1000;
|
|
var ONE_DAY = ONE_HOUR * 24;
|
|
|
|
var defaultTimeArray = ["12:00 AM", "12:30 AM", "01:00 AM", "01:30 AM", "02:00 AM", "02:30 AM",
|
|
"03:00 AM", "03:30 AM", "04:00 AM", "04:30 AM", "05:00 AM", "05:30 AM", "06:00 AM", "06:30 AM",
|
|
"07:00 AM", "07:30 AM", "08:00 AM", "08:30 AM", "09:00 AM", "09:30 AM", "10:00 AM", "10:30 AM",
|
|
"11:00 AM", "11:30 AM", "12:00 PM", "12:30 PM", "01:00 PM", "01:30 PM", "02:00 PM", "02:30 PM",
|
|
"03:00 PM", "03:30 PM", "04:00 PM", "04:30 PM", "05:00 PM", "05:30 PM", "06:00 PM", "06:30 PM",
|
|
"07:00 PM", "07:30 PM", "08:00 PM", "08:30 PM", "09:00 PM", "09:30 PM", "10:00 PM", "10:30 PM",
|
|
"11:00 PM", "11:30 PM"];
|
|
|
|
var proficiencyDescriptionMap = {
|
|
"0": "Any",
|
|
"1": "Beg",
|
|
"2": "Beg/Int",
|
|
"3": "Int",
|
|
"4": "Int/Adv",
|
|
"5": "Adv"
|
|
};
|
|
|
|
function afterLoadScheduledSessions(sessionList) {
|
|
$scheduledSessions.empty();
|
|
|
|
var $noSessionFound = $("#scheduled-session-not-found");
|
|
createSessionSettings.session_count = sessionList.length;
|
|
|
|
if (createSessionSettings.session_count == 0) {
|
|
$noSessionFound.show();
|
|
createSessionSettings.selectedSessionId = null;
|
|
}
|
|
else {
|
|
$noSessionFound.hide();
|
|
$.each(sessionList, function (i, session) {
|
|
scheduledSessions[session.id] = session;
|
|
});
|
|
|
|
context._.each(sessionList, function (session) {
|
|
session.scheduled_start = new Date(session.scheduled_start).toDateString() + ', ' +
|
|
getFormattedTime(new Date(session.scheduled_start), false);
|
|
var options = {
|
|
id: session.id,
|
|
name: session.name,
|
|
scheduled_start: session.scheduled_start
|
|
};
|
|
var txt = $(context._.template($('#template-scheduled-session').html(), options, { variable: 'data' }));
|
|
$scheduledSessions.append(txt);
|
|
});
|
|
|
|
var firstSession = function() {
|
|
var $firstSession = $scheduledSessions.children().first().find('input[name="scheduled-session-info"]');
|
|
$firstSession.attr('checked', 'checked');
|
|
createSessionSettings.selectedSessionId = $firstSession.attr('id');
|
|
};
|
|
if (createSessionSettings.selectedSessionId == null) {
|
|
firstSession();
|
|
}
|
|
else {
|
|
var $selectedSession = $scheduledSessions.children().first().find('input[name="scheduled-session-info"][id="' + createSessionSettings.selectedSessionId + '"]');
|
|
if ($selectedSession.length)
|
|
$selectedSession.attr('checked', 'checked');
|
|
else
|
|
firstSession();
|
|
}
|
|
|
|
|
|
$scheduledSessions.iCheck({
|
|
checkboxClass: 'icheckbox_minimal',
|
|
radioClass: 'iradio_minimal',
|
|
inheritClass: true
|
|
});
|
|
}
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled' && createSessionSettings.session_count == 0)
|
|
$('#edit_scheduled_sessions').hide();
|
|
else if (createSessionSettings.createType == 'start-scheduled' && createSessionSettings.session_count > 0)
|
|
$('#edit_scheduled_sessions').show();
|
|
}
|
|
|
|
function afterLoadUserDetail(userDetail) {
|
|
var userInstruments = [];
|
|
$.each(userDetail.instruments, function(index, userInstrument) {
|
|
userInstrument.level = userInstrument.proficiency_level;
|
|
userInstruments.push(userInstrument);
|
|
})
|
|
|
|
instrumentSelector.render('#instrument-select-list', userInstruments);
|
|
instrumentRSVP.render('#instrument-select-rsvp-list');
|
|
|
|
$("#instrument-select-list").iCheck({
|
|
checkboxClass: 'icheckbox_minimal',
|
|
radioClass: 'iradio_minimal',
|
|
inheritClass: true
|
|
});
|
|
|
|
$("#instrument-select-rsvp-list").iCheck({
|
|
checkboxClass: 'icheckbox_minimal',
|
|
radioClass: 'iradio_minimal',
|
|
inheritClass: true
|
|
});
|
|
}
|
|
|
|
function beforeShowStep1() {
|
|
rest.findScheduledSessions({})
|
|
.done(afterLoadScheduledSessions)
|
|
.fail(app.ajaxError);
|
|
|
|
rest.getUserDetail()
|
|
.done(afterLoadUserDetail)
|
|
.fail(app.ajaxError);
|
|
|
|
createSessionSettings.startDate = createSessionSettings.startDate || (new Date().toDateString());
|
|
$("#session-start-date").val(createSessionSettings.startDate);
|
|
|
|
toggleDate();
|
|
toggleStartTime();
|
|
toggleStepStatus();
|
|
}
|
|
|
|
function beforeShowStep2() {
|
|
}
|
|
|
|
function beforeShowStep3() {
|
|
}
|
|
|
|
function beforeShowStep4() {
|
|
}
|
|
|
|
function beforeShowStep5() {
|
|
var startType = null;
|
|
if (createSessionSettings.createType == 'start-scheduled' ||
|
|
createSessionSettings.createType == 'immediately' ||
|
|
createSessionSettings.createType == 'quick-start') {
|
|
startType = 'Now!';
|
|
createSessionSettings.startType = "START SESSION";
|
|
}
|
|
else if (createSessionSettings.createType == 'rsvp') {
|
|
startType = 'To be determined after RSVPs received';
|
|
createSessionSettings.startType = "PUBLISH SESSION";
|
|
}
|
|
else if (createSessionSettings.createType == 'schedule-future') {
|
|
startType = createSessionSettings.startDate + ',' +
|
|
createSessionSettings.startTime + ', ' +
|
|
createSessionSettings.timezone.label;
|
|
createSessionSettings.startType = "PUBLISH SESSION";
|
|
}
|
|
$('#session-step-5 #session-start-type-disp').html(startType);
|
|
|
|
var sessionName = createSessionSettings.name;
|
|
sessionName += ' (' + createSessionSettings.genresValues[0] + ')';
|
|
$('#session-name-disp').html(sessionName);
|
|
|
|
var sessionDescription = createSessionSettings.description;
|
|
$('#session-description-disp').html(sessionDescription);
|
|
|
|
var sessionNotations = [];
|
|
for (var i = 0; i < createSessionSettings.notations.length; i++) {
|
|
var name = createSessionSettings.notations.filename;
|
|
sessionNotations.push(name);
|
|
}
|
|
$('#session-notations-disp').html(sessionNotations.join(', '));
|
|
|
|
$('#session-language-disp').html(createSessionSettings.language.label);
|
|
|
|
var sessionInvited = [];
|
|
var invitedFriends = inviteMusiciansUtil.getInvitedFriendNames();
|
|
$.each(invitedFriends, function(index, friend) {
|
|
sessionInvited.push(friend);
|
|
});
|
|
var sessionInvitedString = sessionInvited.join(', ');
|
|
if (createSessionSettings.musician_access.value == 'musicians-approval') {
|
|
if (invitedFriends.length == 0)
|
|
sessionInvitedString = "Any interested JamKazam musicians that I approve";
|
|
else
|
|
sessionInvitedString += ", plus any interested JamKazam musicians that I approve";
|
|
}
|
|
else if (createSessionSettings.musician_access.value == 'musicians') {
|
|
if (invitedFriends.length == 0)
|
|
sessionInvitedString = "Any interested JamKazam musicians who want to join us";
|
|
else
|
|
sessionInvitedString += ", plus any interested JamKazam musicians who want to join us";
|
|
}
|
|
$('#session-invited-disp').html(sessionInvitedString);
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
var session = scheduledSessions[createSessionSettings.selectedSessionId];
|
|
if (session.approved_rsvps_detail.length > 0) {
|
|
var instruments_me = [];
|
|
$.each(session.approved_rsvps_detail, function(index, user) {
|
|
if (user.id == context.JK.currentUserId) {
|
|
$.each(user.instrument_list, function(index, instrument) {
|
|
instruments_me.push(instrument.desc);
|
|
});
|
|
}
|
|
});
|
|
$('#session-instruments-me-disp').html(instruments_me.join(', '));
|
|
}
|
|
|
|
if (session.open_slots_detail.length > 0) {
|
|
var instruments_rsvp = {};
|
|
$.each(session.open_slots_detail, function(index, slot) {
|
|
if (instruments_rsvp[slot.description]) {
|
|
instruments_rsvp[slot.description]["count"] = instruments_rsvp[slot.description]["count"] + 1;
|
|
}
|
|
else {
|
|
instruments_rsvp[slot.description] = {"count": 1, "level": slot.proficiency_desc};
|
|
}
|
|
});
|
|
|
|
var instruments_rsvp_arr = $.makeArray(instruments_rsvp);
|
|
var instruments_str_arr = [];
|
|
$.map(instruments_rsvp_arr, function(val, i) {
|
|
instruments_str_arr.push(i + ' (' + val.count + ') (' + val.level + ')');
|
|
})
|
|
$('#session-instruments-rsvp-disp').html(instruments_str_arr.join(', '));
|
|
}
|
|
}
|
|
else {
|
|
var instruments_me = [];
|
|
$.each(instrumentSelector.getSelectedInstruments(), function(index, instrument) {
|
|
instruments_me.push(instrument.name);
|
|
});
|
|
$('#session-instruments-me-disp').html(instruments_me.join(', '));
|
|
|
|
var instruments_rsvp = [];
|
|
$.each(instrumentRSVP.getSelectedInstruments(), function(index, instrument) {
|
|
instruments_rsvp.push(instrument.name + ' (' + instrument.count + ') (' + proficiencyDescriptionMap[instrument.level] + ')');
|
|
});
|
|
$('#session-instruments-rsvp-disp').html(instruments_rsvp.join(', '));
|
|
}
|
|
|
|
$('#session-musician-access-disp').html('Musicians: ' + createSessionSettings.musician_access.label);
|
|
$('#session-fans-access-disp').html('Fans: ' + createSessionSettings.fans_access.label);
|
|
|
|
$('#session-policy-disp').html(createSessionSettings.session_policy);
|
|
}
|
|
|
|
function beforeMoveStep1() {
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
var session = scheduledSessions[createSessionSettings.selectedSessionId];
|
|
|
|
var moveToFinish = function() {
|
|
app.layout.closeDialog('confirm');
|
|
createSessionSettings.startDate = new Date(session.scheduled_start).toDateString();
|
|
createSessionSettings.startTime = getFormattedTime(new Date(session.scheduled_start), false);
|
|
createSessionSettings.genresValues = session.genres;
|
|
createSessionSettings.genres = [session.genre_id];
|
|
createSessionSettings.timezone.label = session.timezone_description;
|
|
createSessionSettings.timezone.value = session.timezone;
|
|
createSessionSettings.name = session.name;
|
|
createSessionSettings.description = session.description;
|
|
createSessionSettings.notations = session.music_notations;
|
|
createSessionSettings.language.label = session.language_description;
|
|
createSessionSettings.language.value = session.language;
|
|
createSessionSettings.session_policy = session.legal_policy;
|
|
createSessionSettings.musician_access.label = session.musician_access_description;
|
|
createSessionSettings.fans_access.label = session.fan_access_description;
|
|
createSessionSettings.recurring_mode.value = session.recurring_mode;
|
|
|
|
step = STEP_SELECT_CONFIRM;
|
|
moveToStep();
|
|
}
|
|
|
|
var currentTime = new Date();
|
|
var startTime = new Date(session.scheduled_start_time);
|
|
var diffTime = startTime.getTime() - currentTime.getTime();
|
|
if (diffTime > ONE_HOUR) {
|
|
var confirmDialog = new context.JK.ConfirmDialog(app, "Start Session Now",
|
|
"You are starting a session that is scheduled to begin more than one hour from now. Are you sure you want to do this?",
|
|
"Future Session", moveToFinish);
|
|
confirmDialog.initialize();
|
|
context.JK.app.layout.showDialog('confirm');
|
|
}
|
|
else {
|
|
moveToFinish();
|
|
}
|
|
return false;
|
|
}
|
|
else if (createSessionSettings.createType == 'quick-start') {
|
|
createSessionSettings.genresValues = ['Pop'];
|
|
createSessionSettings.genres = ['pop'];
|
|
createSessionSettings.timezone.label = "(GMT-06:00) Central Time (US & Canada)";
|
|
createSessionSettings.timezone.value = "Central Time (US & Canada),America/Chicago";
|
|
createSessionSettings.name = "Private Test Session";
|
|
createSessionSettings.description = "Private session set up just to test things out in the session interface by myself.";
|
|
createSessionSettings.notations = [];
|
|
createSessionSettings.language.label = 'English';
|
|
createSessionSettings.language.value = 'en';
|
|
createSessionSettings.session_policy = 'Standard';
|
|
createSessionSettings.musician_access.label = "Only RSVP musicians may join";
|
|
createSessionSettings.musician_access.value = "only-rsvp";
|
|
createSessionSettings.fans_access.label = "Fans may not listen to session";
|
|
createSessionSettings.fans_access.value = "no-listen-chat";
|
|
createSessionSettings.recurring_mode.label = 'Not Recurring';
|
|
createSessionSettings.recurring_mode.value = 'once';
|
|
}
|
|
else {
|
|
createSessionSettings.startDate = $('#session-start-date').val();
|
|
createSessionSettings.startTime = $('#start-time-list').val();
|
|
createSessionSettings.endTime = $('#end-time-list').val();
|
|
createSessionSettings.selectedSessionId = $scheduledSessions.find('input[name="scheduled-session-info"][checked="checked"]').attr('id');
|
|
var $timezoneList = $('#timezone-list');
|
|
createSessionSettings.timezone.value = $timezoneList.val();
|
|
createSessionSettings.timezone.label = $timezoneList.get(0).options[$timezoneList.get(0).selectedIndex].text;
|
|
var $recurringMode = $('#recurring-mode-list');
|
|
createSessionSettings.recurring_mode.label = $recurringMode.get(0).options[$recurringMode.get(0).selectedIndex].text;
|
|
createSessionSettings.recurring_mode.value = $recurringMode.val();
|
|
}
|
|
|
|
return true;
|
|
}
|
|
|
|
function beforeMoveStep2() {
|
|
var isValid = true;
|
|
var name = $('#session-name').val();
|
|
if (!name) {
|
|
$('#divSessionName .error-text').remove();
|
|
$('#divSessionName').addClass("error");
|
|
$('#session-name').after("<ul class='error-text'><li>Name is required</li></ul>");
|
|
isValid = false;
|
|
}
|
|
else {
|
|
$('#divSessionName').removeClass("error");
|
|
}
|
|
|
|
var description = $('#session-description').val();
|
|
if (!description) {
|
|
$('#divSessionDescription .error-text').remove();
|
|
$('#divSessionDescription').addClass("error");
|
|
$('#session-description').after("<ul class='error-text'><li>Description is required</li></ul>");
|
|
isValid = false;
|
|
}
|
|
else {
|
|
$('#divSessionDescription').removeClass("error");
|
|
}
|
|
|
|
var genres = context.JK.GenreSelectorHelper.getSelectedGenres('#create-session-genre');
|
|
var genresValues = context.JK.GenreSelectorHelper.getSelectedGenresValues('#create-session-genre');
|
|
|
|
if (genres.length === 0) {
|
|
$('#divSessionGenre .error-text').remove();
|
|
$('#divSessionGenre').addClass("error");
|
|
$('#create-session-genre').after("<ul class='error-text'><li>You must select a genre.</li></ul>");
|
|
isValid = false;
|
|
}
|
|
else {
|
|
$('#divSessionGenre').removeClass("error");
|
|
}
|
|
|
|
if (isValid) {
|
|
createSessionSettings.genres = genres;
|
|
createSessionSettings.genresValues = genresValues;
|
|
createSessionSettings.name = name;
|
|
createSessionSettings.description = description;
|
|
createSessionSettings.notations = $('#session-step-2 #session-select-files').get(0).files;
|
|
|
|
if (createSessionSettings.notations.length > 0) {
|
|
var formData = new FormData();
|
|
$.each(createSessionSettings.notations, function(i, file) {
|
|
formData.append('files[]', file);
|
|
});
|
|
formData.append('client_id', app.clientId);
|
|
|
|
rest.uploadMusicNotations(formData)
|
|
.done(function(response) {
|
|
var error_files = [];
|
|
$.each(response, function(i, music_notation) {
|
|
if (music_notation.errors) {
|
|
error_files.push(createSessionSettings.notations[i].name);
|
|
}
|
|
})
|
|
if (error_files.length > 0) {
|
|
app.notifyAlert("Failed to upload files. ", error_files.join(', '));
|
|
}
|
|
|
|
createSessionSettings.notations = response;
|
|
})
|
|
.fail(function(jqXHR) {
|
|
app.notifyServerError(jqXHR, "Unable to upload music notations");
|
|
})
|
|
}
|
|
}
|
|
|
|
return isValid;
|
|
}
|
|
|
|
function beforeMoveStep3() {
|
|
var $languageList = $('#session-language-list');
|
|
createSessionSettings.language.value = $languageList.val();
|
|
createSessionSettings.language.label = $languageList.get(0).options[$languageList.get(0).selectedIndex].text;
|
|
return true;
|
|
}
|
|
|
|
function beforeMoveStep4() {
|
|
var isValid = true;
|
|
var sessionPolicyChecked = $('#session-policy-confirm').is(':checked');
|
|
if (!sessionPolicyChecked) {
|
|
$('#divSessionPolicy .error-text').remove();
|
|
$('#divSessionPolicy').addClass("error");
|
|
$('#divSessionPolicyHelper').after("<ul class='error-text'><li>You must accept the Session Policy.</li></ul>");
|
|
isValid = false;
|
|
}
|
|
else {
|
|
$('#divSessionPolicy').removeClass("error");
|
|
}
|
|
|
|
createSessionSettings.session_policy = $('input[name="session-policy-type"][checked="checked"]').attr('policy-id');
|
|
var $musicianAccess = $('#session-musician-access');
|
|
createSessionSettings.musician_access.value = $musicianAccess.val();
|
|
createSessionSettings.musician_access.label = $musicianAccess.get(0).options[$musicianAccess.get(0).selectedIndex].text;
|
|
|
|
var $fansAccess = $('#session-fans-access');
|
|
createSessionSettings.fans_access.value = $fansAccess.val();
|
|
createSessionSettings.fans_access.label = $fansAccess.get(0).options[$fansAccess.get(0).selectedIndex].text;
|
|
|
|
return isValid;
|
|
}
|
|
|
|
function beforeMoveStep5() {
|
|
}
|
|
|
|
function startSession() {
|
|
var data = {};
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
data = scheduledSessions[createSessionSettings.selectedSessionId];
|
|
}
|
|
else {
|
|
data.name = createSessionSettings.name;
|
|
data.description = createSessionSettings.description;
|
|
data.genres = createSessionSettings.genres;
|
|
if (createSessionSettings.musician_access.value == 'only-rsvp') {
|
|
data.musician_access = false;
|
|
data.approval_required = false;
|
|
}
|
|
else if (createSessionSettings.musician_access.value == 'musicians-approval') {
|
|
data.musician_access = true;
|
|
data.approval_required = true;
|
|
}
|
|
else if (createSessionSettings.musician_access.value == 'musicians') {
|
|
data.musician_access = true;
|
|
data.approval_required = false;
|
|
}
|
|
|
|
if (createSessionSettings.fans_access.value == 'no-listen-chat') {
|
|
data.fan_access = false; data.fan_chat = false;
|
|
}
|
|
else if (createSessionSettings.fans_access.value == 'listen-chat-each') {
|
|
data.fan_access = true; data.fan_chat = false;
|
|
}
|
|
else if (createSessionSettings.fans_access.value == 'listen-chat-band') {
|
|
data.fan_access = true; data.fan_chat = true;
|
|
}
|
|
data.legal_policy = createSessionSettings.session_policy;
|
|
data.legal_terms = true;
|
|
data.language = createSessionSettings.language.value;
|
|
if (createSessionSettings.createType == 'quick-start' || createSessionSettings.createType == 'immediately') {
|
|
data.start = new Date().toDateString() + ' ' + getFormattedTime(new Date(), false);
|
|
data.duration = "30";
|
|
}
|
|
else if (createSessionSettings.createType == 'rsvp') {
|
|
data.start = ""; data.duration = "0";
|
|
}
|
|
else {
|
|
data.start = createSessionSettings.startDate + ' ' + createSessionSettings.startTime;
|
|
var endDate = new Date(createSessionSettings.startDate + ' ' + createSessionSettings.endTime);
|
|
data.duration = (endDate - new Date(data.start)) / ONE_MINUTE;
|
|
if (createSessionSettings.endTime == defaultTimeArray[0]) {
|
|
data.duration += ONE_DAY / ONE_MINUTE;
|
|
}
|
|
}
|
|
data.invitations = inviteMusiciansUtil.getInvitedFriends();
|
|
data.recurring_mode = createSessionSettings.recurring_mode.value;
|
|
data.music_notations = createSessionSettings.music_notations;
|
|
data.timezone = createSessionSettings.timezone.value;
|
|
|
|
data.rsvp_slots = [];
|
|
$.each(instrumentSelector.getSelectedInstruments(), function(index, instrument) {
|
|
var slot = {};
|
|
slot.instrument_id = instrument.id;
|
|
slot.proficiency_level = instrument.level;
|
|
slot.approve = true;
|
|
data.rsvp_slots.push(slot);
|
|
});
|
|
|
|
$.each(instrumentRSVP.getSelectedInstruments(), function(index, instrument) {
|
|
for (var i = 0; i < instrument.count; i++) {
|
|
var slot = {};
|
|
slot.instrument_id = instrument.id;
|
|
slot.proficiency_level = instrument.level;
|
|
slot.approve = false;
|
|
data.rsvp_slots.push(slot);
|
|
}
|
|
});
|
|
}
|
|
|
|
var tracks = context.JK.TrackHelpers.getUserTracks(context.jamClient);
|
|
if(tracks.length == 0) {
|
|
logger.error("we should never have 0 tracks and have gotten this far. Launch FTUE is the best we can do right now")
|
|
// If user hasn't completed FTUE - do so now.
|
|
app.afterFtue = function() { startSession(); };
|
|
app.layout.startNewFtue();
|
|
return false;
|
|
}
|
|
|
|
var joinSession = function(sessionId) {
|
|
var options = {};
|
|
options.client_id = app.clientId;
|
|
options.session_id = sessionId;
|
|
options.as_musician = true;
|
|
options.tracks = tracks;
|
|
rest.joinSession(options)
|
|
.done(function(response) {
|
|
var invitationCount = data.invitations.length;
|
|
|
|
context.location = '/client#/session/' + sessionId;
|
|
|
|
context.JK.GA.trackSessionCount(data.musician_access, data.fan_access, invitationCount);
|
|
context.JK.GA.trackSessionMusicians(context.JK.GA.SessionCreationTypes.create);
|
|
})
|
|
.fail(function(jqXHR) {
|
|
var handled = false;
|
|
if(jqXHR.status = 422) {
|
|
var response = JSON.parse(jqXHR.responseText);
|
|
if(response["errors"] && response["errors"]["tracks"] && response["errors"]["tracks"][0] == "Please select at least one track") {
|
|
app.notifyAlert("No Inputs Configured", $('<span>You will need to reconfigure your audio device.</span>'));
|
|
handled = true;
|
|
}
|
|
}
|
|
if(!handled) {
|
|
app.notifyServerError(jqXHR, "Unable to Create Session");
|
|
}
|
|
})
|
|
};
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
joinSession(createSessionSettings.selectedSessionId);
|
|
}
|
|
else {
|
|
rest.createScheduledSession(data)
|
|
.done(function(response) {
|
|
var newSessionId = response.id;
|
|
$(".btn-next").off('click');
|
|
|
|
if (createSessionSettings.createType == 'quick-start' || createSessionSettings.createType == "immediately") {
|
|
joinSession(newSessionId);
|
|
}
|
|
else {
|
|
app.notifyAlert("Session is successfully published.");
|
|
context.location = '/client#/home';
|
|
}
|
|
})
|
|
.fail(function(jqXHR){
|
|
app.notifyServerError(jqXHR, "Unable to schedule a session");
|
|
});
|
|
}
|
|
}
|
|
|
|
var STEPS = {
|
|
0: {
|
|
beforeShow: beforeShowStep1,
|
|
beforeMove: beforeMoveStep1
|
|
},
|
|
1: {
|
|
beforeShow: beforeShowStep2,
|
|
beforeMove: beforeMoveStep2
|
|
},
|
|
2: {
|
|
beforeShow: beforeShowStep3,
|
|
beforeMove: beforeMoveStep3
|
|
},
|
|
3: {
|
|
beforeShow: beforeShowStep4,
|
|
beforeMove: beforeMoveStep4
|
|
},
|
|
4: {
|
|
beforeShow: beforeShowStep5,
|
|
beforeMove: beforeMoveStep5
|
|
}
|
|
};
|
|
|
|
function moveToStep() {
|
|
var $nextWizardStep = $wizardSteps.filter($('[layout-wizard-step=' + step + ']'));
|
|
|
|
$wizardSteps.hide();
|
|
|
|
$currentWizardStep = $nextWizardStep;
|
|
|
|
$currentWizardStep.show();
|
|
|
|
var $sessionSteps = $(context._.template($templateSteps.html(), { variable: 'data' }));
|
|
var $activeStep = $sessionSteps.find('.session-stepnumber[data-step-number="' + step + '"]');
|
|
$activeStep.addClass('session-stepactive');
|
|
$activeStep.next().show();
|
|
var $createSessionSteps = $("<div id='create-session-steps'><div id='passed-steps' class='left'></div><div id='todo-steps' class='right'></div><div class='clearall'></div></div></div>");
|
|
for (var i = 0; i < TOTAL_STEPS; i++) {
|
|
var $eachStep = $sessionSteps.find('.session-stepnumber[data-step-number="' + i + '"]');
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
if (step == STEP_SELECT_TYPE) {
|
|
if (createSessionSettings.session_count > 0 && i == STEP_SELECT_CONFIRM) {
|
|
$eachStep.on('click', next);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
}
|
|
else if (step == STEP_SELECT_CONFIRM && i == STEP_SELECT_TYPE) {
|
|
$eachStep.on('click', back);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
}
|
|
else if (createSessionSettings.createType == 'quick-start') {
|
|
if (step == STEP_SELECT_CONFIRM && i == STEP_SELECT_TYPE) {
|
|
$eachStep.on('click', back);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
else if (step == STEP_SELECT_TYPE && i == STEP_SELECT_CONFIRM) {
|
|
$eachStep.on('click', next);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
}
|
|
else {
|
|
if (i == step - 1) {
|
|
$eachStep.on('click', back);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
else if (i == step + 1) {
|
|
$eachStep.on('click', next);
|
|
$eachStep.addClass('session-stephover');
|
|
}
|
|
}
|
|
|
|
if (i <= step) {
|
|
$createSessionSteps.find("#passed-steps").append($eachStep.clone(true, true));
|
|
$createSessionSteps.find("#passed-steps").append($eachStep.next().clone());
|
|
}
|
|
else {
|
|
$createSessionSteps.find("#todo-steps").append($eachStep.clone(true, true));
|
|
$createSessionSteps.find("#todo-steps").append($eachStep.next().clone());
|
|
}
|
|
}
|
|
$createSessionSteps.find("#passed-steps").append($("<div class='clearall'></div>"));
|
|
$createSessionSteps.find("#todo-steps").append($("<div class='clearall'></div>"));
|
|
$screen.find('#create-session-steps').replaceWith($createSessionSteps);
|
|
|
|
beforeShowStep();
|
|
|
|
// update buttons
|
|
var $sessionButtonsContent = $(context._.template($templateButtons.html(), {}, {variable: 'data'}));
|
|
|
|
var $btnBack = $sessionButtonsContent.find('.btn-back');
|
|
var $btnNext = $sessionButtonsContent.find('.btn-next');
|
|
var $btnCancel = $sessionButtonsContent.find('.btn-cancel');
|
|
|
|
// hide back button if 1st step or last step
|
|
if (step == 0) {
|
|
$btnBack.hide();
|
|
}
|
|
|
|
// if (step == STEP_SELECT_TYPE && createSessionSettings.createType == 'start-scheduled' && createSessionSettings.selectedSessionId == null) {
|
|
// $btnNext.removeClass('button-orange').addClass('button-grey');
|
|
// }
|
|
// else {
|
|
// $btnNext.removeClass('button-grey').addClass('button-orange');
|
|
// }
|
|
|
|
if (step == STEP_SELECT_CONFIRM) {
|
|
$btnNext.html(createSessionSettings.startType);
|
|
$btnNext.on('click', startSession);
|
|
}
|
|
else
|
|
$btnNext.on('click', next);
|
|
|
|
$btnBack.on('click', back);
|
|
|
|
$sessionButtons.empty();
|
|
$sessionButtons.append($sessionButtonsContent);
|
|
}
|
|
|
|
function back(event) {
|
|
if (event) {
|
|
event.preventDefault();
|
|
}
|
|
|
|
if ($(this).is('.button-grey')) return;
|
|
if ($.inArray(createSessionSettings.createType, ['start-scheduled', 'quick-start']) > -1)
|
|
step = STEP_SELECT_TYPE;
|
|
else
|
|
step--;
|
|
moveToStep();
|
|
return false;
|
|
}
|
|
|
|
function next(event) {
|
|
var valid = beforeMoveStep();
|
|
if (!valid) {
|
|
return;
|
|
}
|
|
|
|
if (event) {
|
|
event.preventDefault();
|
|
}
|
|
if ($(this).is('.button-grey')) return;
|
|
|
|
if ($.inArray(createSessionSettings.createType, ['start-scheduled', 'quick-start']) > -1)
|
|
step = STEP_SELECT_CONFIRM;
|
|
else
|
|
step++;
|
|
|
|
moveToStep();
|
|
return false;
|
|
}
|
|
|
|
function beforeShowStep() {
|
|
var stepInfo = STEPS[step];
|
|
|
|
if (!stepInfo) {
|
|
throw "unknown step: " + step;
|
|
}
|
|
|
|
toggleStepStatus();
|
|
|
|
stepInfo.beforeShow.call(self);
|
|
}
|
|
|
|
function beforeMoveStep() {
|
|
var stepInfo = STEPS[step];
|
|
|
|
if (!stepInfo) {
|
|
throw "unknown step: " + step;
|
|
}
|
|
|
|
return stepInfo.beforeMove.call(self);
|
|
}
|
|
|
|
function beforeShow(args) {
|
|
step = args.d1;
|
|
if (!step) step = 0;
|
|
step = parseInt(step);
|
|
moveToStep();
|
|
}
|
|
|
|
function afterShow() {
|
|
context.JK.guardAgainstBrowser(app);
|
|
}
|
|
|
|
function getFormattedTime(date, change) {
|
|
if (change) {
|
|
date.setMinutes(Math.ceil(date.getMinutes() / 30) * 30);
|
|
}
|
|
var h12h = date.getHours();
|
|
var m12h = date.getMinutes();
|
|
var ampm;
|
|
if (h12h >= 0 && h12h < 12) {
|
|
if (h12h === 0) {
|
|
h12h = 12; // 0 becomes 12
|
|
}
|
|
ampm = "AM";
|
|
}
|
|
else {
|
|
if (h12h > 12) {
|
|
h12h -= 12; // 13-23 becomes 1-11
|
|
}
|
|
ampm = "PM";
|
|
}
|
|
var timeString = ("00" + h12h).slice(-2) + ":" + ("00" + m12h).slice(-2) + " " + ampm;
|
|
|
|
return timeString;
|
|
}
|
|
|
|
function toggleDate() {
|
|
var selectedDate = new Date($('#session-start-date').val());
|
|
var currentDate = new Date();
|
|
var startIndex = 0;
|
|
|
|
if (currentDate.getYear() == selectedDate.getYear() &&
|
|
currentDate.getMonth() == selectedDate.getMonth() &&
|
|
currentDate.getDate() == selectedDate.getDate()) {
|
|
|
|
var timeString = getFormattedTime(currentDate, true);
|
|
startIndex = defaultTimeArray.indexOf(timeString);
|
|
}
|
|
var $startTimeList = $('#start-time-list');
|
|
$startTimeList.empty();
|
|
for (var i = startIndex; i < defaultTimeArray.length; i++) {
|
|
var strTime = defaultTimeArray[i];
|
|
$startTimeList.append($('<option value="' + strTime + '" class="label">' + strTime +'</option>'));
|
|
}
|
|
|
|
if (createSessionSettings.startTime != selectedDate)
|
|
createSessionSettings.startTime = defaultTimeArray[startIndex];
|
|
$startTimeList.val(createSessionSettings.startTime);
|
|
|
|
toggleStartTime();
|
|
}
|
|
|
|
function toggleStartTime() {
|
|
var valueSelected = $('#start-time-list').find('option:selected').val();
|
|
var startIndex = defaultTimeArray.indexOf(valueSelected) + 1;
|
|
|
|
var $endTimeList = $('#end-time-list');
|
|
$endTimeList.empty();
|
|
if (startIndex == defaultTimeArray.length ) {
|
|
strTime = defaultTimeArray[0];
|
|
$endTimeList.append($('<option value="' + strTime + '" class="label">' + strTime +'</option>'));
|
|
}
|
|
for (var i = startIndex; i < defaultTimeArray.length; i++) {
|
|
var strTime = defaultTimeArray[i];
|
|
$endTimeList.append($('<option value="' + strTime + '" class="label">' + strTime +'</option>'));
|
|
}
|
|
|
|
if (createSessionSettings.endTime != defaultTimeArray[startIndex])
|
|
createSessionSettings.endTime = defaultTimeArray[startIndex];
|
|
$endTimeList.val(createSessionSettings.endTime);
|
|
}
|
|
|
|
function initializeControls() {
|
|
$("#create-session-form").iCheck({
|
|
checkboxClass: 'icheckbox_minimal',
|
|
radioClass: 'iradio_minimal',
|
|
inheritClass: true
|
|
});
|
|
$("#session-start-date").datepicker({
|
|
dateFormat: "D d MM yy",
|
|
onSelect: toggleDate
|
|
}
|
|
);
|
|
|
|
context.JK.GenreSelectorHelper.render('#create-session-genre');
|
|
|
|
inviteMusiciansUtil.loadFriends();
|
|
|
|
context.JK.dropdown($('#session-musician-access'));
|
|
context.JK.dropdown($('#session-fans-access'));
|
|
}
|
|
|
|
function changeSelectedFiles() {
|
|
var $inputFiles = $('#session-step-2 #session-select-files');
|
|
var fileNames = [];
|
|
var files = $inputFiles.get(0).files;
|
|
var error = false;
|
|
for (var i = 0; i < files.length; ++i) {
|
|
var name = files.item(i).name;
|
|
var ext = name.split('.').pop();
|
|
if ($.inArray(ext, ["pdf", "png", "jpg", "jpeg", "gif", "xml", "mxl", "txt"]) == -1) {
|
|
error = true;
|
|
break;
|
|
}
|
|
fileNames.push(name);
|
|
}
|
|
|
|
if (error) {
|
|
app.notifyAlert("Error", "We're sorry, but we do not allow upload of that file type. Please upload only the file types listed in the Upload dialog box.");
|
|
$inputFiles.replaceWith($inputFiles.clone(true));
|
|
|
|
$('#selected-filenames').html("");
|
|
createSessionSettings.files = null;
|
|
}
|
|
else {
|
|
$('#selected-filenames').html(fileNames.join(', '));
|
|
createSessionSettings.files = files;
|
|
}
|
|
}
|
|
|
|
function toggleSelectFiles(event) {
|
|
event.preventDefault();
|
|
$('#session-select-files').trigger('click');
|
|
}
|
|
|
|
function toggleStepStatus() {
|
|
$screen.find('#create-session-steps .session-stepnumber').off('click');
|
|
$screen.find('#create-session-steps .session-stepnumber').removeClass('session-stephover');
|
|
|
|
if ($.inArray(createSessionSettings.createType, ['start-scheduled', 'quick-start']) > -1) {
|
|
if (step == STEP_SELECT_CONFIRM) {
|
|
for (var i = 1; i < 4; i++) {
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + i + '"]').hide();
|
|
}
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="4"]').html("2");
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="0"]').on('click', back);
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="0"]').addClass('session-stephover');
|
|
}
|
|
else if (step == STEP_SELECT_TYPE) {
|
|
for (var i = 2; i < 5; i++) {
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + i + '"]').hide();
|
|
}
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="4"]').html("5");
|
|
var $nextStep = $screen.find('#create-session-steps .session-stepnumber[data-step-number="1"]');
|
|
if (createSessionSettings.createType == 'quick-start') {
|
|
$nextStep.on('click', next);
|
|
$nextStep.addClass('session-stephover')
|
|
}
|
|
else if (createSessionSettings.createType == 'start-scheduled' && createSessionSettings.session_count > 0) {
|
|
$nextStep.on('click', next);
|
|
$nextStep.addClass('session-stephover')
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
$screen.find('#create-session-steps').find('.session-stepnumber').show();
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + (step + 1) + '"]').on('click', next);
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + (step + 1) + '"]').addClass('session-stephover');
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + (step - 1) + '"]').on('click', back);
|
|
$screen.find('#create-session-steps .session-stepnumber[data-step-number="' + (step - 1) + '"]').addClass('session-stephover');
|
|
}
|
|
}
|
|
|
|
function toggleCreateType(event) {
|
|
|
|
var $checkedType = $(event.target);
|
|
var checkedType = $checkedType.attr('info-value');
|
|
|
|
if (checkedType == createSessionSettings.createType) return;
|
|
|
|
$createTypeHelpers.addClass('hidden');
|
|
var $checkedInfo = $screen.find('.session-when-info div[info-id=' + '"' + checkedType + '"]');
|
|
$checkedInfo.removeClass('hidden');
|
|
|
|
createSessionSettings.createType = checkedType;
|
|
|
|
if (createSessionSettings.createType == 'start-scheduled') {
|
|
$('#start-scheduled-wrapper').show();
|
|
$('#schedule-future-wrapper').hide();
|
|
createSessionSettings.timezone = {};
|
|
createSessionSettings.recurring_mode = {};
|
|
createSessionSettings.timezone = {};
|
|
createSessionSettings.language = {};
|
|
createSessionSettings.musician_access = {};
|
|
createSessionSettings.fans_access = {};
|
|
}
|
|
else if (createSessionSettings.createType == 'schedule-future') {
|
|
$('#start-scheduled-wrapper').hide();
|
|
$('#schedule-future-wrapper').show();
|
|
}
|
|
else
|
|
{
|
|
$('#start-scheduled-wrapper').hide();
|
|
$('#schedule-future-wrapper').hide();
|
|
}
|
|
|
|
var $btnNext = $('#create-session-buttons .btn-next');
|
|
if (step == STEP_SELECT_TYPE && createSessionSettings.createType == 'start-scheduled' && createSessionSettings.selectedSessionId == null) {
|
|
$btnNext.removeClass('button-orange').addClass('button-grey');
|
|
}
|
|
else {
|
|
$btnNext.removeClass('button-grey').addClass('button-orange');
|
|
}
|
|
|
|
toggleStepStatus();
|
|
}
|
|
|
|
function togglePolicyTypeChanged(event) {
|
|
$('#session-policy-info .info-box').addClass('hidden');
|
|
$('#session-policy-info .info-box[policy-type="' + $(event.target).attr('policy-id') + '"]').removeClass('hidden');
|
|
}
|
|
|
|
function toggleMusicianAccessTypes(event) {
|
|
$('#session-musician-access-info .info-box').addClass('hidden');
|
|
$('#session-musician-access-info .info-box[musician-access-type="' + $(event.target).val() + '"]').removeClass('hidden');
|
|
}
|
|
|
|
function toggleFanAccessTypes(event) {
|
|
$('#session-fans-access-info .info-box').addClass('hidden');
|
|
$('#session-fans-access-info .info-box[fans-access-type="' + $(event.target).val() + '"]').removeClass('hidden');
|
|
}
|
|
|
|
function events() {
|
|
$createTypes.on("ifChanged", toggleCreateType);
|
|
$('#start-time-list').on('change', toggleStartTime);
|
|
$('#session-step-2 .btn-select-files').on('click', toggleSelectFiles);
|
|
$('#session-step-2 #session-select-files').on('change', changeSelectedFiles);
|
|
$policyTypes.on("ifChanged", togglePolicyTypeChanged);
|
|
$('#session-step-4 #session-musician-access').on('change', toggleMusicianAccessTypes);
|
|
$('#session-step-4 #session-fans-access').on('change', toggleFanAccessTypes);
|
|
|
|
$('div[layout-id="createSession"] .btn-email-invitation').click(function() {
|
|
invitationDialog.showEmailDialog();
|
|
});
|
|
|
|
$('div[layout-id="createSession"] .btn-gmail-invitation').click(function() {
|
|
invitationDialog.showGoogleDialog();
|
|
});
|
|
|
|
$('div[layout-id="createSession"] .btn-facebook-invitation').click(function(e) {
|
|
invitationDialog.showFacebookDialog(e);
|
|
});
|
|
|
|
$(friendInput).focus(function() { $(this).val(''); })
|
|
}
|
|
|
|
function initialize(invitationDialogInstance, inviteMusiciansUtilInstance, instrumentSelectorInstance, instrumentRSVPSelectorInstance) {
|
|
invitationDialog = invitationDialogInstance;
|
|
inviteMusiciansUtil = inviteMusiciansUtilInstance;
|
|
friendInput = inviteMusiciansUtil.inviteSessionCreate('#create-session-invite-musicians', "<div style='margin-right:140px;'>Who do you want to invite?</div>"); //'
|
|
|
|
instrumentSelector = instrumentSelectorInstance;
|
|
instrumentRSVP = instrumentRSVPSelectorInstance;
|
|
|
|
var screenBindings = {'beforeShow': beforeShow, 'afterShow': afterShow};
|
|
app.bindScreen('createSession', screenBindings);
|
|
|
|
$screen = $('#create-session-layout');
|
|
$wizardSteps = $screen.find('.create-session-wizard');
|
|
$templateSteps = $('#template-session-steps');
|
|
$templateButtons = $('#template-session-buttons');
|
|
$sessionButtons = $('#create-session-buttons');
|
|
|
|
$screenStep1 = $('#session-step-1');
|
|
$createTypes = $('input[name="session-when"]');
|
|
$createTypeHelpers = $screen.find('.session-when-info div');
|
|
$scheduledSessions = $screenStep1.find("#scheduled-session-list");
|
|
|
|
$policyTypes = $('input[name="session-policy-type"]');
|
|
|
|
initializeControls();
|
|
events();
|
|
}
|
|
|
|
this.initialize = initialize;
|
|
|
|
return this;
|
|
}
|
|
|
|
})(window, jQuery); |