@ -104,19 +104,36 @@ function Settings({
< tbody >
< Row >
< KeyCell > { t ( 'Show advanced settings' ) } < / KeyCell >
< KeyCell > < GlobeIcon style = { { verticalAlign : 'middle' , marginRight : '.5em' } } / > App language < / KeyCell >
< td >
< Select value = { language || '' } onChange = { onLangChange } style = { { fontSize : '1.2em' } } >
< option key = "" value = "" > { t ( 'System language' ) } < / option >
{ Object . keys ( langNames ) . map ( ( lang ) = > < option key = { lang } value = { lang } > { langNames [ lang ] } < / option > ) }
< / Select >
< / td >
< / Row >
< Row >
< KeyCell >
{ t ( 'Show advanced settings' ) }
< div style = { detailsStyle } >
{ ! showAdvanced && t ( 'Advanced settings are currently not visible.' ) }
< / div >
< / KeyCell >
< td >
< Switch checked = { showAdvanced } onCheckedChange = { setShowAdvanced } / >
< / td >
< / Row >
< Row >
< KeyCell > < GlobeIcon style = { { verticalAlign : 'middle' , marginRight : '.5em' } } / > App language < / KeyCell >
< KeyCell >
{ t ( 'Show export options screen before exporting?' ) }
< div style = { detailsStyle } >
{ t ( 'This gives you an overview of the export and allows you to customise more parameters before exporting.' ) }
< / div >
< / KeyCell >
< td >
< Select value = { language || '' } onChange = { onLangChange } style = { { fontSize : '1.2em' } } >
< option key = "" value = "" > { t ( 'System language' ) } < / option >
{ Object . keys ( langNames ) . map ( ( lang ) = > < option key = { lang } value = { lang } > { langNames [ lang ] } < / option > ) }
< / Select >
< Switch checked = { exportConfirmEnabled } onCheckedChange = { toggleExportConfirmEnabled } / >
< / td >
< / Row >
@ -184,12 +201,15 @@ function Settings({
< KeyCell >
{ t ( 'Choose cutting mode: Remove or keep selected segments from video when exporting?' ) } < br / >
< div style = { detailsStyle } >
< b > { t ( 'Keep' ) } < / b > : { t ( 'The video inside segments will be kept, while the video outside will be discarded.' ) } < br / >
< b > { t ( 'Remove' ) } < / b > : { t ( 'The video inside segments will be discarded, while the video surrounding them will be kept.' ) }
{ invertCutSegments ? (
< > < b > { t ( 'Remove' ) } < / b > : { t ( 'The video inside segments will be discarded, while the video surrounding them will be kept.' ) } < / >
) : (
< > < b > { t ( 'Keep' ) } < / b > : { t ( 'The video inside segments will be kept, while the video outside will be discarded.' ) } < / >
) }
< / div >
< / KeyCell >
< td >
< Button iconBefore = { FaYinYang } appearance = { invertCutSegments ? 'd efault' : 'primary' } intent = "success" onClick = { ( ) = > setInvertCutSegments ( ( v ) = > ! v ) } >
< Button iconBefore = { FaYinYang } appearance = "primary" intent = { invertCutSegments ? 'd anger' : 'success' } onClick = { ( ) = > setInvertCutSegments ( ( v ) = > ! v ) } >
{ invertCutSegments ? t ( 'Remove' ) : t ( 'Keep' ) }
< / Button >
< / td >
@ -203,10 +223,10 @@ function Settings({
< / div >
< / KeyCell >
< td >
< div > { customOutDir } < / div >
< Button iconBefore = { customOutDir ? FolderCloseIcon : DocumentIcon } onClick = { changeOutDir } >
{ customOutDir ? t ( 'Custom working directory' ) : t ( 'Same directory as input file' ) } . . .
< / Button >
< div > { customOutDir } < / div >
{ customOutDir && (
< Button
height = { 20 }
@ -250,13 +270,13 @@ function Settings({
< div style = { detailsStyle } >
{ keyframeCut ? (
< >
{t ( 'Cut at the nearest keyframe (not accurate time.) Equiv to' ) } : < br / >
< code className = "highlighted" > ffmpeg - ss - i . . . < / code >
<b > { t ( 'Keyframe cut' ) } < / b > : {t ( 'Cut at the nearest keyframe (not accurate time.) Equiv to' ) } : < br / >
< code className = "highlighted" > ffmpeg - ss - i input . mp4 < / code >
< / >
) : (
< >
{t ( 'Accurate time but could leave an empty portion at the beginning of the video. Equiv to' ) } : < br / >
< code className = "highlighted" > ffmpeg - i - ss . . . < / code >
<b > { t ( 'Normal cut' ) } < / b > : {t ( 'Accurate time but could leave an empty portion at the beginning of the video. Equiv to' ) } : < br / >
< code className = "highlighted" > ffmpeg - i - ss input . mp4 < / code >
< / >
) }
< / div >
@ -299,17 +319,19 @@ function Settings({
< / td >
< / Row >
< Row >
< KeyCell >
{ t ( 'Snapshot capture method' ) }
< div style = { detailsStyle } > { t ( 'FFmpeg capture method might sometimes capture more correct colors, but the captured snapshot might be off by one or more frames, relative to the preview.' ) } < / div >
< / KeyCell >
< td >
< Button onClick = { ( ) = > setCaptureFrameMethod ( ( existing ) = > ( existing === 'ffmpeg' ? 'videotag' : 'ffmpeg' ) ) } >
{ captureFrameMethod === 'ffmpeg' ? t ( 'FFmpeg' ) : t ( 'HTML video tag' ) }
< / Button >
< / td >
< / Row >
{ showAdvanced && (
< Row >
< KeyCell >
{ t ( 'Snapshot capture method' ) }
< div style = { detailsStyle } > { t ( 'FFmpeg capture method might sometimes capture more correct colors, but the captured snapshot might be off by one or more frames, relative to the preview.' ) } < / div >
< / KeyCell >
< td >
< Button onClick = { ( ) = > setCaptureFrameMethod ( ( existing ) = > ( existing === 'ffmpeg' ? 'videotag' : 'ffmpeg' ) ) } >
{ captureFrameMethod === 'ffmpeg' ? t ( 'FFmpeg' ) : t ( 'HTML video tag' ) }
< / Button >
< / td >
< / Row >
) }
< Row >
< KeyCell > { t ( 'Snapshot capture quality' ) } < / KeyCell >
@ -319,14 +341,16 @@ function Settings({
< / td >
< / Row >
< Row >
< KeyCell > { t ( 'File names of extracted video frames' ) } < / KeyCell >
< td >
< Button iconBefore = { captureFrameFileNameFormat === 'timestamp' ? TimeIcon : NumericalIcon } onClick = { ( ) = > setCaptureFrameFileNameFormat ( ( existing ) = > ( existing === 'timestamp' ? 'index' : 'timestamp' ) ) } >
{ captureFrameFileNameFormat === 'timestamp' ? t ( 'Frame timestamp' ) : t ( 'Frame number' ) }
< / Button >
< / td >
< / Row >
{ showAdvanced && (
< Row >
< KeyCell > { t ( 'File names of extracted video frames' ) } < / KeyCell >
< td >
< Button iconBefore = { captureFrameFileNameFormat === 'timestamp' ? TimeIcon : NumericalIcon } onClick = { ( ) = > setCaptureFrameFileNameFormat ( ( existing ) = > ( existing === 'timestamp' ? 'index' : 'timestamp' ) ) } >
{ captureFrameFileNameFormat === 'timestamp' ? t ( 'Frame timestamp' ) : t ( 'Frame number' ) }
< / Button >
< / td >
< / Row >
) }
< Header title = { t ( 'Keyboard, mouse and input' ) } / >
@ -391,6 +415,7 @@ function Settings({
< / td >
< / Row >
< Header title = { t ( 'User interface' ) } / >
{ showAdvanced && (
@ -421,15 +446,6 @@ function Settings({
< / Row >
) }
< Row >
< KeyCell > { t ( 'In timecode show' ) } < / KeyCell >
< td >
< Button iconBefore = { timecodeFormat === 'frameCount' ? NumericalIcon : TimeIcon } onClick = { onTimecodeFormatClick } >
{ timecodeFormatOptions [ timecodeFormat ] }
< / Button >
< / td >
< / Row >
< Row >
< KeyCell > { t ( 'Prefer strong colors' ) } < / KeyCell >
< td >
@ -437,15 +453,18 @@ function Settings({
< / td >
< / Row >
< Header title = { t ( 'Prompts and dialogs' ) } / >
< Row >
< KeyCell > { t ( ' Show export options screen before exporting? ') } < / KeyCell >
< KeyCell > { t ( 'In timecode show' ) } < / KeyCell >
< td >
< Switch checked = { exportConfirmEnabled } onCheckedChange = { toggleExportConfirmEnabled } / >
< Button iconBefore = { timecodeFormat === 'frameCount' ? NumericalIcon : TimeIcon } onClick = { onTimecodeFormatClick } >
{ timecodeFormatOptions [ timecodeFormat ] }
< / Button >
< / td >
< / Row >
< Header title = { t ( 'Prompts and dialogs' ) } / >
< Row >
< KeyCell > { t ( 'Show notifications' ) } < / KeyCell >
< td >