@@ 16,6 16,8 @@ import 'reset-css/reset.css'
import './style.css'
import palettePass from "./palette-pass"
+import kitty from './kitty.png?url'
+
const SCHED = new coro.Schedule()
const scene = new THREE.Scene()
@@ 81,8 83,8 @@ const INPUT = new Input([
axes
])
-scene.add(new THREE.GridHelper(500, 8))
-// new OrbitControls(camera, renderer.domElement)
+// scene.add(new THREE.GridHelper(500, 8))
+new OrbitControls(camera, renderer.domElement)
const GIZMOS = new Gizmos()
scene.add(GIZMOS.object3d)
@@ 112,11 114,25 @@ function drawPeg(position, color = 'white', size = 2) {
GIZMOS.line(v, v.clone().add(new THREE.Vector3(0, size, 0)), new THREE.Color(color))
}
-const zones = []
-zones.push({
+const goalZones = []
+goalZones.push({
+ box: new THREE.Box2(new THREE.Vector2(-190, -240), new THREE.Vector2(190, -60)),
+ complete: false
+})
+
+const velocityZones = []
+velocityZones.push({
box: new THREE.Box2(new THREE.Vector2(-40, -100), new THREE.Vector2(40, -20)),
velocity: new THREE.Vector2(0, -1).normalize()
})
+velocityZones.push({
+ box: new THREE.Box2(new THREE.Vector2(-80, -50), new THREE.Vector2(-40, -20)),
+ velocity: new THREE.Vector2(1, 0).normalize()
+})
+velocityZones.push({
+ box: new THREE.Box2(new THREE.Vector2(-80 + 120, -50), new THREE.Vector2(-40 + 120, -20)),
+ velocity: new THREE.Vector2(-1, 0).normalize()
+})
const terrain = []
function makeTerrainPath(path) {
@@ 143,18 159,27 @@ makeTerrainPath([
SCHED.add(function* () {
const blue = new THREE.Color(0x2929ff)
const green = new THREE.Color(0x0aff0a)
+ const darkGreen = new THREE.Color(0x007062)
+ const orange = new THREE.Color(0xff8f00)
const center = new THREE.Vector2()
while (true) {
for (const segment of terrain)
GIZMOS.line(toVector3(segment.from), toVector3(segment.to), blue)
- for (const zone of zones) {
- GIZMOS.line(toVector3(zone.box.min), toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), green)
- GIZMOS.line(toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), toVector3(zone.box.max), green)
- GIZMOS.line(toVector3(zone.box.max), toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), green)
- GIZMOS.line(toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), toVector3(zone.box.min), green)
- zone.box.getCenter(center)
- GIZMOS.line(toVector3(center), toVector3(center.clone().addScaledVector(zone.velocity, 20)), green)
- }
+ // for (const zone of velocityZones) {
+ // GIZMOS.line(toVector3(zone.box.min), toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), orange)
+ // GIZMOS.line(toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), toVector3(zone.box.max), orange)
+ // GIZMOS.line(toVector3(zone.box.max), toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), orange)
+ // GIZMOS.line(toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), toVector3(zone.box.min), orange)
+ // zone.box.getCenter(center)
+ // GIZMOS.line(toVector3(center), toVector3(center.clone().addScaledVector(zone.velocity, 20)), orange)
+ // }
+ // for (const zone of goalZones) {
+ // const color = zone.complete ? green : darkGreen
+ // GIZMOS.line(toVector3(zone.box.min), toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), color)
+ // GIZMOS.line(toVector3(new THREE.Vector2(zone.box.min.x, zone.box.max.y)), toVector3(zone.box.max), color)
+ // GIZMOS.line(toVector3(zone.box.max), toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), color)
+ // GIZMOS.line(toVector3(new THREE.Vector2(zone.box.max.x, zone.box.min.y)), toVector3(zone.box.min), color)
+ // }
yield
}
})
@@ 187,7 212,7 @@ function getSheepNear(p, except = null, threshold = 10) {
SCHED.add(function* sheep() {
while (true) {
for (const sheep of sheepies) {
- let color = 'gray'
+ let color = 'white'
// flocking
const neighborhood = getSheepNear(sheep.position, sheep, 20)
if (neighborhood.length > 0) {
@@ 216,14 241,14 @@ SCHED.add(function* sheep() {
const avoidDog = new THREE.Vector2()
avoidDog.add(sheep.position.clone().sub(dog.position).multiplyScalar(1 / dogDistance))
sheep.velocity.add(avoidDog.multiplyScalar(1))
- color = 'yellow'
+ // color = 'yellow'
}
// zone
- for (const zone of zones) {
+ for (const zone of velocityZones) {
if (zone.box.containsPoint(sheep.position)) {
sheep.velocity.addScaledVector(zone.velocity, 2)
- color = 0x007062
+ // color = 0x007062
}
}
@@ 250,6 275,60 @@ SCHED.add(function* sheep() {
}
})
+SCHED.add(function* sheep() {
+ while (true) {
+ for (const zone of goalZones) {
+ zone.complete = true
+ for (const sheep of sheepies) {
+ if (!zone.box.containsPoint(sheep.position)) {
+ zone.complete = false
+ break
+ }
+ }
+ }
+ yield
+ }
+})
+
+const map = new THREE.TextureLoader().load(kitty)
+map.colorSpace = THREE.SRGBColorSpace
+map.magFilter = THREE.NearestFilter
+map.minFilter = THREE.NearestFilter
+// const geometry = new THREE.BoxGeometry(1, 1, 1);
+// const material = new THREE.MeshBasicMaterial({ map });
+// const sprite = new THREE.Mesh(geometry, material);
+
+const geometry = new THREE.BufferGeometry();
+geometry.setAttribute('position', new THREE.Float32BufferAttribute([0, 0, 0], 3));
+const material = new THREE.PointsMaterial({ size: 100, map });
+const sprite = new THREE.Points(geometry, material);
+
+// const sprite = new THREE.Sprite(
+// new THREE.SpriteMaterial(
+// {
+// // transparent: false,
+// // sizeAttenuation: false,
+// map
+// }
+// )
+// )
+
+
+// sprite.center.set(0.5, 0.5)
+// sprite.position.set(15, 0, -55)
+sprite.scale.set(200, 200, 200)
+sprite.renderOrder = 2
+// sprite.material.map.colorSpace = THREE.SRGBColorSpace
+// scene.add(sprite)
+
+SCHED.add(function* () {
+ const origin = new THREE.Vector3()
+ while (true) {
+ GIZMOS.line(origin, sprite.position)
+ yield
+ }
+})
+
SCHED.add(function* dogMovement() {
while (true) {
cursor.position.x += INPUT.now.axes.horizontal