import { Color } from "./../color/index.uts"
import { TinyColor } from "./../color/color.uts"

const colorful = new Color()

export class ColorBase {
	
	/**
	 * 颜色值
	 */
	color = ref('')
	
	/**
	 * 浅色
	 */
	light = ref('')
	
	/**
	 * 深色
	 */
	dark = ref('')
	
	/**
	 * 禁止色
	 */
	disabled = ref('')
	
	/**
	 * 禁止色-深色
	 */
	disabledDark = ref('')
	
	constructor(color: string) {
		this.color.value = color
		this.light.value = this.getLightColor(color)
		this.dark.value = this.getDarkColor(color)
		this.disabled.value = this.getDisabledColor(color)
		this.disabledDark.value = this.getDarkColor(this.disabled.value)
		
		// console.log(color, this.light.value, this.dark.value, this.disabled.value, this.disabledDark.value);
	}
	
	/**
	 * 颜色实例
	 */
	newColor(color: string = ''): TinyColor {
		return colorful.newColor(color == '' ? this.color : color)
	}
	
	/**
	 * 重置颜色值
	 */
	reset(color: string) {
		this.color.value = color
		this.light.value = this.getLightColor(color)
		this.dark.value = this.getDarkColor(color)
		this.disabled.value = this.getDisabledColor(color)
		this.disabledDark.value = this.getDarkColor(this.disabled.value)
	}
	
	/**
	 * 反色
	 * 深色 -> 浅色
	 * 浅色 -> 深色
	 */
	getDarkColor(color: string): string {
		let newColor = this.newColor(color)
		
		if(newColor.isDark()) {
			return newColor.lighten(80).toString()
		} else {
			return newColor.darken(80).toString()
		}
	}
	
	/**
	 * 浅色
	 */
	getLightColor(color: string): string {
		return this.newColor(color).lighten(20).toString()
	}
	
	/**
	 * 禁止色
	 */
	getDisabledColor(color: string): string {
		return this.newColor(color).setAlpha(0.6).toString()
	}
}