VirtualDungeon/common/Color.ts

/**
 * HSV Struct
 * all fields are from 0-1.
 * undefined a == 1
 */

export type HSV = {
	h: number;
	s: number;
	v: number;
	a?: number;
}


/**
 * RGB Struct
 * r, g, b are from 0-255
 * a is from 0-1, undefined == 1
 */

export type RGB = {
	r: number;
	g: number;
	b: number;
	a?: number;
}


/**
 * Converts an HSV Color to RGB.
 * Source: https://stackoverflow.com/questions/17242144/#comment24984878_17242144
 *
 * @param {HSV} hsv - The HSV value to convert.
 * @returns {RGB} the RGB representation.
 */

export function HSVToRGB(hsv: HSV = { h: 0, s: 0, v: 0}): RGB {
	let r: number = 0, g: number = 0, b: number = 0;

	let i = Math.floor(hsv.h * 6);
	let f = hsv.h * 6 - i;
	let p = hsv.v * (1 - hsv.s);
	let q = hsv.v * (1 - f * hsv.s);
	let t = hsv.v * (1 - (1 - f) * hsv.s);

	switch(i % 6) {
	default: break;
	case 0: r = hsv.v; g = t; b = p; break;
	case 1: r = q; g = hsv.v; b = p; break;
	case 2: r = p; g = hsv.v; b = t; break;
	case 3: r = p; g = q; b = hsv.v; break;
	case 4: r = t; g = p; b = hsv.v; break;
	case 5: r = hsv.v; g = p; b = q; break;
	}

	return { r: r * 255, g: g * 255, b: b * 255 };
}


/**
 * Converts an RGB Color to HSV.
 * Source: https://stackoverflow.com/questions/8022885/rgb-to-hsv-color-in-javascript
 *
 * @param {RGB} rgb - The RGB value to convert.
 * @returns {HSV} the HSV representation.
 */

export function RGBToHSV(rgb: RGB = { r: 0, g: 0, b: 0}): HSV {
	let rabs, gabs, babs, rr, gg, bb, h = 0, s, v: any, diff: any, diffc;
	rabs = rgb.r / 255;
	gabs = rgb.g / 255;
	babs = rgb.b / 255;
	v = Math.max(rabs, gabs, babs);
	diff = v - Math.min(rabs, gabs, babs);
	diffc = (c: any) => (v - c) / 6 / diff + 1 / 2;
	
	if (diff === 0) h = s = 0;
	else {
		s = diff / v;
		rr = diffc(rabs);
		gg = diffc(gabs);
		bb = diffc(babs);

		if (rabs === v) h = bb - gg;
		else if (gabs === v) h = (1 / 3) + rr - bb;
		else if (babs === v) h = (2 / 3) + gg - rr;

		if (h < 0) h += 1;
		else if (h > 1) h -= 1;
	}
	
	return { h, s, v };
}


/**
 * Converts a numeric value from 0-255
 * to a hexadecimal string from 00-ff.
 */

function componentToHex(c: number) {
	let hex = Math.round(c).toString(16);
	return hex.length === 1 ? '0' + hex : hex;
}

/**
 * Converts an RGB Color to a Hex string.
 * Source: https://stackoverflow.com/a/5624139
 *
 * @param {RGB} rgb - The RGB value to convert.
 * @returns {string} the hexadecimal string representation.
 */

export function RGBToHex(rgb: RGB = { r: 0, g: 0, b: 0}): string {
	return '#' + componentToHex(rgb.r) + componentToHex(rgb.g) + componentToHex(rgb.b);
}

/**
 * Converts a Hex string to an RGB Color.
 *
 * @param {string} hex - The hexadecimal string to convert.
 * @returns {RGB} the RGB representation.
 */

export function hexToRGB(hex: string): RGB {
	let r = parseInt('0x' + hex[1] + hex[2], 16);
	let g = parseInt('0x' + hex[3] + hex[4], 16);
	let b = parseInt('0x' + hex[5] + hex[6], 16);

	return { r, g, b };
}

/**
 * Converts an HSV Color to a Hex string.
 *
 * @param {HSV} hsv - The HSV value to convert.
 * @returns {string} the hexadecimal string representation.
 */

export function HSVToHex(hsv: HSV = { h: 0, s: 0, v: 0}): string {
	return RGBToHex(HSVToRGB(hsv));
}

/**
 * Converts a Hex string to an RGB Color.
 *
 * @param {string} hex - The hexadecimal string to convert.
 * @returns {RGB} the RGB representation.
 */

export function hexToHSV(hex: string): HSV {
	return RGBToHSV(hexToRGB(hex));
}

/**
 * Converts a HSV color to a hex integer value.
 *
 * @param {HSV} color - The color to convert.
 * @returns {number} the RGB representation of the color in an int.
 */

export function HSVToInt(hsv: HSV) {
	return parseInt(HSVToHex(hsv).substr(1), 16);
}

export function hexToInt(hex: string) {
	return parseInt(hex.substr(1), 16);
}

export function intToHex(int: number) {
	let s = int.toString(16);
	while (s.length < 6) s = '00' + s;
	return '#' + s;
}