import * as THREE from 'three';
import { App, makeLights } from './core/app';
import { Slice } from './sim/slice';
import { BREADS } from './sim/bread';
import { Rng } from './core/rng';
import './style.css';

const canvas = document.getElementById('c') as HTMLCanvasElement;
const app = new App(canvas);
makeLights(app.scene);
app.scene.background = new THREE.Color(0x1d1613);

const bench = new THREE.Mesh(
  new THREE.BoxGeometry(9, 0.3, 5),
  new THREE.MeshStandardMaterial({ color: 0x8a5a33, roughness: 0.85 }),
);
bench.position.y = -0.15;
bench.receiveShadow = true;
app.scene.add(bench);

const slice = new Slice(BREADS.white, new Rng(7));
slice.mesh.position.y = 0.12;
app.scene.add(slice.mesh);

// M0 smoke test: a browning gradient + a smear of butter, so the shader gets exercised.
for (let y = 0; y < slice.browning.n; y++) {
  for (let x = 0; x < slice.browning.n; x++) {
    const i = y * slice.browning.n + x;
    slice.browning.data[i] = (x / slice.browning.n) * 1.0;
    const dx = x / slice.spread.n - 0.5;
    const dy = y / slice.spread.n - 0.55;
    slice.spread.data[i] = Math.max(0, 0.45 - Math.hypot(dx, dy) * 1.2);
  }
}
slice.setSpread({
  id: 'butter',
  name: 'Butter',
  blurb: '',
  color: [0.97, 0.72, 0.19],
  gloss: 0.85,
  opaqueAt: 0.5,
  bump: 0.1,
  baseYield: 0.72,
  tempSoftening: 0.78,
  viscosity: 0.72,
  pickup: 0.55,
  transferRate: 1.5,
  drag: 0.5,
  scrapeEase: 1,
  amounts: { thin: [0.1, 0.22], normal: [0.25, 0.5], thick: [0.55, 0.9] },
});
slice.touch();
slice.sync();

(window as unknown as { __t: unknown }).__t = { app, slice, THREE };

app.camera.position.set(0, 1.5, 1.6);
app.camera.lookAt(0, 0.1, 0);

app.onTick((dt) => {
  slice.mesh.rotation.y += dt * 0.4;
});

app.start();
