diff --git a/src/App.vue b/src/App.vue index f51be59..cee7e1b 100644 --- a/src/App.vue +++ b/src/App.vue @@ -4,7 +4,7 @@ import EditorPanel from './components/editor/EditorPanel.vue'; import ElementPopup from './components/ElementPopup.vue'; import PagePopup from './components/PagePopup.vue'; import PreviewLoader from './components/PreviewLoader.vue'; -import { onMounted, onUnmounted, ref, watch, computed, provide } from 'vue'; +import { onMounted, ref, watch, computed, provide } from 'vue'; import { useStylesheetStore } from './stores/stylesheet'; import Coloris from '@melloware/coloris'; @@ -274,79 +274,66 @@ watch( } ); -// Handle Cmd+P / Ctrl+P to print the iframe content -const handlePrint = async (event) => { - if ((event.metaKey || event.ctrlKey) && event.key === 'p') { - event.preventDefault(); - const frame = activeFrame.value; - if (frame && frame.contentDocument) { - const doc = frame.contentDocument; +// Print the PagedJS content +const printPreview = async () => { + const frame = activeFrame.value; + if (!frame || !frame.contentDocument) return; - // Collect all styles (inline and from stylesheets) - let allStyles = ''; + const doc = frame.contentDocument; - // Get inline - - ${bodyContent} - - `; - - // Open print window - const printWindow = window.open('', '_blank'); - printWindow.document.write(printContent); - printWindow.document.close(); - - // Wait for rendering then print - setTimeout(() => { - printWindow.print(); - printWindow.close(); - }, 100); } } + + // Save current page content + const originalContent = document.body.innerHTML; + const originalStyles = document.head.innerHTML; + + // Replace page content with iframe content + document.head.innerHTML = ` + + Impression + + `; + document.body.innerHTML = doc.body.innerHTML; + + // Print + window.print(); + + // Restore original content after print dialog closes + setTimeout(() => { + document.head.innerHTML = originalStyles; + document.body.innerHTML = originalContent; + // Re-mount Vue app would be needed, so we reload instead + window.location.reload(); + }, 100); }; -onMounted(() => { - renderPreview(true); - window.addEventListener('keydown', handlePrint); -}); - -onUnmounted(() => { - window.removeEventListener('keydown', handlePrint); -}); +onMounted(() => renderPreview(true));