GithubMirrors/cardconjurer
1
0
Fork 1
mirror of https://github.com/Investigamer/cardconjurer.git synced 2025-07-27 13:21:41 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

auto white transparency

Browse Source
This commit is contained in:
Kyle
2018-11-03 20:55:34 -07:00
parent 704ad56dec
commit ba21202c16
3 changed files with 39 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
data/scripts/loadImage.js
View File

@@ -6,6 +6,9 @@ function loadImage(event, destination, arg) {
var dataURL = reader.result
destination.src = dataURL
destination.cropped = false
if (destination == imgWatermark) {
imgWatermark.whiteToTransparent = false
}
}
reader.readAsDataURL(input.files[0])
}

55
data/scripts/whiteToTransparent.js
View File

@@ -1,56 +1,35 @@
var transparentCanvas = document.createElement("canvas")
var transparentContext = transparentCanvas.getContext("2d")
//transparentCanvas.onload = function() {
//document.body.appendChild(transparentCanvas) //For testing purposes only
//}
transparentCanvas.onload = function() {
alert("WHAT")
}
//document.body.appendChild(transparentCanvas)
document.body.appendChild(transparentCanvas)
//Function that auto the image
function whiteToTransparent(url, destination) {
function whiteToTransparent(targetImage) {
//Create image, size canvas, draw image
var imgTempSetSymbol = new Image()
imgTempSetSymbol.crossOrigin = "anonymous"
imgTempSetSymbol.src = url
imgTempSetSymbol.onload = function() {
if (imgTempSetSymbol.width > 0 && imgTempSetSymbol.height > 0) {
transparentCanvas.width = imgTempSetSymbol.width
transparentCanvas.height = imgTempSetSymbol.height
transparentCanvas.drawImage(imgTempSetSymbol, 0, 0)
var imgTemporary = new Image()
imgTemporary.crossOrigin = "anonymous"
imgTemporary.src = targetImage.src
imgTemporary.onload = function() {
if (imgTemporary.width > 0 && imgTemporary.height > 0) {
transparentCanvas.width = imgTemporary.width
transparentCanvas.height = imgTemporary.height
transparentContext.drawImage(imgTemporary, 0, 0)
//declare variables
var width = transparentCanvas.width
var height = transparentCanvas.height
var pix = {x:[], y:[]}
var imageData = transparentContext.getImageData(0,0,transparentCanvas.width,transparentCanvas.height)
var x, y, index
//Go through every pixel and
for (y = 0; y < height; y++) {
for (x = 0; x < width; x++) {
//(y * width + x) * 4 + 3 calculates the index at which the alpha value of the pixel at x, y is given
index = (y * width + x) * 4 + 3
if (imageData.data[index] > 0) {
//pix is the image object that stores two arrays of x and y coordinates. These stored coordinates are all the visible pixels
pix.x.push(x)
pix.y.push(y)
index = (y * width + x) * 4
if (imageData.data[index] >= 250 && imageData.data[index + 1] >= 250 && imageData.data[index + 2] >= 250) {
imageData.data[index + 3] = 0
}
}
}
//sorts the arrays numerically
pix.x.sort(function(a,b){return a-b})
pix.y.sort(function(a,b){return a-b})
var n = pix.x.length - 1
//Finds the difference between the leftmost and rightmost visible pixels, and the topmost and bottommost pixels, cuts out a section of the canvas
width = pix.x[n] - pix.x[0]
height = pix.y[n] - pix.y[0]
var transparentImage = transparentContext.getImageData(pix.x[0], pix.y[0], width + 1, height + 1)
//Resizes the canvas and draws image
transparentCanvas.width = width + 1
transparentCanvas.height = height + 1
transparentContext.putImageData(transparentImage, 0, 0)
//Saves the newly image to the given image
destination.src = transparentCanvas.toDataURL()
transparentContext.clearRect(0, 0, width, height)
transparentContext.putImageData(imageData, 0, 0)
targetImage.src = transparentCanvas.toDataURL()
}
}
}