forked from GithubMirrors/cardconjurer
		
	upgraded print
This commit is contained in:
		| @@ -1,10 +1,10 @@ | ||||
| //Configure sizes | ||||
| var ppi = 600; | ||||
| var page = [8.5 * ppi, 11 * ppi]; | ||||
| var cardWidth = 2.5 * ppi; | ||||
| var cardHeight = 3.5 * ppi; | ||||
| var cardMarginX = parseInt(document.querySelector('#cardMargin').value); | ||||
| var cardMarginY = parseInt(document.querySelector('#cardMargin').value); | ||||
| var page = [8.5, 11]; | ||||
| var cardWidth = 2.5; | ||||
| var cardHeight = 3.5; | ||||
| var cardMarginX = parseInt(document.querySelector('#cardMargin').value) / ppi; | ||||
| var cardMarginY = parseInt(document.querySelector('#cardMargin').value) / ppi; | ||||
| //Prepare variables/canvas/context | ||||
| var imageList = []; | ||||
| var canvas = document.querySelector('canvas'); | ||||
| @@ -12,23 +12,30 @@ var context = canvas.getContext('2d'); | ||||
| drawSheet(); | ||||
|  | ||||
|  | ||||
| function uploadCard(card) { | ||||
| function uploadCard(card, filename) { | ||||
|     var img = new Image(); | ||||
|     img.crossOrigin = 'anonymous'; | ||||
|     img.onload = function() {imageList.push(this); drawSheet();} | ||||
|     img.filename = filename.replace('filename=', ''); | ||||
|     img.src = card; | ||||
| } | ||||
|  | ||||
| function drawSheet() { | ||||
|     canvas.width = page[0]; | ||||
|     canvas.height = page[1]; | ||||
|     canvas.width = page[0] * ppi; | ||||
|     canvas.height = page[1] * ppi; | ||||
|     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], (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); | ||||
|             const cardX = (page[0] - cardsX * cardWidth) / 2 + (count % cardsX) * (cardWidth + cardMarginX) - cardMarginX; | ||||
|             const cardY = (page[1] - cardsY * cardHeight) / 2 + (Math.floor(count / cardsX) % cardsY) * (cardHeight + cardMarginY) - cardMarginY; | ||||
|             try { | ||||
|                 context.drawImage(imageList[i], cardX * ppi, cardY * ppi, cardWidth * ppi, cardHeight * ppi); | ||||
|             } catch { | ||||
|                 console.log('image failed.'); | ||||
|             } | ||||
|         } | ||||
|         count ++; | ||||
|     } | ||||
| @@ -51,25 +58,48 @@ function downloadPDF() { | ||||
|     var doc = new jsPDF({ | ||||
|         orientation: pageOrientation, | ||||
|         unit: 'in', | ||||
|         format: [page[0] / ppi, page[1] / ppi] | ||||
|         format: [page[0], page[1]] | ||||
|     }); | ||||
|     doc.addImage(canvas.toDataURL('image/png'), 'PNG', 0, 0, page[0] / ppi, page[1] / ppi); | ||||
|     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) { | ||||
|             const cardX = (page[0] - cardsX * cardWidth) / 2 + (count % cardsX) * (cardWidth + cardMarginX) - cardMarginX; | ||||
|             const cardY = (page[1] - cardsY * cardHeight) / 2 + (Math.floor(count / cardsX) % cardsY) * (cardHeight + cardMarginY) - cardMarginY; | ||||
|             console.log(`image: ${imageList[i].filename}, bounds: ${cardX}, ${cardY}, ${cardWidth}, ${cardHeight}`) | ||||
|             doc.addImage(imageList[i], 'PNG', cardX, cardY, cardWidth, cardHeight); | ||||
|         } | ||||
|         count ++; | ||||
|     } | ||||
|     doc.save('print.pdf'); | ||||
| } | ||||
|  | ||||
| function setPageSize(size = [8.5, 11]) { | ||||
|     page[0] = parseFloat(size[0]) * ppi; | ||||
|     page[1] = parseFloat(size[1]) * ppi; | ||||
|     page[0] = parseFloat(size[0]); | ||||
|     page[1] = parseFloat(size[1]); | ||||
|     drawSheet(); | ||||
| } | ||||
|  | ||||
| function setCardSize(size = [2.5, 3.5]) { | ||||
|     cardWidth = parseFloat(size[0]); | ||||
|     cardHeight = parseFloat(size[1]); | ||||
|     drawSheet(); | ||||
| } | ||||
|  | ||||
| function setCardDistance(distance) { | ||||
|     cardMarginX = parseInt(distance); | ||||
|     cardMarginY = parseInt(distance); | ||||
|     cardMarginX = parseInt(distance) / ppi; | ||||
|     cardMarginY = parseInt(distance) / ppi; | ||||
|     drawSheet(); | ||||
| } | ||||
|  | ||||
| function changeOrientation() { | ||||
|     page = page.reverse(); | ||||
|     drawSheet(); | ||||
| } | ||||
|  | ||||
| function setPPI(inputPPI) { | ||||
|     ppi = parseInt(inputPPI); | ||||
|     setPageSize([page[0], page[1]]); | ||||
|     setCardSize([cardWidth, cardHeight]); | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 Kyle
					Kyle