From 3015c2d1569fdc26a0ebdb93853b062f4e2e0dfc Mon Sep 17 00:00:00 2001
From: Alex Turchyn <lexfox777@gmail.com>
Date: Thu, 2 May 2024 01:57:08 +0300
Subject: [PATCH] convert BMP images to PNG before uploading in the signing
 form

---
 app/javascript/submission_form/dropzone.vue | 32 ++++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/app/javascript/submission_form/dropzone.vue b/app/javascript/submission_form/dropzone.vue
index e5a70385..922aac67 100644
--- a/app/javascript/submission_form/dropzone.vue
+++ b/app/javascript/submission_form/dropzone.vue
@@ -104,9 +104,13 @@ export default {
       this.isLoading = true
 
       return await Promise.all(
-        Array.from(files).map((file) => {
+        Array.from(files).map(async (file) => {
           const formData = new FormData()
 
+          if (file.type === 'image/bmp') {
+            file = await this.convertBmpToPng(file)
+          }
+
           formData.append('file', file)
           formData.append('submitter_slug', this.submitterSlug)
           formData.append('name', 'attachments')
@@ -122,6 +126,32 @@ export default {
       }).finally(() => {
         this.isLoading = false
       })
+    },
+    convertBmpToPng (bmpFile) {
+      return new Promise((resolve, reject) => {
+        const reader = new FileReader()
+
+        reader.onload = function (event) {
+          const img = new Image()
+
+          img.onload = function () {
+            const canvas = document.createElement('canvas')
+            const ctx = canvas.getContext('2d')
+
+            canvas.width = img.width
+            canvas.height = img.height
+            ctx.drawImage(img, 0, 0)
+            canvas.toBlob(function (blob) {
+              const newFile = new File([blob], bmpFile.name.replace(/\.\w+$/, '.png'), { type: 'image/png' })
+              resolve(newFile)
+            }, 'image/png')
+          }
+
+          img.src = event.target.result
+        }
+        reader.onerror = reject
+        reader.readAsDataURL(bmpFile)
+      })
     }
   }
 }