From 17bb5a29bfb2462ea90e4cddd8cd73247f2baf09 Mon Sep 17 00:00:00 2001 From: Brian Smith Date: Sun, 12 May 2013 01:43:36 -0400 Subject: [PATCH] VRFS-292 Configure Tracks dialog work --- app/assets/javascripts/createSession.js | 2 +- app/assets/javascripts/fakeJamClient.js | 31 ++++ app/assets/javascripts/session.js | 171 +++++++++++++++++++-- app/assets/javascripts/utils.js | 18 ++- app/views/clients/_profile.html.erb | 2 +- app/views/clients/_session.html.erb | 190 ++++++++++++------------ 6 files changed, 304 insertions(+), 110 deletions(-) diff --git a/app/assets/javascripts/createSession.js b/app/assets/javascripts/createSession.js index b1b4336cb..3121c1f00 100644 --- a/app/assets/javascripts/createSession.js +++ b/app/assets/javascripts/createSession.js @@ -140,7 +140,7 @@ sound: "stereo" }; } - data.tracks = [ track ]; //getTracks(); + data.tracks = getTracks(); var jsonData = JSON.stringify(data); diff --git a/app/assets/javascripts/fakeJamClient.js b/app/assets/javascripts/fakeJamClient.js index 1f4af89a1..d9385ecd9 100644 --- a/app/assets/javascripts/fakeJamClient.js +++ b/app/assets/javascripts/fakeJamClient.js @@ -14,6 +14,7 @@ var vuChange = 10; var callbackTimer = null; var _mix = -30; + var device_id = -1; function dbg(msg) { logger.debug('FakeJamClient: ' + msg); } @@ -237,6 +238,31 @@ function TrackGetInstrument(trackNumber) {} + + function TrackGetDevices() { + var response =[{"device_id":0,"device_name":"Realtek High Definition Audio","interfaces":[{"interface_id":0,"interface_name":"Realtek HDA SPDIF Out","pins":[{"is_input":false,"pin_id":0,"pin_name":"PC Speaker"}]},{"interface_id":1,"interface_name":"Realtek HD Audio rear output","pins":[{"is_input":false,"pin_id":0,"pin_name":"PC Speaker"}]},{"interface_id":2,"interface_name":"Realtek HD Audio Mic input","pins":[{"is_input":true,"pin_id":0,"pin_name":"Recording Control"}]},{"interface_id":3,"interface_name":"Realtek HD Audio Line input","pins":[{"is_input":true,"pin_id":0,"pin_name":"Recording Control"}]},{"interface_id":4,"interface_name":"Realtek HD Digital input","pins":[{"is_input":true,"pin_id":0,"pin_name":"Capture"}]},{"interface_id":5,"interface_name":"Realtek HD Audio Stereo input","pins":[{"is_input":true,"pin_id":0,"pin_name":"Recording Control"}]}],"wavert_supported":false},{"device_id":1,"device_name":"M-Audio FW Audiophile","interfaces":[{"interface_id":0,"interface_name":"FW AP Multi","pins":[{"is_input":false,"pin_id":0,"pin_name":"Output"},{"is_input":true,"pin_id":1,"pin_name":"Input"}]},{"interface_id":1,"interface_name":"FW AP 1/2","pins":[{"is_input":false,"pin_id":0,"pin_name":"Output"},{"is_input":true,"pin_id":1,"pin_name":"Input"}]},{"interface_id":2,"interface_name":"FW AP SPDIF","pins":[{"is_input":false,"pin_id":0,"pin_name":"Output"},{"is_input":true,"pin_id":1,"pin_name":"Input"}]},{"interface_id":3,"interface_name":"FW AP 3/4","pins":[{"is_input":false,"pin_id":0,"pin_name":"Output"}]}],"wavert_supported":false},{"device_id":2,"device_name":"Virtual Audio Cable","interfaces":[{"interface_id":0,"interface_name":"Virtual Cable 2","pins":[{"is_input":true,"pin_id":0,"pin_name":"Capture"},{"is_input":false,"pin_id":1,"pin_name":"Output"}]},{"interface_id":1,"interface_name":"Virtual Cable 1","pins":[{"is_input":true,"pin_id":0,"pin_name":"Capture"},{"is_input":false,"pin_id":1,"pin_name":"Output"}]}],"wavert_supported":false},{"device_id":3,"device_name":"WebCamDV WDM Audio Capture","interfaces":[{"interface_id":0,"interface_name":"WebCamDV Audio","pins":[{"is_input":true,"pin_id":0,"pin_name":"Recording Control"},{"is_input":false,"pin_id":1,"pin_name":"Volume Control"}]}],"wavert_supported":false}]; + return response; + } + + function TrackSetMusicDevice(id) { + device_id = id; + } + + // mock response of this method by allowing only even device IDs to open control panel + function TrackHasControlPanel() { + var devices = TrackGetDevices(); + if (devices[device_id].device_id % 2 === 0) { + return true; + } + else { + return false; + } + } + + function TrackOpenControlPanel() { + return; + } + function TrackLoadAssignments() {} function TrackSave() {} @@ -343,6 +369,11 @@ this.TrackSetInstrument = TrackSetInstrument; this.TrackGetInstrument = TrackGetInstrument; + this.TrackGetDevices = TrackGetDevices; + this.TrackSetMusicDevice = TrackSetMusicDevice; + this.TrackHasControlPanel = TrackHasControlPanel; + this.TrackOpenControlPanel = TrackOpenControlPanel; + // Client Update this.ClientUpdateVersion = ClientUpdateVersion; this.ClientUpdateStartDownload = ClientUpdateStartDownload; diff --git a/app/assets/javascripts/session.js b/app/assets/javascripts/session.js index ee255d55b..9d96fafe6 100644 --- a/app/assets/javascripts/session.js +++ b/app/assets/javascripts/session.js @@ -9,6 +9,7 @@ var sessionId; var tracks = {}; var mixers = []; + var myTrackCount = 0; // TODO Consolidate dragged controls and handles var $draggingFaderHandle = null; @@ -25,6 +26,25 @@ 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" @@ -76,6 +96,8 @@ } } checkForCurrentUser(); + + setAudioInstructions(); } function afterCurrentUserLoaded() { @@ -106,6 +128,8 @@ _wireTopVolume(); _wireTopMix(); _addVoiceChat(); + + toggleTrack2ConfigDetails(myTrackCount > 1); } // Get the latest list of underlying audio mixer channels @@ -194,14 +218,6 @@ }); } - function _instrumentIconFromId(id) { - if (id in instrumentIcons) { - return instrumentIcons[id]; - } - // return default instrument for any unknowns - return "content/icon_instrument_default45.png"; - } - function _renderTracks() { // Participants are here now, but the mixers don't update right away. // Draw tracks from participants, then setup timers to look for the @@ -213,7 +229,7 @@ if (!(name)) { name = participant.user.first_name + ' ' + participant.user.last_name; } - var instrumentIcon = _instrumentIconFromId(participant.tracks[0].instrument_id); + var instrumentIcon = context.JK.getInstrumentIcon45(participant.tracks[0].instrument_id); var photoUrl = context.JK.resolveAvatarUrl(participant.user.photo_url); var myTrack = false; @@ -258,10 +274,30 @@ // Show settings icons only for my tracks if (myTrack) { $('div[mixer-id="' + mixer.id + '"].track-icon-settings').show(); + myTrackCount++; } }); } + 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 called on an interval when participants change. Mixers seem to // show up later, so we render the tracks from participants, but keep track // of the ones there weren't any mixers for, and continually try to find them @@ -353,6 +389,9 @@ var template = $('#template-session-track').html(); var newTrack = context.JK.fillTemplate(template, trackData); $destination.append(newTrack); + $('div[mixer-id="' + trackData.mixerId + '"].track-icon-settings').click(function() { + initMusicAudioPanel(); + }); tracks[trackData.clientId] = new context.JK.SessionTrack(trackData.clientId); } @@ -638,6 +677,120 @@ $('#voice-chat').on('mousedown', 'div[control="fader-handle"]', faderHandleDown); $('#voice-chat').on('mousemove', faderMouseMove); $('body').on('mouseup', faderMouseUp); + + $('#tab-configure-audio').click(function() { + // validate voice chat settings + if (validateVoiceChatSettings()) { + setAudioInstructions(); + initMusicAudioPanel(); + } + }); + + $('#tab-configure-voice').click(function() { + // validate audio settings + if (validateAudioSettings()) { + + initVoiceChatPanel(); + + $('#instructions', 'div[layout-id="configure-audio"]').html(configure_voice_instructions); + } + }); + + // Track 1 Add + $('#img-track1-input-add').click(function() { + $('#audio-inputs-unused option:selected').remove().appendTo('#track1-input'); + }); + + // Track 1 Remove + $('#img-track1-input-remove').click(function() { + $('#track1-input option:selected').remove().appendTo('#audio-inputs-unused'); + }); + + // Track 2 Add + $('#img-track2-input-add').click(function() { + $('#audio-inputs-unused option:selected').remove().appendTo('#track2-input'); + }); + + // Track 2 Remove + $('#img-track2-input-remove').click(function() { + $('#track2-input option:selected').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'); + }); + + $('.voicechat-settings').click(function() { + initVoiceChatPanel(); + }); + + $('#btn-driver-settings').click(function() { + context.jamClient.TrackSetMusicDevice($('#audio-drivers').val()); + + if (context.jamClient.TrackHasControlPanel()) { + logger.debug("Opening control panel"); + context.jamClient.TrackOpenControlPanel(); + } + }); + + $('#btn-save-settings').click(function() { + if (!validateAudioSettings()) { + return false; + } + + if (!validateVoiceChatSettings()) { + + } + }); + } + + function initMusicAudioPanel() { + $('div[tab-id="music-audio"]').show(); + $('div[tab-id="voice-chat"]').hide(); + + $('#tab-configure-audio').addClass('selected'); + $('#tab-configure-voice').removeClass('selected'); + + $('#audio-drivers').empty(); + + // load Audio Driver dropdown + var devices = context.jamClient.TrackGetDevices(); + $.each(devices, function(index, val) { + var template = $('#template-dropdown').html(); + var audioDriversHtml = context.JK.fillTemplate(template, { + value: val.device_id, + label: val.device_name + }); + + $('#audio-drivers').append(audioDriversHtml); + }); + } + + function initVoiceChatPanel() { + $('div[tab-id="music-audio"]').hide(); + $('div[tab-id="voice-chat"]').show(); + + $('#tab-configure-audio').removeClass('selected'); + $('#tab-configure-voice').addClass('selected'); + } + + function validateAudioSettings() { + return true; + } + + function validateVoiceChatSettings() { + return true; + } + + function setAudioInstructions() { + var os = context.jamClient.GetOSAsString(); + $('#instructions', 'div[layout-id="configure-audio"]').html(configure_audio_instructions[os]); } this.initialize = function() { diff --git a/app/assets/javascripts/utils.js b/app/assets/javascripts/utils.js index 08fdaa3b9..922375fde 100644 --- a/app/assets/javascripts/utils.js +++ b/app/assets/javascripts/utils.js @@ -13,7 +13,8 @@ "electric guitar": '../assets/content/icon_instrument_guitar24.png', "keyboard": '../assets/content/icon_instrument_keyboard24.png', "saxophone": '../assets/content/icon_instrument_saxophone24.png', - "voice": '../assets/content/icon_instrument_vocal24.png' + "voice": '../assets/content/icon_instrument_vocal24.png', + "default": '../assets/content/icon_instrument_default24.png' }; var instrumentIconMap45 = { @@ -22,7 +23,8 @@ "electric guitar": "../assets/content/icon_instrument_guitar45.png", "keyboard": "../assets/content/icon_instrument_keyboard45.png", "saxophone": "../assets/content/icon_instrument_saxophone45.png", - "voice": "../assets/content/icon_instrument_vocal45.png" + "voice": "../assets/content/icon_instrument_vocal45.png", + "default": '../assets/content/icon_instrument_default45.png' }; // Uber-simple templating @@ -49,11 +51,19 @@ } context.JK.getInstrumentIcon24 = function(instrument) { - return instrumentIconMap24[instrument]; + if (instrument in instrumentIconMap24) { + return instrumentIconMap24[instrument]; + } + + return instrumentIconMap24["default"]; } context.JK.getInstrumentIcon45 = function(instrument) { - return instrumentIconMap45[instrument]; + if (instrument in instrumentIconMap45) { + return instrumentIconMap45[instrument]; + } + + return instrumentIconMap45["default"]; } context.JK.search = function(query, app, callback) { diff --git a/app/views/clients/_profile.html.erb b/app/views/clients/_profile.html.erb index 046ec8958..0a6f20fd5 100644 --- a/app/views/clients/_profile.html.erb +++ b/app/views/clients/_profile.html.erb @@ -95,7 +95,7 @@ + +