import fs from "fs"
import { formatHex, parseHex, convertRgbToOklab } from 'culori'

function make_piece_colors(base) {
	let rgb = parseHex(base)
        let sh1 = convertRgbToOklab(rgb); sh1.l *= 0.9;
        let sh2 = convertRgbToOklab(rgb); sh2.l *= 0.8;
        let sh3 = convertRgbToOklab(rgb); sh3.l *= 0.7;
        let sh4 = convertRgbToOklab(rgb); sh4.l *= 0.4;
	return [ base, formatHex(sh1), formatHex(sh2), formatHex(sh3), formatHex(sh4) ]
}

const color_austria = make_piece_colors("#ffffff")
const color_bavaria = make_piece_colors("#ffc825")
const color_france = make_piece_colors("#ed1c24")
const color_pragmatic = make_piece_colors("#5f5c5c")
const color_prussia = make_piece_colors("#005988")
const color_saxony = make_piece_colors("#157d36")

const IMAGE_W = 40
const IMAGE_H = Math.round( IMAGE_W * 3/4 )

const RX = (IMAGE_W - 1) / 2
const RY = (IMAGE_H - 1) / 2
const SVG_W = RX * 2 + 3
const SVG_H = RY * 2 + 3
const CX = (RX * 2 + 3) / 2
const CY = (RY * 2 + 3) / 2

console.log("CYLINDER", SVG_W, SVG_H)

function mkarc(cx, cy, rx, ry, h) {
	return [
		'M', cx - rx, cy,
		'L', cx - rx, cy + h,
		'A', rx, ry, 0, 0, 0, cx + rx, cy + h,
		'L', cx + rx, cy,
		'z'
	].join(" ")
}

function print_cylinder(output, icon_file, c, TALL=15) {
	let icon = icon_file ? fs.readFileSync(icon_file).toString('base64') : null
	let svg = []

	svg.push(`<svg xmlns="http://www.w3.org/2000/svg" width="${SVG_W}" height="${SVG_H + TALL}">`)

	if (icon)
		svg.push(`<clipPath id="c"><ellipse cx="${CX}" cy="${CY}" rx="${RX}" ry="${RY}"/></clipPath>`)

	if (1) {
		svg.push(`<linearGradient id="g">`)
		svg.push(`<stop offset="0%" stop-color="${c[1]}"/>`)
		svg.push(`<stop offset="50%" stop-color="${c[2]}"/>`)
		svg.push(`<stop offset="100%" stop-color="${c[3]}"/>`)
		svg.push('</linearGradient>')
		svg.push(`<path fill="url(#g)" stroke="${c[4]}" d="${mkarc(CX, CY, RX, RY, TALL)}"/>`)
	} else {
		svg.push(`<path fill="${c[1]}" stroke="${c[4]}" d="${mkarc(CX, CY, RX, RY, TALL)}"/>`)
	}

	if (icon) {
		svg.push(`<image preserveAspectRatio="none" href="data:image/png;base64,${icon}" clip-path="url(#c)" x="1" y="1" width="${IMAGE_W}" height="${IMAGE_H}"/>`)
		svg.push(`<ellipse fill="none" stroke="${c[4]}" cx="${CX}" cy="${CY}" rx="${RX}" ry="${RY}"/>`)
	} else {
		svg.push(`<ellipse fill="${c[0]}" stroke="${c[4]}" cx="${CX}" cy="${CY}" rx="${RX}" ry="${RY}"/>`)
	}

	svg.push('</svg>')
	fs.writeFileSync(output, svg.join("\n") + "\n")
}

function print_disc(output, icon_file, c) {
	print_cylinder(output, icon_file, c, 8)
}

const CUBE_SIDE = 20
const CUBE_ASPECT = 3/4
const CUBE_TALL = 15

const CUBE_W = Math.round( CUBE_SIDE * Math.sqrt(2) )
const CUBE_H = Math.round( CUBE_SIDE * Math.sqrt(2) * CUBE_ASPECT )

const CUBE_SVG_W = CUBE_W + 3
const CUBE_SVG_H = CUBE_TALL + CUBE_H + 3

console.log("CUBE", CUBE_SVG_W, CUBE_SVG_H, CUBE_W)

function print_cube(output, c) {
	let svg = []

	// let xo = 0
	// let yo = 0
	// let ys = 1 // 2/3

	// let w = 20
	// let d = Math.sqrt(w * w + w * w)
	// let h = Math.round(w * 0.8)

	let xo = 1.5
	let yo = 1.5
	let dx = CUBE_W
	let dy = CUBE_H
	let h = CUBE_TALL

	let v = [
		[ xo + (dx/2), yo + (0) ],
		[ xo + (dx), yo + (dy/2) ],
		[ xo + (dx/2), yo + (dy) ],
		[ xo + (0), yo + (dy/2) ],
	]

	let v2 = [
		[ v[1][0], v[1][1] ],
		[ v[1][0], v[1][1] + h ],
		[ v[2][0], v[2][1] + h ],
		[ v[3][0], v[3][1] + h ],
		[ v[3][0], v[3][1] ],
	]

	let v3 = [
		[ v[2][0], v[2][1] ],
		[ v[2][0], v[2][1] + h ],
	]

	let f1 = [
		[ v[1][0], v[1][1] ],
		[ v[1][0], v[1][1] + h ],
		[ v[2][0], v[2][1] + h ],
		[ v[2][0], v[2][1] ],
	]

	let f2 = [
		[ v[2][0], v[2][1] ],
		[ v[2][0], v[2][1] + h ],
		[ v[3][0], v[3][1] + h ],
		[ v[3][0], v[3][1] ],
	]

	svg.push(`<svg xmlns="http://www.w3.org/2000/svg" width="${CUBE_SVG_W}" height="${CUBE_SVG_H}">`)

	svg.push(`<path fill="${c[0]}" d="M${v}"/>`)
	svg.push(`<path fill="${c[3]}" d="M${f1}"/>`)
	svg.push(`<path fill="${c[1]}" d="M${f2}"/>`)

	svg.push(`<path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="${c[4]}" d="M${v}z M${v2} M${v3}"/>`)

	svg.push('</svg>')
	fs.writeFileSync(output, svg.join("\n") + "\n")
}

print_cylinder("pieces/cylinder_austria_1.svg", "tools/cylinders.2x/face_austria_1.png", color_austria)
print_cylinder("pieces/cylinder_austria_2.svg", "tools/cylinders.2x/face_austria_2.png", color_austria)
print_cylinder("pieces/cylinder_austria_3.svg", "tools/cylinders.2x/face_austria_3.png", color_austria)
print_cylinder("pieces/cylinder_austria_4.svg", "tools/cylinders.2x/face_austria_4.png", color_austria)
print_cylinder("pieces/cylinder_austria_5.svg", "tools/cylinders.2x/face_austria_5.png", color_austria)
print_cylinder("pieces/cylinder_austria_6.svg", "tools/cylinders.2x/face_austria_6.png", color_austria)

print_cylinder("pieces/cylinder_bavaria_1.svg", "tools/cylinders.2x/face_bavaria_1.png", color_bavaria)

print_cylinder("pieces/cylinder_france_1.svg", "tools/cylinders.2x/face_france_1.png", color_france)
print_cylinder("pieces/cylinder_france_2.svg", "tools/cylinders.2x/face_france_2.png", color_france)
print_cylinder("pieces/cylinder_france_3.svg", "tools/cylinders.2x/face_france_3.png", color_france)
print_cylinder("pieces/cylinder_france_4.svg", "tools/cylinders.2x/face_france_4.png", color_france)
print_cylinder("pieces/cylinder_france_5.svg", "tools/cylinders.2x/face_france_5.png", color_france)

print_cylinder("pieces/cylinder_pragmatic_1.svg", "tools/cylinders.2x/face_pragmatic_1.png", color_pragmatic)
print_cylinder("pieces/cylinder_pragmatic_2.svg", "tools/cylinders.2x/face_pragmatic_2.png", color_pragmatic)
print_cylinder("pieces/cylinder_pragmatic_3.svg", "tools/cylinders.2x/face_pragmatic_3.png", color_pragmatic)

print_cylinder("pieces/cylinder_prussia_1.svg", "tools/cylinders.2x/face_prussia_1.png", color_prussia)
print_cylinder("pieces/cylinder_prussia_2.svg", "tools/cylinders.2x/face_prussia_2.png", color_prussia)
print_cylinder("pieces/cylinder_prussia_3.svg", "tools/cylinders.2x/face_prussia_3.png", color_prussia)
print_cylinder("pieces/cylinder_prussia_4.svg", "tools/cylinders.2x/face_prussia_4.png", color_prussia)

print_cylinder("pieces/cylinder_saxony_1.svg", "tools/cylinders.2x/face_saxony_1.png", color_saxony)

print_disc("pieces/disc_hussar.svg", "tools/cylinders.2x/face_hussar.png", color_austria)

print_cube("pieces/cube_austria.svg", color_austria)
print_cube("pieces/cube_bavaria.svg", color_bavaria)
print_cube("pieces/cube_france.svg", color_france)
print_cube("pieces/cube_pragmatic.svg", color_pragmatic)
print_cube("pieces/cube_prussia.svg", color_prussia)
print_cube("pieces/cube_saxony.svg", color_saxony)