70 lines
1.9 KiB
Plaintext
70 lines
1.9 KiB
Plaintext
|
-- | `App.HomeInterface` presents the website and its features.
|
||
|
module App.SimpleInput where
|
||
|
|
||
|
import Prelude (Unit, ($))
|
||
|
|
||
|
-- import Data.Either (Either(..))
|
||
|
-- import Data.Maybe (Maybe(..), maybe)
|
||
|
-- import Data.Tuple (Tuple(..))
|
||
|
import Effect.Aff.Class (class MonadAff)
|
||
|
import Halogen as H
|
||
|
import Halogen.HTML as HH
|
||
|
-- import Halogen.HTML.Events as HE
|
||
|
import Halogen.HTML.Properties as HP
|
||
|
|
||
|
import Bulma as Bulma
|
||
|
|
||
|
type Input = Unit
|
||
|
data Action = UpdateStuff String
|
||
|
|
||
|
data Query a = DoNothing a
|
||
|
type Output = Unit
|
||
|
type Slot = H.Slot Query Output
|
||
|
|
||
|
type State = { stuff :: String }
|
||
|
|
||
|
component :: forall m. MonadAff m => H.Component Query Input Output m
|
||
|
component =
|
||
|
H.mkComponent
|
||
|
{ initialState
|
||
|
, render
|
||
|
, eval: H.mkEval $ H.defaultEval
|
||
|
{ handleAction = handleAction
|
||
|
}
|
||
|
}
|
||
|
|
||
|
handleAction :: forall m. MonadAff m => Action -> H.HalogenM State Action () Output m Unit
|
||
|
handleAction = case _ of
|
||
|
UpdateStuff val -> H.modify_ _ { stuff = val }
|
||
|
|
||
|
initialState :: forall input. input -> State
|
||
|
initialState _ = { stuff: "" }
|
||
|
|
||
|
render :: forall m. State -> H.ComponentHTML Action () m
|
||
|
render state
|
||
|
= HH.div_
|
||
|
[ Bulma.hero_danger "A simple input" "Nothing much to see"
|
||
|
, Bulma.section_small [ render_stuff ]
|
||
|
]
|
||
|
where
|
||
|
-- Some helpers.
|
||
|
title = Bulma.h3
|
||
|
p = Bulma.p
|
||
|
b x = Bulma.column_ [ Bulma.box x ]
|
||
|
|
||
|
render_stuff = Bulma.columns_ [ b [ title "stuff"
|
||
|
, stuff_input
|
||
|
]
|
||
|
, b [ title "value"
|
||
|
, p state.stuff
|
||
|
]
|
||
|
]
|
||
|
|
||
|
stuff_input
|
||
|
= Bulma.box_input "stuff" "stuff" "stuff"
|
||
|
UpdateStuff
|
||
|
state.stuff
|
||
|
true
|
||
|
should_be_disabled
|
||
|
should_be_disabled = (if true then (HP.enabled true) else (HP.disabled true))
|