Spaces:
Sleeping
Sleeping
Commit
•
4ba412e
1
Parent(s):
3bf0a70
Fixed print function having weird blank pages. @media print added to pop up print window
Browse files- scripts.js +47 -46
scripts.js
CHANGED
|
@@ -108,25 +108,53 @@ document.addEventListener("DOMContentLoaded", function() {
|
|
| 108 |
<script src="https://unpkg.com/htmx.org@1.7.0/dist/htmx.min.js"></script>
|
| 109 |
</head>
|
| 110 |
<body>`;
|
| 111 |
-
|
| 112 |
-
|
| 113 |
-
|
| 114 |
-
|
| 115 |
-
|
| 116 |
-
|
| 117 |
-
|
| 118 |
-
|
| 119 |
-
|
| 120 |
-
|
| 121 |
-
|
| 122 |
-
|
| 123 |
-
|
| 124 |
-
|
| 125 |
-
|
| 126 |
-
|
| 127 |
-
|
| 128 |
-
|
| 129 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 130 |
|
| 131 |
|
| 132 |
// Store initial positions of the blocks
|
|
@@ -702,23 +730,6 @@ document.addEventListener("DOMContentLoaded", function() {
|
|
| 702 |
const overflowBlocks = blocks.slice(overflowStartIndex);
|
| 703 |
const overflowHeight = overflowBlocks.reduce((acc, block) => acc + block.offsetHeight, 0);
|
| 704 |
|
| 705 |
-
// // If the target column is the first column, check if the second column has enough space
|
| 706 |
-
// if (targetColumn === 1) {
|
| 707 |
-
// const secondColumnAvailableHeight = MAX_COLUMN_HEIGHT - columnHeights[1];
|
| 708 |
-
|
| 709 |
-
// if (overflowHeight <= secondColumnAvailableHeight) {
|
| 710 |
-
// // Move the overflowing blocks to the second column within the same page
|
| 711 |
-
// overflowBlocks.forEach(block => {
|
| 712 |
-
// const blockWrapper = block.closest('.block.monster.frame.wide');
|
| 713 |
-
// if (blockWrapper) {
|
| 714 |
-
// blockWrapper.appendChild(block);
|
| 715 |
-
// block.setAttribute('data-page-id', page.getAttribute('data-page-id'));
|
| 716 |
-
// }
|
| 717 |
-
// });
|
| 718 |
-
// return;
|
| 719 |
-
// }
|
| 720 |
-
// }
|
| 721 |
-
|
| 722 |
// Get the next page if it exists
|
| 723 |
const nextPage = getNextPage(page);
|
| 724 |
if (nextPage) {
|
|
@@ -739,16 +750,6 @@ document.addEventListener("DOMContentLoaded", function() {
|
|
| 739 |
});
|
| 740 |
return;
|
| 741 |
}
|
| 742 |
-
|
| 743 |
-
// // If the next page's second column has enough space for overflow from the first column
|
| 744 |
-
// if (targetColumn === 1 && nextPageColumnHeights[1] + overflowHeight <= MAX_COLUMN_HEIGHT) {
|
| 745 |
-
// const nextPageContainer = nextPage.querySelector('.block.monster.frame.wide');
|
| 746 |
-
// overflowBlocks.forEach(block => {
|
| 747 |
-
// nextPageContainer.appendChild(block);
|
| 748 |
-
// block.setAttribute('data-page-id', nextPage.getAttribute('data-page-id'));
|
| 749 |
-
// });
|
| 750 |
-
// return;
|
| 751 |
-
// }
|
| 752 |
}
|
| 753 |
|
| 754 |
// Otherwise, create a new page and move the overflowing blocks there
|
|
|
|
| 108 |
<script src="https://unpkg.com/htmx.org@1.7.0/dist/htmx.min.js"></script>
|
| 109 |
</head>
|
| 110 |
<body>`;
|
| 111 |
+
window.printPageContainer = function() {
|
| 112 |
+
var pageContainer = document.getElementById('brewRenderer');
|
| 113 |
+
if (pageContainer) {
|
| 114 |
+
var printWindow = window.open('', 'Print Preview', 'height=800,width=600');
|
| 115 |
+
|
| 116 |
+
printWindow.document.write(`
|
| 117 |
+
<!DOCTYPE html>
|
| 118 |
+
<html lang="en">
|
| 119 |
+
<head>
|
| 120 |
+
<meta charset="UTF-8">
|
| 121 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 122 |
+
<link href="./dependencies/all.css" rel="stylesheet">
|
| 123 |
+
<link href="./dependencies/css.css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css">
|
| 124 |
+
<link href="./dependencies/bundle.css" rel="stylesheet">
|
| 125 |
+
<link href="./dependencies/style.css" rel="stylesheet">
|
| 126 |
+
<link href="./dependencies/5ePHBstyle.css" rel="stylesheet">
|
| 127 |
+
<link href="./storeUI.css" rel="stylesheet">
|
| 128 |
+
<title>Print Preview - DnD Stat Block</title>
|
| 129 |
+
<link rel="stylesheet" href="styles.css">
|
| 130 |
+
<style>
|
| 131 |
+
@media print {
|
| 132 |
+
|
| 133 |
+
.page {
|
| 134 |
+
page-break-before: auto;
|
| 135 |
+
page-break-after: avoid;
|
| 136 |
+
page-break-inside: avoid;
|
| 137 |
+
|
| 138 |
+
}
|
| 139 |
+
.columnWrapper {
|
| 140 |
+
overflow: visible;
|
| 141 |
+
}
|
| 142 |
+
|
| 143 |
+
}
|
| 144 |
+
</style>
|
| 145 |
+
</head>
|
| 146 |
+
<body>
|
| 147 |
+
${pageContainer.innerHTML}
|
| 148 |
+
</body>
|
| 149 |
+
</html>
|
| 150 |
+
`);
|
| 151 |
+
|
| 152 |
+
printWindow.document.close();
|
| 153 |
+
printWindow.focus(); // Optional: Bring the window to the front
|
| 154 |
+
} else {
|
| 155 |
+
console.error('Element with ID "pages" not found.');
|
| 156 |
+
}
|
| 157 |
+
};
|
| 158 |
|
| 159 |
|
| 160 |
// Store initial positions of the blocks
|
|
|
|
| 730 |
const overflowBlocks = blocks.slice(overflowStartIndex);
|
| 731 |
const overflowHeight = overflowBlocks.reduce((acc, block) => acc + block.offsetHeight, 0);
|
| 732 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 733 |
// Get the next page if it exists
|
| 734 |
const nextPage = getNextPage(page);
|
| 735 |
if (nextPage) {
|
|
|
|
| 750 |
});
|
| 751 |
return;
|
| 752 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 753 |
}
|
| 754 |
|
| 755 |
// Otherwise, create a new page and move the overflowing blocks there
|