diff --git a/src/main.js b/src/main.js index 0a4c59c..b0b64c8 100644 --- a/src/main.js +++ b/src/main.js @@ -9,7 +9,7 @@ let model tf.enableProdMode() const wasmToUrl = wasm => { - const blb = new Blob([tfwasm]) + const blb = new Blob([wasm], { type: 'application/wasm' }) return URL.createObjectURL(blb) } @@ -18,11 +18,10 @@ const backendloaded = (async () => { // dead code elimination should occur here // eslint-disable-next-line camelcase if (execution_mode === 'userscript') { - weightsData = import('./model.weights.bin') - - const tfwasmthreadedsimd = await import('./tfjs-backend-wasm-threaded-simd.wasm') - const tfwasmsimd = await import('./tfjs-backend-wasm-simd.wasm') - const tfwasm = await import('./tfjs-backend-wasm.wasm') + weightsData = (await import('./model.weights.bin')).default + const tfwasmthreadedsimd = (await import('./tfjs-backend-wasm-threaded-simd.wasm')).default + const tfwasmsimd = (await import('./tfjs-backend-wasm-simd.wasm')).default + const tfwasm = (await import('./tfjs-backend-wasm.wasm')).default setWasmPaths({ 'tfjs-backend-wasm.wasm': wasmToUrl(tfwasm), 'tfjs-backend-wasm-simd.wasm': wasmToUrl(tfwasmsimd), @@ -146,6 +145,7 @@ function imageFromCanvas (img, bg, off) { const scale = th / h const canvas = document.createElement('canvas') + document.body.append(canvas) canvas.height = w * scale + pw * 2 canvas.width = th @@ -158,7 +158,27 @@ function imageFromCanvas (img, bg, off) { ctx.scale(-scale, scale) ctx.rotate((90 * Math.PI) / 180) - const draw = function (off) { + const adf = 0.3 + + const draw = function (off, adj) { + if (adj) { + if (bg) { + const border = 4 + ctx.drawImage( + bg, + /* sx */ -off + border, + /* sy */ 0, + /* sw */w - border * 2, + /* sh */h, + /* dx */-w / 2 + border, + /* dy */-h / 2 - (h * (adf * 0.5)), + /* dw */w - border * 2, + /* dh */h * (1 + adf) + ) + } + ctx.drawImage(img, -w / 2, -h / 2 - (h * (adf * 0.5)), w, h * (1 + adf)) + return + } if (bg) { const border = 4 ctx.drawImage( @@ -187,13 +207,16 @@ function imageFromCanvas (img, bg, off) { for (let off = 0; off >= -50; off--) { draw(off) - const imgdata = ctx.getImageData(0, 0, canvas.width, canvas.height) + let imgdata = ctx.getImageData(0, 0, canvas.width, canvas.height) const disorder = calculateDisorder(imgdata) if (disorder < bestDisorder) { bestDisorder = disorder + draw(off, true) + imgdata = ctx.getImageData(0, 0, canvas.width, canvas.height) bestImagedata = imgdata bestOff = off + console.log(off) } } @@ -206,11 +229,10 @@ function imageFromCanvas (img, bg, off) { slider.value = -bestOff * 2 bg.style.backgroundPositionX = bestOff + 'px' }, 1) - + draw(bestOff, true) return bestImagedata } else { draw(off) - return ctx.getImageData(0, 0, canvas.width, canvas.height) } } @@ -233,6 +255,7 @@ async function predict (img, bg, off) { model = await load() } const image = imageFromCanvas(img, bg, off) + const tensor = tf.browser .fromPixels(image, 1) .mul(-1 / 238) @@ -354,7 +377,6 @@ async function imageFromUri (uri) { const img = new Image() await new Promise((r) => (img.onload = r), (img.src = uri)) - return img } @@ -468,7 +490,7 @@ function showOpts (opts) { const observer = new MutationObserver(async function (mutationsList, observer) { solve(false) }) - +window.solve = solve observer.observe(document.body, { attributes: true, childList: true,