From f7267d38c6758d50b30f2aa82512b075285bbb5e Mon Sep 17 00:00:00 2001 From: Seth Call Date: Fri, 30 Oct 2015 09:59:50 -0500 Subject: [PATCH] * wip --- .../dialog/configureTrackDialog.js | 3 + web/app/assets/javascripts/fakeJamClient.js | 6 + .../ConfigureLiveTracksDialog.js.jsx.coffee | 68 ++++++++++ .../ConfigureTracks.js.jsx.coffee | 69 +++++++++- .../actions/ConfigureTracksActions.js.coffee | 2 + .../stores/ConfigureTracksStore.js.coffee | 51 ++++++- web/app/assets/javascripts/utils.js | 4 + .../react-components/ConfigureTracks.css.scss | 126 ++++++++++++++++++ .../configureLiveTracksDialog.css.scss | 25 ++++ .../_configureLiveTracksDialog.html.slim | 6 + web/app/views/dialogs/_dialogs.html.haml | 1 + 11 files changed, 349 insertions(+), 12 deletions(-) create mode 100644 web/app/assets/javascripts/react-components/ConfigureLiveTracksDialog.js.jsx.coffee create mode 100644 web/app/assets/stylesheets/client/react-components/ConfigureTracks.css.scss create mode 100644 web/app/assets/stylesheets/dialogs/configureLiveTracksDialog.css.scss create mode 100644 web/app/views/dialogs/_configureLiveTracksDialog.html.slim diff --git a/web/app/assets/javascripts/dialog/configureTrackDialog.js b/web/app/assets/javascripts/dialog/configureTrackDialog.js index 6720df09f..5c631e196 100644 --- a/web/app/assets/javascripts/dialog/configureTrackDialog.js +++ b/web/app/assets/javascripts/dialog/configureTrackDialog.js @@ -214,6 +214,9 @@ function afterShow() { sessionUtils.SessionPageEnter(); + + context.ConfigureTracksActions.vstScan(); + } function onCancel() { diff --git a/web/app/assets/javascripts/fakeJamClient.js b/web/app/assets/javascripts/fakeJamClient.js index 077ad4ced..26fcb4cc3 100644 --- a/web/app/assets/javascripts/fakeJamClient.js +++ b/web/app/assets/javascripts/fakeJamClient.js @@ -1052,6 +1052,10 @@ function GetAutoStart() { return true; } function SaveSettings() {} + + function VSTScan(callback) {setTimeout(eval(callback+ "()"), 1000)} + function hasVstHost() { return false;} + // Javascript Bridge seems to camel-case // Set the instance functions: this.AbortRecording = AbortRecording; @@ -1315,6 +1319,8 @@ this.StopNetworkTest = StopNetworkTest; this.log = log; this.getOperatingMode = getOperatingMode; + this.VSTScan = VSTSCan; + this.hasVstHost = hasVstHost; this.clientID = "devtester"; }; diff --git a/web/app/assets/javascripts/react-components/ConfigureLiveTracksDialog.js.jsx.coffee b/web/app/assets/javascripts/react-components/ConfigureLiveTracksDialog.js.jsx.coffee new file mode 100644 index 000000000..387d1a59f --- /dev/null +++ b/web/app/assets/javascripts/react-components/ConfigureLiveTracksDialog.js.jsx.coffee @@ -0,0 +1,68 @@ +context = window +ConfigureTracksStore = @ConfigureTracksStore +@ConfigureLiveTracksDialog = React.createClass({ + + mixins: [Reflux.listenTo(@ConfigureTracksStore,"onConfigureTracksChanged")] + + onConfigureTracksChanged:(configureTracks) -> + @setState({configureTracks: configureTracks}) + + getInitialState: () -> + {configureTracks: null} + + render: () -> + + inputOneOptions = [] + inputTwoOptions = [] + + defaultSelectionOne = `` + defaultSelectionTwo = `` + + inputOneOptions.push(defaultSelectionOne) + inputTwoOptions.push(defaultSelectionTwo) + + instruments = [] + for displayName, value of context.JK.server_to_client_instrument_map + instruments.push(``) + + if @state.configureTracks? + for input in @state.configureTracks.musicPorts.inputs + item = `` + inputOneOptions.push(item) + inputTwoOptions.push(item) + + `
+
+

Track Type

+ + +
+ +
+

Audio Input Ports

+

Select one or two inputs ports to assign to this track. Note that if you assign a single input port, the app will automatically duplicate this port into a stereo track.

+ + +
+
+

Instrument

+ +
+
+

Audio Effects (optional)

+ +
+
` + + componentDidMount: () -> + $root = $(@getDOMNode()) + context.JK.checkbox($root.find('input[type="checkbox"]')) +}) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/ConfigureTracks.js.jsx.coffee b/web/app/assets/javascripts/react-components/ConfigureTracks.js.jsx.coffee index 5c9bae882..e6256f4f3 100644 --- a/web/app/assets/javascripts/react-components/ConfigureTracks.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/ConfigureTracks.js.jsx.coffee @@ -22,21 +22,78 @@ gearUtils = context.JK.GearUtils console.log("@state.configureTracks", @state.configureTracks) liveTracks = [] + outputs = [] trackAssignments = @state.configureTracks?.trackAssignments if trackAssignments - for track in trackAssignments.inputs.assigned + for inputsForTrack in trackAssignments.inputs.assigned + candidate = inputsForTrack[0] + inputs = [] + for input in inputsForTrack + inputs.push(`
{input.name}
`) + if !inputsForTrack.instrument_id? + instrument = `?` + else + instrument = `` + liveTracks.push( + `
+
{candidate.assignment}:{inputs}
+
None
+
{instrument}
+
+ update + delete +
+
`) - `
+ for output, i in trackAssignments.outputs.assigned + outputs.push( + `
+
{i + 1}:
{output.name}
+
`) + + `
-

Session Audio Inputs (Live Performance Tracks)

- {liveTracks} - - +
+
+

Session Audio Inputs (Live Performance Tracks)

+

Plugin

+

Instrument

+
+
+ {liveTracks} +
+ ADD A LIVE TRACK . . . +
+
+
+

Session Audio Outputs (Requires 2 Ports)

+
+ {outputs} +
+ UPDATE OUTPUTS . . . +
+
` + + onUpdateLiveTrack:(liveTrack, e) -> + e.preventDefault() + + onDeleteLiveTrack:(liveTrack, e) -> + e.preventDefault() + + openLiveTrackDialog: (e) -> + e.preventDefault() + + context.JK.app.layout.showDialog('configure-live-tracks-dialog') + + openOutputTrackDialog: (e) -> + e.preventDefault() + + context.JK.app.layout.app.showDialog('configure-output-tracks-dialog') }) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/actions/ConfigureTracksActions.js.coffee b/web/app/assets/javascripts/react-components/actions/ConfigureTracksActions.js.coffee index 0afa11498..b4448c579 100644 --- a/web/app/assets/javascripts/react-components/actions/ConfigureTracksActions.js.coffee +++ b/web/app/assets/javascripts/react-components/actions/ConfigureTracksActions.js.coffee @@ -3,4 +3,6 @@ context = window @ConfigureTracksActions = Reflux.createActions({ reset: {} trySave: {} + vstScan: {} + vstScanComplete: {} }) diff --git a/web/app/assets/javascripts/react-components/stores/ConfigureTracksStore.js.coffee b/web/app/assets/javascripts/react-components/stores/ConfigureTracksStore.js.coffee index 03f74afd3..93e842ff1 100644 --- a/web/app/assets/javascripts/react-components/stores/ConfigureTracksStore.js.coffee +++ b/web/app/assets/javascripts/react-components/stores/ConfigureTracksStore.js.coffee @@ -12,9 +12,11 @@ gearUtils = context.JK.GearUtils listenables: ConfigureTracksActions musicPorts: {inputs:[], outputs:[]} + trackNumber: null + editingTrack: null + init: () -> - this.listenTo(context.AppStore, this.onAppInit); onAppInit: (@app) -> @@ -29,8 +31,19 @@ gearUtils = context.JK.GearUtils trySave: () -> + onVstScan: () -> + hasVst = context.jamClient.hasVstHost() + logger.debug("hasVst", hasVst) + if hasVst + logger.debug("vstScan starting") + result = context.jamClient.VSTScan() + logger.debug("vstScan completed", result) + + + onVstScanComplete:() -> + changed: () -> - @item = {musicPorts: @musicPorts, trackAssignments: @trackAssignments} + @item = {musicPorts: @musicPorts, trackAssignments: @trackAssignments, trackNumber: @trackNumber, editingTrack: @editingTrack} @trigger(@item) @@ -39,9 +52,11 @@ gearUtils = context.JK.GearUtils # basically, if an input channel isn't in there, it's not going to be displayed @musicPorts = context.jamClient.FTUEGetChannels() + # let's populate this bad boy @trackAssignments = {inputs: {unassigned:[], assigned:[], chat:[]}, outputs: {unassigned:[], assigned: []}} + for input in @musicPorts.inputs - if input.assigment == ASSIGNMENT.UNASSIGNED + if input.assignment == ASSIGNMENT.UNASSIGNED @trackAssignments.inputs.unassigned.push(input) else if input.assignment == ASSIGNMENT.CHAT @trackAssignments.inputs.chat.push(input) @@ -49,18 +64,42 @@ gearUtils = context.JK.GearUtils # make sure this assignment isn't already preset (you can have multiple inputs per 'track slot') found = false for assigned in @trackAssignments.inputs.assigned - if assigned[0].assignment == input.assignment + if assigned.assignment == input.assignment assigned.push(input) found = true if !found - @trackAssignments.inputs.assigned.push([input]) - for output in @musiPorts.outputs + initial = [input] + initial.assignment = input.assignment # store the assignment on the array itself, so we don't have to check inside the array for an input's assignment (which will all be the same) + @trackAssignments.inputs.assigned.push(initial) + for output in @musicPorts.outputs if output.assignment == ASSIGNMENT.OUTPUT @trackAssignments.outputs.assigned.push(output) else @trackAssignments.outputs.unassigned.push(output) + @loadTrackInstruments(forceInputsToUnassign) @changed() + + loadTrackInstruments: (forceInputsToUnassign) -> + for inputsForTrack in @trackAssignments.inputs.assigned + clientInstrument = context.jamClient.TrackGetInstrument(inputsForTrack[0].assignment) + + instrument = context.JK.client_to_server_instrument_map[clientInstrument]; + + inputsForTrack.instrument_id = instrument?.server_id + + openLiveTrackDialog: (trackNumber) -> + @trackNumber = trackNumber + + @editingTrack = null + for inputsForTrack in @trackAssignments.inputs.assigned + if inputsForTrack.assignment == trackNumber + @editingTrack = inputsForTrack + break + + @changed() + + @app.layout.showDialog('configure-live-tracks-dialog') } ) \ No newline at end of file diff --git a/web/app/assets/javascripts/utils.js b/web/app/assets/javascripts/utils.js index 68aa5b692..c25a3292c 100644 --- a/web/app/assets/javascripts/utils.js +++ b/web/app/assets/javascripts/utils.js @@ -733,6 +733,10 @@ return date.toLocaleTimeString(); } + context.JK.iconMapBase = function() { + return icon_map_base + } + context.JK.formatUtcTime = function(date, change) { if (change) { date.setMinutes(Math.ceil(date.getMinutes() / 30) * 30); diff --git a/web/app/assets/stylesheets/client/react-components/ConfigureTracks.css.scss b/web/app/assets/stylesheets/client/react-components/ConfigureTracks.css.scss new file mode 100644 index 000000000..f76f8276d --- /dev/null +++ b/web/app/assets/stylesheets/client/react-components/ConfigureTracks.css.scss @@ -0,0 +1,126 @@ +@import "client/common"; + +.ConfigureTracks { + + .inputs-view { + border-width:1px 0; + border-color:$ColorText; + border-style:solid; + padding:20px 0; + height:220px; + + .live-tracks { + height:150px; + overflow:auto; + a { + margin-left:3px; + } + } + + .live-input { + display:inline-block; + } + .live-track { + margin-bottom:20px; + } + + a.delete-live-track { + margin-left:20px; + } + .assignment { + display:inline-block; + width:20px; + } + + .input-track-info { + @include border_box_sizing; + width:60%; + display:inline-block; + } + + .plugin-info { + @include border_box_sizing; + width:30%; + display:inline-block; + } + + .plugin-instrument { + @include border_box_sizing; + width:10%; + display:inline-block; + text-align:center; + + img { + vertical-align:middle; + } + } + } + + .outputs-view { + border-width:0 0 1px; + border-color:$ColorText; + border-style:solid; + padding:20px 0; + + .assignment { + display:inline-block; + width:20px; + } + + + .output-tracks { + height:73px; + overflow:auto; + a { + margin-left:3px; + } + } + + + .output-track { + margin-bottom: 20px; + } + + .output-track-info { + display:inline-block; + } + + .output { + display:inline-block; + margin-bottom:0 !important; + } + } + h3 { + display:inline-block; + font-size:14px; + margin:0 0 20px; + @include border_box_sizing; + &.session-audio-inputs-header { + color:white; + font-weight:bold; + width:60%; + } + + &.session-audio-outputs-header { + color:white; + font-weight:bold; + width:60%; + } + + &.plugin-header { + width:30%; + } + &.instrument-header { + width:10%; + text-align:center; + } + } + .live-track-actions { + display:block; + padding-left:30px; + margin-top:10px; + a { + font-size:12px; + } + } +} \ No newline at end of file diff --git a/web/app/assets/stylesheets/dialogs/configureLiveTracksDialog.css.scss b/web/app/assets/stylesheets/dialogs/configureLiveTracksDialog.css.scss new file mode 100644 index 000000000..282c08a2f --- /dev/null +++ b/web/app/assets/stylesheets/dialogs/configureLiveTracksDialog.css.scss @@ -0,0 +1,25 @@ +@import "client/common"; + +#configure-live-tracks-dialog { + width: 800px; + + .track-type { + width:100%; + @include border_box_sizing; + } + .audio-input-ports { + width:50%; + @include border_box_sizing; + float:left; + } + .instrument-selection { + width:50%; + @include border_box_sizing; + float:left; + } + .audio-effects { + width:50%; + @include border_box_sizing; + float:left; + } +} \ No newline at end of file diff --git a/web/app/views/dialogs/_configureLiveTracksDialog.html.slim b/web/app/views/dialogs/_configureLiveTracksDialog.html.slim new file mode 100644 index 000000000..eace5771b --- /dev/null +++ b/web/app/views/dialogs/_configureLiveTracksDialog.html.slim @@ -0,0 +1,6 @@ +.dialog.dialog-overlay-sm.top-parent layout='dialog' layout-id='configure-live-tracks-dialog' id='configure-live-tracks-dialog' + .content-head + = image_tag "content/icon_add.png", {:height => 19, :width => 19, :class => 'content-icon'} + h1 add live track + .dialog-inner + = react_component 'ConfigureLiveTracksDialog', {} diff --git a/web/app/views/dialogs/_dialogs.html.haml b/web/app/views/dialogs/_dialogs.html.haml index 45db4cb3f..761559fdf 100644 --- a/web/app/views/dialogs/_dialogs.html.haml +++ b/web/app/views/dialogs/_dialogs.html.haml @@ -44,3 +44,4 @@ = render 'dialogs/recordingSelectorDialog' = render 'dialogs/soundCloudPlayerDialog' = render 'dialogs/deleteVideoConfirmDialog' += render 'dialogs/configureLiveTracksDialog' \ No newline at end of file