examples
_animations
- animating-circles.js
- circle-grid.js
- circles-border-timer.js
- circles-inout.js
- circles.js
- cloud-delay.js
- clown.js
- drops.js
- grid.js
- helloworld-animate.js
- keyframe.js
- shapes-border.js
- square-grid.js
- squares-border-timer.js
- squares-timer-overlap.js
- troll.js
- circles2.js
- helloworld-animate2.js
- keyframe2.js
- keyframe3.js
_audio
_gravity
_particles
_sub
display
movement
- arrows-aim-shoot.js
- arrows-line.js
- arrows-rotate.js
- arrows-shift.js
- arrows-x.js
- arrows-y.js
- drag-drop.js
- falling-click.js
- follow-line.js
- follow-x.js
- follow-y.js
- follow.js
- if-on-edge-bounce.js
- input-aim-shoot.js
- input-point-goto.js
- input-point-moveto.js
- joystick.js
- strech-back-release-physics.js
- stretch-front-release-physics.js
- stretch-front-release.js
- drag-drop2.js
physics
showcase
tests
user-interface
gravity11.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
const g = display.rect(Point(480, 320), Size(20, 20))
g.color = color.clear
repeat(25, () => {
const c = display.circle(480, 100, 5)
c.color = color.hsb(random.num(0,360), 25, 100)
c.velocity = Vec2(1, random.num(-1, 1))
})
update(() => {
display.each("circle", (c) => {
g.forceOn(c)
})
})
draw((ctx) => {
display.each("circle", (el) => {
display.each("circle", (el2) => {
const dis = el.distanceTo(el2)
if (dis > 10 && dis < 100) {
ctx.moveTo(el.x, el.y)
ctx.lineTo(el2.x, el2.y)
ctx.strokeStyle = "white"
ctx.lineWidth = 0.1
ctx.stroke()
}
})
})
})
times(10, () => {
display.star(random.pos(), random.num(2,5))
})
const g = display.rect(Point(480, 320), Size(20, 20)) g.color = color.clear repeat(25, () => { const c = display.circle(480, 100, 5) c.color = color.hsb(random.num(0,360), 25, 100) c.velocity = Vec2(1, random.num(-1, 1)) }) update(() => { display.each("circle", (c) => { g.forceOn(c) }) }) draw((ctx) => { display.each("circle", (el) => { display.each("circle", (el2) => { const dis = el.distanceTo(el2) if (dis > 10 && dis < 100) { ctx.moveTo(el.x, el.y) ctx.lineTo(el2.x, el2.y) ctx.strokeStyle = "white" ctx.lineWidth = 0.1 ctx.stroke() } }) }) }) times(10, () => { display.star(random.pos(), random.num(2,5)) })