src/utils.js 2.0 K raw
1
export function getImageData(image) {
2
  const { width, height } = image
3
  const tmpCanvas = document.createElement('canvas')
4
  const ctx = tmpCanvas.getContext('2d')
5
  let result
6
7
  tmpCanvas.width = width
8
  tmpCanvas.height = height
9
  ctx.drawImage(image, 0, 0)
10
11
  result = ctx.getImageData(0, 0, width, height)
12
  tmpCanvas.remove()
13
  return result
14
}
15
16
export async function loadImage(url) {
17
  return new Promise((resolve, reject) => {
18
    const image = new Image()
19
20
    image.onload = () => resolve(image)
21
    image.onerror = reject
22
    image.src = url
23
  })
24
}
25
26
function getFontName(url) {
27
  const ext = url.slice(url.lastIndexOf('.'))
28
  const pathParts = url.split('/')
29
30
  return pathParts[pathParts.length - 1].slice(0, -1 * ext.length)
31
}
32
33
export async function loadFont(url, fontName) {
34
  if (!fontName) fontName = getFontName(url)
35
  const styleEl = document.createElement('style')
36
37
  styleEl.innerHTML = `
38
    @font-face {
39
      font-family: ${fontName};
40
      src: url(${url});
41
    }
42
  `
43
  document.head.appendChild(styleEl)
44
  await document.fonts.load(`12px ${fontName}`)
45
}
46
47
export async function invertImage(image) {
48
  const canvas = document.createElement('canvas')
49
  const ctx = canvas.getContext('2d')
50
  canvas.width = image.width
51
  canvas.height = image.height
52
  ctx.drawImage(image, 0, 0)
53
54
  const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height)
55
  const data = imageData.data
56
  for (let i = 0; i < data.length; i += 4) {
57
    if (data[i + 3] > 0) {
58
      data[i] = 255 - data[i]
59
      data[i + 1] = 255 - data[i + 1]
60
      data[i + 2] = 255 - data[i + 2]
61
    }
62
  }
63
  ctx.putImageData(imageData, 0, 0)
64
65
  return new Promise((resolve) => {
66
    const img = new Image()
67
    img.onload = () => resolve(img)
68
    img.src = canvas.toDataURL()
69
  })
70
}
71
72
export function randInteger(min, max) {
73
  return Math.floor(Math.random() * (max - min + 1)) + min
74
}
75
76
export function randBoolean() {
77
  return Boolean(randInteger(0, 1))
78
}
79
80
export function randItem(arr) {
81
  return arr[randInteger(0, arr.length - 1)]
82
}