(function(context,$) { "use strict"; context.JK = context.JK || {}; context.JK.CreateSessionScreen = function(app) { var logger = context.JK.logger; var realtimeMessaging = context.JK.JamServer; var genreSelector; var autoComplete = null; var usernames = []; var userids = []; var MAX_GENRES = 3; function beforeShow(data) { usernames = []; userids = []; resetForm(); } function resetForm() { var $form = $('#create-session-form'); $('textarea[name="description"]', $form).val(''); genreSelector.reset(); } function validateForm() { var errors = []; var $form = $('#create-session-form'); // Description can't be empty var description = $('#description').val(); if (!description) { errors.push(['#description', "Please enter a description."]); } var genres = genreSelector.getSelectedGenres(); if (genres.length == 0) { errors.push(['#genre-list-items', "Please select a genre."]); } if (genres.length > MAX_GENRES) { errors.push(['#genre-list-items', "No more than " + MAX_GENRES + "genres are allowed."]); } return (errors.length) ? errors : null; } function submitForm(evt) { evt.preventDefault(); var formErrors = validateForm(); if (formErrors) { app.notify({ title: "Validation Errors", text: JSON.stringify(formErrors) }); return false; } var $this = $(evt.currentTarget); logger.debug($this.length); var data = {}; data.client_id = app.clientId; data.description = $('#description').val() data.as_musician = true; data.legal_terms = true; // this overrides the default of 'on', which isn't satisfying our concept of boolean data.genres = genreSelector.getSelectedGenres(); data.musician_access = $('#musician-access option:selected').val() === "true" ? true : false; data.approval_required = $("input[name='musician-access-option']:checked").val() === "true" ? true : false; data.fan_access = $('#fan-access option:selected').val() === "true" ? true : false; data.fan_chat = $("input[name='fan-chat-option']:checked").val() === "true" ? true : false; if ($('#band-list option:selected').val() != '') { data.band = $('#band-list option:selected').val(); } // FIXME: Hard-code tracks for now. Needs to default to: // 1. If no previous session data, a single stereo track with the // top instrument in the user's profile. // 2. Otherwise, use the tracks from the last created session. data.tracks = [ { instrument_id: "electric guitar", sound: "mono" }, { instrument_id: "keyboard", sound: "mono" } ]; var jsonData = JSON.stringify(data); var url = "/api/sessions"; $.ajax({ type: "POST", dataType: "json", contentType: 'application/json', url: url, processData:false, data: JSON.stringify(data), success: function(response) { var newSessionId = response.id; createInvitations(newSessionId, function() { context.location = '#/session/' + newSessionId; }); }, error: app.ajaxError }); return false; } function createInvitations(sessionId, onComplete) { var callCount = 0; $('#added-invitations .invitation').each(function(index, invitation) { callCount++; var invite_id = $(invitation).attr('user-id'); var invite = { music_session: sessionId, receiver: invite_id }; $.ajax({ type: "POST", url: "/api/invitations", data: invite }).done(function(response) { callCount--; }).fail(app.ajaxError); }); // TODO - this is the second time I've used this pattern. // refactor to make a common utility for this. function checker() { if (callCount === 0) { onComplete(); } else { context.setTimeout(checker, 10); } } checker(); } function events() { $('#create-session-form').submit(submitForm); //$('#added-invitations').on("click", ".invitation span", removeInvitation); $('#musician-access').change(toggleMusicianAccess); $('#fan-access').change(toggleFanAccess); // friend input focus $('#friend-input').focus(function() { $(this).val(''); }); // friend input blur // $('#friend-input').blur(function() { // $(this).val('Type a friend\'s name'); // $('#friend-search-results').attr('style', 'display:none'); // }); // friend input change $('#friend-input').keyup(function() { // searchFriends($(this).val()); }); } function addInvitation() { alert(target); var template = $('#template-added-invitation').html(); var inviteHtml = context.JK.fillTemplate(template, {userId: this.id, userName: 'Text'}); $('#friend-input').prepend(inviteHtml); } function removeInvitation(evt) { $(evt.currentTarget).closest('.invitation').remove(); } function toggleMusicianAccess() { var value = $("#musician-access option:selected").val(); if (value == "false") { $("input[name='musician-access-option']").attr('disabled', 'disabled'); $("input[name='musician-access-option']").parent().addClass("op50"); } else { $("input[name='musician-access-option']").removeAttr('disabled'); $("input[name='musician-access-option']").parent().removeClass("op50"); } } function toggleFanAccess() { var value = $("#fan-access option:selected").val(); if (value == "false") { $("input[name='fan-chat-option']").attr('disabled', 'disabled'); $("input[name='fan-chat-option']").parent().addClass("op50"); } else { $("input[name='fan-chat-option']").removeAttr('disabled'); $("input[name='fan-chat-option']").parent().removeClass("op50"); } } function loadBands() { var url = "/api/users/" + context.JK.currentUserId + "/bands"; $.ajax({ type: "GET", url: url, success: bandsLoaded }); } function bandsLoaded(response) { $.each(response, function() { var template = $('#template-band-option').html(); var bandOptionHtml = context.JK.fillTemplate(template, {value: this.id, label: this.name}); $('#band-list').append(bandOptionHtml); }); } function searchFriends(query) { if (query.length < 2) { $('#friend-search-results').empty(); return; } var url = "/api/search?query=" + query + "&userId=" + context.JK.currentUserId; $.ajax({ type: "GET", url: url, success: friendSearchComplete }); } function friendSearchComplete(response) { // reset search results each time $('#friend-search-results').empty(); // loop through each $.each(response.friends, function() { // only show friends who are musicians if (this.musician === true) { var template = $('#template-friend-search-results').html(); var searchResultHtml = context.JK.fillTemplate(template, {userId: this.id, name: this.first_name + ' ' + this.last_name}); $('#friend-search-results').append(searchResultHtml); $('#friend-search-results').attr('style', 'display:block'); } }); } function initialize() { genreSelector = new context.JK.GenreSelector(app); genreSelector.initialize('Choose up to ' + MAX_GENRES + ' genres', MAX_GENRES, $('#create-session-form')); events(); loadBands(); var screenBindings = { 'beforeShow': beforeShow }; app.bindScreen('createSession', screenBindings); } // Expose publics this.initialize = initialize; this.resetForm = resetForm; this.submitForm = submitForm; this.validateForm = validateForm; this.loadBands = loadBands; this.searchFriends = searchFriends; this.addInvitation = addInvitation; return this; }; })(window,jQuery);