VRFS-2701 VRFS-2923 bug fixes on musician profile enhancements / genre selector dialog

This commit is contained in:
Brian Smith 2015-03-19 02:50:49 -04:00
parent 82f35e221f
commit 299caa5b59
14 changed files with 176 additions and 83 deletions

View File

@ -8,8 +8,6 @@
var logger = context.JK.logger;
var EVENTS = context.JK.EVENTS;
var api = context.JK.Rest();
var userId;
var user = {};
var $screen = $('#account-profile-experience');
var $scroller = $screen.find('#account-profile-content-scroller');
var $instrumentSelector = null;
@ -17,7 +15,6 @@
var profileUtils = context.JK.ProfileUtils;
function beforeShow(data) {
userId = data.id;
}
function afterShow(data) {

View File

@ -137,15 +137,23 @@
// Column 3 - misc (play commitment, rates, cowriting purpose)
$virtualBandCommitment.val(userDetail.virtual_band_commitment);
context.JK.dropdown($virtualBandCommitment);
$traditionalBandCommitment.val(userDetail.traditional_band_commitment);
context.JK.dropdown($traditionalBandCommitment);
$traditionalTouringOption.val(userDetail.traditional_band_touring ? '1' : '0');
context.JK.dropdown($traditionalTouringOption);
$hourlyRate.val(userDetail.paid_sessions_hourly_rate);
$dailyRate.val(userDetail.paid_sessions_daily_rate);
$cowritingPurpose.val(userDetail.cowriting_purpose);
context.JK.dropdown($cowritingPurpose);
}
function bindGenreSelector($btnSelect, $genreList) {
$btnSelect.click(function(evt) {
function bindGenreSelector(type, $btnSelect, $genreList) {
$btnSelect.unbind('click').click(function(evt) {
evt.stopPropagation();
var genreText = $genreList.html();
var genres = [];
@ -153,7 +161,7 @@
genres = genreText.split(GENRE_LIST_DELIMITER);
}
ui.launchGenreSelectorDialog(genres, function(selectedGenres) {
ui.launchGenreSelectorDialog(type, genres, function(selectedGenres) {
$genreList.html(selectedGenres && selectedGenres.length > 0 ? selectedGenres.join(GENRE_LIST_DELIMITER) : NONE_SPECIFIED);
});
});
@ -161,17 +169,19 @@
function events() {
bindGenreSelector($btnVirtualBandGenreSelect, $virtualBandGenreList);
bindGenreSelector($btnTraditionalBandGenreSelect, $traditionalBandGenreList);
bindGenreSelector($btnPaidSessionsGenreSelect, $paidSessionsGenreList);
bindGenreSelector($btnFreeSessionsGenreSelect, $freeSessionsGenreList);
bindGenreSelector($btnCowritingGenreSelect, $cowritingGenreList);
bindGenreSelector('virtual bands', $btnVirtualBandGenreSelect, $virtualBandGenreList);
bindGenreSelector('traditional bands', $btnTraditionalBandGenreSelect, $traditionalBandGenreList);
bindGenreSelector('paid sessions', $btnPaidSessionsGenreSelect, $paidSessionsGenreList);
bindGenreSelector('free sessions', $btnFreeSessionsGenreSelect, $freeSessionsGenreList);
bindGenreSelector('co-writing', $btnCowritingGenreSelect, $cowritingGenreList);
$btnCancel.on('click', function(evt) { evt.stopPropagation(); navigateTo('/client#/profile/' + context.JK.currentUserId); return false; } );
$btnBack.on('click', function(evt) { evt.stopPropagation(); navigateTo('/client#/account/profile/experience'); return false; } );
$btnSubmit.on('click', function(evt) { evt.stopPropagation(); handleUpdateProfile(); return false; } );
context.JK.dropdown($('select', $screen));
context.JK.dropdown($virtualBandCommitment);
context.JK.dropdown($traditionalBandCommitment);
context.JK.dropdown($cowritingPurpose);
}
function renderInterests() {

View File

@ -2,19 +2,50 @@
"use strict";
context.JK = context.JK || {};
context.JK.GenreSelectorDialog = function(app, genres, callback) {
context.JK.GenreSelectorDialog = function(app, type, genres, callback) {
var logger = context.JK.logger;
var rest = context.JK.Rest();
var $dialog = null;
var dialogId = 'genre-selector-dialog';
var $screen = $('#' + dialogId);
var $btnSelect = $screen.find(".btn-select-genres");
var $instructions = $screen.find('#instructions');
var $genres = $screen.find('.genres');
var GENRES_PER_COLUMN = 12;
function beforeShow(data) {
}
function afterShow(data) {
var genreList = context.JK.genres;
$genres.empty();
if (genreList) {
var columns = genreList.length / GENRES_PER_COLUMN;
columns = Math.floor((genreList.length % GENRES_PER_COLUMN) === 0 ? columns : columns + 1);
var columnWidthPct = 100/columns;
$.each(genreList, function(index, val) {
if (index === 0 || index % GENRES_PER_COLUMN === 0) {
$genres.append('<div class="left" style="width:"' + columnWidthPct + '%;"><table>');
}
$genres.append('<tr>');
var checked = '';
if (genres && $.inArray(val.id, genres) > -1) {
checked = 'checked';
}
$genres.append('<td><input type="checkbox" value="' + val.id + '" ' + checked + ' />' + val.description + '</td>');
$genres.append('</tr>');
if (index === genreList.length-1 || (index+1) % GENRES_PER_COLUMN === 0) {
$genres.append('</table></div>')
}
});
}
}
function afterHide() {
@ -25,7 +56,20 @@
}
function events() {
$btnSelect.click(function(evt) {
var selectedGenres = [];
$genres.find('input[type=checkbox]:checked').each(function(index) {
selectedGenres.push($(this).val());
});
if (callback) {
callback(selectedGenres);
}
app.layout.closeDialog(dialogId);
});
}
function initialize() {
@ -35,7 +79,9 @@
'afterHide': afterHide
};
app.bindDialog('genre-selector-dialog', dialogBindings);
app.bindDialog(dialogId, dialogBindings);
$instructions.html('Select one or more genres for ' + type + ':');
events();
}

View File

@ -680,13 +680,13 @@
$paidGigSection.show();
var genreList = profileUtils.paidSessionGenreList(user.genres);
$paidGigDetails.find("ul li:nth-child(1)").append(genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT);
$paidGigDetails.find("ul li:nth-child(1)").html('Genre(s): ' + (genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT));
var hourlyRate = user.paid_sessions_hourly_rate;
$paidGigDetails.find("ul li:nth-child(2)").append(hourlyRate ? hourlyRate : NOT_SPECIFIED_TEXT);
$paidGigDetails.find("ul li:nth-child(2)").html('Hourly rate = ' + (hourlyRate ? hourlyRate : NOT_SPECIFIED_TEXT));
var dailyRate = user.paid_sessions_daily_rate;
$paidGigDetails.find("ul li:nth-child(3)").append(dailyRate ? dailyRate : NOT_SPECIFIED_TEXT);
$paidGigDetails.find("ul li:nth-child(3)").html('Day rate = ' + (dailyRate ? dailyRate : NOT_SPECIFIED_TEXT));
}
else {
$paidGigSection.hide();
@ -697,7 +697,7 @@
$freeGigSection.show();
var genreList = profileUtils.freeSessionGenreList(user.genres);
$freeGigDetails.find("ul li:nth-child(1)").append(genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT);
$freeGigDetails.find("ul li:nth-child(1)").html('Genre(s): ' + (genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT));
}
else {
$freeGigSection.hide();
@ -708,10 +708,10 @@
$cowritingSection.show();
var genreList = profileUtils.cowritingGenreList(user.genres);
$cowritingDetails.find("ul li:nth-child(1)").append(genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT);
$cowritingDetails.find("ul li:nth-child(1)").html('Genre(s): ' + (genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT));
var purpose = user.cowriting_purpose;
$cowritingDetails.find("ul li:nth-child(2)").append(purpose ? profileUtils.cowritingPurposeMap[purpose] : NOT_SPECIFIED_TEXT);
$cowritingDetails.find("ul li:nth-child(2)").html('Purpose: ' + (purpose ? profileUtils.cowritingPurposeMap[purpose] : NOT_SPECIFIED_TEXT));
}
else {
$cowritingSection.hide();
@ -722,14 +722,14 @@
$traditionalBandSection.show();
var genreList = profileUtils.traditionalBandGenreList(user.genres);
$traditionalBandDetails.find("ul li:nth-child(1)").append(genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT);
$traditionalBandDetails.find("ul li:nth-child(1)").html('Genre(s): ' + (genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT));
var commitment = user.traditional_band_commitment;
$traditionalBandDetails.find("ul li:nth-child(2)").append(commitment ? profileUtils.bandCommitmentMap[commitment] : NOT_SPECIFIED_TEXT);
$traditionalBandDetails.find("ul li:nth-child(2)").html('Commitment: ' + (commitment ? profileUtils.bandCommitmentMap[commitment] : NOT_SPECIFIED_TEXT));
var canTour = user.traditional_band_touring;
var canTourResponse = canTour ? "Yes" : (canTour === false ? "No" : NOT_SPECIFIED_TEXT);
$traditionalBandDetails.find("ul li:nth-child(3)").append(canTourResponse);
$traditionalBandDetails.find("ul li:nth-child(3)").html('Touring: ' + canTourResponse);
}
else {
$traditionalBandSection.hide();
@ -740,10 +740,10 @@
$virtualBandSection.show();
var genreList = profileUtils.virtualBandGenreList(user.genres);
$virtualBandDetails.find("ul li:nth-child(1)").append(genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT);
$virtualBandDetails.find("ul li:nth-child(1)").html('Genre(s): ' + (genreList.length > 0 ? genreList : NOT_SPECIFIED_TEXT));
var commitment = user.virtual_band_commitment;
$virtualBandDetails.find("ul li:nth-child(2)").append(commitment ? profileUtils.bandCommitmentMap[commitment] : NOT_SPECIFIED_TEXT);
$virtualBandDetails.find("ul li:nth-child(2)").html('Commitment: ' + (commitment ? profileUtils.bandCommitmentMap[commitment] : NOT_SPECIFIED_TEXT));
}
else {
$virtualBandSection.hide();

View File

@ -62,8 +62,8 @@
});
}
function launchGenreSelectorDialog(genres, callback) {
var genreSelectorDialog = new JK.GenreSelectorDialog(JK.app, genres, callback);
function launchGenreSelectorDialog(type, genres, callback) {
var genreSelectorDialog = new JK.GenreSelectorDialog(JK.app, type, genres, callback);
genreSelectorDialog.initialize();
return genreSelectorDialog.showDialog();
}

View File

@ -7,6 +7,7 @@
context.JK = context.JK || {};
var logger = context.JK.logger;
var api = context.JK.Rest();
var AUDIO_DEVICE_BEHAVIOR = context.JK.AUDIO_DEVICE_BEHAVIOR;
var ALERT_NAMES = context.JK.ALERT_NAMES;
@ -22,6 +23,10 @@
var os = null;
context.JK.getGenreList = function() {
return api.getGenres();
}
context.JK.stringToBool = function (s) {
switch (s.toLowerCase()) {
case "true":

View File

@ -9,6 +9,25 @@
padding:0;
}
}
div.logo {
text-align: bottom;
}
img.logo {
margin-right: 20px;
}
ul {
margin:0px 0px 10px 0px;
padding:0px;
}
li {
margin-left: 15px;
margin-bottom: 0px !important;
list-style: disc;
}
}
.profile-head {

View File

@ -44,10 +44,10 @@
<div class="field left w35">
<label>Play Commitment</label>
<select id="virtual-band-commitment" name="virtual_band_commitment">
<option value='1'>infrequent</option>
<option value='2'>once a week</option>
<option value='3'>2-3 times a week</option>
<option value='4'>4+ times a week</option>
<option value="1">infrequent</option>
<option value="2">once a week</option>
<option value="3">2-3 times a week</option>
<option value="4">4+ times a week</option>
</select>
</div>
</div>
@ -83,10 +83,10 @@
<div class="field left w15">
<label>Play Commitment</label>
<select id="traditional-band-commitment" name="traditional_band_commitment">
<option value='1'>infrequent</option>
<option value='2'>once a week</option>
<option value='3'>2-3 times a week</option>
<option value='4'>4+ times a week</option>
<option value="1">infrequent</option>
<option value="2">once a week</option>
<option value="3">2-3 times a week</option>
<option value="4">4+ times a week</option>
</select>
</div>
@ -198,8 +198,8 @@
<div class="field left w35">
<label>Purpose</label>
<select id="cowriting-purpose" name="cowriting_purpose">
<option value='2'>sell music</option>
<option value='1'>just for fun</option>
<option value='2'>sell music</option>
</select>
</div>
</div>

View File

@ -101,60 +101,62 @@
<br clear="all" />
<div id="no-samples" class="left">None specified</div>
<div id="jamkazam-samples" class="left">
<img src="/assets/header/logo.png" width="120" height="30" /><br/>
<div id="jamkazam-samples" class="left logo">
<img src="/assets/header/logo.png" class="logo" /><br/>
</div>
<div id="soundcloud-samples" class="left">
<img src="/assets/header/logo.png" width="120" height="30" /><br/>
<div id="soundcloud-samples" class="left logo">
<img src="/assets/content/soundcloud-logo.png" class="logo" /><br/>
</div>
<div id="youtube-samples" class="left">
<img src="/assets/header/logo.png" width="120" height="30" /><br/>
<div id="youtube-samples" class="left logo">
<img src="/assets/content/youtube-logo.png" class="logo" /><br/>
</div>
<br clear="all" />
<div><a href="/client#/account/profile" class="add-recordings">Add Recordings</a></div>
<div><a href="/client#/account/profile/samples" class="add-recordings">Add Recordings</a></div>
<br clear="all" />
<br clear="all" />
<div class="section-header">Online Presence</div>
<br clear="all" />
<div id="no-online-presence" class="left">None specified</div>
<div id="user-website" class="left">
<a rel="external"><img src="/assets/content/website-logo.png" /></a>
<div id="user-website" class="left logo">
<a rel="external"><img src="/assets/content/website-logo.png" class="logo" /></a>
</div>
<div id="soundcloud-presence" class="left">
<a rel="external"><img src="/assets/content/soundcloud-logo.png" /></a>
<div id="soundcloud-presence" class="left logo">
<a rel="external"><img src="/assets/content/soundcloud-logo.png" class="logo" /></a>
</div>
<div id="reverbnation-presence" class="left">
<a rel="external"><img src="/assets/content/reverbnation-logo.png" /></a>
<div id="reverbnation-presence" class="left logo">
<a rel="external"><img src="/assets/content/reverbnation-logo.png" class="logo" /></a>
</div>
<div id="bandcamp-presence" class="left">
<a rel="external"><img src="/assets/content/bandcamp-logo.png" /></a>
<div id="bandcamp-presence" class="left logo">
<a rel="external"><img src="/assets/content/bandcamp-logo.png" class="logo" /></a>
</div>
<div id="fandalism-presence" class="left">
<a rel="external"><img src="/assets/content/fandalism-logo.png" /></a>
<div id="fandalism-presence" class="left logo">
<a rel="external"><img src="/assets/content/fandalism-logo.png" class="logo" /></a>
</div>
<div id="youtube-presence" class="left">
<a rel="external"><img src="/assets/content/youtube-logo.png" /></a>
<div id="youtube-presence" class="left logo">
<a rel="external"><img src="/assets/content/youtube-logo.png" class="logo" /></a>
</div>
<div id="facebook-presence" class="left">
<a rel="external"><img src="/assets/content/facebook-logo.png" /></a>
<div id="facebook-presence" class="left logo">
<a rel="external"><img src="/assets/content/facebook-logo.png" class="logo" /></a>
</div>
<div id="twitter-presence" class="left">
<a rel="external"><img src="/assets/content/twitter-logo.png" /></a>
<div id="twitter-presence" class="left logo">
<a rel="external"><img src="/assets/content/twitter-logo.png" class="logo" /></a>
</div>
<br clear="all" />
<div><a href="/client#/account/profile" class="add-sites">Add Sites</a></div>
<div><a href="/client#/account/profile/samples" class="add-sites">Add Sites</a></div>
<br clear="all" />
<br clear="all" />
<div class="section-header">Current Interests</div>
@ -162,34 +164,34 @@
<div id="no-interests" class="left">None specified</div>
<div id="paid-gigs">
<div class="left profile-details">I'm interested in playing paid gigs</div>
<div class="left">I'm interested in playing paid gigs</div>
<br clear="all" />
<div id="paid-gig-details">
<ul>
<li>Genre(s): </li>
<li>Hourly rate = </li>
<li>Day rate = </li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
<div id="free-gigs">
<div class="left profile-details">I'm interested in playing free gigs</div>
<div class="left">I'm interested in playing free gigs</div>
<br clear="all" />
<div id="free-gig-details">
<ul>
<li>Genre(s): </li>
<li></li>
</ul>
</div>
</div>
<div id="cowriting">
<div class="left profile-details">Concert Gigs:</div>
<div class="left">I'm interested in co-writing:</div>
<br clear="all" />
<div id="cowriting-details">
<ul>
<li>Genre(s): </li>
<li>Purpose: </li>
<li></li>
<li></li>
</ul>
</div>
</div>
@ -199,29 +201,26 @@
<br clear="all" />
<div id="traditional-band-details">
<ul>
<li>Genre(s): </li>
<li>Commitment: </li>
<li>Touring: </li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
<br clear="all" />
<div><a href="/client#/account/profile" class="add-interests">Add Interests</a></div>
<div><a href="/client#/account/profile/interests" class="add-interests">Add Interests</a></div>
<div id="virtual-band">
<div class="left profile-details">I'm interested in forming virtual band(s)</div>
<div class="left">I'm interested in forming virtual band(s)</div>
<br clear="all" />
<div id="virtual-band-details">
<ul>
<li>Genre(s): </li>
<li>Commitment: </li>
<li></li>
<li></li>
</ul>
</div>
</div>
<br clear="all" />
<br clear="all" />
</div>
</div>
</div>

View File

@ -136,6 +136,9 @@
// This is a helper class with a singleton. No need to instantiate.
JK.GenreSelectorHelper.initialize(JK.app);
JK.getGenreList().done(function(genres) {
JK.genres = genres;
});
var recordingManager = new JK.RecordingManager(JK.app);
var acceptFriendRequestDialog = new JK.AcceptFriendRequestDialog(JK.app);

View File

@ -1,11 +1,14 @@
.dialog.dialog-overlay-sm{layout: 'dialog', 'layout-id' => 'genre-selector-dialog', id: 'genre-selector-dialog'}
.content-head
= image_tag "content/icon_friend.png", {:width => 14, :height => 14, :class => 'content-icon' }
= image_tag "content/icon_checkmark_circle.png", {:width => 20, :height => 20, :class => 'content-icon' }
%h1
= 'select genre'
.dialog-inner
= 'TESTING'
%span{id: 'instructions'}
%br{:clear => "all"}/
%br{:clear => "all"}/
.genres
.right.action-buttons
%a.button-grey.btn-cancel-dialog{href:'#', 'layout-action' => 'cancel'} CANCEL
%a.button-orange.btn-select-genres{href:'#'} SELECT
%a.button-grey.btn-cancel-dialog{'layout-action' => 'cancel'} CANCEL
%a.button-orange.btn-select-genres SELECT

View File

@ -64,6 +64,10 @@
JK.currentUserAvatarUrl = null;
JK.currentUserName = null;
<% end %>
JK.getGenreList().done(function(genres) {
JK.genres = genres;
});
})
</script>

View File

@ -75,6 +75,9 @@
<% end %>
JK.app = JK.JamKazam();
JK.getGenreList().done(function(genres) {
JK.genres = genres;
});
JK.app.initialize({inClient: false, layoutOpts: {layoutFooter: false, sizeOverlayToContent: true}});
})

View File

@ -116,6 +116,10 @@
JK.bindHoverEvents();
JK.getGenreList().done(function(genres) {
JK.genres = genres;
});
JK.JamServer.connect() // singleton here defined in JamServer.js
.done(function() {
console.log("websocket connected")