mirror of
https://github.com/amitwh/markdown-converter.git
synced 2026-08-02 18:10:18 +05:30
Fix print preview to properly hide toolbar and show only markdown content
- Rewrote handlePrintPreview to explicitly hide all UI elements - Store and restore original display values for clean restoration - Make preview pane absolute positioned and full width for printing - Hide toolbar, tab bar, status bar, editor pane, and dialogs - Added proper timing for DOM updates before printing 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
+84
-12
@@ -1184,23 +1184,95 @@ function handlePrintPreview(withStyles) {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Add print style classes to body for styling control
|
// Store original display values for restoration
|
||||||
// The @media print CSS will handle hiding toolbar/tabs automatically
|
const elementsToHide = [];
|
||||||
if (!withStyles) {
|
|
||||||
document.body.classList.add('printing-no-styles');
|
|
||||||
}
|
|
||||||
document.body.classList.add('printing');
|
|
||||||
|
|
||||||
// Give browser time to apply classes before printing
|
// Hide toolbar
|
||||||
|
const toolbar = document.querySelector('.toolbar');
|
||||||
|
if (toolbar) {
|
||||||
|
elementsToHide.push({ elem: toolbar, display: toolbar.style.display });
|
||||||
|
toolbar.style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide tab bar
|
||||||
|
const tabBar = document.querySelector('.tab-bar');
|
||||||
|
if (tabBar) {
|
||||||
|
elementsToHide.push({ elem: tabBar, display: tabBar.style.display });
|
||||||
|
tabBar.style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide status bar
|
||||||
|
const statusBar = document.querySelector('.status-bar');
|
||||||
|
if (statusBar) {
|
||||||
|
elementsToHide.push({ elem: statusBar, display: statusBar.style.display });
|
||||||
|
statusBar.style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide editor pane
|
||||||
|
const editorPane = document.getElementById(`editor-pane-${activeTabId}`);
|
||||||
|
if (editorPane) {
|
||||||
|
elementsToHide.push({ elem: editorPane, display: editorPane.style.display });
|
||||||
|
editorPane.style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide all dialogs
|
||||||
|
const dialogs = document.querySelectorAll('.dialog, .modal-overlay');
|
||||||
|
dialogs.forEach(dialog => {
|
||||||
|
elementsToHide.push({ elem: dialog, display: dialog.style.display });
|
||||||
|
dialog.style.display = 'none';
|
||||||
|
});
|
||||||
|
|
||||||
|
// Make preview pane full width
|
||||||
|
const previewPane = document.getElementById(`preview-pane-${activeTabId}`);
|
||||||
|
let originalPreviewStyles = {};
|
||||||
|
if (previewPane) {
|
||||||
|
originalPreviewStyles = {
|
||||||
|
position: previewPane.style.position,
|
||||||
|
top: previewPane.style.top,
|
||||||
|
left: previewPane.style.left,
|
||||||
|
width: previewPane.style.width,
|
||||||
|
height: previewPane.style.height,
|
||||||
|
margin: previewPane.style.margin,
|
||||||
|
padding: previewPane.style.padding
|
||||||
|
};
|
||||||
|
previewPane.style.position = 'absolute';
|
||||||
|
previewPane.style.top = '0';
|
||||||
|
previewPane.style.left = '0';
|
||||||
|
previewPane.style.width = '100%';
|
||||||
|
previewPane.style.height = 'auto';
|
||||||
|
previewPane.style.margin = '0';
|
||||||
|
previewPane.style.padding = '20px';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Apply no-styles if needed
|
||||||
|
if (!withStyles && previewContent) {
|
||||||
|
previewContent.style.color = '#000';
|
||||||
|
previewContent.style.background = '#fff';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wait for DOM updates then print
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
// Tell main process to print
|
|
||||||
ipcRenderer.send('do-print', { withStyles });
|
ipcRenderer.send('do-print', { withStyles });
|
||||||
|
|
||||||
// Restore classes after print dialog appears
|
// Restore everything after print dialog opens
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
document.body.classList.remove('printing', 'printing-no-styles');
|
// Restore hidden elements
|
||||||
}, 1000);
|
elementsToHide.forEach(({ elem, display }) => {
|
||||||
}, 100);
|
elem.style.display = display;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Restore preview pane styles
|
||||||
|
if (previewPane) {
|
||||||
|
Object.assign(previewPane.style, originalPreviewStyles);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Restore preview content styles
|
||||||
|
if (!withStyles && previewContent) {
|
||||||
|
previewContent.style.color = '';
|
||||||
|
previewContent.style.background = '';
|
||||||
|
}
|
||||||
|
}, 500);
|
||||||
|
}, 200);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Export Dialog functionality
|
// Export Dialog functionality
|
||||||
|
|||||||
Reference in New Issue
Block a user