pixelDensity(1)

  createCanvas(960, 540)

  background(0)

}

​

function draw() {

  loadPixels()

​

  const rowHeight = 90

  // row area to scan

  const pstart = width * 4 * 32

  const pend = pstart+(width * rowHeight)

  // iterate over a whole row

  for (let i = pstart; i < pend; i += 1) {

    const xOffset = 128

    let x = i % width - xOffset

​

    const bi = x >> 6 // bit field index

    // 1.

    // string rows

    const line1 = 887

    const line2 = 533

    const line3 = 1559

    // get a row bit from given index and make it either white (256) or black (0) with : << 8

    b1 = ((line1 >> bi) & 1) << 8

    b2 = ((line2 >> bi) & 1) << 8

    b3 = ((line3 >> bi) & 1) << 8

    // 2. non generic variant with single 32-bit value

    //    only works if you don't care about the last glyph block

/*

    let logo1 = 2245045111

    b1 = (((logo1 & 2047) >> bi) & 1) << 8

    b2 = ((((logo1 >> 11) & 2047) >> bi) & 1) << 8

    b3 = ((((logo1 >> 22) & 2047) >> bi) & 1) << 8

*/  

    // 3. generic with single 32-bit value

    //    not encoding spaces

/*

    let logo2 = 104667903

    b1 = (((logo2 & 511) >> bi) & 0x1) << 8

    b2 = ((((logo2 >> 9) & 511) >> bi) & 0x1) << 8

    b3 = ((((logo2 >> 18) & 511) >> bi) & 0x1) << 8

*/

​

    // first row

    let index = i * 4

    pixels[index + 0] = b1

    pixels[index + 1] = b1

    pixels[index + 2] = b1

    // second row

    index += width * rowHeight * 4

    pixels[index + 0] = b2

    pixels[index + 1] = b2

    pixels[index + 2] = b2

    // third row

    index += width * rowHeight * 4

    pixels[index + 0] = b3

    pixels[index + 1] = b3

    pixels[index + 2] = b3

  }

  updatePixels()

}