mirror of
https://github.com/iib0011/omni-tools.git
synced 2025-09-23 16:09:30 +02:00
feat: rotate pdf
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { tool as pdfRotatePdf } from './rotate-pdf/meta';
|
||||
import { meta as splitPdfMeta } from './split-pdf/meta';
|
||||
import { DefinedTool } from '@tools/defineTool';
|
||||
|
||||
export const pdfTools: DefinedTool[] = [splitPdfMeta];
|
||||
export const pdfTools: DefinedTool[] = [splitPdfMeta, pdfRotatePdf];
|
||||
|
242
src/pages/tools/pdf/rotate-pdf/index.tsx
Normal file
242
src/pages/tools/pdf/rotate-pdf/index.tsx
Normal file
@@ -0,0 +1,242 @@
|
||||
import { Box, FormControlLabel, Switch, Typography } from '@mui/material';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import ToolPdfInput from '@components/input/ToolPdfInput';
|
||||
import ToolFileResult from '@components/result/ToolFileResult';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { PDFDocument } from 'pdf-lib';
|
||||
import { InitialValuesType, RotationAngle } from './types';
|
||||
import { parsePageRanges, rotatePdf } from './service';
|
||||
import SimpleRadio from '@components/options/SimpleRadio';
|
||||
import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
|
||||
|
||||
const initialValues: InitialValuesType = {
|
||||
rotationAngle: 90,
|
||||
applyToAllPages: true,
|
||||
pageRanges: ''
|
||||
};
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
title: 'Rotate All Pages 90°',
|
||||
description: 'Rotate all pages in the document 90 degrees clockwise',
|
||||
sampleText: '',
|
||||
sampleResult: '',
|
||||
sampleOptions: {
|
||||
rotationAngle: 90,
|
||||
applyToAllPages: true,
|
||||
pageRanges: ''
|
||||
}
|
||||
},
|
||||
{
|
||||
title: 'Rotate Specific Pages 180°',
|
||||
description: 'Rotate only pages 1 and 3 by 180 degrees',
|
||||
sampleText: '',
|
||||
sampleResult: '',
|
||||
sampleOptions: {
|
||||
rotationAngle: 180,
|
||||
applyToAllPages: false,
|
||||
pageRanges: '1,3'
|
||||
}
|
||||
},
|
||||
{
|
||||
title: 'Rotate Page Range 270°',
|
||||
description: 'Rotate pages 2 through 5 by 270 degrees',
|
||||
sampleText: '',
|
||||
sampleResult: '',
|
||||
sampleOptions: {
|
||||
rotationAngle: 270,
|
||||
applyToAllPages: false,
|
||||
pageRanges: '2-5'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
export default function RotatePdf({
|
||||
title,
|
||||
longDescription
|
||||
}: ToolComponentProps) {
|
||||
const [input, setInput] = useState<File | null>(null);
|
||||
const [result, setResult] = useState<File | null>(null);
|
||||
const [isProcessing, setIsProcessing] = useState<boolean>(false);
|
||||
const [totalPages, setTotalPages] = useState<number>(0);
|
||||
const [pageRangePreview, setPageRangePreview] = useState<string>('');
|
||||
|
||||
// Get the total number of pages when a PDF is uploaded
|
||||
useEffect(() => {
|
||||
const getPdfInfo = async () => {
|
||||
if (!input) {
|
||||
setTotalPages(0);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const arrayBuffer = await input.arrayBuffer();
|
||||
const pdf = await PDFDocument.load(arrayBuffer);
|
||||
setTotalPages(pdf.getPageCount());
|
||||
} catch (error) {
|
||||
console.error('Error getting PDF info:', error);
|
||||
setTotalPages(0);
|
||||
}
|
||||
};
|
||||
|
||||
getPdfInfo();
|
||||
}, [input]);
|
||||
|
||||
const onValuesChange = (values: InitialValuesType) => {
|
||||
const { pageRanges, applyToAllPages } = values;
|
||||
|
||||
if (applyToAllPages) {
|
||||
setPageRangePreview(
|
||||
totalPages > 0 ? `All ${totalPages} pages will be rotated` : ''
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!totalPages || !pageRanges?.trim()) {
|
||||
setPageRangePreview('');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const count = parsePageRanges(pageRanges, totalPages).length;
|
||||
setPageRangePreview(
|
||||
`${count} page${count !== 1 ? 's' : ''} will be rotated`
|
||||
);
|
||||
} catch (error) {
|
||||
setPageRangePreview('');
|
||||
}
|
||||
};
|
||||
|
||||
const compute = async (values: InitialValuesType, input: File | null) => {
|
||||
if (!input) return;
|
||||
|
||||
try {
|
||||
setIsProcessing(true);
|
||||
const rotatedPdf = await rotatePdf(input, values);
|
||||
setResult(rotatedPdf);
|
||||
} catch (error) {
|
||||
throw new Error('Error rotating PDF: ' + error);
|
||||
} finally {
|
||||
setIsProcessing(false);
|
||||
}
|
||||
};
|
||||
const angleOptions: { value: RotationAngle; label: string }[] = [
|
||||
{ value: 90, label: '90° Clockwise' },
|
||||
{ value: 180, label: '180° (Upside down)' },
|
||||
{ value: 270, label: '270° (90° Counter-clockwise)' }
|
||||
];
|
||||
return (
|
||||
<ToolContent
|
||||
title={title}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
initialValues={initialValues}
|
||||
compute={compute}
|
||||
exampleCards={exampleCards}
|
||||
inputComponent={
|
||||
<ToolPdfInput
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
accept={['application/pdf']}
|
||||
title={'Input PDF'}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolFileResult
|
||||
title={'Rotated PDF'}
|
||||
value={result}
|
||||
extension={'pdf'}
|
||||
loading={isProcessing}
|
||||
loadingText={'Rotating pages'}
|
||||
/>
|
||||
}
|
||||
getGroups={({ values, updateField }) => [
|
||||
{
|
||||
title: 'Rotation Settings',
|
||||
component: (
|
||||
<Box>
|
||||
<Typography variant="subtitle2" sx={{ mb: 1 }}>
|
||||
Rotation Angle
|
||||
</Typography>
|
||||
{angleOptions.map((angleOption) => (
|
||||
<SimpleRadio
|
||||
key={angleOption.value}
|
||||
title={angleOption.label}
|
||||
checked={values.rotationAngle === angleOption.value}
|
||||
onClick={() => {
|
||||
updateField('rotationAngle', angleOption.value);
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
|
||||
<Box sx={{ mt: 2 }}>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
checked={values.applyToAllPages}
|
||||
onChange={(e) => {
|
||||
updateField('applyToAllPages', e.target.checked);
|
||||
}}
|
||||
/>
|
||||
}
|
||||
label="Apply to all pages"
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{!values.applyToAllPages && (
|
||||
<Box sx={{ mt: 2 }}>
|
||||
{totalPages > 0 && (
|
||||
<Typography variant="body2" sx={{ mb: 1 }}>
|
||||
PDF has {totalPages} page{totalPages !== 1 ? 's' : ''}
|
||||
</Typography>
|
||||
)}
|
||||
<TextFieldWithDesc
|
||||
value={values.pageRanges}
|
||||
onOwnChange={(val) => {
|
||||
updateField('pageRanges', val);
|
||||
}}
|
||||
description={
|
||||
'Enter page numbers or ranges separated by commas (e.g., 1,3,5-7)'
|
||||
}
|
||||
placeholder={'e.g., 1,5-8'}
|
||||
/>
|
||||
{pageRangePreview && (
|
||||
<Typography
|
||||
variant="body2"
|
||||
sx={{ mt: 1, color: 'primary.main' }}
|
||||
>
|
||||
{pageRangePreview}
|
||||
</Typography>
|
||||
)}
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
]}
|
||||
onValuesChange={onValuesChange}
|
||||
toolInfo={{
|
||||
title: 'How to Use the Rotate PDF Tool',
|
||||
description: `This tool allows you to rotate pages in a PDF document. You can rotate all pages or specify individual pages to rotate.
|
||||
|
||||
Choose a rotation angle:
|
||||
- 90° Clockwise
|
||||
- 180° (Upside down)
|
||||
- 270° (90° Counter-clockwise)
|
||||
|
||||
To rotate specific pages:
|
||||
1. Uncheck "Apply to all pages"
|
||||
2. Enter page numbers or ranges separated by commas (e.g., 1,3,5-7)
|
||||
|
||||
Examples:
|
||||
- "1,5,9" rotates pages 1, 5, and 9
|
||||
- "1-5" rotates pages 1 through 5
|
||||
- "1,3-5,8-10" rotates pages 1, 3, 4, 5, 8, 9, and 10
|
||||
|
||||
${longDescription}`
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
14
src/pages/tools/pdf/rotate-pdf/meta.ts
Normal file
14
src/pages/tools/pdf/rotate-pdf/meta.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('pdf', {
|
||||
name: 'Rotate PDF',
|
||||
path: 'rotate-pdf',
|
||||
icon: 'carbon:rotate',
|
||||
description: 'Rotate PDF pages by 90, 180, or 270 degrees',
|
||||
shortDescription: 'Rotate pages in a PDF document',
|
||||
keywords: ['pdf', 'rotate', 'rotation', 'document', 'pages', 'orientation'],
|
||||
longDescription:
|
||||
'Change the orientation of PDF pages by rotating them 90, 180, or 270 degrees. Useful for fixing incorrectly scanned documents or preparing PDFs for printing.',
|
||||
component: lazy(() => import('./index'))
|
||||
});
|
36
src/pages/tools/pdf/rotate-pdf/rotate-pdf.service.test.ts
Normal file
36
src/pages/tools/pdf/rotate-pdf/rotate-pdf.service.test.ts
Normal file
@@ -0,0 +1,36 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import { parsePageRanges } from './service';
|
||||
|
||||
describe('rotate-pdf', () => {
|
||||
describe('parsePageRanges', () => {
|
||||
it('should return all pages when pageRanges is empty', () => {
|
||||
const result = parsePageRanges('', 5);
|
||||
expect(result).toEqual([1, 2, 3, 4, 5]);
|
||||
});
|
||||
|
||||
it('should parse single page numbers', () => {
|
||||
const result = parsePageRanges('1,3,5', 5);
|
||||
expect(result).toEqual([1, 3, 5]);
|
||||
});
|
||||
|
||||
it('should parse page ranges', () => {
|
||||
const result = parsePageRanges('2-4', 5);
|
||||
expect(result).toEqual([2, 3, 4]);
|
||||
});
|
||||
|
||||
it('should parse mixed page numbers and ranges', () => {
|
||||
const result = parsePageRanges('1,3-5', 5);
|
||||
expect(result).toEqual([1, 3, 4, 5]);
|
||||
});
|
||||
|
||||
it('should ignore invalid page numbers', () => {
|
||||
const result = parsePageRanges('1,8,3', 5);
|
||||
expect(result).toEqual([1, 3]);
|
||||
});
|
||||
|
||||
it('should handle whitespace', () => {
|
||||
const result = parsePageRanges(' 1, 3 - 5 ', 5);
|
||||
expect(result).toEqual([1, 3, 4, 5]);
|
||||
});
|
||||
});
|
||||
});
|
82
src/pages/tools/pdf/rotate-pdf/service.ts
Normal file
82
src/pages/tools/pdf/rotate-pdf/service.ts
Normal file
@@ -0,0 +1,82 @@
|
||||
import { degrees, PDFDocument } from 'pdf-lib';
|
||||
import { InitialValuesType } from './types';
|
||||
|
||||
/**
|
||||
* Parses a page range string and returns an array of page numbers
|
||||
* @param pageRangeStr String like "1,3-5,7" to extract pages 1, 3, 4, 5, and 7
|
||||
* @param totalPages Total number of pages in the PDF
|
||||
* @returns Array of page numbers to extract
|
||||
*/
|
||||
export function parsePageRanges(
|
||||
pageRangeStr: string,
|
||||
totalPages: number
|
||||
): number[] {
|
||||
if (!pageRangeStr.trim()) {
|
||||
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
||||
}
|
||||
|
||||
const pageNumbers = new Set<number>();
|
||||
const ranges = pageRangeStr.split(',');
|
||||
|
||||
for (const range of ranges) {
|
||||
const trimmedRange = range.trim();
|
||||
|
||||
if (trimmedRange.includes('-')) {
|
||||
const [start, end] = trimmedRange.split('-').map(Number);
|
||||
if (!isNaN(start) && !isNaN(end)) {
|
||||
// Handle both forward and reversed ranges
|
||||
const normalizedStart = Math.min(start, end);
|
||||
const normalizedEnd = Math.max(start, end);
|
||||
|
||||
for (
|
||||
let i = Math.max(1, normalizedStart);
|
||||
i <= Math.min(totalPages, normalizedEnd);
|
||||
i++
|
||||
) {
|
||||
pageNumbers.add(i);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
const pageNum = parseInt(trimmedRange, 10);
|
||||
if (!isNaN(pageNum) && pageNum >= 1 && pageNum <= totalPages) {
|
||||
pageNumbers.add(pageNum);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return [...pageNumbers].sort((a, b) => a - b);
|
||||
}
|
||||
|
||||
/**
|
||||
* Rotates pages in a PDF file
|
||||
* @param pdfFile The input PDF file
|
||||
* @param options Options including rotation angle and page selection
|
||||
* @returns Promise resolving to a new PDF file with rotated pages
|
||||
*/
|
||||
export async function rotatePdf(
|
||||
pdfFile: File,
|
||||
options: InitialValuesType
|
||||
): Promise<File> {
|
||||
const { rotationAngle, applyToAllPages, pageRanges } = options;
|
||||
|
||||
const arrayBuffer = await pdfFile.arrayBuffer();
|
||||
const pdfDoc = await PDFDocument.load(arrayBuffer);
|
||||
const totalPages = pdfDoc.getPageCount();
|
||||
|
||||
// Determine which pages to rotate
|
||||
const pagesToRotate = applyToAllPages
|
||||
? Array.from({ length: totalPages }, (_, i) => i + 1)
|
||||
: parsePageRanges(pageRanges, totalPages);
|
||||
|
||||
// Apply rotation to selected pages
|
||||
for (const pageNum of pagesToRotate) {
|
||||
const page = pdfDoc.getPage(pageNum - 1);
|
||||
page.setRotation(degrees(rotationAngle));
|
||||
}
|
||||
|
||||
// Save the modified PDF
|
||||
const modifiedPdfBytes = await pdfDoc.save();
|
||||
const newFileName = pdfFile.name.replace('.pdf', '-rotated.pdf');
|
||||
|
||||
return new File([modifiedPdfBytes], newFileName, { type: 'application/pdf' });
|
||||
}
|
7
src/pages/tools/pdf/rotate-pdf/types.ts
Normal file
7
src/pages/tools/pdf/rotate-pdf/types.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
export type RotationAngle = 90 | 180 | 270;
|
||||
|
||||
export type InitialValuesType = {
|
||||
rotationAngle: RotationAngle;
|
||||
applyToAllPages: boolean;
|
||||
pageRanges: string;
|
||||
};
|
Reference in New Issue
Block a user