from rio import Component, Rectangle, Color, Column, Text, Image, Row, PointerEventListener, Spacer

from from_root import from_root

class LandingPageBoxFull(Component):
    image_name: str
    heading_text: str
    article_text: str
    date: str

    def build(self) -> Component:
        return Rectangle(
            content=Column(
                Image(from_root(f"src/elm/assets/img/{self.image_name}"), fill_mode="zoom"),
                Column(
                    Text(self.heading_text, style="heading3", fill=Color.from_hex("51ffef"), overflow="wrap" if self.session.is_mobile() else "ellipsize", margin_bottom=1.5),
                    Text(self.article_text, overflow="wrap", margin_bottom=1.5),
                    Rectangle(content=Row(), shadow_color=self.session.theme.text_color, shadow_radius=0.1, min_height=0.1, margin_bottom=1.5),
                    Text(self.date, overflow="wrap", justify="right"),
                    margin=2
                ),
                proportions=[0.8, 1]
            ),
            fill=self.session.theme.box_color,
            stroke_width=0.1,
            stroke_color=self.session.theme.box_border_color,
            min_height=20
        )

class LandingPageBoxHalf(Component):
    image_name: str
    heading_text: str
    article_text: str
    link: str

    def build(self) -> Component:
        return PointerEventListener(
            content=Rectangle(
                content=Column(
                    Rectangle(
                        content=Rectangle(
                            content=Text(self.heading_text, margin=0.5, selectable=False, overflow="wrap"),
                            fill=self.session.theme.header_box_background_color,
                            margin=0.4
                        ),
                        stroke_width=0.1,
                        stroke_color=self.session.theme.box_border_color,
                    ),
                    Row(
                        Column(
                            Rectangle(
                                content=Image(
                                    from_root(f"src/elm/assets/img/{self.image_name}")
                                ),
                                stroke_width=0.1,
                                stroke_color=self.session.theme.box_border_color,
                                margin_right=1,
                                min_width=4 if self.session.is_mobile() else 10,
                                min_height=4 if self.session.is_mobile() else 10,
                            ),
                            Spacer()
                        ),
                        Text(
                            self.article_text,
                            overflow="wrap",
                            grow_x=True,
                            selectable=False,
                            font_size=0.8
                        ),
                        margin=1
                    ),
                    Spacer()
                ),
                fill=self.session.theme.box_color,
                stroke_width=0.1,
                stroke_color=self.session.theme.box_border_color,
                min_height=12,
                cursor="pointer"
            ),
            on_press=lambda _: self.session.open_url_in_browser(self.link)
        )