Snippet Zone

Remove First Line of a String

```
str.replace(/.*/, '').substr(1)
```

Needed this one today…

November 20, 2021

// javascript // regex // strings

Gravity Dots 2

```
d = document
```
```
b = d.body
```
```
b.style.margin = 0
```
```
b.style.background = 'black'
```
```
r = (v = 1) => Math.random() * v
```
```
 
```
```
with(
```
```
  b.appendChild(
```
```
    d.createElement`canvas`
```
```
  ).getContext`2d`) {
```
```
 
```
```
  onresize = () => {
```
```
    canvas.width = innerWidth
```
```
    canvas.height = innerHeight
```
```
  }
```
```
  onresize()
```
```
 
```
```
  fillStyle = 'red'
```
```
 
```
```
  dot = (
```
```
    x = r(innerWidth),
```
```
    y = 0,
```
```
    mass = 20, sr = r(2) + 2, 
```
```
    R = sr,
```
```
    dx, dy,
```
```
    col = '#005eb0',
```
```
    dist, vx = .2, vy = 0) => { 
```
```
 
```
```
    return () => { 
```
```
      fillStyle = col
```
```
      R = sr
```
```
      if (r() < .001) {
```
```
        vx = r() * 4 - 2
```
```
        R = sr * 2
```
```
        fillStyle = 'red'
```

        col = `hsl(${r(360)}deg, 50%, 50%)`

```
      }
```
```
 
```
```
      dx = innerWidth / 2 - x
```
```
      dy = innerHeight / 2 - y
```

      dist = Math.sqrt(dx * dx + dy * dy)

```
      dist *= dist
```
```
      vx += dx / dist * mass
```
```
      vy += dy / dist * mass
```
```
 
```
```
      x += vx
```
```
      y += vy
```
```
 
```
```
      beginPath()
```
```
      arc(x, y, R, 0, 6.29)
```
```
      fill()
```
```
    }
```
```
  }
```
```
 
```
```
  const dots = []
```

  for (let i = 0; i < 100; i++) dots.push(dot())

```
  loop = () => {
```
```
    fillStyle = 'rgba(0, 0, 0, 0.05)'
```

    fillRect(0, 0, canvas.width, canvas.height)

```
    dots.map(d => d())
```
```
  }
```
```
  setInterval(loop, 16)
```
```
}
```

A variation on this recent post.

November 18, 2021

// animation // canvas // javascript // math // speed-coded

Get the milliseconds

```
console.log(+new Date());
```
```
console.log(Date.now());
```

At some point I got in the habit of doing +new Date(). Not entirely sure why, Date.now() is the clear choice. I guess maybe Date.now() is newer…

confirmed… it is new, doesn’t work in much older browsers…

November 17, 2021

// javascript // speed-coded // tricks

Gravity Dots

```
d = document
```
```
b = d.body
```
```
b.style.margin = 0
```
```
b.style.background = 'black'
```
```
r = (v = 1) => Math.random() * v
```
```
 
```
```
with(
```
```
  b.appendChild(
```
```
    d.createElement`canvas`
```
```
  ).getContext`2d`) {
```
```
 
```
```
  onresize = () => {
```
```
    canvas.width = innerWidth
```
```
    canvas.height = innerHeight
```
```
  }
```
```
  onresize()
```
```
 
```
```
  fillStyle = 'red'
```
```
 
```
```
  dot = (
```
```
    x = r(innerWidth),
```
```
    y = r(innerHeight),
```
```
    mass = 10, sr = r(8) + 4, 
```
```
    R = sr,
```
```
    dx, dy,
```
```
    dist, vx = .2, vy = 0) => { 
```
```
 
```
```
    return () => { 
```
```
      fillStyle = '#005eb0'
```
```
      R = sr
```
```
      if (r() < .005) {
```
```
        vx = r() * 4 - 2
```
```
        R = sr * 2
```
```
        fillStyle = 'white'
```
```
      }
```
```
 
```
```
      dx = innerWidth / 2 - x
```
```
      dy = innerHeight / 2 - y
```

      dist = Math.sqrt(dx * dx + dy * dy)

```
      dist *= dist
```
```
      vx += dx / dist * mass
```
```
      vy += dy / dist * mass
```
```
 
```
```
      x += vx
```
```
      y += vy
```
```
 
```
```
      beginPath()
```
```
      arc(x, y, R, 0, 6.29)
```
```
      fill()
```
```
    }
```
```
  }
```
```
 
```
```
  const dots = []
```

  for (let i = 0; i < 10; i++) dots.push(dot())

```
  loop = () => {
```
```
    fillStyle = 'rgba(0, 0, 0, 0.2)'
```

    fillRect(0, 0, canvas.width, canvas.height)

```
    dots.map(d => d())
```
```
  }
```
```
  setInterval(loop, 16)
```
```
}
```

Some speed coded dots that gravitate to the center of the screen and occasionally change direction.

November 16, 2021

// animation // canvas // graphics // javascript // math // random // speed-coded

Merge Collection (array of objects)

```
const collection = [
```
```
  { name: 'Joe' },
```
```
  { age: 31 },
```
```
  { job: 'programmer' }
```
```
];
```

const merged = Object.assign({}, ...collection);

```
console.log(merged);
```

Combine (“assign”) entire array of objects.

Saw this here… figured it was worth a quick post.

November 15, 2021

// arrays // javascript // objects // tricks

Older Posts

Newer Posts

Remove First Line of a String

Gravity Dots 2

Get the milliseconds

Gravity Dots

Merge Collection (array of objects)

Recent

Archive