* mid-progress jcrop

This commit is contained in:
Seth Call 2013-05-23 08:56:33 -05:00
commit 02be07b308
18 changed files with 1303 additions and 936 deletions

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,219 @@
(function(context,$) {
"use strict";
context.JK = context.JK || {};
context.JK.AddTrackDialog = function(app, myTracks, sessionId, sessionModel) {
var logger = context.JK.logger;
var myTrackCount = myTracks.length;
var ASSIGNMENT = {
CHAT: -2,
OUTPUT: -1,
UNASSIGNED: 0,
TRACK1: 1,
TRACK2: 2
};
var VOICE_CHAT = {
CHAT: "0",
SESSION: "1",
MIC: "2"
};
var instrument_array = [];
var instrument_map = {
"Acoustic Guitar": { "client_id": 10, "server_id": "acoustic guitar" },
"Bass Guitar": { "client_id": 20, "server_id": "bass guitar" },
"Computer": { "client_id": 30, "server_id": "computer" },
"Drums": { "client_id": 40, "server_id": "drums" },
"Electric Guitar": { "client_id": 50, "server_id": "electric guitar" },
"Keyboard": { "client_id": 60, "server_id": "keyboard" },
"Voice": { "client_id": 70, "server_id": "voice" },
"Flute": { "client_id": 80, "server_id": "flute" },
"Clarinet": { "client_id": 90, "server_id": "clarinet" },
"Saxophone": { "client_id": 100, "server_id": "saxophone" },
"Trumpet": { "client_id": 110, "server_id": "trumpet" },
"Violin": { "client_id": 120, "server_id": "violin" },
"Trombone": { "client_id": 130, "server_id": "trombone" },
"Banjo": { "client_id": 140, "server_id": "banjo" },
"Harmonica": { "client_id": 150, "server_id": "harmonica" },
"Accordion": { "client_id": 160, "server_id": "accordion" },
"French Horn": { "client_id": 170, "server_id": "french horn" },
"Euphonium": { "client_id": 180, "server_id": "euphonium" },
"Tuba": { "client_id": 190, "server_id": "tuba" },
"Oboe": { "client_id": 200, "server_id": "oboe" },
"Ukulele": { "client_id": 210, "server_id": "ukulele" },
"Cello": { "client_id": 220, "server_id": "cello" },
"Viola": { "client_id": 230, "server_id": "viola" },
"Mandolin": { "client_id": 240, "server_id": "mandolin" },
"Other": { "client_id": 250, "server_id": "other" }
};
// dialog variables
var unusedAudioInputChannels = [];
var track2AudioInputChannels = [];
function events() {
// Track 2 Add
$('#img-add-track2-input-add').click(function() {
$('#add-track2-unused > option:selected').remove().appendTo('#add-track2-input');
});
// Track 2 Remove
$('#img-add-track2-input-remove').click(function() {
$('#add-track2-input > option:selected').remove().appendTo('#add-track2-unused');
});
$('#btn-cancel-new-audio').click(showOverlay);
$('#btn-error-ok').click(showOverlay);
$('#btn-add-track').click(saveSettings);
$('#btn-leave-session-test').click(function() {
$('div[layout-id="add-track"]').hide();
});
}
// TODO: figure out how to handle this in layout.js for layered popups
function showOverlay() {
$('.dialog-overlay').show();
}
function hideOverlay() {
$('.dialog-overlay').hide();
}
function showDialog() {
$('#add-track2-input').empty();
$('#add-track2-instrument').empty();
initDialogData();
// load Unused Inputs
context.JK.loadOptions($('#template-option').html(), $('#add-track2-unused'), unusedAudioInputChannels, "device_id", "name", -1);
// load Track 2 Input(s)
context.JK.loadOptions($('#template-option').html(), $('#add-track2-input'), track2AudioInputChannels, "device_id", "name", -1);
// load Track 2 Instrument
context.JK.loadOptions($('#template-option').html(), $('#add-track2-instrument'), instrument_array, "id", "description", -1);
}
function initDialogData() {
// clear out arrays
unusedAudioInputChannels = [];
track2AudioInputChannels = [];
// get data needed for listboxes
var channels = context.jamClient.TrackGetChannels();
$.each(channels, function(index, val) {
var assignment = context.jamClient.TrackGetAssignment(val.id, val.input);
logger.debug("channel id=" + val.id + ", channel input=" + val.input + ", channel assignment=" + assignment +
", channel name=" + val.name + ", channel type=" + val.device_type + ", chat=" + val.chat);
// INPUT
if (context.jamClient.TrackIsMusicDeviceType(val.device_type)) {
if (val.input) {
if (assignment === ASSIGNMENT.UNASSIGNED) {
if (!val.chat) {
unusedAudioInputChannels.push(val);
}
}
}
}
});
}
function saveSettings() {
if (!validateSettings()) {
return;
}
saveTrack();
$('div[layout-id="add-track"]').hide();
hideOverlay();
// refresh Session screen
sessionModel.refreshCurrentSession();
}
function saveTrack() {
// TRACK 2 INPUTS
$("#add-track2-input > option").each(function() {
logger.debug("Saving track 2 input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.TRACK2);
});
// TRACK 2 INSTRUMENT
var instrumentVal = $('#add-track2-instrument').val();
var instrumentText = $('#add-track2-instrument > option:selected').text().toLowerCase();
logger.debug("Saving track 2 instrument = " + instrumentVal);
context.jamClient.TrackSetInstrument(ASSIGNMENT.TRACK2, instrumentVal);
// UPDATE SERVER
logger.debug("Adding track with instrument " + instrumentText);
var data = {};
// use the first track's connection_id (not sure why we need this on the track data model)
logger.debug("myTracks[0].connection_id=" + myTracks[0].connection_id);
data.connection_id = myTracks[0].connection_id;
data.instrument_id = instrumentText;
data.sound = "stereo";
sessionModel.addTrack(sessionId, data);
context.jamClient.TrackSaveAssignments();
}
function validateSettings() {
var isValid = true;
var noTrackErrMsg = 'You must assign at least one input port to each of your tracks. Please update your settings to correct this. If you want to delete a track, please return to the session screen and delete the track by clicking the "x" box in the upper right-hand corner of the track.';
var noInstrumentErrMsg = 'You must specify what instrument is being played for each track. Please update your settings to correct this.';
var errMsg;
// verify Input and Instrument exist
if ($('#add-track2-input > option').size() === 0 || $('#add-track2-input > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
if (isValid && $('#add-track2-instrument > option:selected').length === 0) {
errMsg = noInstrumentErrMsg;
isValid = false;
}
if (!isValid) {
context.JK.showErrorDialog(app, errMsg);
}
return isValid;
}
// TODO: repeated in configureTrack.js
function _init() {
// load instrument array for populating listboxes, using client_id in instrument_map as ID
context.JK.getInstruments(app, function(instruments) {
$.each(instruments, function(index, val) {
instrument_array.push({"id": instrument_map[val.description].client_id, "description": val.description});
});
});
}
this.initialize = function() {
events();
_init();
};
this.showDialog = showDialog;
return this;
};
})(window,jQuery);

View File

@ -0,0 +1,736 @@
(function(context,$) {
"use strict";
context.JK = context.JK || {};
context.JK.ConfigureTrackDialog = function(app, myTracks, sessionId, sessionModel) {
var logger = context.JK.logger;
var myTrackCount = myTracks.length;
var ASSIGNMENT = {
CHAT: -2,
OUTPUT: -1,
UNASSIGNED: 0,
TRACK1: 1,
TRACK2: 2
};
var VOICE_CHAT = {
CHAT: "0",
SESSION: "1",
MIC: "2"
};
var instrument_array = [];
var instrument_map = {
"Acoustic Guitar": { "client_id": 10, "server_id": "acoustic guitar" },
"Bass Guitar": { "client_id": 20, "server_id": "bass guitar" },
"Computer": { "client_id": 30, "server_id": "computer" },
"Drums": { "client_id": 40, "server_id": "drums" },
"Electric Guitar": { "client_id": 50, "server_id": "electric guitar" },
"Keyboard": { "client_id": 60, "server_id": "keyboard" },
"Voice": { "client_id": 70, "server_id": "voice" },
"Flute": { "client_id": 80, "server_id": "flute" },
"Clarinet": { "client_id": 90, "server_id": "clarinet" },
"Saxophone": { "client_id": 100, "server_id": "saxophone" },
"Trumpet": { "client_id": 110, "server_id": "trumpet" },
"Violin": { "client_id": 120, "server_id": "violin" },
"Trombone": { "client_id": 130, "server_id": "trombone" },
"Banjo": { "client_id": 140, "server_id": "banjo" },
"Harmonica": { "client_id": 150, "server_id": "harmonica" },
"Accordion": { "client_id": 160, "server_id": "accordion" },
"French Horn": { "client_id": 170, "server_id": "french horn" },
"Euphonium": { "client_id": 180, "server_id": "euphonium" },
"Tuba": { "client_id": 190, "server_id": "tuba" },
"Oboe": { "client_id": 200, "server_id": "oboe" },
"Ukulele": { "client_id": 210, "server_id": "ukulele" },
"Cello": { "client_id": 220, "server_id": "cello" },
"Viola": { "client_id": 230, "server_id": "viola" },
"Mandolin": { "client_id": 240, "server_id": "mandolin" },
"Other": { "client_id": 250, "server_id": "other" }
};
// dialog variables
var unusedAudioInputChannels = [];
var track1AudioInputChannels = [];
var track2AudioInputChannels = [];
var unusedAudioOutputChannels = [];
var usedAudioOutputChannels = [];
var unusedChatInputChannels = [];
var usedChatInputChannels = [];
var removedAudioChannels = {};
var removedVoiceChatChannels = {};
var devices = [];
var originalDeviceId;
var originalVoiceChat;
var currentVoiceChat;
var configure_audio_instructions = {
"Win32": "Choose the driver to use for audio and check its settings. Then use arrow " +
"buttons to assign audio inputs to your tracks, to indicate what instrument you are playing on " +
"each track, and to assign audio outputs for listening. If you don't see an audio device you think " +
"should be listed, view this help topic to understand why.",
"MacOSX": "Use arrow buttons to assign audio inputs to your tracks, to indicate what " +
"instrument you are playing on each track, and to assign audio outputs for listening. If you don't " +
"see an audio device you think should be listed, view this help topic to understand why.",
"Unix": "Use arrow buttons to assign audio inputs to your tracks, to indicate what " +
"instrument you are playing on each track, and to assign audio outputs for listening. If you don't " +
"see an audio device you think should be listed, view this help topic to understand why."
};
var configure_voice_instructions = "If you are using a microphone to capture your instrumental or vocal audio, you can simply use that mic " +
"for both music and chat. Otherwise, choose a device to use for voice chat, and use arrow buttons to " +
"select an input on that device.";
function toggleTrack2ConfigDetails(visible) {
if (visible) {
$('#track2-arrows-div').show();
$('#track2-input-div').show();
$('#track2-instrument-div').show();
$('#track1-input').height('70px');
$('#track1-instrument').height('70px');
}
else {
$('#track2-arrows-div').hide();
$('#track2-input-div').hide();
$('#track2-instrument-div').hide();
$('#track1-input').height('145px');
$('#track1-instrument').height('145px');
}
}
function events() {
$('#tab-configure-audio').click(function() {
// validate voice chat settings
if (validateVoiceChatSettings(true)) {
showMusicAudioPanel(false);
}
});
$('#tab-configure-voice').click(function() {
// validate audio settings
if (validateAudioSettings(true)) {
showVoiceChatPanel(false);
}
});
// Track 1 Add
$('#img-track1-input-add').click(function() {
// REMOVE FROM VOICE CHAT UNUSED IF NECESSARY
syncVoiceChatDialog();
$('#audio-inputs-unused > option:selected').remove().appendTo('#track1-input');
});
// Track 1 Remove
$('#img-track1-input-remove').click(function() {
// ADD TO VOICE CHAT UNUSED IF NECESSARY
$("#track1-input > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#track1-input > option[value="' + deviceId + '"]').length > 0) {
if (removedVoiceChatChannels[deviceId]) {
restoreVoiceChatOptions(deviceId);
}
}
$(this).remove().appendTo('#audio-inputs-unused');
});
});
// Track 2 Add
$('#img-track2-input-add').click(function() {
// REMOVE FROM VOICE CHAT UNUSED IF NECESSARY
syncVoiceChatDialog();
$('#audio-inputs-unused > option:selected').remove().appendTo('#track2-input');
});
// Track 2 Remove
$('#img-track2-input-remove').click(function() {
// ADD TO VOICE CHAT UNUSED IF NECESSARY
$("#track2-input > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#track2-input > option[value="' + deviceId + '"]').length > 0) {
restoreVoiceChatOptions(deviceId);
}
$(this).remove().appendTo('#audio-inputs-unused');
});
});
// Audio Output Add
$('#img-audio-output-add').click(function() {
$('#audio-output-unused > option:selected').remove().appendTo('#audio-output-selection');
});
// Audio Output Remove
$('#img-audio-output-remove').click(function() {
$('#audio-output-selection > option:selected').remove().appendTo('#audio-output-unused');
});
// Voice Chat Add
$('#img-voice-input-add').click(function() {
// REMOVE FROM AUDIO UNUSED IF NECESSARY
syncMusicAudioDialog();
$('#voice-inputs-unused > option:selected').remove().appendTo('#voice-inputs-selection');
});
$('#img-voice-input-remove').click(function() {
// ADD TO AUDIO UNUSED IF NECESSARY
$("#voice-inputs-selection > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#voice-inputs-selection > option[value="' + deviceId + '"]').length > 0) {
if (removedAudioChannels[deviceId]) {
logger.debug("Adding " + deviceId + " to Music Audio Unused");
var option = '<option value="' + deviceId + '">' + description + '</option>';
$('#audio-inputs-unused').append(option);
delete removedAudioChannels[deviceId];
}
$('#voice-inputs-unused > option[value="' + deviceId + '"]').remove();
}
$(this).remove().appendTo('#voice-inputs-unused');
});
});
$('.voicechat-settings').click(function() {
// call this to initialize Music Audio tab
showMusicAudioPanel(true);
showVoiceChatPanel(true);
});
$('#audio-drivers').change(function() {
audioDriverChanged();
});
$('#voice-chat-device').change(function() {
voiceChatChanged();
});
$('#btn-driver-settings').click(function() {
logger.debug("Opening control panel...");
context.jamClient.TrackOpenControlPanel();
});
$('#btn-cancel-new-audio').click(showOverlay);
$('#btn-error-ok').click(showOverlay);
$('#btn-save-settings').click(saveSettings);
$('#btn-cancel-settings').click(cancelSettings);
$('#btn-leave-session-test').click(function() {
$('div[layout-id="configure-audio"]').hide();
});
}
function restoreVoiceChatOptions(deviceId) {
logger.debug("Adding " + deviceId + " to Voice Chat Unused");
$('#voice-inputs-unused').append(removedVoiceChatChannels[deviceId]);
delete removedVoiceChatChannels[deviceId];
syncVoiceChatDialog();
}
function syncVoiceChatDialog() {
$("#audio-inputs-unused option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#voice-inputs-unused > option[value="' + deviceId + '"]').length > 0) {
logger.debug("Removing " + deviceId + " from Voice Chat Unused");
$('#voice-inputs-unused > option[value="' + deviceId + '"]').remove();
var option = '<option value="' + deviceId + '">' + description + '</option>';
removedVoiceChatChannels[deviceId] = option;
}
});
// remove Session Audio option from voice chat if none are available
if ($('#voice-inputs-unused > option').size() === 0) {
logger.debug('Removing Option 1 from Voice Chat dropdown.');
$('#voice-chat-device > option[value="1"]').remove();
}
else {
if ($('#voice-chat-device > option[value="1"]').length === 0) {
logger.debug('Adding Option 1 back to Voice Chat dropdown.');
$('#voice-chat-device').prepend('<option value="1">Use an input on my session audio device for chat</option>');
}
}
}
function syncMusicAudioDialog() {
$("#voice-inputs-unused > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#audio-inputs-unused > option[value="' + deviceId + '"]').length > 0) {
logger.debug("Removing " + deviceId + " from Music Audio Unused");
$('#audio-inputs-unused > option[value="' + deviceId + '"]').remove();
var option = '<option value="' + deviceId + '">' + description + '</option>';
removedAudioChannels[deviceId] = option;
}
});
}
// TODO: figure out how to handle this in layout.js for layered popups
function showOverlay() {
$('.dialog-overlay').show();
}
function hideOverlay() {
$('.dialog-overlay').hide();
}
function audioDriverChanged() {
// ensure any channels removed are restored
var keys = Object.keys(removedVoiceChatChannels);
for (var i=0; i < keys.length; i++) {
restoreVoiceChatOptions(keys[i]);
}
context.jamClient.TrackSetMusicDevice($('#audio-drivers').val());
// refresh dialog
showMusicAudioPanel(true);
}
function voiceChatChanged() {
// ensure any channels removed are restored
var keys = Object.keys(removedAudioChannels);
for (var i=0; i < keys.length; i++) {
$('#audio-inputs-unused').append(removedAudioChannels[keys[i]]);
delete removedAudioChannels[keys[i]];
}
showVoiceChatPanel(true);
}
function configureDriverSettingsButton() {
if (context.jamClient.TrackHasControlPanel()) {
logger.debug("Showing DRIVER SETTINGS button...");
$('#btn-driver-settings').show();
}
else {
logger.debug("Hiding DRIVER SETTINGS button...");
$('#btn-driver-settings').hide();
}
}
function showMusicAudioPanel(refreshLists) {
_setInstructions('audio');
$('div[tab-id="music-audio"]').show();
$('div[tab-id="voice-chat"]').hide();
$('#tab-configure-audio').addClass('selected');
$('#tab-configure-voice').removeClass('selected');
if (refreshLists) {
configureDriverSettingsButton();
$('#audio-drivers').empty();
// determine correct music device to preselect
var deviceId = context.jamClient.TrackGetMusicDeviceID();
logger.debug("deviceId = " + deviceId);
// load Audio Driver dropdown
devices = context.jamClient.TrackGetDevices();
var keys = Object.keys(devices);
for (var i=0; i < keys.length; i++) {
var template = $('#template-option').html();
var isSelected = "";
if (keys[i] === deviceId) {
isSelected = "selected";
}
var html = context.JK.fillTemplate(template, {
value: keys[i],
label: devices[keys[i]],
selected: isSelected
});
$('#audio-drivers').append(html);
}
$('#audio-inputs-unused').empty();
$('#track1-input').empty();
$('#track1-instrument').empty();
$('#track2-input').empty();
$('#track2-instrument').empty();
$('#audio-output-unused').empty();
$('#audio-output-selection').empty();
initDialogData();
// filter out any channels already used on the Voice Chat tab
var musicAudioOptions = [];
$.each(unusedAudioInputChannels, function(index, val) {
var deviceId = val.device_id;
// verify the device is not already used on track 1 or 2
if ($('#voice-inputs-selection > option[value="' + deviceId + '"]').length === 0) {
logger.debug("Adding " + val.device_id + " to Music Audio.");
musicAudioOptions.push(val);
}
});
// load Unused Inputs
context.JK.loadOptions($('#template-option').html(), $('#audio-inputs-unused'), musicAudioOptions, "device_id", "name", -1);
// load Track 1 Input(s)
context.JK.loadOptions($('#template-option').html(), $('#track1-input'), track1AudioInputChannels, "device_id", "name", -1);
// load Track 1 Instrument
var current_instrument = context.jamClient.TrackGetInstrument(1);
context.JK.loadOptions($('#template-option').html(), $('#track1-instrument'), instrument_array, "id", "description", current_instrument);
// load Track 2 config details if necessary
if (myTrackCount > 1) {
// load Track 2 Input(s)
context.JK.loadOptions($('#template-option').html(), $('#track2-input'), track2AudioInputChannels, "device_id", "name", -1);
// load Track 2 Instrument
current_instrument = context.jamClient.TrackGetInstrument(2);
context.JK.loadOptions($('#template-option').html(), $('#track2-instrument'), instrument_array, "id", "description", current_instrument);
}
// load Unused Outputs
context.JK.loadOptions($('#template-option').html(), $('#audio-output-unused'), unusedAudioOutputChannels, "device_id", "name", -1);
// load Session Audio Output
context.JK.loadOptions($('#template-option').html(), $('#audio-output-selection'), usedAudioOutputChannels, "device_id", "name", -1);
}
}
function showVoiceChatPanel(refreshLists) {
_setInstructions('voice');
$('div[tab-id="music-audio"]').hide();
$('div[tab-id="voice-chat"]').show();
$('#tab-configure-audio').removeClass('selected');
$('#tab-configure-voice').addClass('selected');
if (refreshLists) {
$('#voice-inputs-unused').empty();
$('#voice-inputs-selection').empty();
initDialogData();
var chatOption = $('#voice-chat-device').val();
// populate with unused session inputs
var voiceChatOptions = [];
$.each(unusedAudioInputChannels, function(index, val) {
var deviceId = val.device_id;
// verify the device is not already used on track 1 or 2
if ($('#track1-input > option[value="' + deviceId + '"]').length === 0 &&
$('#track2-input > option[value="' + deviceId + '"]').length === 0) {
voiceChatOptions.push(val);
}
});
if (chatOption === VOICE_CHAT.SESSION) {
context.JK.loadOptions($('#template-option').html(), $('#voice-inputs-unused'), voiceChatOptions, "device_id", "name", -1);
context.JK.loadOptions($('#template-option').html(), $('#voice-inputs-selection'), usedChatInputChannels, "device_id", "name", -1);
}
// populate with voice devices
else if (chatOption === VOICE_CHAT.CHAT) {
context.JK.loadOptions($('#template-option').html(), $('#voice-inputs-unused'), unusedChatInputChannels, "device_id", "name", -1);
context.JK.loadOptions($('#template-option').html(), $('#voice-inputs-selection'), usedChatInputChannels, "device_id", "name", -1);
}
// disable inputs
else if (chatOption === VOICE_CHAT.MIC) {
}
}
}
function initDialogData() {
// clear out arrays
unusedAudioInputChannels = [];
track1AudioInputChannels = [];
track2AudioInputChannels = [];
unusedAudioOutputChannels = [];
usedAudioOutputChannels = [];
unusedChatInputChannels = [];
usedChatInputChannels = [];
// get data needed for listboxes
var channels = context.jamClient.TrackGetChannels();
$.each(channels, function(index, val) {
var assignment = context.jamClient.TrackGetAssignment(val.id, val.input);
logger.debug("channel id=" + val.id + ", channel input=" + val.input + ", channel assignment=" + assignment +
", channel name=" + val.name + ", channel type=" + val.device_type + ", chat=" + val.chat);
// INPUT
if (context.jamClient.TrackIsMusicDeviceType(val.device_type)) {
if (val.input) {
if (assignment === ASSIGNMENT.CHAT) {
usedChatInputChannels.push(val);
}
else if (assignment === ASSIGNMENT.UNASSIGNED) {
if (!val.chat) {
unusedAudioInputChannels.push(val);
}
else {
unusedChatInputChannels.push(val);
}
}
else if (assignment === ASSIGNMENT.OUTPUT) {
}
else {
if (assignment === ASSIGNMENT.TRACK1) {
track1AudioInputChannels.push(val);
}
else if (assignment === ASSIGNMENT.TRACK2) {
track2AudioInputChannels.push(val);
}
}
}
// OUTPUT
else {
if (assignment === ASSIGNMENT.CHAT) {
}
else if (assignment === ASSIGNMENT.UNASSIGNED) {
if (!val.chat) {
unusedAudioOutputChannels.push(val);
}
}
else if (assignment === ASSIGNMENT.OUTPUT) {
}
else {
}
}
}
});
}
function saveSettings() {
if (!validateAudioSettings(false)) {
return;
}
if (!validateVoiceChatSettings(false)) {
return;
}
saveAudioSettings();
saveVoiceChatSettings();
originalDeviceId = $('#audio-drivers').val();
$('div[layout-id="configure-audio"]').hide();
hideOverlay();
// refresh Session screen
sessionModel.refreshCurrentSession();
}
function saveAudioSettings() {
// TRACK 1 INPUTS
$("#track1-input > option").each(function() {
logger.debug("Saving track 1 input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.TRACK1);
});
// TRACK 1 INSTRUMENT
var instrumentVal = $('#track1-instrument').val();
var instrumentText = $('#track1-instrument > option:selected').text().toLowerCase();
logger.debug("Saving track 1 instrument = " + instrumentVal);
context.jamClient.TrackSetInstrument(ASSIGNMENT.TRACK1, instrumentVal);
// UPDATE SERVER
logger.debug("Updating track " + myTracks[0].trackId + " with instrument " + instrumentText);
var data = {};
data.instrument_id = instrumentText;
sessionModel.updateTrack(sessionId, myTracks[0].trackId, data);
if (myTrackCount > 1) {
// TRACK 2 INPUTS
$("#track2-input > option").each(function() {
logger.debug("Saving track 2 input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.TRACK2);
});
// TRACK 2 INSTRUMENT
instrumentVal = $('#track2-instrument').val();
instrumentText = $('#track2-instrument > option:selected').text().toLowerCase();
logger.debug("Saving track 2 instrument = " + instrumentVal);
context.jamClient.TrackSetInstrument(ASSIGNMENT.TRACK2, instrumentVal);
// UPDATE SERVER
logger.debug("Updating track " + myTracks[1].trackId + " with instrument " + instrumentText);
data.instrument_id = instrumentText;
sessionModel.updateTrack(myTracks[1].trackId, sessionId, data);
}
// OUTPUT
$("#audio-output-selection > option").each(function() {
logger.debug("Saving session audio output = " + this.value);
context.jamClient.TrackSetAssignment(this.value, false, ASSIGNMENT.OUTPUT);
});
context.jamClient.TrackSaveAssignments();
}
function saveVoiceChatSettings() {
currentVoiceChat = $('#voice-chat-device').val();
logger.debug("Calling TrackSetChatUsesMusic with value = " + currentVoiceChat);
context.jamClient.TrackSetChatUsesMusic(currentVoiceChat);
$("#voice-inputs-selection > option").each(function() {
logger.debug("Saving chat input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.CHAT);
});
}
function cancelSettings() {
// reset to original device ID
context.jamClient.TrackSetMusicDevice(originalDeviceId);
// reset voice chat option to original
$('#voice-chat-device').val(originalVoiceChat);
}
function validateAudioSettings(allowEmptyInput) {
var isValid = true;
var noTrackErrMsg = 'You must assign at least one input port to each of your tracks. Please update your settings to correct this. If you want to delete a track, please return to the session screen and delete the track by clicking the "x" box in the upper right-hand corner of the track.';
var noInstrumentErrMsg = 'You must specify what instrument is being played for each track. Please update your settings to correct this.';
var outputErrMsg = 'You must assign two output ports for stereo session audio to hear music. Please update your settings to correct this.';
var errMsg;
// if there are no inputs remaining then allow the user to switch to the Voice Chat tab
// to remove some
if (allowEmptyInput && $('#audio-inputs-unused > option').size() === 0) {
return isValid;
}
else {
// verify Track 1 Input and Instrument exist
if ($('#track1-input > option').size() === 0 || $('#track1-input > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
if (isValid) {
if ($('#track1-instrument > option:selected').length === 0) {
errMsg = noInstrumentErrMsg;
isValid = false;
}
}
// if Track 2 exists, verify Input and Instrument exist
if (isValid && myTrackCount > 1) {
if ($('#track2-input > option').size() === 0 || $('#track2-input > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
if (isValid && $('#track2-instrument > option:selected').length === 0) {
errMsg = noInstrumentErrMsg;
isValid = false;
}
}
// verify Session Audio Output exists
if (isValid && $('#audio-output-selection > option').size() !== 2) {
errMsg = outputErrMsg;
isValid = false;
}
if (!isValid) {
context.JK.showErrorDialog(app, errMsg);
}
}
return isValid;
}
function validateVoiceChatSettings(allowEmptyInput) {
var isValid = true;
var noTrackErrMsg = 'You must select a voice input.';
var errMsg;
if (allowEmptyInput && $('#voice-inputs-unused > option').size() === 0) {
return isValid;
}
else {
currentVoiceChat = $('#voice-chat-device').val();
if (currentVoiceChat === VOICE_CHAT.SESSION || currentVoiceChat === VOICE_CHAT.CHAT) {
if ($('#voice-inputs-selection > option').size() === 0 || $('#voice-inputs-selection > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
}
else if (currentVoiceChat === VOICE_CHAT.MIC) {
// NO VALIDATION NEEDED
}
if (!isValid) {
context.JK.showErrorDialog(app, errMsg);
}
}
return isValid;
}
function _setInstructions(type) {
if (type === 'audio') {
var os = context.jamClient.GetOSAsString();
$('#instructions', 'div[layout-id="configure-audio"]').html(configure_audio_instructions[os]);
}
else if (type === 'voice') {
$('#instructions', 'div[layout-id="configure-audio"]').html(configure_voice_instructions);
}
}
function _init() {
// load instrument array for populating listboxes, using client_id in instrument_map as ID
context.JK.getInstruments(app, function(instruments) {
$.each(instruments, function(index, val) {
instrument_array.push({"id": instrument_map[val.description].client_id, "description": val.description});
});
});
originalVoiceChat = context.jamClient.TrackGetChatUsesMusic();
$('#voice-chat-device').val(originalVoiceChat);
originalDeviceId = context.jamClient.TrackGetMusicDeviceID();
}
this.initialize = function() {
events();
_init();
toggleTrack2ConfigDetails(myTrackCount > 1);
};
this.showMusicAudioPanel = showMusicAudioPanel;
this.showVoiceChatPanel = showVoiceChatPanel;
return this;
};
})(window,jQuery);

View File

@ -200,14 +200,14 @@
// But we'll just build a list of names and fake it
var devices = [
"M-Audio FW Audiophile: FW AP 1/2",
"M-Audio FW Audiophile: FW AP 1/2"
//"M-Audio FW Audiophile: FW Multi 1/2",
//"M-Audio FW Audiophile: FW SPDIF 1/2",
"Realtek High Definition Audio: Realtek HD Digital",
//"Realtek High Definition Audio: Realtek HD Digital",
// "Realtek High Definition Audio: Realtek HD Line",
// "Realtek High Definition Audio: Realtek HD Audio Mic",
// "Realtek High Definition Audio: Realtek HD Audio Stereo",
"WebCamDV WDM Audio Capture: WebCamDV Audio"
//"WebCamDV WDM Audio Capture: WebCamDV Audio"
];
var suffixes = [ " - Left", " - Right", " - Left", " - Right"];
var lefts = [true, false, true, false];

View File

@ -3,6 +3,7 @@
"use strict";
context.JK = context.JK || {};
var logger = context.JK.logger;
context.JK.HomeScreen = function(app) {
function events() {
@ -12,6 +13,9 @@
$('.homecard').on('mouseleave', function() {
$(this).removeClass('hover');
});
$('.profile').on('click', function() {
context.location = '#/profile/' + context.JK.currentUserId;
})
}
this.initialize = function() {

View File

@ -90,11 +90,11 @@
this.getCities = getCities;
this.getRegions = getRegions;
this.getIsps = getIsps;
this.getInstruments = getInstruments
this.getPhotoUrl = getPhotoUrl;
//this.getInstruments = getInstruments
return this;
};
})(window,jQuery);
})(window,jQuery);

View File

@ -2,6 +2,18 @@
"use strict";
// Change underscore's default templating characters as they
// conflict withe the ERB rendering. Templates will use:
// {{ interpolate }}
// {% evaluate %}
// {{- escape }}
//
context._.templateSettings = {
evaluate : /\{%([\s\S]+?)%\}/g,
interpolate : /\{\{([\s\S]+?)\}\}/g,
escape : /\{\{-([\s\S]+?)\}\}/g
};
context.JK = context.JK || {};
var JamKazam = context.JK.JamKazam = function() {

View File

@ -10,69 +10,9 @@
var tracks = {};
var myTracks = [];
var mixers = [];
var myTrackCount = 0;
var ASSIGNMENT = {
CHAT: -2,
OUTPUT: -1,
UNASSIGNED: 0,
TRACK1: 1,
TRACK2: 2
};
var VOICE_CHAT = {
CHAT: "0",
SESSION: "1",
MIC: "2"
};
var instrument_array = [];
var instrument_map = {
"Acoustic Guitar": { "client_id": 10, "server_id": "acoustic guitar" },
"Bass Guitar": { "client_id": 20, "server_id": "bass guitar" },
"Computer": { "client_id": 30, "server_id": "computer" },
"Drums": { "client_id": 40, "server_id": "drums" },
"Electric Guitar": { "client_id": 50, "server_id": "electric guitar" },
"Keyboard": { "client_id": 60, "server_id": "keyboard" },
"Voice": { "client_id": 70, "server_id": "voice" },
"Flute": { "client_id": 80, "server_id": "flute" },
"Clarinet": { "client_id": 90, "server_id": "clarinet" },
"Saxophone": { "client_id": 100, "server_id": "saxophone" },
"Trumpet": { "client_id": 110, "server_id": "trumpet" },
"Violin": { "client_id": 120, "server_id": "violin" },
"Trombone": { "client_id": 130, "server_id": "trombone" },
"Banjo": { "client_id": 140, "server_id": "banjo" },
"Harmonica": { "client_id": 150, "server_id": "harmonica" },
"Accordion": { "client_id": 160, "server_id": "accordion" },
"French Horn": { "client_id": 170, "server_id": "french horn" },
"Euphonium": { "client_id": 180, "server_id": "euphonium" },
"Tuba": { "client_id": 190, "server_id": "tuba" },
"Oboe": { "client_id": 200, "server_id": "oboe" },
"Ukulele": { "client_id": 210, "server_id": "ukulele" },
"Cello": { "client_id": 220, "server_id": "cello" },
"Viola": { "client_id": 230, "server_id": "viola" },
"Mandolin": { "client_id": 240, "server_id": "mandolin" }
};
// dialog variables
var unusedAudioInputChannels = [];
var track1AudioInputChannels = [];
var track2AudioInputChannels = [];
var unusedAudioOutputChannels = [];
var usedAudioOutputChannels = [];
var unusedChatInputChannels = [];
var usedChatInputChannels = [];
var removedAudioChannels = {};
var removedVoiceChatChannels = {};
var devices = [];
var originalDeviceId;
var originalVoiceChat;
var currentVoiceChat;
var configureTrackDialog;
var addTrackDialog;
// TODO Consolidate dragged controls and handles
var $draggingFaderHandle = null;
@ -89,25 +29,6 @@
var lookingForMixersTimer = null;
var lookingForMixers = {};
var configure_audio_instructions = {
"Win32": "Choose the driver to use for audio and check its settings. Then use arrow " +
"buttons to assign audio inputs to your tracks, to indicate what instrument you are playing on " +
"each track, and to assign audio outputs for listening. If you don't see an audio device you think " +
"should be listed, view this help topic to understand why.",
"MacOSX": "Use arrow buttons to assign audio inputs to your tracks, to indicate what " +
"instrument you are playing on each track, and to assign audio outputs for listening. If you don't " +
"see an audio device you think should be listed, view this help topic to understand why.",
"Unix": "Use arrow buttons to assign audio inputs to your tracks, to indicate what " +
"instrument you are playing on each track, and to assign audio outputs for listening. If you don't " +
"see an audio device you think should be listed, view this help topic to understand why."
};
var configure_voice_instructions = "If you are using a microphone to capture your instrumental or vocal audio, you can simply use that mic " +
"for both music and chat. Otherwise, choose a device to use for voice chat, and use arrow buttons to " +
"select an input on that device.";
var defaultParticipant = {
tracks: [{
instrument_id: "unknown"
@ -157,18 +78,6 @@
}
}
checkForCurrentUser();
// load instrument array for populating listboxes, using client_id in instrument_map as ID
var instruments = context.JK.getInstruments(app, function(instruments) {
$.each(instruments, function(index, val) {
instrument_array.push({"id": instrument_map[val.description].client_id, "description": val.description});
});
});
originalVoiceChat = context.jamClient.TrackGetChatUsesMusic();
$('#voice-chat-device').val(originalVoiceChat);
originalDeviceId = context.jamClient.TrackGetMusicDeviceID();
}
function afterCurrentUserLoaded() {
@ -199,8 +108,12 @@
_wireTopVolume();
_wireTopMix();
_addVoiceChat();
_initDialogs();
}
toggleTrack2ConfigDetails(myTrackCount > 1);
function _initDialogs() {
configureTrackDialog.initialize();
addTrackDialog.initialize();
}
// Get the latest list of underlying audio mixer channels
@ -291,7 +204,6 @@
function _renderTracks() {
myTracks = [];
myTrackCount = 0;
// Participants are here now, but the mixers don't update right away.
// Draw tracks from participants, then setup timers to look for the
@ -314,6 +226,7 @@
// Default trackData to participant + no Mixer state.
var trackData = {
trackId: track.id,
connection_id: track.connection_id,
clientId: participant.client_id,
name: name,
instrumentIcon: instrumentIcon,
@ -348,35 +261,30 @@
lookingForMixersTimer = context.setInterval(lookForMixers, 300);
}
}
_addTrack(trackData);
_addTrack(index, trackData);
// Show settings icons only for my tracks
if (myTrack) {
$('div[mixer-id="' + mixer.id + '"].track-icon-settings').show();
// myTrackCount++;
// myTracks.push(trackData);
}
myTrackCount++;
// TODO: FIX THIS
myTracks.push(trackData);
});
});
}
function toggleTrack2ConfigDetails(visible) {
if (visible) {
$('#track2-arrows-div').show();
$('#track2-input-div').show();
$('#track2-instrument-div').show();
configureTrackDialog = new context.JK.ConfigureTrackDialog(app, myTracks, sessionId, sessionModel);
addTrackDialog = new context.JK.AddTrackDialog(app, myTracks, sessionId, sessionModel);
$('#track1-input').height('70px');
$('#track1-instrument').height('70px');
// hide "Add Track" link if there are 2 tracks
if (myTracks.length === 2) {
$('#div-add-track').hide();
}
else {
$('#track2-arrows-div').hide();
$('#track2-input-div').hide();
$('#track2-instrument-div').hide();
$('#track1-input').height('145px');
$('#track1-instrument').height('145px');
$('#div-add-track').show();
$('#div-add-track').click(function() {
addTrackDialog.showDialog();
});
}
}
@ -461,7 +369,7 @@
}
}
function _addTrack(trackData) {
function _addTrack(index, trackData) {
var $destination = $('#session-mytracks-container');
if (trackData.clientId !== app.clientId) {
$destination = $('#session-livetracks-container');
@ -471,10 +379,19 @@
var template = $('#template-session-track').html();
var newTrack = context.JK.fillTemplate(template, trackData);
$destination.append(newTrack);
var $closeButton = $('#div-track-close', 'div[track-id="' + trackData.trackId + '"]');
if (index === 0) {
$closeButton.hide();
}
else {
$closeButton.click(deleteTrack);
}
$('div[mixer-id="' + trackData.mixerId + '"].track-icon-settings').click(function() {
// call this to initialize Voice Chat tab
showVoiceChatPanel(true);
showMusicAudioPanel(true);
configureTrackDialog.showVoiceChatPanel(true);
configureTrackDialog.showMusicAudioPanel(true);
});
tracks[trackData.trackId] = new context.JK.SessionTrack(trackData.clientId);
}
@ -531,6 +448,11 @@
}
}
function deleteTrack(evt) {
var trackId = $(evt.currentTarget).attr("track-id");
sessionModel.deleteTrack(trackId);
}
function _toggleVisualMuteControl($control, muting) {
if (muting) {
$control.removeClass('enabled');
@ -762,594 +684,11 @@
$('#voice-chat').on('mousemove', faderMouseMove);
$('body').on('mouseup', faderMouseUp);
$('#tab-configure-audio').click(function() {
// validate voice chat settings
if (validateVoiceChatSettings()) {
showMusicAudioPanel(false);
}
});
$('#tab-configure-voice').click(function() {
// validate audio settings
if (validateAudioSettings()) {
showVoiceChatPanel(false);
}
});
// Track 1 Add
$('#img-track1-input-add').click(function() {
// REMOVE FROM VOICE CHAT UNUSED IF NECESSARY
syncVoiceChatDialog();
$('#audio-inputs-unused > option:selected').remove().appendTo('#track1-input');
});
// Track 1 Remove
$('#img-track1-input-remove').click(function() {
// ADD TO VOICE CHAT UNUSED IF NECESSARY
$("#track1-input > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#track1-input > option[value="' + deviceId + '"]').length > 0) {
if (removedVoiceChatChannels[deviceId]) {
logger.debug("Adding " + deviceId + " to Voice Chat Unused");
$('#voice-inputs-unused').append('<option value="' + deviceId + '">' + description + '</option>');
delete removedVoiceChatChannels[deviceId];
}
}
$(this).remove().appendTo('#audio-inputs-unused');
});
});
// Track 2 Add
$('#img-track2-input-add').click(function() {
// REMOVE FROM VOICE CHAT UNUSED IF NECESSARY
syncVoiceChatDialog();
$('#audio-inputs-unused > option:selected').remove().appendTo('#track2-input');
});
// Track 2 Remove
$('#img-track2-input-remove').click(function() {
// ADD TO VOICE CHAT UNUSED IF NECESSARY
$("#track2-input > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#track2-input > option[value="' + deviceId + '"]').length > 0) {
if (removedVoiceChatChannels[deviceId]) {
logger.debug("Adding " + deviceId + " to Voice Chat Unused");
$('#voice-inputs-unused').append('<option value="' + deviceId + '">' + description + '</option>');
delete removedVoiceChatChannels[deviceId];
}
}
$(this).remove().appendTo('#audio-inputs-unused');
});
});
// Audio Output Add
$('#img-audio-output-add').click(function() {
$('#audio-output-unused > option:selected').remove().appendTo('#audio-output-selection');
});
// Audio Output Remove
$('#img-audio-output-remove').click(function() {
$('#audio-output-selection > option:selected').remove().appendTo('#audio-output-unused');
});
// Voice Chat Add
$('#img-voice-input-add').click(function() {
// REMOVE FROM AUDIO UNUSED IF NECESSARY
syncMusicAudioDialog();
$('#voice-inputs-unused > option:selected').remove().appendTo('#voice-inputs-selection');
});
$('#img-voice-input-remove').click(function() {
// ADD TO AUDIO UNUSED IF NECESSARY
$("#voice-inputs-selection > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#voice-inputs-selection > option[value="' + deviceId + '"]').length > 0) {
if (removedAudioChannels[deviceId]) {
logger.debug("Adding " + deviceId + " to Music Audio Unused");
var option = '<option value="' + deviceId + '">' + description + '</option>';
$('#audio-inputs-unused').append(option);
delete removedAudioChannels[deviceId];
}
$('#voice-inputs-unused > option[value="' + deviceId + '"]').remove();
}
$(this).remove().appendTo('#voice-inputs-unused');
});
});
$('.voicechat-settings').click(function() {
// call this to initialize Music Audio tab
showMusicAudioPanel(true);
showVoiceChatPanel(true);
configureTrackDialog.showMusicAudioPanel(true);
configureTrackDialog.showVoiceChatPanel(true);
});
$('#audio-drivers').change(function() {
audioDriverChanged();
});
$('#voice-chat-device').change(function() {
voiceChatChanged();
});
$('#btn-driver-settings').click(function() {
logger.debug("Opening control panel...");
context.jamClient.TrackOpenControlPanel();
});
$('#btn-cancel-new-audio').click(showOverlay);
$('#btn-error-ok').click(showOverlay);
$('#btn-save-settings').click(saveSettings);
$('#btn-cancel-settings').click(cancelSettings);
$('#btn-leave-session-test').click(function() {
$('div[layout-id="configure-audio"]').hide();
});
}
function syncVoiceChatDialog() {
$("#audio-inputs-unused option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#voice-inputs-unused > option[value="' + deviceId + '"]').length > 0) {
logger.debug("Removing " + deviceId + " from Voice Chat Unused");
$('#voice-inputs-unused > option[value="' + deviceId + '"]').remove();
var option = '<option value="' + deviceId + '">' + description + '</option>';
removedVoiceChatChannels[deviceId] = option;
// TODO: ADD THIS BACK WHEN APPROPRIATE
if ($('#voice-inputs-unused > option').size() === 0) {
$('#voice-chat-device > option[value="1"]').remove();
}
}
});
}
function syncMusicAudioDialog() {
$("#voice-inputs-unused > option:selected").each(function() {
var deviceId = this.value;
var description = this.text;
if ($('#audio-inputs-unused > option[value="' + deviceId + '"]').length > 0) {
logger.debug("Removing " + deviceId + " from Music Audio Unused");
$('#audio-inputs-unused > option[value="' + deviceId + '"]').remove();
var option = '<option value="' + deviceId + '">' + description + '</option>';
removedAudioChannels[deviceId] = option;
}
});
}
// TODO: figure out how to handle this in layout.js for layered popups
function showOverlay() {
$('.dialog-overlay').show();
}
function hideOverlay() {
$('.dialog-overlay').hide();
}
function audioDriverChanged() {
// ensure any channels removed are restored
var keys = Object.keys(removedVoiceChatChannels);
for (var i=0; i < keys.length; i++) {
$('#voice-inputs-unused').append(removedVoiceChatChannels[keys[i]]);
delete removedVoiceChatChannels[keys[i]];
}
context.jamClient.TrackSetMusicDevice($('#audio-drivers').val());
// refresh dialog
showMusicAudioPanel(true);
}
function voiceChatChanged() {
// ensure any channels removed are restored
var keys = Object.keys(removedAudioChannels);
for (var i=0; i < keys.length; i++) {
$('#audio-inputs-unused').append(removedAudioChannels[keys[i]]);
delete removedAudioChannels[keys[i]];
}
showVoiceChatPanel(true);
}
function configureDriverSettingsButton() {
if (context.jamClient.TrackHasControlPanel()) {
logger.debug("Showing DRIVER SETTINGS button...");
$('#btn-driver-settings').show();
}
else {
logger.debug("Hiding DRIVER SETTINGS button...");
$('#btn-driver-settings').hide();
}
}
function showMusicAudioPanel(refreshLists) {
setInstructions('audio');
$('div[tab-id="music-audio"]').show();
$('div[tab-id="voice-chat"]').hide();
$('#tab-configure-audio').addClass('selected');
$('#tab-configure-voice').removeClass('selected');
if (refreshLists) {
configureDriverSettingsButton();
$('#audio-drivers').empty();
// determine correct music device to preselect
var deviceId = context.jamClient.TrackGetMusicDeviceID();
logger.debug("deviceId = " + deviceId);
// load Audio Driver dropdown
devices = context.jamClient.TrackGetDevices();
var keys = Object.keys(devices);
for (var i=0; i < keys.length; i++) {
var template = $('#template-option').html();
var isSelected = "";
if (keys[i] === deviceId) {
isSelected = "selected";
}
var html = context.JK.fillTemplate(template, {
value: keys[i],
label: devices[keys[i]],
selected: isSelected
});
$('#audio-drivers').append(html);
}
$('#audio-inputs-unused').empty();
$('#track1-input').empty();
$('#track1-instrument').empty();
$('#track2-input').empty();
$('#track2-instrument').empty();
$('#audio-output-unused').empty();
$('#audio-output-selection').empty();
initDialogData();
// TODO: FILTER OUT ANY CHANNELS SELECTED ON THE VOICE CHAT TAB
// load Unused Inputs
loadOptions($('#audio-inputs-unused'), unusedAudioInputChannels, "device_id", "name", -1);
// load Track 1 Input(s)
loadOptions($('#track1-input'), track1AudioInputChannels, "device_id", "name", -1);
// load Track 1 Instrument
var current_instrument = context.jamClient.TrackGetInstrument(1);
loadOptions($('#track1-instrument'), instrument_array, "id", "description", current_instrument);
// load Track 2 config details if necessary
if (myTrackCount > 1) {
// load Track 2 Input(s)
loadOptions($('#track2-input'), track2AudioInputChannels, "device_id", "name", -1);
// load Track 2 Instrument
current_instrument = context.jamClient.TrackGetInstrument(2);
loadOptions($('#track2-instrument'), instrument_array, "id", "description", current_instrument);
}
// load Unused Outputs
loadOptions($('#audio-output-unused'), unusedAudioOutputChannels, "device_id", "name", -1);
// load Session Audio Output
loadOptions($('#audio-output-selection'), usedAudioOutputChannels, "device_id", "name", -1);
}
}
function showVoiceChatPanel(refreshLists) {
setInstructions('voice');
$('div[tab-id="music-audio"]').hide();
$('div[tab-id="voice-chat"]').show();
$('#tab-configure-audio').removeClass('selected');
$('#tab-configure-voice').addClass('selected');
if (refreshLists) {
$('#voice-inputs-unused').empty();
$('#voice-inputs-selection').empty();
initDialogData();
var chatOption = $('#voice-chat-device').val();
// populate with unused session inputs
var voiceChatOptions = [];
$.each(unusedAudioInputChannels, function(index, val) {
var deviceId = val.device_id;
if ($('#track1-input > option[value="' + deviceId + '"]').length === 0 &&
$('#track2-input > option[value="' + deviceId + '"]').length === 0) {
voiceChatOptions.push(val);
}
});
if (chatOption === VOICE_CHAT.SESSION) {
loadOptions($('#voice-inputs-unused'), voiceChatOptions, "device_id", "name", -1);
loadOptions($('#voice-inputs-selection'), usedChatInputChannels, "device_id", "name", -1);
}
// populate with voice devices
else if (chatOption === VOICE_CHAT.CHAT) {
loadOptions($('#voice-inputs-unused'), unusedChatInputChannels, "device_id", "name", -1);
loadOptions($('#voice-inputs-selection'), usedChatInputChannels, "device_id", "name", -1);
}
// disable inputs
else if (chatOption === VOICE_CHAT.MIC) {
}
}
}
function initDialogData() {
// clear out arrays
unusedAudioInputChannels = [];
track1AudioInputChannels = [];
track2AudioInputChannels = [];
unusedAudioOutputChannels = [];
usedAudioOutputChannels = [];
unusedChatInputChannels = [];
usedChatInputChannels = [];
// get data needed for listboxes
var channels = context.jamClient.TrackGetChannels();
$.each(channels, function(index, val) {
var assignment = context.jamClient.TrackGetAssignment(val.id, val.input);
logger.debug("channel id=" + val.id + ", channel input=" + val.input + ", channel assignment=" + assignment +
", channel name=" + val.name + ", channel type=" + val.device_type + ", chat=" + val.chat);
// INPUT
if (context.jamClient.TrackIsMusicDeviceType(val.device_type)) {
if (val.input) {
if (assignment === ASSIGNMENT.CHAT) {
usedChatInputChannels.push(val);
}
else if (assignment === ASSIGNMENT.UNASSIGNED) {
if (!val.chat) {
unusedAudioInputChannels.push(val);
}
else {
unusedChatInputChannels.push(val);
}
}
else if (assignment === ASSIGNMENT.OUTPUT) {
}
else {
if (assignment === ASSIGNMENT.TRACK1) {
track1AudioInputChannels.push(val);
}
else if (assignment === ASSIGNMENT.TRACK2) {
track2AudioInputChannels.push(val);
}
}
}
// OUTPUT
else {
if (assignment === ASSIGNMENT.CHAT) {
}
else if (assignment === ASSIGNMENT.UNASSIGNED) {
if (!val.chat) {
unusedAudioOutputChannels.push(val);
}
}
else if (assignment === ASSIGNMENT.OUTPUT) {
}
else {
}
}
}
});
}
function loadOptions(listbox_id, input_array, id_field, text_field, selected_id) {
$.each(input_array, function(index, val) {
var template = $('#template-option').html();
var isSelected = "";
if (val[id_field] === selected_id) {
isSelected = "selected";
}
var html = context.JK.fillTemplate(template, {
value: val[id_field],
label: val[text_field],
selected: isSelected
});
listbox_id.append(html);
});
}
function saveSettings() {
if (!validateAudioSettings()) {
return;
}
if (!validateVoiceChatSettings()) {
return;
}
saveAudioSettings();
saveVoiceChatSettings();
originalDeviceId = $('#audio-drivers').val();
$('div[layout-id="configure-audio"]').hide();
hideOverlay();
// refresh Session screen
sessionModel.refreshCurrentSession();
}
function saveAudioSettings() {
// TRACK 1 INPUTS
$("#track1-input > option").each(function() {
logger.debug("Saving track 1 input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.TRACK1);
});
// TRACK 1 INSTRUMENT
var instrumentVal = $('#track1-instrument').val();
var instrumentText = $('#track1-instrument > option:selected').text().toLowerCase();
logger.debug("Saving track 1 instrument = " + instrumentVal);
context.jamClient.TrackSetInstrument(ASSIGNMENT.TRACK1, instrumentVal);
// UPDATE SERVER
logger.debug("Updating track " + myTracks[0].trackId + " with instrument " + instrumentText);
var data = {};
data.instrument_id = instrumentText;
sessionModel.updateTrack(sessionId, myTracks[0].trackId, data);
if (myTrackCount > 1) {
// TRACK 2 INPUTS
$("#track2-input > option").each(function() {
logger.debug("Saving track 2 input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.TRACK2);
});
// TRACK 2 INSTRUMENT
instrumentVal = $('#track2-instrument').val();
instrumentText = $('#track2-instrument > option:selected').text().toLowerCase();
logger.debug("Saving track 2 instrument = " + instrumentVal);
context.jamClient.TrackSetInstrument(ASSIGNMENT.TRACK2, instrumentVal);
// UPDATE SERVER
logger.debug("Updating track " + myTracks[1].trackId + " with instrument " + instrumentText);
data.instrument_id = instrumentText;
sessionModel.updateTrack(myTracks[1].trackId, sessionId, data);
}
// OUTPUT
$("#audio-output-selection > option").each(function() {
logger.debug("Saving session audio output = " + this.value);
context.jamClient.TrackSetAssignment(this.value, false, ASSIGNMENT.OUTPUT);
});
context.jamClient.TrackSaveAssignments();
}
function saveVoiceChatSettings() {
currentVoiceChat = $('#voice-chat-device').val();
logger.debug("Calling TrackSetChatUsesMusic with value = " + currentVoiceChat);
context.jamClient.TrackSetChatUsesMusic(currentVoiceChat);
$("#voice-inputs-selection > option").each(function() {
logger.debug("Saving chat input = " + this.value);
context.jamClient.TrackSetAssignment(this.value, true, ASSIGNMENT.CHAT);
});
}
function cancelSettings() {
// reset to original device ID
context.jamClient.TrackSetMusicDevice(originalDeviceId);
// reset voice chat option to original
$('#voice-chat-device').val(originalVoiceChat);
}
function validateAudioSettings() {
var isValid = true;
var noTrackErrMsg = 'You must assign at least one input port to each of your tracks. Please update your settings to correct this. If you want to delete a track, please return to the session screen and delete the track by clicking the "x" box in the upper right-hand corner of the track.';
var noInstrumentErrMsg = 'You must specify what instrument is being played for each track. Please update your settings to correct this.';
var outputErrMsg = 'You must assign two output ports for stereo session audio to hear music. Please update your settings to correct this.';
var errMsg;
// verify Track 1 Input and Instrument exist
if ($('#track1-input > option').size() === 0 || $('#track1-input > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
if (isValid) {
if ($('#track1-instrument > option').size() === 0) {
errMsg = noInstrumentErrMsg;
isValid = false;
}
}
// if Track 2 exists, verify Input and Instrument exist
if (isValid && myTrackCount > 1) {
if ($('#track2-input > option').size() === 0 || $('#track2-input > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
if (isValid && $('#track2-instrument > option').size() === 0) {
errMsg = noInstrumentErrMsg;
isValid = false;
}
}
// verify Session Audio Output exists
if (isValid && $('#audio-output-selection > option').size() !== 2) {
errMsg = outputErrMsg;
isValid = false;
}
if (!isValid) {
showErrorDialog(errMsg);
}
return isValid;
}
function validateVoiceChatSettings() {
var isValid = true;
var noTrackErrMsg = 'You must select a voice input.';
var errMsg;
currentVoiceChat = $('#voice-chat-device').val();
if (currentVoiceChat === VOICE_CHAT.SESSION || currentVoiceChat === VOICE_CHAT.CHAT) {
if ($('#voice-inputs-selection > option').size() === 0 || $('#voice-inputs-selection > option').size() > 2) {
errMsg = noTrackErrMsg;
isValid = false;
}
}
else if (currentVoiceChat === VOICE_CHAT.MIC) {
// NO VALIDATION NEEDED
}
if (!isValid) {
showErrorDialog(errMsg);
}
return isValid;
}
function setInstructions(type) {
if (type === 'audio') {
var os = context.jamClient.GetOSAsString();
$('#instructions', 'div[layout-id="configure-audio"]').html(configure_audio_instructions[os]);
}
else if (type === 'voice') {
$('#instructions', 'div[layout-id="configure-audio"]').html(configure_voice_instructions);
}
}
function showErrorDialog(msg) {
app.layout.showDialog('error-dialog');
$('#error-msg', 'div[layout-id="error-dialog"]').html(msg);
}
this.initialize = function() {

View File

@ -210,6 +210,23 @@
return foundParticipant;
}
function addTrack(sessionId, data) {
logger.debug("track data = " + JSON.stringify(data));
var url = "/api/sessions/" + sessionId + "/tracks";
$.ajax({
type: "POST",
dataType: "json",
contentType: 'application/json',
url: url,
data: JSON.stringify(data),
processData:false,
success: function(response) {
logger.debug("Successfully added track (" + JSON.stringify(data) + ")");
},
error: ajaxError
});
}
function updateTrack(sessionId, trackId, data) {
var url = "/api/sessions/" + sessionId + "/tracks/" + trackId;
$.ajax({
@ -226,6 +243,24 @@
});
}
function deleteTrack(trackId) {
if (trackId) {
$.ajax({
type: "DELETE",
url: "/api/sessions/" + sessionId + "/tracks/" + trackId,
success: function(response) {
// TODO: if in recording, more cleanup to do???
// refresh Session screen
refreshCurrentSession();
},
error: function(jqXHR, textStatus, errorThrown) {
logger.error("Error deleting track " + trackId);
}
});
}
}
/**
* Make the server calls to join the current user to
* the session provided.
@ -297,7 +332,9 @@
this.refreshCurrentSession = refreshCurrentSession;
this.subscribe = subscribe;
this.participantForClientId = participantForClientId;
this.addTrack = addTrack;
this.updateTrack = updateTrack;
this.deleteTrack = deleteTrack;
};
})(window,jQuery);

View File

@ -6,6 +6,7 @@
"use strict";
context.JK = context.JK || {};
var logger = context.JK.logger;
var instrumentIconMap24 = {
"acoustic guitar": '../assets/content/icon_instrument_guitar24.png',
@ -40,15 +41,15 @@
context.JK.resolveAvatarUrl = function(photo_url) {
return photo_url ? photo_url : "/assets/shared/avatar_default.jpg";
}
};
context.JK.getInstrumentIconMap24 = function() {
return instrumentIconMap24;
}
};
context.JK.getInstrumentIconMap45 = function() {
return instrumentIconMap45;
}
};
context.JK.getInstrumentIcon24 = function(instrument) {
if (instrument in instrumentIconMap24) {
@ -56,7 +57,7 @@
}
return instrumentIconMap24["default"];
}
};
context.JK.getInstrumentIcon45 = function(instrument) {
if (instrument in instrumentIconMap45) {
@ -64,19 +65,45 @@
}
return instrumentIconMap45["default"];
}
};
context.JK.getInstruments = function(app, callback) {
var url = "/api/instruments";
var instruments;
$.ajax({
type: "GET",
dataType: "json",
url: url,
success: function(response) {
callback(response);
},
error: app.ajaxError
});
};
context.JK.showErrorDialog = function(app, msg) {
app.layout.showDialog('error-dialog');
$('#error-msg', 'div[layout-id="error-dialog"]').html(msg);
}
/*
* Loads a listbox or dropdown with the values in input_array, setting the option value
* to the id_field and the option text to text_field. It will preselect the option with
* value equal to selected_id.
*/
context.JK.loadOptions = function(templateHtml, listbox_id, input_array, id_field, text_field, selected_id) {
$.each(input_array, function(index, val) {
var isSelected = "";
if (val[id_field] === selected_id) {
isSelected = "selected";
}
var html = context.JK.fillTemplate(templateHtml, {
value: val[id_field],
label: val[text_field],
selected: isSelected
});
listbox_id.append(html);
});
}
context.JK.search = function(query, app, callback) {
@ -91,7 +118,7 @@
},
error: app.ajaxError
});
}
};
context.JK.sendFriendRequest = function(app, userId, callback) {
var url = "/api/users/" + context.JK.currentUserId + "/friend_requests";
@ -107,7 +134,7 @@
},
error: app.ajaxError
});
}
};
/*
* Get the length of a dictionary

View File

@ -131,10 +131,13 @@ class ApiMusicSessionsController < ApiController
end
def track_create
puts "TRACK CONNECTION ID = #{params[:connection_id]}"
@track = Track.save(nil,
params[:connection_id],
params[:instrument_id],
params[:sound])
puts "TRACK CONNECTION ID = #{@track.connection_id}"
respond_with @track, responder: ApiResponder, :status => 201, :location => api_session_track_detail_url(@track.connection.music_session, @track)
end

View File

@ -15,7 +15,7 @@ child(:connections => :participants) {
end
child(:tracks => :tracks) {
attributes :id, :instrument_id, :sound
attributes :id, :connection_id, :instrument_id, :sound
}
}

View File

@ -0,0 +1,16 @@
<!-- Add New Gear Dialog -->
<div class="dialog" layout="dialog" layout-id="add-new-audio-gear" style="max-width:500px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>add new audio gear</h1>
</div>
<div class="dialog-inner">
To add a new audio device, you must exit your current session and test the device using the JamKazam automated test feature.
<br clear="left" /><br />
<div class="right">
<a id="btn-cancel-new-audio" layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a id="btn-leave-session-test" layout-action="close" href="#/ftue1" class="button-orange">LEAVE SESSION &amp; START TEST</a>
</div>
<br clear="all" />
</div>
</div>

View File

@ -0,0 +1,41 @@
<!-- Add Track Dialog -->
<div class="dialog" layout="dialog" layout-id="add-track" style="max-width:750px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>add a track</h1>
</div>
<div class="dialog-inner">
Use arrow buttons to assign audio inputs to this new track, and choose what instrument you are playing on this track. Please note that you may only use one audio device for all audio inputs and outputs. If you don't see an audio device you think should be listed <a href="#">view this help topic to understand why</a>.<br />
<br />
<div class="left w30">
Unused Inputs:<br />
<select id="add-track2-unused" class="w100" multiple="multiple" size="6">
</select>
<br /><br />
<a layout-link="add-new-audio-gear" class="button-grey">ADD NEW AUDIO GEAR</a>
</div>
<div class="left w30 mr30">
<div class="left mr5 ml5">
<br />
<img id="img-add-track2-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-add-track2-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
Track 2 Input:<br />
<select id="add-track2-input" class="w80" multiple="multiple" size="6">
</select>
</div>
<div class="left w30">
Track 2 Instrument:<br />
<select id="add-track2-instrument" class="w100" multiple="multiple" size="6">
</select>
</div>
<br clear="left" /><br />
<div class="right">
<a layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a id="btn-add-track" class="button-orange">ADD TRACK</a>
</div>
<br clear="all" />
</div>
</div>

View File

@ -0,0 +1,130 @@
<!-- Configure Track Dialog -->
<div class="dialog" layout="dialog" layout-id="configure-audio" style="max-width:750px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>configure tracks</h1>
</div>
<div class="dialog-inner">
<div class="dialog-tabs">
<a id="tab-configure-audio" class="selected">Music Audio</a>
<a id="tab-configure-voice">Voice Chat</a>
</div>
<span id="instructions"></span>
<br /><br />
<!-- Music Audio Panel -->
<div class="tab" tab-id="music-audio">
<!-- Left Column -->
<div class="left w30">
Audio Driver:<br />
<select id="audio-drivers" class="w100">
</select>
<br /><br />
Unused Inputs:<br />
<select id="audio-inputs-unused" class="w100" multiple="multiple" size="10">
</select>
<br /><br />
Unused Outputs:<br />
<select id="audio-output-unused" class="w100" multiple="multiple" size="4">
</select>
<br /><br />
<a layout-link="add-new-audio-gear" class="button-grey">ADD NEW AUDIO GEAR</a>
</div>
<!-- End Left Column -->
<!-- Middle Column -->
<div class="left w30 mr30">
<div class="left mr5 ml5">
<br /><br /><br /><br /><br>
<img id="img-track1-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-track1-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<br />
<a id="btn-driver-settings" class="button-grey" >DRIVER SETTINGS...</a><br /><br /><br />
Track 1 Input:<br />
<select id="track1-input" class="w80" multiple="multiple" style="height:70px">
</select>
<br clear="left" /><br />
<div id="track2-arrows-div" class="left mr5 ml5">
<br />
<img id="img-track2-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-track2-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<div id="track2-input-div">
Track 2 Input:<br />
<select id="track2-input" class="w80" multiple="multiple" style="height:70px">
</select>
</div>
<br clear="left" /><br />
<div class="left mr5 ml5">
<br />
<br />
<img id="img-audio-output-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-audio-output-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<br />
Session Audio Output:<br />
<select id="audio-output-selection" class="w80" multiple="multiple" size="4">
</select>
</div>
<!-- End Middle Column -->
<!-- Right Column -->
<div class="left w30">
<br /><br /><br /><br />
Track 1 Instrument:<br />
<select id="track1-instrument" class="w100" multiple="multiple" style="height:70px">
</select>
<br />
<br />
<div id="track2-instrument-div">
Track 2 Instrument:<br />
<select id="track2-instrument" multiple="multiple" class="w100" style="height:70px">
</select>
</div>
</div>
<!-- End Right Column -->
</div> <!-- End Panel for Music Audio Tab -->
<!-- Voice Chat Panel -->
<div class="tab" tab-id="voice-chat" style="display:none;">
<div class="left w50">
Voice Chat Device:<br />
<select id="voice-chat-device" class="w100">
<option value="1">Use an input on my session audio device for chat</option>
<option value="0">Use a device from the list below for chat</option>
<option value="2">Use my session audio mic for both music and chat</option>
</select>
<br /><br />
Unused Inputs:<br />
<select id="voice-inputs-unused" class="w100" multiple="multiple" size="8">
</select>
</div>
<div class="left w50">
<div class="left mr5 ml5">
<br /><br /><br /><br /><br />
<img id="img-voice-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" /><br/>
<br />
<br />
<img id="img-voice-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" /><br/>
</div>
<br /><br /><br /><br />
Voice Chat Input:<br />
<select id="voice-inputs-selection" class="w80" multiple="multiple" size="8">
</select>
</div>
</div>
<br clear="left" /><br />
<div class="right mr30">
<a id="btn-cancel-settings" layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a id="btn-save-settings" class="button-orange">UPDATE SETTINGS</a>
</div>
<br clear="all" />
</div>
</div>

View File

@ -0,0 +1,15 @@
<!-- Error Dialog -->
<div class="dialog" layout="dialog" layout-id="error-dialog" style="max-width:550px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>invalid settings</h1>
</div>
<div class="dialog-inner">
<span id="error-msg"></span>
<br clear="left" /><br />
<div class="right">
<a id="btn-error-ok" layout-action="close" class="button-orange">OK</a>
</div>
<br clear="all" />
</div>
</div>

View File

@ -13,7 +13,7 @@
<div class="homebox-info">1 session invitation, 19 public sessions active</div>
</div>
<div layout-grid-position="0,1" layout-grid-rows="1" layout-grid-columns="1"
layout-link="profile" class="homecard profile">
class="homecard profile">
<h2>profile</h2>
<div class="homebox-info">5 followers, 3 following</div>
</div>

View File

@ -60,7 +60,7 @@
<!-- my tracks -->
<div class="session-mytracks">
<h2>my tracks</h2>
<div class="session-add" layout-link="add-track" style="display:block;" mixer-id="{mixerId}">
<div id="div-add-track" class="session-add" layout-link="add-track" style="display:block;" mixer-id="{mixerId}">
<a>
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :align => "texttop"} %>&nbsp;&nbsp;Add Track
</a>
@ -134,223 +134,11 @@
</div>
</div>
<!-- Configure Track Dialog -->
<!-- Initially just dropped in from Jeff's mockup HTML -->
<!-- TODO: REFACTOR for reusable dialogs -->
<!-- <div class="dialog-overlay dialog-fixed" layout="dialog" layout-id="configure-audio"> -->
<div class="dialog" layout="dialog" layout-id="configure-audio" style="max-width:750px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>configure tracks</h1>
</div>
<div class="dialog-inner">
<div class="dialog-tabs">
<a id="tab-configure-audio" class="selected">Music Audio</a>
<a id="tab-configure-voice">Voice Chat</a>
</div>
<span id="instructions"></span>
<br /><br />
<!-- Music Audio Panel -->
<div class="tab" tab-id="music-audio">
<!-- Left Column -->
<div class="left w30">
Audio Driver:<br />
<select id="audio-drivers" class="w100">
</select>
<br /><br />
Unused Inputs:<br />
<select id="audio-inputs-unused" class="w100" multiple="multiple" size="10">
</select>
<br /><br />
Unused Outputs:<br />
<select id="audio-output-unused" class="w100" multiple="multiple" size="4">
</select>
<br /><br />
<a layout-link="add-new-audio-gear" class="button-grey">ADD NEW AUDIO GEAR</a>
</div>
<!-- End Left Column -->
<!-- Middle Column -->
<div class="left w30 mr30">
<div class="left mr5 ml5">
<br /><br /><br /><br /><br>
<img id="img-track1-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-track1-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<br />
<a id="btn-driver-settings" class="button-grey" >DRIVER SETTINGS...</a><br /><br /><br />
Track 1 Input:<br />
<select id="track1-input" class="w80" multiple="multiple" style="height:70px">
</select>
<br clear="left" /><br />
<div id="track2-arrows-div" class="left mr5 ml5">
<br />
<img id="img-track2-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-track2-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<div id="track2-input-div">
Track 2 Input:<br />
<select id="track2-input" class="w80" multiple="multiple" style="height:70px">
</select>
</div>
<br clear="left" /><br />
<div class="left mr5 ml5">
<br />
<br />
<img id="img-audio-output-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" />
<br/>
<br />
<img id="img-audio-output-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" />
</div>
<br />
Session Audio Output:<br />
<select id="audio-output-selection" class="w80" multiple="multiple" size="4">
</select>
</div>
<!-- End Middle Column -->
<!-- Right Column -->
<div class="left w30">
<br /><br /><br /><br />
Track 1 Instrument:<br />
<select id="track1-instrument" class="w100" multiple="multiple" style="height:70px">
</select>
<br />
<br />
<div id="track2-instrument-div">
Track 2 Instrument:<br />
<select id="track2-instrument" multiple="multiple" class="w100" style="height:70px">
</select>
</div>
</div>
<!-- End Right Column -->
</div> <!-- End Panel for Music Audio Tab -->
<!-- Voice Chat Panel -->
<div class="tab" tab-id="voice-chat" style="display:none;">
<div class="left w50">
Voice Chat Device:<br />
<select id="voice-chat-device" class="w100">
<option value="1">Use an input on my session audio device for chat</option>
<option value="0">Use a device from the list below for chat</option>
<option value="2">Use my session audio mic for both music and chat</option>
</select>
<br /><br />
Unused Inputs:<br />
<select id="voice-inputs-unused" class="w100" multiple="multiple" size="8">
</select>
</div>
<div class="left w50">
<div class="left mr5 ml5">
<br /><br /><br /><br /><br />
<img id="img-voice-input-add" style="cursor:pointer;" src="assets/content/arrow_right_24.png" width="24" height="24" /><br/>
<br />
<br />
<img id="img-voice-input-remove" style="cursor:pointer;" src="assets/content/arrow_left_24.png" width="24" height="24" /><br/>
</div>
<br /><br /><br /><br />
Voice Chat Input:<br />
<select id="voice-inputs-selection" class="w80" multiple="multiple" size="8">
</select>
</div>
</div>
<br clear="left" /><br />
<div class="right mr30">
<a id="btn-cancel-settings" layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a id="btn-save-settings" class="button-orange">UPDATE SETTINGS</a>
</div>
<br clear="all" />
</div>
</div>
<!-- Add Track Dialog -->
<div class="dialog" layout="dialog" layout-id="add-track" style="max-width:750px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>add a track</h1>
</div>
<div class="dialog-inner">
Use arrow buttons to assign audio inputs to this new track, and choose what instrument you are playing on this track. Please note that you may only use one audio device for all audio inputs and outputs. If you don't see an audio device you think should be listed <a href="#">view this help topic to understand why</a>.<br />
<br />
<div class="left w30">
Unused Inputs:<br />
<select class="w100" multiple="multiple" size="6">
<option>Conexant HD Audio...</option>
<option>Conexant HD Audio...</option>
</select>
<br /><br />
<a class="button-grey" >ADD NEW AUDIO GEAR</a>
</div>
<div class="left w30 mr30">
<div class="left mr5 ml5">
<br />
<%= image_tag "content/arrow_right_24.png", {:width => 24, :height => 24} %>
<br/>
<br />
<%= image_tag "content/arrow_left_24.png", {:width => 24, :height => 24} %>
</div>
Track 2 Input:<br />
<select class="w80" multiple="multiple" size="6">
<option>USB Audio Codec 1</option>
<option>USB Audio Codec 2</option>
</select>
</div>
<div class="left w30">
Track 2 Instrument:<br />
<select class="w100" multiple="multiple" size="6">
<option>Acoustic Guitar</option>
<option>Electric Guitar</option>
<option>Bass Guitar</option>
<option>Drums/Percussion</option>
<option>Computer</option>
<option>Vocals</option>
<option>Keyboard/Piano</option>
</select>
</div>
<br clear="left" /><br />
<div class="right">
<a layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a class="button-orange">ADD TRACK</a>
</div>
<br clear="all" />
</div>
</div>
<div class="dialog" layout="dialog" layout-id="add-new-audio-gear" style="max-width:500px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>add new audio gear</h1>
</div>
<div class="dialog-inner">
To add a new audio device, you must exit your current session and test the device using the JamKazam automated test feature.
<br clear="left" /><br />
<div class="right">
<a id="btn-cancel-new-audio" layout-action="close" class="button-grey">CANCEL</a>&nbsp;
<a id="btn-leave-session-test" layout-action="close" href="#/ftue1" class="button-orange">LEAVE SESSION &amp; START TEST</a>
</div>
<br clear="all" />
</div>
</div>
<div class="dialog" layout="dialog" layout-id="error-dialog" style="max-width:550px;">
<div class="content-head">
<%= image_tag "content/icon_add.png", {:width => 19, :height => 19, :class => 'content-icon' } %>
<h1>invalid settings</h1>
</div>
<div class="dialog-inner">
<span id="error-msg"></span>
<br clear="left" /><br />
<div class="right">
<a id="btn-error-ok" layout-action="close" class="button-orange">OK</a>
</div>
<br clear="all" />
</div>
</div>
<!-- dialogs needed for Session screen (ORDER MATTERS) -->
<%= render "configureTrack" %>
<%= render "addTrack" %>
<%= render "addNewGear" %>
<%= render "error" %>
<!-- Track Template -->
@ -363,7 +151,7 @@
{right-vu}
</table>
<div class="track-label">{name}</div>
<div class="track-close op30">
<div id="div-track-close" track-id="{trackId}" class="track-close op30">
<%= image_tag "content/icon_closetrack.png", {:width => 12, :height => 12} %>
</div>
<div class="avatar-med">
@ -435,5 +223,4 @@
<tr>
<td width=3 height=17 class="vulight vu0 vu-green-off"></td>
</tr>
</script>
</script>