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,
                async: true,
                success: afterLoadMusicians,
                error: app.ajaxError
            });
        }

        function search() {
	    did_show_musician_page = true;
            var queryString = 'search_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 = $('.instrument-list').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();
		}
            }
        }

        /**
         * Render a list of musicians
         */
        function renderMusicians() {
            var ii, len;
	    var mTemplate = $('#template-find-musician-row').html();
	    var fTemplate = $('#template-musician-follow-info').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;
		}

		mVals = {
		    avatar_url: context.JK.resolveAvatarUrl(mm.photo_url),
		    profile_url: "/#/profile/" + mm.id,
		    like_url: '#',
		    friend_url: '#',
		    follow_url: '#',
		    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'],
		    is_friend: mm['is_friend'],
		    is_following: mm['is_following'],
		    is_liker: mm['is_liker'],
		    user_id: mm['id'],
		    musician_follow_template: follows
		};
                renderings += context.JK.fillTemplate(mTemplate, mVals);
	    }
	    $('#musician-filter-results').append(renderings);
        }

        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 events() {
            $('#musician-keyword-srch').focus(function() {
                $(this).val('');
            });

            $("#musician-keyword-srch").keypress(function(evt) {
                if (evt.which === 13) {
                    evt.preventDefault();
                    search();
                }
            });
            $('#btn-refresh-musicians').on("click", refreshDisplay);

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

        /**
         * Initialize, 
         */
        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);