marcel/omni-tools
1
0
Fork 0
mirror of https://github.com/iib0011/omni-tools.git synced 2025-09-19 22:19:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: trim video

Browse Source
This commit is contained in:
Ibrahima G. Coulibaly
2025-03-10 04:25:31 +00:00
parent d76abec8c0
commit 917a5c238c
5 changed files with 82 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
.idea/workspace.xml generated
View File

@@ -4,23 +4,12 @@
<option name="autoReloadType" value="SELECTIVE" /> <option name="autoReloadType" value="SELECTIVE" />
</component> </component>
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="fix: missing meta"> <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="feat: trim video">
<change afterPath="$PROJECT_DIR$/src/pages/tools/video/trim/index.tsx" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/pages/tools/video/trim/meta.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" /> <change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" /> <change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/ToolContent.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/ToolContent.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/examples/ToolExamples.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/examples/ToolExamples.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/input/ToolFileInput.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/input/ToolFileInput.tsx" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/components/input/ToolFileInput.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/input/ToolFileInput.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/options/ToolOptions.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/options/ToolOptions.tsx" afterDir="false" /> <change beforePath="$PROJECT_DIR$/src/pages/tools/video/trim/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/tools/video/trim/index.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/result/ToolFileResult.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/result/ToolFileResult.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/pages/tools/list/shuffle/shuffle.service.test.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/tools/list/shuffle/shuffle.service.test.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/pages/tools/string/to-morse/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/tools/string/to-morse/index.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/pages/tools/video/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/tools/video/index.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/tools/defineTool.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/tools/defineTool.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/tools/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/tools/index.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/vite.config.ts" beforeDir="false" afterPath="$PROJECT_DIR$/vite.config.ts" afterDir="false" />
</list> </list>
<option name="SHOW_DIALOG" value="false" /> <option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" /> <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -350,15 +339,7 @@
<workItem from="1741537936314" duration="1294000" /> <workItem from="1741537936314" duration="1294000" />
<workItem from="1741539602311" duration="4557000" /> <workItem from="1741539602311" duration="4557000" />
<workItem from="1741547560596" duration="1671000" /> <workItem from="1741547560596" duration="1671000" />
<workItem from="1741567442768" duration="12099000" /> <workItem from="1741567442768" duration="12784000" />
</task>
<task id="LOCAL-00113" summary="fix: tsc">
<option name="closed" value="true" />
<created>1740464642001</created>
<option name="number" value="00113" />
<option name="presentableId" value="LOCAL-00113" />
<option name="project" value="LOCAL" />
<updated>1740464642001</updated>
</task> </task>
<task id="LOCAL-00114" summary="fix: readme"> <task id="LOCAL-00114" summary="fix: readme">
<option name="closed" value="true" /> <option name="closed" value="true" />
@@ -744,7 +725,15 @@
<option name="project" value="LOCAL" /> <option name="project" value="LOCAL" />
<updated>1741568170877</updated> <updated>1741568170877</updated>
</task> </task>
<option name="localTasksCounter" value="162" /> <task id="LOCAL-00162" summary="feat: trim video">
<option name="closed" value="true" />
<created>1741580004784</created>
<option name="number" value="00162" />
<option name="presentableId" value="LOCAL-00162" />
<option name="project" value="LOCAL" />
<updated>1741580004784</updated>
</task>
<option name="localTasksCounter" value="163" />
<servers /> <servers />
</component> </component>
<component name="TypeScriptGeneratedFilesManager"> <component name="TypeScriptGeneratedFilesManager">
@@ -791,7 +780,6 @@
<option name="CHECK_CODE_SMELLS_BEFORE_PROJECT_COMMIT" value="false" /> <option name="CHECK_CODE_SMELLS_BEFORE_PROJECT_COMMIT" value="false" />
<option name="CHECK_NEW_TODO" value="false" /> <option name="CHECK_NEW_TODO" value="false" />
<option name="ADD_EXTERNAL_FILES_SILENTLY" value="true" /> <option name="ADD_EXTERNAL_FILES_SILENTLY" value="true" />
<MESSAGE value="chore: remove prettify test" />
<MESSAGE value="chore: prettify json in home" /> <MESSAGE value="chore: prettify json in home" />
<MESSAGE value="feat: jakarta font" /> <MESSAGE value="feat: jakarta font" />
<MESSAGE value="chore: img" /> <MESSAGE value="chore: img" />
@@ -816,7 +804,8 @@
<MESSAGE value="refactor: sum" /> <MESSAGE value="refactor: sum" />
<MESSAGE value="fix: tools by category scroll" /> <MESSAGE value="fix: tools by category scroll" />
<MESSAGE value="fix: missing meta" /> <MESSAGE value="fix: missing meta" />
<option name="LAST_COMMIT_MESSAGE" value="fix: missing meta" /> <MESSAGE value="feat: trim video" />
<option name="LAST_COMMIT_MESSAGE" value="feat: trim video" />
</component> </component>
<component name="XSLT-Support.FileAssociations.UIState"> <component name="XSLT-Support.FileAssociations.UIState">
<expand /> <expand />

45
package-lock.json generated
View File

@@ -31,6 +31,7 @@
"notistack": "^3.0.1", "notistack": "^3.0.1",
"omggif": "^1.0.10", "omggif": "^1.0.10",
"playwright": "^1.45.0", "playwright": "^1.45.0",
"rc-slider": "^11.1.8",
"react": "^18.3.1", "react": "^18.3.1",
"react-dom": "^18.3.1", "react-dom": "^18.3.1",
"react-helmet": "^6.1.0", "react-helmet": "^6.1.0",
@@ -4163,6 +4164,12 @@
"node": ">= 6" "node": ">= 6"
} }
}, },
"node_modules/classnames": {
"version": "2.5.1",
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz",
"integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==",
"license": "MIT"
},
"node_modules/cli-cursor": { "node_modules/cli-cursor": {
"version": "5.0.0", "version": "5.0.0",
"resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz", "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz",
@@ -8554,6 +8561,44 @@
} }
] ]
}, },
"node_modules/rc-slider": {
"version": "11.1.8",
"resolved": "https://registry.npmjs.org/rc-slider/-/rc-slider-11.1.8.tgz",
"integrity": "sha512-2gg/72YFSpKP+Ja5AjC5DPL1YnV8DEITDQrcc1eASrUYjl0esptaBVJBh5nLTXCCp15eD8EuGjwezVGSHhs9tQ==",
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.10.1",
"classnames": "^2.2.5",
"rc-util": "^5.36.0"
},
"engines": {
"node": ">=8.x"
},
"peerDependencies": {
"react": ">=16.9.0",
"react-dom": ">=16.9.0"
}
},
"node_modules/rc-util": {
"version": "5.44.4",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.44.4.tgz",
"integrity": "sha512-resueRJzmHG9Q6rI/DfK6Kdv9/Lfls05vzMs1Sk3M2P+3cJa+MakaZyWY8IPfehVuhPJFKrIY1IK4GqbiaiY5w==",
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.18.3",
"react-is": "^18.2.0"
},
"peerDependencies": {
"react": ">=16.9.0",
"react-dom": ">=16.9.0"
}
},
"node_modules/rc-util/node_modules/react-is": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
"integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
"license": "MIT"
},
"node_modules/react": { "node_modules/react": {
"version": "18.3.1", "version": "18.3.1",
"resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",

1
package.json
View File

@@ -48,6 +48,7 @@
"notistack": "^3.0.1", "notistack": "^3.0.1",
"omggif": "^1.0.10", "omggif": "^1.0.10",
"playwright": "^1.45.0", "playwright": "^1.45.0",
"rc-slider": "^11.1.8",
"react": "^18.3.1", "react": "^18.3.1",
"react-dom": "^18.3.1", "react-dom": "^18.3.1",
"react-helmet": "^6.1.0", "react-helmet": "^6.1.0",

49
src/components/input/ToolFileInput.tsx
View File

@@ -8,6 +8,8 @@ import InputFooter from './InputFooter';
import { CustomSnackBarContext } from '../../contexts/CustomSnackBarContext'; import { CustomSnackBarContext } from '../../contexts/CustomSnackBarContext';
import greyPattern from '@assets/grey-pattern.png'; import greyPattern from '@assets/grey-pattern.png';
import { globalInputHeight } from '../../config/uiConfig'; import { globalInputHeight } from '../../config/uiConfig';
import Slider from 'rc-slider';
import 'rc-slider/assets/index.css';
interface ToolFileInputProps { interface ToolFileInputProps {
value: File | null; value: File | null;
@@ -309,34 +311,25 @@ export default function ToolFileInput({
</Typography> </Typography>
</Box> </Box>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 2 }}> <Box sx={{ display: 'flex', alignItems: 'center', gap: 2 }}>
<input <div
type="range" className="range-slider-container"
min={0} style={{ margin: '20px 0', width: '100%' }}
max={videoDuration} >
step={0.1} <Slider
value={trimStart || 0} range
onChange={(e) => min={0}
handleTrimChange( max={videoDuration}
parseFloat(e.target.value), step={0.1}
trimEnd || videoDuration value={[trimStart || 0, trimEnd || videoDuration]}
) onChange={(values) => {
} if (Array.isArray(values)) {
style={{ flex: 1 }} handleTrimChange(values[0], values[1]);
/> }
<input }}
type="range" allowCross={false}
min={trimStart || 0} pushable={0.1} // Minimum distance between handles
max={videoDuration} />
step={0.1} </div>
value={trimEnd || videoDuration}
onChange={(e) =>
handleTrimChange(
trimStart || 0,
parseFloat(e.target.value)
)
}
style={{ flex: 1 }}
/>
</Box> </Box>
</Box> </Box>
)} )}

1
src/pages/tools/video/trim/index.tsx
View File

@@ -92,6 +92,7 @@ export default function TrimVideo({ title }: ToolComponentProps) {
} }
value={values.trimStart} value={values.trimStart}
label={'Start Time'} label={'Start Time'}
sx={{ mb: 2, backgroundColor: 'white' }}
/> />
<TextFieldWithDesc <TextFieldWithDesc
onOwnChange={(value) => onOwnChange={(value) =>