358 lines
12 KiB
JavaScript
358 lines
12 KiB
JavaScript
(function(context,$) {
|
|
|
|
"use strict";
|
|
|
|
context.JK = context.JK || {};
|
|
context.JK.BandProfileScreen = function(app) {
|
|
var logger = context.JK.logger;
|
|
var bandId;
|
|
var band = {};
|
|
|
|
function beforeShow(data) {
|
|
bandId = data.id;
|
|
}
|
|
|
|
function afterShow(data) {
|
|
resetForm();
|
|
events();
|
|
renderActive();
|
|
}
|
|
|
|
function resetForm() {
|
|
$('#band-profile-instruments').empty();
|
|
|
|
$('#band-profile-about').show();
|
|
$('#band-profile-history').hide();
|
|
$('#band-profile-members').hide();
|
|
$('#band-profile-social').hide();
|
|
|
|
$('.band-profile-nav a.active').removeClass('active');
|
|
$('.band-profile-nav a.#band-profile-about-link').addClass('active');
|
|
}
|
|
|
|
/****************** MAIN PORTION OF SCREEN *****************/
|
|
|
|
function addFollowing() {
|
|
var newFollowing = {};
|
|
newFollowing.band_id = userId;
|
|
|
|
var url = "/api/users/" + context.JK.currentUserId + "/band_followings";
|
|
$.ajax({
|
|
type: "POST",
|
|
dataType: "json",
|
|
contentType: 'application/json',
|
|
url: url,
|
|
data: JSON.stringify(newFollowing),
|
|
processData: false,
|
|
success: function(response) {
|
|
renderActive(); // refresh stats
|
|
configureFollowingButton(true);
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
}
|
|
|
|
function removeFollowing(bandId) {
|
|
var following = {};
|
|
following.band_id = id;
|
|
|
|
var url = "/api/users/" + context.JK.currentUserId + "/followings";
|
|
$.ajax({
|
|
type: "DELETE",
|
|
dataType: "json",
|
|
contentType: 'application/json',
|
|
url: url,
|
|
data: JSON.stringify(following),
|
|
processData: false,
|
|
success: function(response) {
|
|
renderActive(); // refresh stats
|
|
configureBandFollowingButton(id);
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
}
|
|
|
|
function isFollowing() {
|
|
var alreadyFollowing = false;
|
|
|
|
var url = "/api/users/" + context.JK.currentUserId + "/band_followings/" + bandId;
|
|
$.ajax({
|
|
type: "GET",
|
|
dataType: "json",
|
|
url: url,
|
|
async: false,
|
|
processData: false,
|
|
success: function(response) {
|
|
if (response.id !== undefined) {
|
|
alreadyFollowing = true;
|
|
}
|
|
else {
|
|
alreadyFollowing = false;
|
|
}
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
|
|
return alreadyFollowing;
|
|
}
|
|
|
|
function configureFollowingButton(following, bandId) {
|
|
var $btnFollowBand = $('div[band-id=' + bandId + ']', '#profile-bands').find('#btn-follow-band');
|
|
$btnFollowBand.unbind("click");
|
|
|
|
if (following) {
|
|
$btnFollowBand.text('UN-FOLLOW');
|
|
$btnFollowBand.click(function() {
|
|
removeFollowing(true, bandId);
|
|
});
|
|
}
|
|
else {
|
|
$btnFollowBand.text('FOLLOW');
|
|
$btnFollowBand.click(addBandFollowing);
|
|
}
|
|
}
|
|
|
|
// refreshes the currently active tab
|
|
function renderActive() {
|
|
if ($('#band-profile-about-link').hasClass('active')) {
|
|
renderAbout();
|
|
}
|
|
else if ($('#band-profile-history-link').hasClass('active')) {
|
|
renderHistory();
|
|
}
|
|
else if ($('#band-profile-members-link').hasClass('active')) {
|
|
renderMembers();
|
|
}
|
|
else if ($('#band-profile-social-link').hasClass('active')) {
|
|
renderSocial();
|
|
}
|
|
}
|
|
|
|
/****************** ABOUT TAB *****************/
|
|
function renderAbout() {
|
|
|
|
$('#band-profile-about').show();
|
|
$('#band-profile-history').hide();
|
|
$('#band-profile-members').hide();
|
|
$('#band-profile-social').hide();
|
|
|
|
$('.band-profile-nav a.active').removeClass('active');
|
|
$('.band-profile-nav a.#band-profile-about-link').addClass('active');
|
|
|
|
bindAbout();
|
|
}
|
|
|
|
function bindAbout() {
|
|
var url = "/api/bands/" + bandId;
|
|
$.ajax({
|
|
type: "GET",
|
|
dataType: "json",
|
|
url: url,
|
|
async: false,
|
|
processData:false,
|
|
success: function(response) {
|
|
band = response;
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
|
|
if (band) {
|
|
|
|
// name
|
|
$('#band-profile-name').html(band.name);
|
|
|
|
// avatar
|
|
$('#band-profile-avatar').attr('src', context.JK.resolveAvatarUrl(band.photo_url));
|
|
|
|
// instruments
|
|
// if (user.instruments) {
|
|
// for (var i=0; i < user.instruments.length; i++) {
|
|
// var instrument = user.instruments[i];
|
|
// var description = instrument.instrument_id;
|
|
// var proficiency = instrument.proficiency_level;
|
|
// var instrument_icon_url = context.JK.getInstrumentIcon45(description);
|
|
|
|
// // add instrument info to layout
|
|
// var template = $('#template-profile-instruments').html();
|
|
// var instrumentHtml = context.JK.fillTemplate(template, {
|
|
// instrument_logo_url: instrument_icon_url,
|
|
// instrument_description: description,
|
|
// proficiency_level: proficiencyDescriptionMap[proficiency],
|
|
// proficiency_level_css: proficiencyCssMap[proficiency]
|
|
// });
|
|
|
|
// $('#profile-instruments').append(instrumentHtml);
|
|
// }
|
|
// }
|
|
|
|
// location
|
|
$('#band-profile-location').html(band.location);
|
|
|
|
// stats
|
|
var text = band.follower_count > 1 || band.follower_count == 0 ? " Followers" : " Follower";
|
|
$('#band-profile-follower-stats').html(band.follower_count + text);
|
|
|
|
text = band.session_count > 1 || band.session_count == 0 ? " Sessions" : " Session";
|
|
$('#band-profile-session-stats').html(band.session_count + text);
|
|
|
|
text = band.recording_count > 1 || band.recording_count == 0 ? " Recordings" : " Recording";
|
|
$('#band-profile-recording-stats').html(band.recording_count + text);
|
|
|
|
$('#band-profile-biography').html(band.biography);
|
|
}
|
|
else {
|
|
|
|
}
|
|
}
|
|
|
|
/****************** SOCIAL TAB *****************/
|
|
function renderSocial() {
|
|
$('#profile-social-friends').empty();
|
|
$('#profile-social-followings').empty();
|
|
$('#profile-social-followers').empty();
|
|
|
|
$('#profile-about').hide();
|
|
$('#profile-history').hide();
|
|
$('#profile-bands').hide();
|
|
$('#profile-social').show();
|
|
$('#profile-favorites').hide();
|
|
|
|
$('.profile-nav a.active').removeClass('active');
|
|
$('.profile-nav a.#profile-social-link').addClass('active');
|
|
|
|
bindSocial();
|
|
}
|
|
|
|
function bindSocial() {
|
|
// FOLLOWERS
|
|
url = "/api/users/" + userId + "/followers";
|
|
$.ajax({
|
|
type: "GET",
|
|
dataType: "json",
|
|
url: url,
|
|
async: false,
|
|
processData:false,
|
|
success: function(response) {
|
|
$.each(response, function(index, val) {
|
|
var template = $('#template-band-profile-social').html();
|
|
var followerHtml = context.JK.fillTemplate(template, {
|
|
avatar_url: context.JK.resolveAvatarUrl(val.photo_url),
|
|
userName: val.name,
|
|
location: val.location
|
|
});
|
|
|
|
$('#profile-social-followers').append(followerHtml);
|
|
});
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
}
|
|
|
|
/****************** HISTORY TAB *****************/
|
|
function renderHistory() {
|
|
$('#profile-about').hide();
|
|
$('#profile-history').show();
|
|
$('#profile-bands').hide();
|
|
$('#profile-social').hide();
|
|
$('#profile-favorites').hide();
|
|
|
|
$('.profile-nav a.active').removeClass('active');
|
|
$('.profile-nav a.#profile-history-link').addClass('active');
|
|
|
|
bindHistory();
|
|
}
|
|
|
|
function bindHistory() {
|
|
|
|
}
|
|
|
|
/****************** BANDS TAB *****************/
|
|
function renderMembers() {
|
|
$('#band-profile-members').empty();
|
|
|
|
$('#band-profile-about').hide();
|
|
$('#band-profile-history').hide();
|
|
$('#band-profile-members').show();
|
|
$('#band-profile-social').hide();
|
|
|
|
$('.band-profile-nav a.active').removeClass('active');
|
|
$('.band-profile-nav a.#band-profile-bands-link').addClass('active');
|
|
|
|
bindMembers();
|
|
}
|
|
|
|
function bindMembers() {
|
|
var url = "/api/bands/" + bandId + "/musicians";
|
|
$.ajax({
|
|
type: "GET",
|
|
dataType: "json",
|
|
url: url,
|
|
async: false,
|
|
processData:false,
|
|
success: function(response) {
|
|
$.each(response, function(index, val) {
|
|
var template = $('#template-band-profile-members').html();
|
|
var bandHtml = context.JK.fillTemplate(template, {
|
|
bandId: val.id,
|
|
band_url: "/#/bandProfile/" + val.id,
|
|
avatar_url: context.JK.resolveAvatarUrl(val.logo_url),
|
|
name: val.name,
|
|
location: val.location,
|
|
genres: formatGenres(val.genres)
|
|
});
|
|
|
|
$('#profile-bands').append(bandHtml);
|
|
|
|
// wire up Band Follow button click handler
|
|
var following = isFollowingBand(val.id);
|
|
configureBandFollowingButton(following, val.id);
|
|
});
|
|
},
|
|
error: app.ajaxError
|
|
});
|
|
}
|
|
|
|
function formatGenres(genres) {
|
|
var formattedGenres = '';
|
|
if (genres) {
|
|
for (var i=0; i < genres.length; i++) {
|
|
var genre = genres[i];
|
|
formattedGenres += genre.description;
|
|
if (i < genres.length -1) {
|
|
formattedGenres += ', ';
|
|
}
|
|
}
|
|
}
|
|
return formattedGenres;
|
|
}
|
|
|
|
// events for main screen
|
|
function events() {
|
|
// wire up panel clicks
|
|
$('#band-profile-about-link').click(renderAbout);
|
|
$('#band-profile-history-link').click(renderHistory);
|
|
$('#band-profile-bands-link').click(renderBands);
|
|
$('#band-profile-social-link').click(renderSocial);
|
|
$('#band-profile-favorites-link').click(renderFavorites);
|
|
|
|
// wire up Follow click
|
|
var following = isFollowing();
|
|
configureFollowingButton(following);
|
|
}
|
|
|
|
function initialize() {
|
|
var screenBindings = {
|
|
'beforeShow': beforeShow,
|
|
'afterShow': afterShow
|
|
};
|
|
app.bindScreen('profile', screenBindings);
|
|
}
|
|
|
|
|
|
this.initialize = initialize;
|
|
this.beforeShow = beforeShow;
|
|
this.afterShow = afterShow;
|
|
return this;
|
|
};
|
|
|
|
})(window,jQuery); |