diff --git a/web/app/assets/javascripts/musician_search_filter.js.coffee b/web/app/assets/javascripts/musician_search_filter.js.coffee index 4410b2548..2d7e89fb1 100644 --- a/web/app/assets/javascripts/musician_search_filter.js.coffee +++ b/web/app/assets/javascripts/musician_search_filter.js.coffee @@ -173,6 +173,12 @@ context.JK.MusicianSearchFilter = class MusicianSearchFilter vals.push $(this).val() vals + didSearch: (response) => + console.log("response = ", JSON.stringify(response)) + $('#musician-search-filter-builder-form').hide() + $('#musician-search-filter-builder-results').show() + this.renderMusicians(response) + performSearch: () => $.each gon.musician_search_meta.filter_keys.single, (index, key) => @searchFilter[key] = this._selectedValue(key) @@ -180,5 +186,87 @@ context.JK.MusicianSearchFilter = class MusicianSearchFilter $.each gon.musician_search_meta.filter_keys.multi, (index, key) => @searchFilter[key] = this._selectedMultiValue(key) - @rest.postMusicianSearchFilter { filter: JSON.stringify(@searchFilter), page: 1 } - \ No newline at end of file + @rest.postMusicianSearchFilter({ filter: JSON.stringify(@searchFilter), page: 1 }).done(this.didSearch) + + renderMusicians: (musicianList) => + ii = undefined + len = undefined + mTemplate = $('#template-search-musician-row').html() + aTemplate = $('#template-search-musician-action-btns').html() + mVals = undefined + musician = undefined + renderings = '' + instr_logos = undefined + instr = undefined + follows = undefined + followVals = undefined + aFollow = undefined + myAudioLatency = musicianList.my_audio_latency + ii = 0 + len = musicians.length + while ii < len + musician = musicians[ii] + if context.JK.currentUserId == musician.id + ii++ + continue + instr_logos = '' + jj = 0 + ilen = musician['instruments'].length + while jj < ilen + toolTip = '' + if musician['instruments'][jj].instrument_id in instrument_logo_map + instr = instrument_logo_map[musician['instruments'][jj].instrument_id].asset + toolTip = musician['instruments'][jj].instrument_id + instr_logos += '' + jj++ + actionVals = + profile_url: '/client#/profile/' + musician.id + friend_class: 'button-' + (if musician['is_friend'] then 'grey' else 'orange') + friend_caption: (if musician.is_friend then 'DIS' else '') + 'CONNECT' + follow_class: 'button-' + (if musician['is_following'] then 'grey' else 'orange') + follow_caption: (if musician.is_following then 'UN' else '') + 'FOLLOW' + message_class: 'button-orange' + message_caption: 'MESSAGE' + button_message: 'button-orange' + musician_actions = context.JK.fillTemplate(aTemplate, actionVals) + latencyBadge = context._.template($templateAccountSessionLatency.html(), $.extend(sessionUtils.createLatency(musician), musician), variable: 'data') + mVals = + avatar_url: context.JK.resolveAvatarUrl(musician.photo_url) + profile_url: '/client#/profile/' + musician.id + musician_name: musician.name + musician_location: formatLocation(musician) + instruments: instr_logos + biography: musician['biography'] + follow_count: musician['follow_count'] + friend_count: musician['friend_count'] + recording_count: musician['recording_count'] + session_count: musician['session_count'] + musician_id: musician['id'] + musician_action_template: musician_actions + latency_badge: latencyBadge + musician_first_name: musician['first_name'] + $rendering = $(context.JK.fillTemplate(mTemplate, mVals)) + $offsetParent = $results.closest('.content') + data = entity_type: 'musician' + options = + positions: [ + 'top' + 'bottom' + 'right' + 'left' + ] + offsetParent: $offsetParent + scoreOptions = offsetParent: $offsetParent + context.JK.helpBubble $('.follower-count', $rendering), 'follower-count', data, options + context.JK.helpBubble $('.friend-count', $rendering), 'friend-count', data, options + context.JK.helpBubble $('.recording-count', $rendering), 'recording-count', data, options + context.JK.helpBubble $('.session-count', $rendering), 'session-count', data, options + helpBubble.scoreBreakdown $('.latency', $rendering), false, musician['full_score'], myAudioLatency, musician['audio_latency'], musician['score'], scoreOptions + $results.append $rendering + $rendering.find('.biography').dotdotdot() + ii++ + $('.search-m-friend').on 'click', friendMusician + $('.search-m-follow').on 'click', followMusician + $('.search-m-message').on 'click', messageMusician + context.JK.bindHoverEvents() + return \ No newline at end of file diff --git a/web/app/assets/stylesheets/client/client.css b/web/app/assets/stylesheets/client/client.css index 28049797e..c48ea6bef 100644 --- a/web/app/assets/stylesheets/client/client.css +++ b/web/app/assets/stylesheets/client/client.css @@ -59,7 +59,6 @@ *= require ./checkout_signin *= require ./checkout_payment *= require ./checkout_order - *= require ./genreSelector *= require ./sessionList *= require ./searchResults *= require ./clientUpdate diff --git a/web/app/views/clients/_musician_search_filter.html.slim b/web/app/views/clients/_musician_search_filter.html.slim index b02a4da41..e0b28b332 100644 --- a/web/app/views/clients/_musician_search_filter.html.slim +++ b/web/app/views/clients/_musician_search_filter.html.slim @@ -1,8 +1,13 @@ .content-body-scroller div#musician-search-filter-builder.content-wrapper h2 search musicians - a#btn-perform-musician-search.button-grey href="#" SEARCH + div#musician-search-filter-header + a#btn-perform-musician-search.button-grey href="#" SEARCH div#musician-search-filter-builder-form + div#musician-search-filter-builder-results + + div#musician-search-filter-results.content-wrapper + h2 search musicians script#template-musician-search-filter type="text/template" .field @@ -61,3 +66,54 @@ script#template-search-filter-setup-genres type="text/template" script#template-search-filter-setup-ages type="text/template" tr td {description} + +/! Session Row Template +script#template-search-musician-row type="text/template" + .profile-band-list-result.musician-list-result data-musician-id="{musician_id}" + .f11 data-hint="container" + .left.musician-avatar + /! avatar + .avatar-small + img src="{avatar_url}" / + .left.musician-info + .first-row data-hint="top-row" + .musician-profile + .result-name musician_name + .result-location musician_location + #result_instruments.instruments.nowrap.mt10 instruments + .musician-stats + span.friend-count + | {friend_count} + img align="absmiddle" alt="friends" height="12" src="../assets/content/icon_friend.png" style="margin-right:4px;" width="14" / + span.follower-count + | {follow_count} + img align="absmiddle" alt="followers" height="12" src="../assets/content/icon_followers.png" style="margin-right:4px;" width="22" / + span.recording-count + | {recording_count} + img align="absmiddle" alt="recordings" height="13" src="../assets/content/icon_recordings.png" style="margin-right:4px;" width="12" / + span.session-count + | {session_count} + img align="absmiddle" alt="sessions" height="12" src="../assets/content/icon_session_tiny.png" style="margin-right:4px;" width="12" / + br clear="both" / + .left.musician-latency + .latency-help + | Your latency + br>/ + | to {musician_first_name} is: + .latency-holder + | {latency_badge} + br clear="both" / + .button-row data-hint="button-row" + .biography biography + .result-list-button-wrapper data-musician-id="{musician_id}" + | {musician_action_template} + br clear="both" / + + +script#template-search-musician-action-btns type="text/template" + a.button-orange.smallbutton href="{profile_url}" PROFILE + - if current_user && current_user.musician? + a.smallbutton.search-m-friend class="{friend_class}" href="#" {friend_caption} + a.smallbutton.search-m-follow class="{follow_class}" href="#" {follow_caption} + a.smallbutton.search-m-message class="{message_class}" href="#" {message_caption" + .clearall