jam-cloud/web/app/assets/javascripts/inviteMusicians.js

(function(context,$) {

    "use strict";

    context.JK = context.JK || {};
    context.JK.InviteMusiciansUtil = function(app) {
        var logger = context.JK.logger;
        var userNames = [];
        var userIds = [];
        var userPhotoUrls = [];
        var friendSelectorDialog = null;
        var invitedFriends = [];
        var existingInvites = [];
        var autoComplete = null;
        var rest = context.JK.Rest();
        var inviteAction = 'create';  // create/update
        var updateSessionID = null;

        this.inviteSessionCreate = function(elemSelector) {
            inviteAction = 'create';
            _appendFriendSelector($(elemSelector));
        };

        this.inviteSessionUpdate = function(elemSelector, sessionId) {
            this.clearSelections();
            updateSessionID = sessionId;
            friendSelectorDialog.setCallback(friendSelectorCallback);
            inviteAction = 'update';
            if (0 == $(elemSelector + ' .friendbox').length) {
                _appendFriendSelector($(elemSelector));
                $('#btn-save-invites').click(function() {
                    createInvitations(updateSessionID);
                });
            }
            $.ajax({
                url: "/api/invitations",
                data: { session_id:  sessionId, sender: context.JK.currentUserId }
            }).done(function(response) {
                response.map(function(item) {
                    var dd = item['receiver'];
                    existingInvites.push(dd.id);
                    addInvitation(dd.name, dd.id);
                });
            }).fail(app.ajaxError);
        }

        this.clearSelections = function() {
            userNames = [];
            userIds = [];
            userPhotoUrls = [];
            invitedFriends = [];
            existingInvites = [];
            updateSessionID = null;
            $('.selected-friends').empty();
        };

        this.loadFriends = function() {
            friendSelectorDialog.setCallback(friendSelectorCallback);

            var friends = 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,
                        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);
                    } else {
                        autoComplete.setOptions(autoCompleteOptions);
                    }

                    $(".autocomplete").width("150px");
                })
                .fail(function() {
                    $('#friend-input').attr("placeholder", "Unable to lookup friends");
                    app.ajaxError(arguments);
                });
        }

        function friendSelectorCallback(newSelections) {
            var keys = Object.keys(newSelections);
            for (var i=0; i < keys.length; i++) {
                var dd = newSelections[keys[i]];
                addInvitation(dd.userName, dd.userId);
            }
        }

        function _inviteExists(userID) {
            return 0 <= existingInvites.indexOf(userID);
        }

        function addInvitation(value, data) {
            if (undefined === data) {
                data = value.data;
                value = value.value;
            }
            if (0 > invitedFriends.indexOf(data)) {
                var template = $('#template-added-invitation').html();
                var imgStyle = _inviteExists(data) ? 'display:none' : '';
                var invitationHtml = context.JK.fillTemplate(template, 
                                                             {userId: data, 
                                                              userName: value,
                                                              imageStyle: imgStyle});
                $('.selected-friends').append(invitationHtml);
                $('#friend-input').select();
                invitedFriends.push(data);

            } else {
                $('#friend-input').select();
                context.alert('Invitation already exists for this musician.');
            }
        }

        function removeInvitation(evt) {
            var idx = invitedFriends.indexOf($(evt.currentTarget).parent().attr('user-id'));
            if (0 <= idx) invitedFriends.splice(idx, 1); 
            $(evt.currentTarget).closest('.invitation').remove();
        }

        function createInvitations(sessionId, onComplete) {
            var callCount = 0;
            var totalInvitations = invitedFriends.length - existingInvites.length;
            invitedFriends.map(function(invite_id) {
                if (!_inviteExists(invite_id)) { 
                    callCount++;
                    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() {
                callCount === 0 ? onComplete() : context.setTimeout(checker, 10);
            }
            if (onComplete) checker();
            return totalInvitations;
        }
        this.createInvitations = createInvitations;

        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 _friendSelectorHTML() {
            return context.JK.fillTemplate($('#template-session-invite-musicians').html(),
                                           {choose_friends_id: 'btn-choose-friends-'+inviteAction,
                                            selected_friends_id: 'selected-friends-'+inviteAction}); 
        }

        function _appendFriendSelector(elemSelector) {
            elemSelector.append(_friendSelectorHTML());
            $('#selected-friends-'+inviteAction).on("click", ".invitation a", removeInvitation);
            $('#btn-choose-friends-'+inviteAction).click(function(){
                var obj = {};
                invitedFriends.map(function(uid) { obj[uid] = true; });
                friendSelectorDialog.showDialog(obj);
            });
        };

        this.initialize = function(friendSelectorDialogInstance) {
            friendSelectorDialog = friendSelectorDialogInstance;
        };

        return this;
    };

})(window,jQuery);