module Aviary.UI where

import Prelude

import Aviary.Model (Image, ImageData(..), Model(..))

import Data.Maybe (maybe)
import Effect.Aff (Aff)
import Halogen as H
import Halogen.HTML as HH
import Halogen.HTML.Properties as HP
import Web.HTML.Common (ClassName(..))

data Event = Unimplemented

component :: forall query input output. Model -> H.Component query input output Aff
component initialState = H.mkComponent
    { initialState: \_ -> initialState
    , render
    , eval: H.mkEval $ H.defaultEval { handleAction = update }
    }

placeholderBlurhash :: forall r i. String -> HH.IProp r i
placeholderBlurhash = HH.attr (HH.AttrName "data-blurhash")

renderThumbnail :: forall m. Image -> H.ComponentHTML Event () m
renderThumbnail {blurhash, thumb} =
    HH.div
        [ HP.class_ $ ClassName "thumbnail-card"
        ]
        ( [ HH.img
            ( [ placeholderBlurhash blurhash
                , HP.width 400
                , HP.height 400
            ] <> case thumb of
                ILoaded url -> [HP.src url]
                _ -> []
            )
        ] <> case thumb of
            Unloaded _ -> [HH.p_ [HH.text "Loading..."]]
            IError e -> [HH.p_ [HH.text $ "Error!  " <> (show e)]]
            _ -> []
        )

update :: forall output. Event -> H.HalogenM Model Event () output Aff Unit
update Unimplemented = pure unit

render :: forall m. Model -> H.ComponentHTML Event () m
render (GError e) = HH.p_ [ HH.text $ show e ]
render (GLoaded title desc images) = HH.div_
    ((maybe [] (HH.text >>> pure >>> HH.h1_ >>> pure) title) <>
    (maybe [] (HH.text >>> pure >>> HH.p_ >>> pure) desc)    <>
    (renderThumbnail <$> images))