diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index ad99f086c..fff464cbc 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -18,6 +18,7 @@
"@embedpdf/plugin-render": "^1.1.1",
"@embedpdf/plugin-scroll": "^1.1.1",
"@embedpdf/plugin-selection": "^1.1.1",
+ "@embedpdf/plugin-spread": "^1.1.1",
"@embedpdf/plugin-tiling": "^1.1.1",
"@embedpdf/plugin-viewport": "^1.1.1",
"@embedpdf/plugin-zoom": "^1.1.1",
@@ -745,6 +746,22 @@
"vue": ">=3.2.0"
}
},
+ "node_modules/@embedpdf/plugin-spread": {
+ "version": "1.1.1",
+ "resolved": "https://registry.npmjs.org/@embedpdf/plugin-spread/-/plugin-spread-1.1.1.tgz",
+ "integrity": "sha512-UyzPKx96f96qKqtGKLv0wT26NbCUi2D+pBdk+/CUQFbe7PJfNIIpECPp0bZJAwQ6MwBWnIwCVT1OwK+egqji5A==",
+ "dependencies": {
+ "@embedpdf/models": "1.1.1"
+ },
+ "peerDependencies": {
+ "@embedpdf/core": "1.1.1",
+ "@embedpdf/plugin-loader": "1.1.1",
+ "preact": "^10.26.4",
+ "react": ">=16.8.0",
+ "react-dom": ">=16.8.0",
+ "vue": ">=3.2.0"
+ }
+ },
"node_modules/@embedpdf/plugin-tiling": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@embedpdf/plugin-tiling/-/plugin-tiling-1.1.1.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 2ffffea8e..d5a6ce969 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -14,6 +14,7 @@
"@embedpdf/plugin-render": "^1.1.1",
"@embedpdf/plugin-scroll": "^1.1.1",
"@embedpdf/plugin-selection": "^1.1.1",
+ "@embedpdf/plugin-spread": "^1.1.1",
"@embedpdf/plugin-tiling": "^1.1.1",
"@embedpdf/plugin-viewport": "^1.1.1",
"@embedpdf/plugin-zoom": "^1.1.1",
diff --git a/frontend/src/components/viewer/EmbedPdfViewer.tsx b/frontend/src/components/viewer/EmbedPdfViewer.tsx
index 1d26b5830..e59f034ae 100644
--- a/frontend/src/components/viewer/EmbedPdfViewer.tsx
+++ b/frontend/src/components/viewer/EmbedPdfViewer.tsx
@@ -132,8 +132,7 @@ const EmbedPdfViewer = ({
}}
dualPage={false}
onDualPageToggle={() => {
- // Placeholder - will implement dual page toggle later
- console.log('Toggle dual page view');
+ (window as any).embedPdfSpread?.toggleSpreadMode();
}}
currentZoom={100}
/>
diff --git a/frontend/src/components/viewer/LocalEmbedPDF.tsx b/frontend/src/components/viewer/LocalEmbedPDF.tsx
index 9a0423609..91da33f14 100644
--- a/frontend/src/components/viewer/LocalEmbedPDF.tsx
+++ b/frontend/src/components/viewer/LocalEmbedPDF.tsx
@@ -13,10 +13,12 @@ import { InteractionManagerPluginPackage, PagePointerProvider, GlobalPointerProv
import { SelectionLayer, SelectionPluginPackage } from '@embedpdf/plugin-selection/react';
import { TilingLayer, TilingPluginPackage } from '@embedpdf/plugin-tiling/react';
import { PanPluginPackage } from '@embedpdf/plugin-pan/react';
+import { SpreadPluginPackage, SpreadMode } from '@embedpdf/plugin-spread/react';
import { ZoomControlsExporter } from './ZoomControlsExporter';
import { ScrollControlsExporter } from './ScrollControlsExporter';
import { SelectionControlsExporter } from './SelectionControlsExporter';
import { PanControlsExporter } from './PanControlsExporter';
+import { SpreadControlsExporter } from './SpreadControlsExporter';
interface LocalEmbedPDFProps {
file?: File | Blob;
@@ -88,6 +90,11 @@ export function LocalEmbedPDF({ file, url, colorScheme }: LocalEmbedPDFProps) {
overlapPx: 5,
extraRings: 1,
}),
+
+ // Register spread plugin for dual page layout
+ createPluginRegistration(SpreadPluginPackage, {
+ defaultSpreadMode: SpreadMode.None, // Start with single page view
+ }),
];
}, [pdfUrl]);
@@ -166,6 +173,7 @@ export function LocalEmbedPDF({ file, url, colorScheme }: LocalEmbedPDFProps) {
+
{
+ if (spread) {
+ // Export spread controls to global window for toolbar access
+ (window as any).embedPdfSpread = {
+ setSpreadMode: (mode: SpreadMode) => {
+ console.log('EmbedPDF: Setting spread mode to:', mode);
+ spread.setSpreadMode(mode);
+ },
+ getSpreadMode: () => spread.getSpreadMode(),
+ toggleSpreadMode: () => {
+ // Toggle between None and Odd (most common dual-page mode)
+ const newMode = spreadMode === SpreadMode.None ? SpreadMode.Odd : SpreadMode.None;
+ console.log('EmbedPDF: Toggling spread mode from', spreadMode, 'to', newMode);
+ spread.setSpreadMode(newMode);
+ },
+ currentSpreadMode: spreadMode,
+ isDualPage: spreadMode !== SpreadMode.None,
+ SpreadMode: SpreadMode, // Export enum for reference
+ };
+
+ console.log('EmbedPDF spread controls exported to window.embedPdfSpread', {
+ currentSpreadMode: spreadMode,
+ isDualPage: spreadMode !== SpreadMode.None,
+ spreadAPI: spread,
+ availableMethods: Object.keys(spread)
+ });
+ } else {
+ console.warn('EmbedPDF spread API not available yet');
+ }
+ }, [spread, spreadMode]);
+
+ return null; // This component doesn't render anything
+}
\ No newline at end of file