Mirrors/lossless-cut
1
0
Fork 0
mirror of https://github.com/mifi/lossless-cut.git synced 2024-11-22 10:22:31 +01:00
Code Issues Releases Activity

fix timestamp issue and improve clicking variables

Browse Source
This commit is contained in:
solderq35 2023-04-05 19:36:50 -07:00 committed by Mikael Finstad
parent 77e49e6dab
commit dcdcb0e21e
2 changed files with 25 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/OutSegTemplateEditor.jsx
View File

@ -1,4 +1,4 @@
import React, { memo, useState, useEffect, useCallback } from 'react';
import React, { memo, useState, useEffect, useCallback, useRef } from 'react';
import { useDebounce } from 'use-debounce';
import i18n from 'i18next';
import { useTranslation } from 'react-i18next';
@ -26,6 +26,7 @@ const OutSegTemplateEditor = memo(({ outSegTemplate, setOutSegTemplate, generate
const [error, setError] = useState();
const [outSegFileNames, setOutSegFileNames] = useState();
const [shown, setShown] = useState();
const inputRef = useRef(null);
const { t } = useTranslation();
@ -83,6 +84,24 @@ const OutSegTemplateEditor = memo(({ outSegTemplate, setOutSegTemplate, generate
const needToShow = shown || error != null;
const onTextClick = useCallback(() => {
inputRef.current.focus();
}, []);
const onVariableClick = useCallback((variable) => {
const input = inputRef.current;
const startPos = input.selectionStart;
const endPos = input.selectionEnd;
const newValue = `${text.slice(0, startPos)}${'${' + variable + '}' + text.slice(endPos)}`;
setText(newValue);
// Move the cursor to after the inserted variable
const newPos = startPos + variable.length + 2;
input.selectionStart = newPos;
input.selectionEnd = newPos;
}, [text]);
return (
<>
<div>
@ -94,7 +113,7 @@ const OutSegTemplateEditor = memo(({ outSegTemplate, setOutSegTemplate, generate
{needToShow && (
<>
<div style={{ display: 'flex', alignItems: 'center', marginBottom: 5, marginTop: 10 }}>
<input type="text" style={inputStyle} onChange={onTextChange} value={text} autoComplete="off" autoCapitalize="off" autoCorrect="off" />
<input type="text" ref={inputRef} style={inputStyle} onChange={onTextChange} onClick={onTextClick} value={text} autoComplete="off" autoCapitalize="off" autoCorrect="off" />
{outSegFileNames != null && <Button height={20} onClick={onAllSegmentsPreviewPress} marginLeft={5}>{t('Preview')}</Button>}
<Button title={t('Whether or not to sanitize output file names (sanitizing removes special characters)')} marginLeft={5} height={20} onClick={toggleSafeOutputFileName} intent={safeOutputFileName ? 'success' : 'danger'}>{safeOutputFileName ? t('Sanitize') : t('No sanitize')}</Button>
@ -106,7 +125,9 @@ const OutSegTemplateEditor = memo(({ outSegTemplate, setOutSegTemplate, generate
{isMissingExtension && <div style={{ marginBottom: '1em' }}><WarningSignIcon color="var(--amber9)" /> {i18n.t('The file name template is missing {{ext}} and will result in a file without the suggested extension. This may result in an unplayable output file.', { ext: extVar })}</div>}
<div style={{ fontSize: '.8em', color: 'var(--gray11)' }}>
{`${i18n.t('Variables')}`}{': '}
{['FILENAME', 'CUT_FROM', 'CUT_TO', 'SEG_NUM', 'SEG_LABEL', 'SEG_SUFFIX', 'EXT', 'SEG_TAGS.XX'].map((variable) => <span key={variable} role="button" style={{ cursor: 'pointer', marginRight: '.2em' }} onClick={() => setText((oldText) => `${oldText}\${${variable}}`)}>{variable}</span>)}
{['FILENAME', 'TIMESTAMP', 'CUT_FROM', 'CUT_TO', 'SEG_NUM', 'SEG_LABEL', 'SEG_SUFFIX', 'EXT', 'SEG_TAGS.XX'].map((variable) => (
<span key={variable} role="button" style={{ cursor: 'pointer', marginRight: '.2em' }} onClick={() => onVariableClick(variable)}>{variable}</span>
))}
</div>
</div>
</>

1
src/util/outputNameTemplate.js
View File

@ -74,6 +74,7 @@ function interpolateSegmentFileName({ template, inputFileNameWithoutExt, segSuff
EXT: ext,
SEG_NUM: segNum,
SEG_LABEL: segLabel,
TIMESTAMP: Date.now(),
CUT_FROM: cutFrom,
CUT_TO: cutTo,
SEG_TAGS: {