refactor frontend, add threshold slider

1 files changed, 0 insertions, 156 deletions

diff --git a/client/lib/upload.helpers.js b/client/lib/upload.helpers.js
deleted file mode 100644
index d0baab4..0000000
--- a/client/lib/upload.helpers.js
+++ /dev/null
@@ -1,156 +0,0 @@
-import ExifReader from 'exifreader'
-
-export const MAX_SIDE = 256
-
-function base64ToUint8Array(string, start, finish) {
-  start = start || 0
-  finish = finish || string.length
-  // atob that shit
-  const binary = atob(string)
-  const buffer = new Uint8Array(binary.length)
-  for (let i = start; i < finish; i++) {
-    buffer[i] = binary.charCodeAt(i)
-  }
-  return buffer
-}
-
-function getOrientation(uri) {
-  // Split off the base64 data
-  const base64String = uri.split(',')[1]
-  // Read off first 128KB, which is all we need to
-  // get the EXIF data
-  const arr = base64ToUint8Array(base64String, 0, 2 ** 17)
-  try {
-    const tags = ExifReader.load(arr.buffer)
-    // console.log(tags)
-    return tags.Orientation
-  } catch (err) {
-    return 1
-  }
-}
-
-function applyRotation(canvas, ctx, deg) {
-  const radians = deg * (Math.PI / 180)
-  if (deg === 90) {
-    ctx.translate(canvas.width, 0)
-  } else if (deg === 180) {
-    ctx.translate(canvas.width, canvas.height)
-  } else if (deg === 270) {
-    ctx.translate(0, canvas.height)
-  }
-  ctx.rotate(radians)
-}
-
-/**
- * Mapping from EXIF orientation values to data
- * regarding the rotation and mirroring necessary to
- * render the canvas correctly
- * Derived from:
- * http://www.daveperrett.com/articles/2012/07/28/exif-orientation-handling-is-a-ghetto/
- */
-const orientationToTransform = {
-  1: { rotation: 0, mirror: false },
-  2: { rotation: 0, mirror: true },
-  3: { rotation: 180, mirror: false },
-  4: { rotation: 180, mirror: true },
-  5: { rotation: 90, mirror: true },
-  6: { rotation: 90, mirror: false },
-  7: { rotation: 270, mirror: true },
-  8: { rotation: 270, mirror: false }
-}
-
-function applyOrientationCorrection(canvas, ctx, uri) {
-  const orientation = getOrientation(uri)
-  // Only apply transform if there is some non-normal orientation
-  if (orientation && orientation !== 1) {
-    const transform = orientationToTransform[orientation]
-    const { rotation } = transform
-    const flipAspect = rotation === 90 || rotation === 270
-    if (flipAspect) {
-      // Fancy schmancy swap algo
-      canvas.width = canvas.height + canvas.width
-      canvas.height = canvas.width - canvas.height
-      canvas.width -= canvas.height
-    }
-    if (rotation > 0) {
-      applyRotation(canvas, ctx, rotation)
-    }
-  }
-}
-
-function getScale(width, height, viewportWidth, viewportHeight, fillViewport) {
-  function fitHorizontal() {
-    return viewportWidth / width
-  }
-  function fitVertical() {
-    return viewportHeight / height
-  }
-  fillViewport = !!fillViewport
-  const landscape = (width / height) > (viewportWidth / viewportHeight)
-  if (landscape) {
-    if (fillViewport) {
-      return fitVertical()
-    }
-    if (width > viewportWidth) {
-      return fitHorizontal()
-    }
-  } else {
-    if (fillViewport) {
-      return fitHorizontal()
-    }
-    if (height > viewportHeight) {
-      return fitVertical()
-    }
-  }
-  return 1
-}
-
-export function renderToCanvas(img, options) {
-  if (!img) return null
-  options = options || {}
-
-  // Canvas max size for any side
-  const maxSide = MAX_SIDE
-  const canvas = document.createElement('canvas')
-  const ctx = canvas.getContext('2d')
-  const initialScale = options.scale || 1
-  // Scale to needed to constrain canvas to max size
-  let scale = getScale(img.naturalWidth * initialScale, img.naturalHeight * initialScale, maxSide, maxSide, true)
-  // console.log(scale)
-  // Still need to apply the user defined scale
-  scale *= initialScale
-  canvas.width = Math.round(img.naturalWidth * scale)
-  canvas.height = Math.round(img.naturalHeight * scale)
-  const { correctOrientation } = options
-  const jpeg = !!img.src.match(/data:image\/jpeg|\.jpeg$|\.jpg$/i)
-  const hasDataURI = !!img.src.match(/^data:/)
-
-  ctx.save()
-
-  // Can only correct orientation on JPEGs represented as dataURIs
-  // for the time being
-  if (correctOrientation && jpeg && hasDataURI) {
-    applyOrientationCorrection(canvas, ctx, img.src)
-  }
-  // Resize image if too large
-  if (scale !== 1) {
-    ctx.scale(scale, scale)
-  }
-
-  ctx.drawImage(img, 0, 0)
-  ctx.restore()
-
-  return canvas
-}
-
-export function renderThumbnail(img) {
-  const resized = renderToCanvas(img, { correctOrientation: true })
-  // const canvas = document.createElement('canvas') // document.querySelector('#user_photo_canvas')
-  // const ctx = canvas.getContext('2d')
-  // ctx.fillStyle = 'black'
-  // ctx.fillRect(0, 0, MAX_SIDE, MAX_SIDE)
-  // const xOffset = (MAX_SIDE - resized.width) / 2
-  // const yOffset = (MAX_SIDE - resized.height) / 2
-  // ctx.drawImage(resized, xOffset, yOffset, resized.width, resized.height)
-  return resized
-}