GithubMirrors/cardconjurer
1
0
Fork 1
mirror of https://github.com/Investigamer/cardconjurer.git synced 2025-10-25 20:30:34 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

better prints

Browse Source
This commit is contained in:
Kyle
2021-02-26 18:08:17 -08:00
parent da0059b49b
commit 30b7730ebd
3 changed files with 20 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/main-1.js
View File

@@ -65,7 +65,7 @@ function dropDrop(e) {
otherParams = e.target.closest('.drop-area').children[1].getAttribute('data-otherParams');
uploadFiles(e.dataTransfer.files, destination, otherParams);
}
async function uploadFiles(filesRaw, destination, otherParams) {
async function uploadFiles(filesRaw, destination, otherParams = '') {
var files = ([...filesRaw]);
if (files.length > 9) {
if (!confirm('You are uploading ' + files.length + ' images. Would you like to continue?')) {

2
print/index.php
View File

@@ -14,7 +14,7 @@ include('../globalHTML/header-1.php');
<h5 class='margin-bottom padding input-description'>Toggle the paper orientation (Portrait / Landscape)</h5>
<button onclick='changeOrientation();' class='input margin-bottom'>Toggle orientation</button>
<h5 class='margin-bottom padding input-description'>Set the distance between cards (in pixels)</h5>
<input type='number' class='input margin-bottom' value='50' min='0' max='100' onchange='setCardDistance(this.value);'>
<input type='number' id='cardMargin' class='input margin-bottom' value='60' min='0' max='100' onchange='setCardDistance(this.value);'>
</div>
<div class="layer">
<div class='padding margin-bottom readable-background drop-area'>

41
print/print.js
View File

@@ -1,12 +1,10 @@
//Configure sizes
var ppi = 600;
var pageWidth = 11 * ppi;
var pageHeight = 8.5 * ppi;
var page = [8.5 * ppi, 11 * ppi];
var cardWidth = 2.5 * ppi;
var cardHeight = 3.5 * ppi;
var cardMarginX = 50;
var cardMarginY = 50;
var pageOrientation = 'landscape';
var cardMarginX = parseInt(document.querySelector('#cardMargin').value);
var cardMarginY = parseInt(document.querySelector('#cardMargin').value);
//Prepare variables/canvas/context
var imageList = [];
var canvas = document.querySelector('canvas');
@@ -22,15 +20,15 @@ function uploadCard(card) {
}
function drawSheet() {
canvas.width = pageWidth;
canvas.height = pageHeight;
context.clearRect(0, 0, pageWidth, pageHeight);
const cardsX = Math.floor(pageWidth / cardWidth);
const cardsY = Math.floor(pageHeight / cardHeight);
canvas.width = page[0];
canvas.height = page[1];
context.clearRect(0, 0, page[0], page[1]);
const cardsX = Math.floor(page[0] / cardWidth);
const cardsY = Math.floor(page[1] / cardHeight);
var count = 0;
for (var i = imageList.length - 1; i >= 0 && count < cardsX * cardsY; i --) {
if (imageList[i].width > 1) {
context.drawImage(imageList[i], (pageWidth - cardsX * cardWidth) / 2 + (count % cardsX) * (cardWidth + cardMarginX) - cardMarginX, (pageHeight - cardsY * cardHeight) / 2 + (Math.floor(count / cardsX) % cardsY) * (cardHeight + cardMarginY) - cardMarginY, cardWidth, cardHeight);
context.drawImage(imageList[i], (page[0] - cardsX * cardWidth) / 2 + (count % cardsX) * (cardWidth + cardMarginX) - cardMarginX, (page[1] - cardsY * cardHeight) / 2 + (Math.floor(count / cardsX) % cardsY) * (cardHeight + cardMarginY) - cardMarginY, cardWidth, cardHeight);
}
count ++;
}
@@ -46,18 +44,22 @@ async function downloadSheet() {
}
function downloadPDF() {
var pageOrientation = 'portrait';
if (page[0] > page[1]) {
pageOrientation = 'landscape';
}
var doc = new jsPDF({
orientation: pageOrientation,
unit: 'in',
format: [pageWidth / ppi, pageHeight / ppi]
format: [page[0] / ppi, page[1] / ppi]
});
doc.addImage(canvas.toDataURL('image/png'), 'PNG', 0, 0, pageWidth / ppi, pageHeight / ppi);
doc.addImage(canvas.toDataURL('image/png'), 'PNG', 0, 0, page[0] / ppi, page[1] / ppi);
doc.save('print.pdf');
}
function setPageSize(size = [8.5, 11]) {
pageHeight = parseFloat(size[0]) * ppi;
pageWidth = parseFloat(size[1]) * ppi;
page[0] = parseFloat(size[0]) * ppi;
page[1] = parseFloat(size[1]) * ppi;
drawSheet();
}
@@ -68,13 +70,6 @@ function setCardDistance(distance) {
}
function changeOrientation() {
var oldWidth = pageWidth;
pageWidth = pageHeight;
pageHeight = oldWidth;
if (pageWidth > pageHeight) {
pageOrientation = 'landscape';
} else {
pageOrientation = 'portrait';
}
page = page.reverse();
drawSheet();
}