From a2b6aaf78358916ddad418eb48b60fc170febd66 Mon Sep 17 00:00:00 2001 From: Jonathan Kolyer Date: Mon, 10 Mar 2014 15:14:12 +0000 Subject: [PATCH] VRFS-1110 integrated autocomplete --- web/app/assets/javascripts/band_setup.js | 66 +++---------------- web/app/assets/javascripts/inviteMusicians.js | 7 +- web/app/views/clients/_band_setup.html.erb | 6 +- web/app/views/clients/index.html.erb | 2 +- 4 files changed, 20 insertions(+), 61 deletions(-) diff --git a/web/app/assets/javascripts/band_setup.js b/web/app/assets/javascripts/band_setup.js index 875f31f41..b46310f92 100644 --- a/web/app/assets/javascripts/band_setup.js +++ b/web/app/assets/javascripts/band_setup.js @@ -11,13 +11,8 @@ context.JK.BandSetupScreen = function (app) { var logger = context.JK.logger; var rest = context.JK.Rest(); - var friendSelectorDialog = null; + var inviteMusiciansUtil = null; var invitationDialog = null; - var autoComplete = null; - var userNames = []; - var userIds = []; - var userPhotoUrls = []; - var selectedFriendIds = {}; var nilOptionText = 'n/a'; var bandId = ''; @@ -61,7 +56,7 @@ $("#band-setup-step-1").show(); $("#band-setup-step-2").hide(); - $('#band-invitee-input') + $('#friend-input') .unbind('blur') .attr("placeholder", "Looking up friends...") .prop('disabled', true) @@ -178,16 +173,13 @@ } function beforeShow(data) { - userNames = []; - userIds = []; - userPhotoUrls = []; + inviteMusiciansUtil.clearSelections(); bandId = data.id == 'new' ? '' : data.id; resetForm(); } function afterShow(data) { - friendSelectorDialog.setCallback(friendSelectorCallback); - loadFriends(); + inviteMusiciansUtil.loadFriends(); if (!is_new_record()) { $("#band-setup-title").html("edit band"); @@ -239,38 +231,6 @@ }); } - // TODO: this is repeated in createSession.js.erb - function loadFriends() { - rest.getFriends({ id: context.JK.currentUserId }) - .done(function (friends) { - $.each(friends, function () { - userNames.push(this.name); - userIds.push(this.id); - userPhotoUrls.push(this.photo_url); - }); - - var autoCompleteOptions = { - lookup: { suggestions: userNames, data: userIds }, - onSelect: addInvitation - }; - - $('#band-invitee-input').attr("placeholder", "Type a friend\'s name").prop('disabled', false); - - if (!autoComplete) { - autoComplete = $('#band-invitee-input').autocomplete(autoCompleteOptions); - } - else { - autoComplete.setOptions(autoCompleteOptions); - } - - $(".autocomplete").width("150px"); - }) - .fail(function () { - $('#band-invitee-input').attr("placeholder", "Unable to lookup friends"); - app.ajaxError(arguments) - }); - } - function loadGenres(selectedGenres) { $("#band-genres").empty(); @@ -392,13 +352,6 @@ } } - function friendSelectorCallback(newSelections) { - var keys = Object.keys(newSelections); - for (var i = 0; i < keys.length; i++) { - addInvitation(newSelections[keys[i]].userName, newSelections[keys[i]].userId); - } - } - function addInvitation(value, data) { if ($('#selected-band-invitees div[user-id=' + data + ']').length === 0) { var template = $('#template-band-invitation').html(); @@ -461,10 +414,6 @@ $('#btn-band-setup-save').click(saveBand); - $('#btn-band-choose-friends').click(function () { - friendSelectorDialog.showDialog(selectedFriendIds); - }); - $('#band-country').on('change', function (evt) { evt.stopPropagation(); loadRegions(); @@ -492,10 +441,13 @@ $('div[layout-id="band/setup"] .btn-facebook-invitation').click(function () { invitationDialog.showFacebookDialog(); }); + + $('#friend-input').focus(function() { $(this).val(''); }) } - function initialize(invitationDialogInstance, friendSelectorDialogInstance) { - friendSelectorDialog = friendSelectorDialogInstance; + function initialize(invitationDialogInstance, inviteMusiciansUtilInstance) { + inviteMusiciansUtil = inviteMusiciansUtilInstance; + inviteMusiciansUtil.inviteBandCreate('#band-setup-invite-musicians'); invitationDialog = invitationDialogInstance; events(); diff --git a/web/app/assets/javascripts/inviteMusicians.js b/web/app/assets/javascripts/inviteMusicians.js index 1ea0ccb76..8a9b03f44 100644 --- a/web/app/assets/javascripts/inviteMusicians.js +++ b/web/app/assets/javascripts/inviteMusicians.js @@ -21,6 +21,11 @@ _appendFriendSelector($(elemSelector)); }; + this.inviteBandCreate = function(elemSelector) { + inviteAction = 'band'; + _appendFriendSelector($(elemSelector)); + }; + this.inviteSessionUpdate = function(elemSelector, sessionId) { this.clearSelections(); updateSessionID = sessionId; @@ -68,7 +73,7 @@ var autoCompleteOptions = { lookup: { suggestions: userNames, data: userIds }, onSelect: addInvitation, - serviceUrl: '/api/search.json?srch_sessinv=1', + serviceUrl: '/api/search.json?srch_muscinv=1', minChars: 3, autoSelectFirst: true }; diff --git a/web/app/views/clients/_band_setup.html.erb b/web/app/views/clients/_band_setup.html.erb index e3dd3ae13..57e228197 100644 --- a/web/app/views/clients/_band_setup.html.erb +++ b/web/app/views/clients/_band_setup.html.erb @@ -94,7 +94,9 @@

Step 2: Add Band Members


If your bandmates are already on JamKazam, start typing their names in the box
below, or click the Choose Friends button to select them.
-
+
+ + If your bandmates are not on JamKazam yet, use any of the options below to invite them to join the service.

diff --git a/web/app/views/clients/index.html.erb b/web/app/views/clients/index.html.erb index 21e359063..a8739254a 100644 --- a/web/app/views/clients/index.html.erb +++ b/web/app/views/clients/index.html.erb @@ -179,7 +179,7 @@ createSessionScreen.initialize(invitationDialog, inviteMusiciansUtil); var bandSetupScreen = new JK.BandSetupScreen(JK.app); - bandSetupScreen.initialize(invitationDialog, friendSelectorDialog); + bandSetupScreen.initialize(invitationDialog, inviteMusiciansUtil); var bandSetupPhotoScreen = new JK.BandSetupPhotoScreen(JK.app); bandSetupPhotoScreen.initialize();