rpuzonas/nature-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: rpuzonas:5dfb8253155abac53d1f767a20d4be05c8b4281a
Branches Tags
rpuzonas:main
...
compare: rpuzonas:fd2df012afd94cf86d572b83f0c0b294ce262127
Branches Tags
rpuzonas:main

3 Commits
5dfb825315 ... fd2df012af

Author SHA1 Message Date
Rokas Puzonas
fd2df012af complete exercise 1.3 2024-02-07 00:09:24 +02:00
Rokas Puzonas
ba0dec0bb4 complete exercise 1.2 2024-02-07 00:09:18 +02:00
Rokas Puzonas
5ddad8d145 complete exercise 1.1 2024-02-07 00:09:12 +02:00
6 changed files with 179 additions and 0 deletions
Show Stats Expand all files Collapse all files

15
1. Vectors/1. Mouse Walker/index.html Normal file
View File

@ -0,0 +1,15 @@
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/p5@1.9.0/lib/p5.js"></script>
<script src="sketch.js"></script>
<style>
body {
background: #212121;
}
</style>
</head>
<body>
<main>
</main>
</body>
</html>

40
1. Vectors/1. Mouse Walker/sketch.js Normal file
View File

@ -0,0 +1,40 @@
function clamp(x, min_x, max_x) {
return min(max(x, min_x), max_x)
}
class Walker {
constructor(x = 0, y = 0) {
this.pos = createVector(x, y)
}
step() {
let vel = createVector(0, 0)
if (random(1) < 0.5) {
vel.x = clamp(mouseX - this.pos.x, -1, 1)
vel.y = clamp(mouseY - this.pos.y, -1, 1)
} else {
vel.x = floor(random(3)) - 1
vel.y = floor(random(3)) - 1
}
this.pos.add(vel)
}
draw() {
stroke(0)
point(this.pos)
}
}
let walker
function setup() {
createCanvas(640, 240)
background(255)
walker = new Walker(320, 120)
}
function draw() {
walker.step();
walker.draw();
}

15
1. Vectors/2. Perlin Walker/index.html Normal file
View File

@ -0,0 +1,15 @@
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/p5@1.9.0/lib/p5.js"></script>
<script src="sketch.js"></script>
<style>
body {
background: #212121;
}
</style>
</head>
<body>
<main>
</main>
</body>
</html>

32
1. Vectors/2. Perlin Walker/sketch.js Normal file
View File

@ -0,0 +1,32 @@
class Walker {
constructor(x = 0, y = 0) {
this.t = createVector(0, 10000)
this.pos = createVector(x, y)
}
step() {
let dx = map(noise(this.t.x), 0, 1, -1, 1)
let dy = map(noise(this.t.y), 0, 1, -1, 1)
this.pos.add(createVector(dx, dy))
this.t.add(createVector(0.01, 0.01))
}
draw() {
stroke(0)
point(this.pos)
}
}
let walker
function setup() {
createCanvas(640, 240)
background(255)
walker = new Walker(320, 120)
}
function draw() {
walker.step();
walker.draw();
}

15
1. Vectors/3. Bouncing ball/index.html Normal file
View File

@ -0,0 +1,15 @@
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/p5@1.9.0/lib/p5.js"></script>
<script src="sketch.js"></script>
<style>
body {
background: #212121;
}
</style>
</head>
<body>
<main>
</main>
</body>
</html>

62
1. Vectors/3. Bouncing ball/sketch.js Normal file
View File

@ -0,0 +1,62 @@
let position
let velocity
let topLeftCorner
let bottomRightCorner
function setup() {
createCanvas(300, 300, WEBGL)
topLeftCorner = createVector(-100, -100, -100)
bottomRightCorner = createVector(100, 100, 100)
position = createVector(0, 0)
velocity = createVector(
random(3) - 1,
random(3) - 1,
random(3) - 1,
).mult(0.2)
}
function draw() {
position.add(p5.Vector.mult(velocity, deltaTime))
if (position.x < topLeftCorner.x || position.x > bottomRightCorner.x) {
velocity.x *= -1
}
if (position.y < topLeftCorner.y || position.y > bottomRightCorner.y) {
velocity.y *= -1
}
if (position.z < topLeftCorner.z || position.z > bottomRightCorner.z) {
velocity.z *= -1
}
background(255)
noFill()
orbitControl()
stroke('red')
point(topLeftCorner)
stroke('blue')
point(bottomRightCorner)
stroke('black')
strokeWeight(0.5)
push()
translate(p5.Vector.add(topLeftCorner, bottomRightCorner).div(2))
let boundsWidth = abs(topLeftCorner.x - bottomRightCorner.x)
let boundsHeight = abs(topLeftCorner.y - bottomRightCorner.y)
let boundsDepth = abs(topLeftCorner.z - bottomRightCorner.z)
box(boundsWidth, boundsHeight, boundsDepth)
pop()
strokeWeight(2)
orbitControl()
push()
translate(position)
sphere(5)
pop()
}