export class Card {
    constructor(color, value, turnedUp) {
        this.color = color;
        this.value = value;
        this.turnedUp = turnedUp;
    }

    allows(card) {
        return this.color === card.color || this.value === card.value;
    }

    /**
     * Draws the card
     * @param {Renderer} renderer 
     */
    draw(renderer, x = 0, y = 0) {
        const cardBody = renderer.begin().roundedRect(x, y, 100, 150, 10);
        if (this.turnedUp) {
            cardBody.fill(this.color).stroke(255).strokeWidth(5).close();
            renderer.begin().center(x, y, 100, 150).circle(0, 0, 40).fill(255).close();

            switch (this.value) {
                case "CHOOSE":
                    if (!this.actualColor) {
                        renderer.begin().center(x, y, 100, 150).arc(0, 0, 35, 0, 0.5 * Math.PI).finish().fill('RED').close();
                        renderer.begin().center(x, y, 100, 150).arc(0, 0, 35, 0.5 * Math.PI, Math.PI).finish().fill('GREEN').close();
                        renderer.begin().center(x, y, 100, 150).arc(0, 0, 35, Math.PI, 1.5 * Math.PI).finish().fill('YELLOW').close();
                        renderer.begin().center(x, y, 100, 150).arc(0, 0, 35, 1.5 * Math.PI, 2 * Math.PI).finish().fill('BLUE').close();
                    } else {
                        renderer.begin().center(x, y, 100, 150).circle(0, 0, 35).fill(this.actualColor).close();
                    }
                    break;
                default:
                    renderer.begin().center(x, y, 100, 150).text(this.value[0]).align('center').fontSize(48).baseline('middle').fill(0).close();
                    break;
            }
        } else {
            const temp = cardBody.offset.x;
            cardBody.fill(150, 0, 255).stroke(255).strokeWidth(5).close();
        }
    }
}