import { LightningElement, api } from "lwc";
import cx from "classnames";

export default class CardEvent extends LightningElement {
    @api endDatetime?: string | null = null;
    @api featured?: boolean = false;
    @api href!: string;
    @api imgAlt?: string = "";
    @api imgSrc?: string | null = null;
    @api layout: "vertical" | "horizontal" = "vertical";
    @api location?: string | null = null;
    @api startDatetime!: string;
    @api target: string = "_blank";
    @api header!: string;
    @api shortDescription?: string;
    @api type?: string;

    private isLinkHovered: boolean = false;

    private get className() {
        return cx(
            "card-event",
            "dx-card-base",
            "dx-card-base_borderless",
            `dx-card-base_layout-${this.layout}`,
            this.featured && "dx-card-base_featured",
            this.isLinkHovered && "dx-card-base_link-hovered"
        );
    }

    private setLinkHovered() {
        this.isLinkHovered = true;
    }

    private setLinkInactive() {
        this.isLinkHovered = false;
    }

    private get typeBadgeColor() {
        return this.type === "Webinar" ? "green" : "red";
    }

    private get showSubtitle() {
        return this.featured && this.location;
    }

    private get showDescription() {
        return this.featured && this.shortDescription;
    }
}