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

(function(context,$) {
        "use strict";

        context.JK = context.JK || {};
        context.JK.FindMusicianScreen = function(app) {

        var logger = context.JK.logger;
        var musicians = {};
        var musicianList;
        var instrument_logo_map = context.JK.getInstrumentIconMap24();
        var did_show_musician_page = false;
        var page_num=1, page_count=0;

        function loadMusicians(queryString) {
            // squelch nulls and undefines
            queryString = !!queryString ? queryString : "";

            $.ajax({
                type: "GET",
                url: "/api/search.json?" + queryString,
                success: afterLoadMusicians,
                error: app.ajaxError
            });
        }

        function search() {
            did_show_musician_page = true;
            var queryString = 'srch_m=1&page='+page_num+'&';

            // order by
            var orderby = $('#musician_order_by').val();
            if (typeof orderby != 'undefined' && orderby.length > 0) {
                queryString += "orderby=" + orderby + '&';
            }

            // instrument filter
            var instrument = $('#musician_instrument').val();
            if (typeof instrument != 'undefined' && !(instrument === '')) {
                queryString += "instrument=" + instrument + '&';
            }

            // distance filter
            var query_param = $('#musician_query_distance').val();
            if (query_param !== null && query_param.length > 0) {
                var matches = query_param.match(/(\d+)/);
                if (0 < matches.length) {
                    var distance = matches[0];
                    queryString += "distance=" + distance + '&';
                }
            }
            loadMusicians(queryString);
        }

        function refreshDisplay() {
            clearResults();
            search();
        }

        function afterLoadMusicians(mList) {
            // display the 'no musicians' banner if appropriate
            var $noMusiciansFound = $('#musicians-none-found');
            musicianList = mList;

            if(musicianList.length == 0) {
                $noMusiciansFound.show();
                musicians = [];
            }
            else {
                $noMusiciansFound.hide();
                musicians = musicianList['musicians'];
                if (!(typeof musicians === 'undefined')) {
                    $('#musician-filter-city').text(musicianList['city']);
                    if (0 == page_count) {
                        page_count = musicianList['page_count'];
                    }
                    renderMusicians();
                }
            }
        }

        function renderMusicians() {
            var ii, len;
            var mTemplate = $('#template-find-musician-row').html();
            var fTemplate = $('#template-musician-follow-info').html();
            var aTemplate = $('#template-musician-action-btns').html();
            var mVals, mm, renderings='';
            var instr_logos, instr;
            var follows, followVals, aFollow;

            for (ii=0, len=musicians.length; ii < len; ii++) {
                mm = musicians[ii];
                instr_logos = '';
                for (var jj=0, ilen=mm['instruments'].length; jj<ilen; jj++) {
                    if (mm['instruments'][jj].instrument_id in instrument_logo_map) {
                    instr = instrument_logo_map[mm['instruments'][jj].instrument_id];
                    }
                    instr_logos += '<img src="' + instr + '" width="24" height="24" />&nbsp;';
                }
                follows = '';
                followVals = {};
                for (var jj=0, ilen=mm['followings'].length; jj<ilen; jj++) {
                    aFollow = mm['followings'][jj];
                    followVals = {
                        musician_name:  aFollow.name,
                        profile_url: '/#/profile/' + aFollow.user_id,
                        avatar_url:  context.JK.resolveAvatarUrl(aFollow.photo_url),
                    };
                    follows += context.JK.fillTemplate(fTemplate, followVals);
                    if (2 == jj) break;
                }
                var actionVals = {
                    profile_url: "/#/profile/" + mm.id,
                    button_friend: mm['is_friend'] ? '' : 'button-orange',
                    button_follow: mm['is_following'] ? '' : 'button-orange',
                    button_message: 'button-orange'
                };
                var musician_actions = context.JK.fillTemplate(aTemplate, actionVals);

                mVals = {
                    avatar_url: context.JK.resolveAvatarUrl(mm.photo_url),
                    profile_url: "/#/profile/" + mm.id,
                    musician_name:  mm.name,
                    musician_location:  mm.city + ', ' + mm.state,
                    instruments: instr_logos,
                    biography: mm['biography'],
                    follow_count: mm['follow_count'],
                    friend_count: mm['friend_count'],
                    recording_count: mm['recording_count'],
                    session_count: mm['session_count'],
                    musician_id: mm['id'],
                    musician_follow_template: follows,
                    musician_action_template: musician_actions
                };
                var musician_row = context.JK.fillTemplate(mTemplate, mVals);
                renderings += musician_row;
            }
            $('#musician-filter-results').append(renderings);

            $('.search-m-friend').on('click', friendMusician);
            $('.search-m-follow').on('click', followMusician);
        }

        function beforeShow(data) {
        }

        function afterShow(data) {
            if (!did_show_musician_page) {
                refreshDisplay();
            }
        }

        function clearResults() {
            musicians = {};
            $('#musician-filter-results').empty();
            page_num = 1;
            page_count = 0;
        }
        
        function friendMusician(evt) {
            // if the musician is already a friend, remove the button-orange class, and prevent
            // the link from working 
            if (0 === $(this).closest('.button-orange').size()) {
                return false;
            }

            $(this).click(function(ee) {ee.preventDefault();});

            evt.stopPropagation();
            var uid = $(this).parent().data('musician-id');
            context.JK.sendFriendRequest(app, uid, friendRequestCallback);
        }

        function friendRequestCallback(user_id) {
            // remove the orange look to indicate it's not selectable
            $('div[data-musician-id='+user_id+'] .search-m-friend').removeClass('button-orange');
        }

        function followMusician(evt) {
            // if the musician is already followed, remove the button-orange class, and prevent
            // the link from working 
            if (0 === $(this).closest('.button-orange').size()) {
                return false;
            }

            $(this).click(function(ee) {ee.preventDefault();});

            evt.stopPropagation();
            var newFollowing = {};
            newFollowing.user_id = $(this).parent().data('musician-id');
            var url = "/api/users/" + context.JK.currentUserId + "/followings";
            $.ajax({
                type: "POST",
                dataType: "json",
                contentType: 'application/json',
                url: url,
                data: JSON.stringify(newFollowing),
                processData: false,
                success: function(response) {
            // remove the orange look to indicate it's not selectable
            $('div[data-musician-id='+newFollowing.user_id+'] .search-m-follow').removeClass('button-orange');
                },
                error: app.ajaxError
            });
        }

        function events() {
            $('#musician_query_distance').change(refreshDisplay);
            $('#musician_instrument').change(refreshDisplay);
            $('#musician_order_by').change(refreshDisplay);

            $('#musician-filter-results').bind('scroll', function() {
                if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
                    if (page_num < page_count) {
                        page_num += 1;
                        search();
                    }
                }
            });
        }

        function initialize() {
            var screenBindings = {
                'beforeShow': beforeShow,
                'afterShow': afterShow
            };
            app.bindScreen('musicians', screenBindings);

            events();
        }

        this.initialize = initialize;
        this.renderMusicians = renderMusicians;
        this.afterShow = afterShow;

        this.clearResults = clearResults;

        return this;
    };
})(window,jQuery);