From a2b6aaf78358916ddad418eb48b60fc170febd66 Mon Sep 17 00:00:00 2001 From: Jonathan Kolyer Date: Mon, 10 Mar 2014 15:14:12 +0000 Subject: [PATCH 1/7] 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(); From e408bb42743a574e0722928b98f6072af2d46e18 Mon Sep 17 00:00:00 2001 From: Jonathan Kolyer Date: Mon, 10 Mar 2014 16:50:53 +0000 Subject: [PATCH 2/7] VRFS-1110 fixed couple nits --- web/app/assets/javascripts/inviteMusicians.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/web/app/assets/javascripts/inviteMusicians.js b/web/app/assets/javascripts/inviteMusicians.js index 8a9b03f44..632d04c5d 100644 --- a/web/app/assets/javascripts/inviteMusicians.js +++ b/web/app/assets/javascripts/inviteMusicians.js @@ -73,18 +73,18 @@ var autoCompleteOptions = { lookup: { suggestions: userNames, data: userIds }, onSelect: addInvitation, - serviceUrl: '/api/search.json?srch_muscinv=1', + serviceUrl: '/api/search.json?srch_sessinv=1', minChars: 3, autoSelectFirst: true }; $('#friend-input').attr("placeholder", "Type a friend\'s name").prop('disabled', false); - - if (!autoComplete) { + autoComplete = $('#friend-input').autocomplete(autoCompleteOptions); + /*if (!autoComplete) { autoComplete = $('#friend-input').autocomplete(autoCompleteOptions); } else { autoComplete.setOptions(autoCompleteOptions); - } + }*/ $(".autocomplete").width("150px"); }) From b428bbb91334ae493c8006c07c76eca6017bb962 Mon Sep 17 00:00:00 2001 From: Jonathan Kolyer Date: Thu, 13 Mar 2014 08:47:27 +0000 Subject: [PATCH 3/7] VRFS-1110 fixed integration of InviteMusiciansUtil to band setup --- web/app/assets/javascripts/band_setup.js | 7 +++-- .../assets/javascripts/createSession.js.erb | 7 +++-- web/app/assets/javascripts/inviteMusicians.js | 29 ++++++++++++------- web/app/views/clients/_band_setup.html.erb | 12 -------- .../views/clients/_inviteMusicians.html.erb | 2 +- web/app/views/clients/index.html.erb | 15 ++++++---- 6 files changed, 36 insertions(+), 36 deletions(-) diff --git a/web/app/assets/javascripts/band_setup.js b/web/app/assets/javascripts/band_setup.js index b46310f92..eab2b44a1 100644 --- a/web/app/assets/javascripts/band_setup.js +++ b/web/app/assets/javascripts/band_setup.js @@ -15,6 +15,7 @@ var invitationDialog = null; var nilOptionText = 'n/a'; var bandId = ''; + var friendInput=null; function is_new_record() { return bandId.length == 0; @@ -56,7 +57,7 @@ $("#band-setup-step-1").show(); $("#band-setup-step-2").hide(); - $('#friend-input') + $(friendInput) .unbind('blur') .attr("placeholder", "Looking up friends...") .prop('disabled', true) @@ -442,12 +443,12 @@ invitationDialog.showFacebookDialog(); }); - $('#friend-input').focus(function() { $(this).val(''); }) + $(friendInput).focus(function() { $(this).val(''); }) } function initialize(invitationDialogInstance, inviteMusiciansUtilInstance) { inviteMusiciansUtil = inviteMusiciansUtilInstance; - inviteMusiciansUtil.inviteBandCreate('#band-setup-invite-musicians'); + friendInput = inviteMusiciansUtil.inviteBandCreate('#band-setup-invite-musicians'); invitationDialog = invitationDialogInstance; events(); diff --git a/web/app/assets/javascripts/createSession.js.erb b/web/app/assets/javascripts/createSession.js.erb index fc911550f..4584c97d3 100644 --- a/web/app/assets/javascripts/createSession.js.erb +++ b/web/app/assets/javascripts/createSession.js.erb @@ -11,6 +11,7 @@ var inviteMusiciansUtil = null; var MAX_GENRES = 1; var sessionSettings = {}; + var friendInput = null; function beforeShow(data) { inviteMusiciansUtil.clearSelections(); @@ -60,7 +61,7 @@ context.JK.dropdown($('#musician-access', $form)); context.JK.dropdown($('#fan-access', $form)); - $('#friend-input') + $(friendInput) .unbind('blur') .attr("placeholder", "Looking up friends...") .prop('disabled', true) @@ -233,7 +234,7 @@ invitationDialog.showFacebookDialog(e); }); - $('#friend-input').focus(function() { $(this).val(''); }) + $(friendInput).focus(function() { $(this).val(''); }) } function toggleMusicianAccess() { @@ -306,7 +307,7 @@ function initialize(invitationDialogInstance, inviteMusiciansUtilInstance) { invitationDialog = invitationDialogInstance; inviteMusiciansUtil = inviteMusiciansUtilInstance; - inviteMusiciansUtil.inviteSessionCreate('#create-session-invite-musicians'); + friendInput = inviteMusiciansUtil.inviteSessionCreate('#create-session-invite-musicians'); events(); loadBands(); loadSessionSettings(); diff --git a/web/app/assets/javascripts/inviteMusicians.js b/web/app/assets/javascripts/inviteMusicians.js index 632d04c5d..c201bbcc0 100644 --- a/web/app/assets/javascripts/inviteMusicians.js +++ b/web/app/assets/javascripts/inviteMusicians.js @@ -14,16 +14,22 @@ var autoComplete = null; var rest = context.JK.Rest(); var inviteAction = 'create'; // create/update + var friendInput = null; var updateSessionID = null; - this.inviteSessionCreate = function(elemSelector) { - inviteAction = 'create'; + function _initInvite(elemSelector, iAction) { + inviteAction = iAction; + friendInput = '#friend-input-'+inviteAction; _appendFriendSelector($(elemSelector)); + return friendInput; + } + + this.inviteSessionCreate = function(elemSelector) { + return _initInvite(elemSelector, 'create') }; this.inviteBandCreate = function(elemSelector) { - inviteAction = 'band'; - _appendFriendSelector($(elemSelector)); + return _initInvite(elemSelector, 'band') }; this.inviteSessionUpdate = function(elemSelector, sessionId) { @@ -78,10 +84,10 @@ autoSelectFirst: true }; - $('#friend-input').attr("placeholder", "Type a friend\'s name").prop('disabled', false); - autoComplete = $('#friend-input').autocomplete(autoCompleteOptions); + $(friendInput).attr("placeholder", "Type a friend\'s name").prop('disabled', false); + autoComplete = $(friendInput).autocomplete(autoCompleteOptions); /*if (!autoComplete) { - autoComplete = $('#friend-input').autocomplete(autoCompleteOptions); + autoComplete = $(friendInput).autocomplete(autoCompleteOptions); } else { autoComplete.setOptions(autoCompleteOptions); }*/ @@ -89,7 +95,7 @@ $(".autocomplete").width("150px"); }) .fail(function() { - $('#friend-input').attr("placeholder", "Unable to lookup friends"); + $(friendInput).attr("placeholder", "Unable to lookup friends"); app.ajaxError(arguments); }); } @@ -119,11 +125,11 @@ userName: value, imageStyle: imgStyle}); $('.selected-friends').append(invitationHtml); - $('#friend-input').select(); + $(friendInput).select(); invitedFriends.push(data); } else { - $('#friend-input').select(); + $(friendInput).select(); context.alert('Invitation already exists for this musician.'); } } @@ -195,7 +201,8 @@ function _friendSelectorHTML() { return context.JK.fillTemplate($('#template-session-invite-musicians').html(), {choose_friends_id: 'btn-choose-friends-'+inviteAction, - selected_friends_id: 'selected-friends-'+inviteAction}); + selected_friends_id: 'selected-friends-'+inviteAction, + friend_input: friendInput.substring(1,friendInput.length)}); } function _appendFriendSelector(elemSelector) { diff --git a/web/app/views/clients/_band_setup.html.erb b/web/app/views/clients/_band_setup.html.erb index 57e228197..800e5a6c8 100644 --- a/web/app/views/clients/_band_setup.html.erb +++ b/web/app/views/clients/_band_setup.html.erb @@ -95,18 +95,6 @@

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/_inviteMusicians.html.erb b/web/app/views/clients/_inviteMusicians.html.erb index fa67d9086..6a279e524 100644 --- a/web/app/views/clients/_inviteMusicians.html.erb +++ b/web/app/views/clients/_inviteMusicians.html.erb @@ -26,7 +26,7 @@
- +
diff --git a/web/app/views/clients/index.html.erb b/web/app/views/clients/index.html.erb index 472c49881..8d58a6116 100644 --- a/web/app/views/clients/index.html.erb +++ b/web/app/views/clients/index.html.erb @@ -132,9 +132,6 @@ var friendSelectorDialog = new JK.FriendSelectorDialog(JK.app); friendSelectorDialog.initialize(); - var inviteMusiciansUtil = new JK.InviteMusiciansUtil(JK.app); - inviteMusiciansUtil.initialize(friendSelectorDialog); - var userDropdown = new JK.UserDropdown(JK.app); JK.UserDropdown = userDropdown; userDropdown.initialize(invitationDialog); @@ -177,11 +174,15 @@ JK.GenreSelectorHelper.initialize(); JK.Banner.initialize(); + var inviteMusiciansUtil1 = new JK.InviteMusiciansUtil(JK.app); + inviteMusiciansUtil1.initialize(friendSelectorDialog); var createSessionScreen = new JK.CreateSessionScreen(JK.app); - createSessionScreen.initialize(invitationDialog, inviteMusiciansUtil); + createSessionScreen.initialize(invitationDialog, inviteMusiciansUtil1); + var inviteMusiciansUtil2 = new JK.InviteMusiciansUtil(JK.app); + inviteMusiciansUtil2.initialize(friendSelectorDialog); var bandSetupScreen = new JK.BandSetupScreen(JK.app); - bandSetupScreen.initialize(invitationDialog, inviteMusiciansUtil); + bandSetupScreen.initialize(invitationDialog, inviteMusiciansUtil2); var bandSetupPhotoScreen = new JK.BandSetupPhotoScreen(JK.app); bandSetupPhotoScreen.initialize(); @@ -202,8 +203,10 @@ var findBandScreen = new JK.FindBandScreen(JK.app); findBandScreen.initialize(); + var inviteMusiciansUtil3 = new JK.InviteMusiciansUtil(JK.app); + inviteMusiciansUtil3.initialize(friendSelectorDialog); var sessionScreen = new JK.SessionScreen(JK.app); - sessionScreen.initialize(localRecordingsDialog, recordingFinishedDialog, inviteMusiciansUtil); + sessionScreen.initialize(localRecordingsDialog, recordingFinishedDialog, inviteMusiciansUtil3); var sessionSettingsDialog = new JK.SessionSettingsDialog(JK.app, sessionScreen); sessionSettingsDialog.initialize(); From c46f8c4476c10e82c8aa0a36fb9b6c140e45dff7 Mon Sep 17 00:00:00 2001 From: Jonathan Kolyer Date: Thu, 13 Mar 2014 09:23:22 +0000 Subject: [PATCH 4/7] VRFS-1110 added instructions argument --- web/app/assets/javascripts/band_setup.js | 2 +- web/app/assets/javascripts/createSession.js.erb | 2 +- web/app/assets/javascripts/inviteMusicians.js | 15 +++++++++------ web/app/views/clients/_band_setup.html.erb | 4 +--- web/app/views/clients/_inviteMusicians.html.erb | 4 +--- 5 files changed, 13 insertions(+), 14 deletions(-) diff --git a/web/app/assets/javascripts/band_setup.js b/web/app/assets/javascripts/band_setup.js index eab2b44a1..e7dfb3c6f 100644 --- a/web/app/assets/javascripts/band_setup.js +++ b/web/app/assets/javascripts/band_setup.js @@ -448,7 +448,7 @@ function initialize(invitationDialogInstance, inviteMusiciansUtilInstance) { inviteMusiciansUtil = inviteMusiciansUtilInstance; - friendInput = inviteMusiciansUtil.inviteBandCreate('#band-setup-invite-musicians'); + friendInput = inviteMusiciansUtil.inviteBandCreate('#band-setup-invite-musicians', "
If your bandmates are already on JamKazam, start typing their names in the box below, or click the Choose Friends button to select them.
"); invitationDialog = invitationDialogInstance; events(); diff --git a/web/app/assets/javascripts/createSession.js.erb b/web/app/assets/javascripts/createSession.js.erb index 4584c97d3..494f8f661 100644 --- a/web/app/assets/javascripts/createSession.js.erb +++ b/web/app/assets/javascripts/createSession.js.erb @@ -307,7 +307,7 @@ function initialize(invitationDialogInstance, inviteMusiciansUtilInstance) { invitationDialog = invitationDialogInstance; inviteMusiciansUtil = inviteMusiciansUtilInstance; - friendInput = inviteMusiciansUtil.inviteSessionCreate('#create-session-invite-musicians'); + friendInput = inviteMusiciansUtil.inviteSessionCreate('#create-session-invite-musicians', "
Start typing friends' names or:
"); //' events(); loadBands(); loadSessionSettings(); diff --git a/web/app/assets/javascripts/inviteMusicians.js b/web/app/assets/javascripts/inviteMusicians.js index c201bbcc0..7c4fdb505 100644 --- a/web/app/assets/javascripts/inviteMusicians.js +++ b/web/app/assets/javascripts/inviteMusicians.js @@ -16,20 +16,22 @@ var inviteAction = 'create'; // create/update var friendInput = null; var updateSessionID = null; + var addInstructions = null; - function _initInvite(elemSelector, iAction) { + function _initInvite(elemSelector, iAction, instructions) { + addInstructions = instructions; inviteAction = iAction; friendInput = '#friend-input-'+inviteAction; _appendFriendSelector($(elemSelector)); return friendInput; } - this.inviteSessionCreate = function(elemSelector) { - return _initInvite(elemSelector, 'create') + this.inviteSessionCreate = function(elemSelector, instructions) { + return _initInvite(elemSelector, 'create', instructions) }; - this.inviteBandCreate = function(elemSelector) { - return _initInvite(elemSelector, 'band') + this.inviteBandCreate = function(elemSelector, instructions) { + return _initInvite(elemSelector, 'band', instructions) }; this.inviteSessionUpdate = function(elemSelector, sessionId) { @@ -202,7 +204,8 @@ return context.JK.fillTemplate($('#template-session-invite-musicians').html(), {choose_friends_id: 'btn-choose-friends-'+inviteAction, selected_friends_id: 'selected-friends-'+inviteAction, - friend_input: friendInput.substring(1,friendInput.length)}); + friend_input: friendInput.substring(1,friendInput.length), + instructions: addInstructions}); } function _appendFriendSelector(elemSelector) { diff --git a/web/app/views/clients/_band_setup.html.erb b/web/app/views/clients/_band_setup.html.erb index 800e5a6c8..c989c27b4 100644 --- a/web/app/views/clients/_band_setup.html.erb +++ b/web/app/views/clients/_band_setup.html.erb @@ -93,10 +93,8 @@