forked from GithubMirrors/cardconjurer
		
	convert multiple images at once
This commit is contained in:
		| @@ -5,26 +5,21 @@ var wizards = new Image(); | |||||||
| wizards.crossOrigin = 'anonymous'; | wizards.crossOrigin = 'anonymous'; | ||||||
| wizards.src = 'wizards.png'; | wizards.src = 'wizards.png'; | ||||||
|  |  | ||||||
| async function imageLocal(event) { | function prepareImage(source, filename) { | ||||||
|     var reader = new FileReader(); |     var cardImage = new Image(); | ||||||
|     reader.onload = function () { |     cardImage.crossOrigin = 'anonymous'; | ||||||
|         var cardImage = new Image(); |     cardImage.onload = function() { | ||||||
|         cardImage.crossOrigin = 'anonymous'; |         cropCard(this, filename); | ||||||
|         cardImage.onload = function() { |  | ||||||
|             cropCard(this); |  | ||||||
|         } |  | ||||||
|         cardImage.onerror = errorMessage; |  | ||||||
|         cardImage.src = reader.result; |  | ||||||
|     } |     } | ||||||
|     reader.onerror = errorMessage; |     cardImage.onerror = errorMessage; | ||||||
|     await reader.readAsDataURL(event.target.files[0]); |     cardImage.src = source; | ||||||
| } | } | ||||||
|  |  | ||||||
| function errorMessage() { | function errorMessage() { | ||||||
|     notify('An error occured. Please make sure you\'re uploading a valid image, then try again.', 10); |     notify('An error occured. Please make sure you\'re uploading a valid image, then try again.', 10); | ||||||
| } | } | ||||||
|  |  | ||||||
| async function cropCard(image) { | async function cropCard(image, filename) { | ||||||
|     // Create canvas/context |     // Create canvas/context | ||||||
|     const canvas = document.createElement('canvas'); |     const canvas = document.createElement('canvas'); | ||||||
|     // document.body.appendChild(canvas); |     // document.body.appendChild(canvas); | ||||||
| @@ -43,7 +38,6 @@ async function cropCard(image) { | |||||||
|         version = 'none'; |         version = 'none'; | ||||||
|     } |     } | ||||||
|     // Draw copyright info |     // Draw copyright info | ||||||
|     console.log(version); |  | ||||||
|     if (version == 'm15Creature') { |     if (version == 'm15Creature') { | ||||||
|         context.drawImage(wizards, 895, 2009, 509, 25); |         context.drawImage(wizards, 895, 2009, 509, 25); | ||||||
|     } else if (version == 'm15Noncreature') { |     } else if (version == 'm15Noncreature') { | ||||||
| @@ -57,7 +51,7 @@ async function cropCard(image) { | |||||||
|     context.drawImage(cardMask, 0, 0, 1500, 2100); |     context.drawImage(cardMask, 0, 0, 1500, 2100); | ||||||
|     // Download the card |     // Download the card | ||||||
|     const download = document.createElement('a'); |     const download = document.createElement('a'); | ||||||
|     download.download = document.querySelector('input').files[0].name.split('.')[0] + '.png'; |     download.download = filename.replace('filename=', '') + '.png'; | ||||||
|     download.href = canvas.toDataURL(); |     download.href = canvas.toDataURL(); | ||||||
|     document.body.appendChild(download); |     document.body.appendChild(download); | ||||||
|     await download.click(); |     await download.click(); | ||||||
|   | |||||||
| @@ -10,7 +10,10 @@ include('../globalHTML/header-1.php'); | |||||||
|     <div class="layer margin-bottom-large"> |     <div class="layer margin-bottom-large"> | ||||||
|         <div class='padding margin-bottom readable-background'> |         <div class='padding margin-bottom readable-background'> | ||||||
|             <h5 class='margin-bottom padding input-description'>Upload the image that you'd like to convert</h5> |             <h5 class='margin-bottom padding input-description'>Upload the image that you'd like to convert</h5> | ||||||
|             <input type='file' accept='.png, .svg, .jpg, .jpeg, .bmp' placeholder='File Upload' class='input' oninput='imageLocal(event);'> |             <div class='padding drop-area'> | ||||||
|  |                 <h5 class='margin-bottom padding input-description'>Drag and drop</h5> | ||||||
|  |                 <input type='file' multiple accept='.png, .svg, .jpg, .jpeg, .bmp' placeholder='File Upload' class='input' oninput='uploadFiles(event.target.files, prepareImage, "filename");' data-dropFunction='prepareImage' data-otherParams='filename'> | ||||||
|  |             </div> | ||||||
|         </div> |         </div> | ||||||
|     </div> |     </div> | ||||||
|     <div class="readable-background layer margin-bottom-large"> |     <div class="readable-background layer margin-bottom-large"> | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 Kyle
					Kyle