48 lines
1.4 KiB
JavaScript
48 lines
1.4 KiB
JavaScript
const FORM = document.getElementById("cutter-form")
|
|
const BUTTON = document.getElementById("download")
|
|
const IMAGE = new Image()
|
|
let rowCount
|
|
let maxCount
|
|
|
|
FORM.addEventListener("submit", e => {
|
|
e.preventDefault()
|
|
const data = new FormData(FORM)
|
|
IMAGE.src = URL.createObjectURL(data.get('image'))
|
|
rowCount = data.get('rows')
|
|
console.log('ça marche :', data)
|
|
})
|
|
|
|
IMAGE.addEventListener('load', e => {
|
|
document.getElementById('cutter-panel').replaceChildren()
|
|
for(let i = 0; i<rowCount; i++){
|
|
for (let j = 0; j<3; j++){
|
|
let e = document.createElement('canvas')
|
|
e.width = 1080
|
|
e.height = 1350
|
|
let context = e.getContext('2d')
|
|
context.fillStyle = 'black'
|
|
context.drawImage(IMAGE,
|
|
j*(1080*0.94), i*1350,
|
|
1080*0.94, 1350,
|
|
1080*0.03, 0,
|
|
1080*0.94, 1350
|
|
)
|
|
document.getElementById('cutter-panel').append(e)
|
|
}
|
|
}
|
|
})
|
|
|
|
BUTTON.addEventListener('click', e => {
|
|
let imgList = document.querySelectorAll('canvas')
|
|
maxCount = imgList.length
|
|
for (let [i, img] of imgList.entries()){
|
|
img.toBlob(b => {
|
|
let aEl = document.createElement('a')
|
|
let index = maxCount - i
|
|
aEl.href = URL.createObjectURL(b)
|
|
aEl.download = 'img-' + index + '.jpg'
|
|
aEl.click()
|
|
},'image/jpeg',1)
|
|
}
|
|
})
|