From 2b0ceaf2a00b03a77dc4ab3c9f470a4b7629d765 Mon Sep 17 00:00:00 2001 From: Misode Date: Tue, 25 Aug 2020 22:55:59 +0200 Subject: [PATCH] Make biome noise colors customizable and fix warp problem --- src/app/app.ts | 18 ++++++++++- src/app/visualization/BiomeNoiseVisualizer.ts | 31 ++++++++++++++++--- .../visualization/NoiseSettingsVisualizer.ts | 4 +++ src/app/visualization/Visualizer.ts | 1 + 4 files changed, 48 insertions(+), 6 deletions(-) diff --git a/src/app/app.ts b/src/app/app.ts index 42eba0d0..204faf4c 100644 --- a/src/app/app.ts +++ b/src/app/app.ts @@ -7,12 +7,14 @@ import { ModelPath, SourceView, TreeView, + Path, } from '@mcschema/core' import { getCollections, getSchemas } from '@mcschema/java-1.16' import { VisualizerView } from './visualization/VisualizerView' import { RegistryFetcher } from './RegistryFetcher' import { ErrorsView } from './ErrorsView' import config from '../config.json' +import { BiomeNoiseVisualizer } from './visualization/BiomeNoiseVisualizer' const LOCAL_STORAGE_THEME = 'theme' const LOCAL_STORAGE_LANGUAGE = 'language' @@ -62,7 +64,7 @@ const treeViewObserver = (el: HTMLElement) => { } const treeViewNodeInjector = (path: ModelPath, view: TreeView) => { - return VisualizerView.visualizers + let res = VisualizerView.visualizers .filter(v => v.active(path)) .map(v => { const id = view.registerClick(() => { @@ -71,6 +73,20 @@ const treeViewNodeInjector = (path: ModelPath, view: TreeView) => { return `` }) .join('') + if (views.visualizer.active && views.visualizer.visualizer?.getName() === 'biome-noise') { + if (path.startsWith(new Path(['generator', 'biome_source', 'biomes'])) && path.getArray().length === 4) { + const biomeVisualizer = views.visualizer.visualizer as BiomeNoiseVisualizer + const biome = path.push('biome').get() + const id = view.registerChange(el => { + biomeVisualizer.setBiomeColor(biome, (el as HTMLInputElement).value) + views.visualizer.visualizer!.state = {} + views.visualizer.invalidated() + }) + console.log("hello?") + res += `` + } + } + return res } const fetchLocale = async (id: string) => { diff --git a/src/app/visualization/BiomeNoiseVisualizer.ts b/src/app/visualization/BiomeNoiseVisualizer.ts index 355ab73a..26d1e038 100644 --- a/src/app/visualization/BiomeNoiseVisualizer.ts +++ b/src/app/visualization/BiomeNoiseVisualizer.ts @@ -8,12 +8,17 @@ export class BiomeNoiseVisualizer extends Visualizer { private noise: SimplexNoise[] private offsetX: number = 0 private offsetY: number = 0 + private biomeColors: {[id: string]: number[]} = {} constructor() { super() this.noise = BiomeNoiseVisualizer.noiseMaps.map(e => new SimplexNoise()) } + getName() { + return 'biome-noise' + } + active(path: ModelPath) { return path.endsWith(new Path(['generator', 'biome_source'])) && path.push('type').get() === 'minecraft:multi_noise' @@ -25,7 +30,7 @@ export class BiomeNoiseVisualizer extends Visualizer { for (let y = 0; y < 100; y += 1) { const i = (y * (img.width * 4)) + (x * 4) const b = this.closestBiome(x, y) - const color = this.colorFromBiome(b) + const color = this.getBiomeColor(b) data[i] = color[0] data[i + 1] = color[1] data[i + 2] = color[2] @@ -35,8 +40,8 @@ export class BiomeNoiseVisualizer extends Visualizer { } onDrag(from: number[], to: number[]) { - this.offsetX += (to[0] - from[0]) / 128 - this.offsetY += (to[1] - from[1]) / 128 + this.offsetX += to[0] - from[0] + this.offsetY += to[1] - from[1] } private closestBiome(x: number, y: number): string { @@ -66,7 +71,7 @@ export class BiomeNoiseVisualizer extends Visualizer { let n = 0 let scale = 2**config.firstOctave for (let i = 0; i < config.amplitudes.length; i++) { - n += this.noise[index].noise2D(x*scale - this.offsetX, y*scale + i - this.offsetY) + n += this.noise[index].noise2D((x - this.offsetX)*scale, (y- this.offsetY)*scale + i) * config.amplitudes[i] * 128 / scale scale *= 2 } @@ -74,12 +79,28 @@ export class BiomeNoiseVisualizer extends Visualizer { }) } + getBiomeColor(biome: string): number[] { + const color = this.biomeColors[biome] + if (color === undefined) { + return this.colorFromBiome(biome) + } + return color + } + + setBiomeColor(biome: string, value: string) { + this.biomeColors[biome] = [parseInt(value.slice(1, 3), 16), parseInt(value.slice(3, 5), 16), parseInt(value.slice(5, 7), 16)] + } + + getBiomeHex(biome: string): string { + return '#' + this.getBiomeColor(biome).map(e => e.toString(16).padStart(2, '0')).join('') + } + private colorFromBiome(biome: string): number[] { const h = Math.abs(this.hash(biome)) return [h % 256, (h >> 8) % 256, (h >> 16) % 256] } private hash(s: string) { - return s.split('').reduce((a,b)=>{a=((a<<5)-a)+b.charCodeAt(0);return a&a},0) + return (s ?? '').split('').reduce((a,b)=>{a=((a<<5)-a)+b.charCodeAt(0);return a&a},0) } } diff --git a/src/app/visualization/NoiseSettingsVisualizer.ts b/src/app/visualization/NoiseSettingsVisualizer.ts index 0f16772b..a59c3fff 100644 --- a/src/app/visualization/NoiseSettingsVisualizer.ts +++ b/src/app/visualization/NoiseSettingsVisualizer.ts @@ -14,6 +14,10 @@ export class NoiseSettingsVisualizer extends Visualizer { this.offsetX = 0 } + getName() { + return 'noise-settings' + } + active(path: ModelPath) { return path.endsWith(new Path(['noise'])) } diff --git a/src/app/visualization/Visualizer.ts b/src/app/visualization/Visualizer.ts index 26500688..90822b5d 100644 --- a/src/app/visualization/Visualizer.ts +++ b/src/app/visualization/Visualizer.ts @@ -7,6 +7,7 @@ export abstract class Visualizer { return JSON.stringify(this.state) !== JSON.stringify(path.get()) } + abstract getName(): string abstract active(path: ModelPath): boolean abstract draw(model: DataModel, img: ImageData): void