Skip to content

Commit

Permalink
Merge pull request #6 from olzzon/develop
Browse files Browse the repository at this point in the history 
Develop
  • Loading branch information
@olzzon
olzzon authored Nov 24, 2023
2 parents 06f1886 + 77aeb48 commit 081d51c
Show file tree
Hide file tree
Showing 32 changed files with 403 additions and 401 deletions.
10 changes: 5 additions & 5 deletions src/client/Components/InputTypes/ColorBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
} from '../../../interface/redux/containerActions'
import { RootState } from '../../main'
import { GPU_TYPES, SettingsInputParam } from '../../../interface/SettingsInterface'
import { INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import { parseGlobalInParamsToTranscoder, parseInputParamsToTranscoder } from '../../utils/parseParamsToTranscoder'

interface ColorBarProps {
Expand All @@ -21,7 +21,7 @@ const ColorbarInputOptions: React.FC<ColorBarProps> = (props) => {
const id = props.pipelineId
const [collapse, setCollapse] = useState(false)

const resolution = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const resolution = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const hwAccel = useSelector<RootState, GPU_TYPES>((state) => state.ffmpeg[0].pipeline[id].hwaccell)

useEffect(() => {
Expand All @@ -30,7 +30,7 @@ const ColorbarInputOptions: React.FC<ColorBarProps> = (props) => {
dispatch(storeSetDockerInputPorts(id, []))

if (!resolution) {
dispatch(storeSetInputValue(id, 0, '1920x1080'))
dispatch(storeSetInputValue(id, 0, {valueArg: ['1920x1080']}))
}
}, [])

Expand All @@ -44,8 +44,8 @@ const ColorbarInputOptions: React.FC<ColorBarProps> = (props) => {
<input
className="input-text"
type="text"
value={resolution ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={resolution?.valueArg ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, {valueArg: [event.target.value]}))}
/>
</label>
</div>
Expand Down
24 changes: 12 additions & 12 deletions src/client/Components/InputTypes/DecklinkInputOptions.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { DEVICE_TYPES, INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { DEVICE_TYPES, INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import {
storeSetGlobalInParamArr,
storeSetInputValue,
Expand All @@ -21,9 +21,9 @@ const DecklinkInputOptions: React.FC<DecklinkProps> = (props) => {
const id = props.pipelineId
const [collapse, setCollapse] = useState(false)

const decklinkInput = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const channels = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const queue_size = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const decklinkInput = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const channels = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const queue_size = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const devices = useSelector<RootState, string[]>(
(state) => state.ffmpeg[0].deviceTypes[DEVICE_TYPES.DECKLINK_INPUT]?.devices || []
)
Expand All @@ -35,18 +35,18 @@ const DecklinkInputOptions: React.FC<DecklinkProps> = (props) => {
dispatch(storeSetDockerInputPorts(id, []))

if (!decklinkInput) {
dispatch(storeSetInputValue(id, 0, 'DeckLink Quad (1)'))
dispatch(storeSetInputValue(id, 0, { valueArg: ['"DeckLink Quad (1)"'] }))
}
if (!channels) {
dispatch(storeSetInputValue(id, 1, '16'))
dispatch(storeSetInputValue(id, 1, { valueArg: ['16'] }))
}
if (!queue_size) {
dispatch(storeSetInputValue(id, 2, '1073741824'))
dispatch(storeSetInputValue(id, 2, { valueArg: ['1073741824'] }))
}
}, [])

const handleSetDecklinkInput = (event: React.ChangeEvent<HTMLSelectElement>) => {
dispatch(storeSetInputValue(id, 0, event.target.value))
dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value] }))
}

return (
Expand All @@ -59,8 +59,8 @@ const DecklinkInputOptions: React.FC<DecklinkProps> = (props) => {
<input
className="input-text"
type="text"
value={decklinkInput ?? 'DeckLink Quad (1)'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={decklinkInput?.valueArg ?? 'DeckLink Quad (1)'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value] }))}
/>
</label>
<label className="pipeline-label">
Expand All @@ -81,8 +81,8 @@ const DecklinkInputOptions: React.FC<DecklinkProps> = (props) => {
<label className="pipeline-label">
Audio channels :
<select
value={channels ?? 16}
onChange={(event) => dispatch(storeSetInputValue(id, 1, event.target.value))}
value={channels?.valueArg ?? 16}
onChange={(event) => dispatch(storeSetInputValue(id, 1, { valueArg: [event.target.value] }))}
>
<option key={2} value={2}>2</option>
<option key={4} value={4}>4</option>
Expand Down
26 changes: 13 additions & 13 deletions src/client/Components/InputTypes/File.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import {
storeSetGlobalInValue,
storeSetGlobalInParamArr,
Expand All @@ -23,9 +23,9 @@ const FileInputOptions: React.FC<IFileProps> = (props) => {
const [collapse, setCollapse] = useState(false)


const fileLoop = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].globalInput.valueArgs[0])
const filePath = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const fileName = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const fileLoop = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].globalInput.valueArgs[0])
const filePath = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const fileName = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const hwAccel = useSelector<RootState, GPU_TYPES>((state) => state.ffmpeg[0].pipeline[id].hwaccell)


Expand All @@ -35,13 +35,13 @@ const FileInputOptions: React.FC<IFileProps> = (props) => {
dispatch(storeSetDockerInputPorts(id, []))

if (!fileLoop) {
dispatch(storeSetGlobalInValue(id, 0, '1'))
dispatch(storeSetGlobalInValue(id, 0, { valueArg: ['1']}))
}
if (!filePath) {
dispatch(storeSetInputValue(id, 0, '/Users/olzzon/coding/live-factory/media/'))
dispatch(storeSetInputValue(id, 0, { valueArg: ['/Users/olzzon/coding/live-factory/media/']}))
}
if (!fileName) {
dispatch(storeSetInputValue(id, 1, 'HDR10Jazz.mp4'))
dispatch(storeSetInputValue(id, 1, { valueArg: ['HDR10Jazz.mp4']}))
}
}, [])

Expand All @@ -55,26 +55,26 @@ const FileInputOptions: React.FC<IFileProps> = (props) => {
<input
className="input-text"
type="text"
value={filePath ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={filePath?.valueArg ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value]}))}
/>
</label>
<label className="pipeline-label">
Filename :
<input
className="input-text"
type="text"
value={fileName ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 1, event.target.value))}
value={fileName?.valueArg ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 1, { valueArg: [event.target.value]}))}
/>
</label>
<label className="pipeline-label">
File loop (-1 = infinite) :
<input
className="input-number"
type="number"
value={fileLoop ?? 0}
onChange={(event) => dispatch(storeSetGlobalInValue(id, 0, event.target.value))}
value={fileLoop?.valueArg ?? 0}
onChange={(event) => dispatch(storeSetGlobalInValue(id, 0, { valueArg: [event.target.value]}))}
/>
</label>
</div>
Expand Down
26 changes: 13 additions & 13 deletions src/client/Components/InputTypes/Mpegts.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import {
storeSetGlobalInParamArr,
storeSetInputValue,
Expand All @@ -21,29 +21,29 @@ const MpegtsInputOptions: React.FC<IMpegtsProps> = (props) => {
const id = props.pipelineId
const [collapse, setCollapse] = useState(false)

const ip = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const port = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const fifoSize = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const ip = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const port = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const fifoSize = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const hwAccel = useSelector<RootState, GPU_TYPES>((state) => state.ffmpeg[0].pipeline[id].hwaccell)

useEffect(() => {
dispatch(storeSetGlobalInParamArr(id, parseGlobalInParamsToTranscoder(props.inputParams, INPUT_PARAMS.MPEG_TS, hwAccel)))
dispatch(storeSetInputParamArr(id, parseInputParamsToTranscoder(props.inputParams, INPUT_PARAMS.MPEG_TS, hwAccel)))

if (!ip) {
dispatch(storeSetInputValue(id, 0, 'localhost'))
dispatch(storeSetInputValue(id, 0, { valueArg: ['localhost']}))
}
if (!port) {
dispatch(storeSetInputValue(id, 1, '1234'))
dispatch(storeSetInputValue(id, 1, { valueArg: ['1234']}))
dispatch(storeSetDockerInputPorts(id, [{ip: '0.0.0.0', port: "1234", protocol: 'udp'}]))
}
if (!fifoSize) {
dispatch(storeSetInputValue(id, 2, '49152'))
dispatch(storeSetInputValue(id, 2, { valueArg: ['49152']}))
}
}, [])

const handlePortChange = (event: React.ChangeEvent<HTMLInputElement>) => {
dispatch(storeSetInputValue(id, 1, event.target.value))
dispatch(storeSetInputValue(id, 1, { valueArg: [event.target.value]}))
dispatch(storeSetDockerInputPorts(id, [{ip: '0.0.0.0', port: event.target.value, protocol: 'udp'}]))
}

Expand All @@ -57,16 +57,16 @@ const MpegtsInputOptions: React.FC<IMpegtsProps> = (props) => {
<input
className="input-text"
type="text"
value={ip}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={ip.valueArg}
onChange={(event) => dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value]}))}
/>
</label>
<label className="pipeline-label">
PORT :
<input
className="input-text"
type="text"
value={port}
value={port.valueArg}
onChange={(event) => handlePortChange(event)}
/>
</label>
Expand All @@ -75,8 +75,8 @@ const MpegtsInputOptions: React.FC<IMpegtsProps> = (props) => {
<input
className="input-text"
type="text"
value={fifoSize}
onChange={(event) => dispatch(storeSetInputValue(id, 2, event.target.value))}
value={fifoSize.valueArg}
onChange={(event) => dispatch(storeSetInputValue(id, 2, { valueArg: [event.target.value]}))}
/>
</label>
</div>
Expand Down
12 changes: 6 additions & 6 deletions src/client/Components/InputTypes/NdiInput.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { DEVICE_TYPES, INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { DEVICE_TYPES, INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import {
storeSetGlobalInParamArr,
storeSetInputValue,
Expand All @@ -22,7 +22,7 @@ const NdiInputOptions: React.FC<IFileProps> = (props) => {
const [collapse, setCollapse] = useState(false)


const ndiName = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const ndiName = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const devices = useSelector<RootState, string[]>(
(state) => state.ffmpeg[0].deviceTypes[DEVICE_TYPES.NDI]?.devices || []
)
Expand All @@ -34,12 +34,12 @@ const NdiInputOptions: React.FC<IFileProps> = (props) => {
dispatch(storeSetDockerInputPorts(id, []))

if (!ndiName) {
dispatch(storeSetInputValue(id, 0, 'HOSTNAME (NDINAME)'))
dispatch(storeSetInputValue(id, 0, { valueArg: ['HOSTNAME (NDINAME)']}))
}
}, [])

const handleSetNdiSource = (event: React.ChangeEvent<HTMLSelectElement>) => {
dispatch(storeSetInputValue(id, 0, event.target.value))
dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value]}))
}

return (
Expand All @@ -52,8 +52,8 @@ const NdiInputOptions: React.FC<IFileProps> = (props) => {
<input
className="input-text"
type="text"
value={ndiName ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={ndiName?.valueArg ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value]}))}
/>
</label>
<label className="pipeline-label">
Expand Down
26 changes: 13 additions & 13 deletions src/client/Components/InputTypes/RistInput.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { INPUT_PARAMS } from '../../../interface/GenericInterfaces'
import { INPUT_PARAMS, ValueArg } from '../../../interface/GenericInterfaces'
import {
storeSetGlobalInParamArr,
storeSetInputValue,
Expand All @@ -23,9 +23,9 @@ const RistInputOptions: React.FC<RistProps> = (props) => {
const [collapse, setCollapse] = useState(false)


const ip = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const port = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const cname = useSelector<RootState, string>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const ip = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[0])
const port = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[1])
const cname = useSelector<RootState, ValueArg>((state) => state.ffmpeg[0].pipeline[id].input.valueArgs[2])
const hwAccel = useSelector<RootState, GPU_TYPES>((state) => state.ffmpeg[0].pipeline[id].hwaccell)


Expand All @@ -39,19 +39,19 @@ const RistInputOptions: React.FC<RistProps> = (props) => {
//dispatch(storeSetInputParamArr(id, ['-i "rist://{arg0}:{arg1}?cname={arg2}"']))

if (!ip) {
dispatch(storeSetInputValue(id, 0, '0.0.0.0'))
dispatch(storeSetInputValue(id, 0, { valueArg: ['0.0.0.0']}))
}
if (!port) {
dispatch(storeSetInputValue(id, 1, '9998'))
dispatch(storeSetInputValue(id, 1, { valueArg: ['9998']}))
dispatch(storeSetDockerInputPorts(id, [{ip: '0.0.0.0', port: "1234", protocol: 'tcp'}]))
}
if (!cname) {
dispatch(storeSetInputValue(id, 2, 'RECEIVER01'))
dispatch(storeSetInputValue(id, 2, { valueArg: ['RECEIVER01']}))
}
}, [])

const handlePortChange = (event: React.ChangeEvent<HTMLInputElement>) => {
dispatch(storeSetInputValue(id, 1, event.target.value))
dispatch(storeSetInputValue(id, 1, { valueArg: [event.target.value]}))
dispatch(storeSetDockerInputPorts(id, [{ip: '0.0.0.0', port: event.target.value, protocol: 'tcp'}]))
}

Expand All @@ -65,16 +65,16 @@ const RistInputOptions: React.FC<RistProps> = (props) => {
<input
className="input-text"
type="text"
value={ip ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, event.target.value))}
value={ip?.valueArg ?? 'none'}
onChange={(event) => dispatch(storeSetInputValue(id, 0, { valueArg: [event.target.value]}))}
/>
</label>
<label className="pipeline-label">
Port :
<input
className="input-text"
type="text"
value={port ?? 'none'}
value={port?.valueArg ?? 'none'}
onChange={(event) => handlePortChange(event)}
/>
</label>
Expand All @@ -83,8 +83,8 @@ const RistInputOptions: React.FC<RistProps> = (props) => {
<input
className="input-text"
type="text"
value={cname ?? 0}
onChange={(event) => dispatch(storeSetInputValue(id, 2, event.target.value))}
value={cname?.valueArg ?? 0}
onChange={(event) => dispatch(storeSetInputValue(id, 2, { valueArg: [event.target.value]}))}
/>
</label>
</div>
Expand Down
Loading

0 comments on commit 081d51c

Please sign in to comment.