Partial code example of iterative image resampling

iterative-image-resampling.jsx

// This canvas is only used for initial rendering and resampling
const imageCanvas = document.createElement('canvas')
imageCanvas.width = width
imageCanvas.height = height

// If we have constraints, resize/resample the provided image
if (constraints) {
  // Get the percentage difference between the desired and actual dimensions
  // We can calculate it based on width, since we a locked aspect
  const percentageWidth = (width / constraints.width) * 100
  const absolutePercentage = Math.abs(percentageWidth)
  const percentageRounded = Math.round(absolutePercentage * 100)
  const resampleCount = Math.min(percentageRounded, 100)
  const resampleInterval = percentageWidth / resampleCount
  for (var i = 1; i <= resampleCount; i++) {
    const mw = (width / (resampleInterval * i))
    const mh = (height / (resampleInterval * i))
    imageLayer.drawImage(imageCanvas, 0, 0, mw, mh, 0, 0, mw, mh)
  }
}

context.drawImage(imageCanvas,
  0, 0, width, height,
  0, 0, canvas.width, canvas.height
)

window.open(canvas.toDataURL())