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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
import { lerp } from './modules/Util.js';
class BrushSelector {
constructor(rootId, canvas, terrain) {
console.log('hi');
this.canvas = canvas;
this.terrain = terrain;
this.div = document.createElement('div');
this.div.setAttribute('style', 'position: absolute; padding: 10px; display: block; right: 10px; bottom: 10px;');
this.radiusSlider = this.addSlider('Brush Size', 0, 500);
this.strengthSlider = this.addSlider('Brush Strength', 0, 100);
this.addBrush('Raise', (pt, str) => pt.height += 5 * str);
this.addBrush('Lower', (pt, str) => pt.height -= 5 * str);
this.addBrush('Round', (pt, str) => {
const neighbors = this.terrain.getNeighbors(pt);
let avg = 0;
for (let n of neighbors) avg += n.height;
avg /= neighbors.length;
pt.height = lerp(pt.height, avg, str);
});
const root = document.getElementById(rootId);
root.appendChild(this.div);
}
addSlider(label, min, max) {
const l = document.createElement('label');
const text = document.createTextNode(label);
l.appendChild(text);
this.div.appendChild(l);
const s = document.createElement('input');
s.type = 'range';
s.min = min;
s.max = max;
s.value = 0.5 * (max + min);
this.div.appendChild(s);
return s;
}
addBrush(name, f) {
const button = document.createElement('button');
const text = document.createTextNode(name);
button.appendChild(text);
button.onclick = () => {
if (this.button === button) return // already selected
if (this.button) this.button.classList.remove('selected');
button.classList.add('selected');
this.button = button;
this.f = f;
};
if (!this.button) button.onclick();
this.div.appendChild(button);
}
apply() {
const radius = this.radiusSlider.value;
const str = this.strengthSlider.value/this.strengthSlider.max;
this.terrain.applyBrush(
this.canvas.mouse.drawingPos.x,
this.canvas.mouse.drawingPos.y,
this.f, str, this.canvas.pixelsToUnits(radius)
);
}
}
export default BrushSelector;
|
