blob: 0ff5fd7447c1359df6f367963711e94c4d2456b2 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
module Main (main) where
import Data.Array (catMaybes) as Array
import Data.Maybe (Maybe(..))
import Data.Traversable (sequence, sequence_) as Traversable
import Effect (Effect)
import Prelude
import Web.DOM.Element (toNode) as Element
import Web.DOM.Internal.Types (Node)
import Web.DOM.ParentNode (QuerySelector(..))
import Dom (selectElement, selectElements, onInput, setValue, selectElementFrom) as Dom
import EditableNumber (NumberElem)
import EditableNumber (set) as EditableNumber
import Number (format) as Number
import Parser (number) as Parser
main :: Effect Unit
main = do
tagElems <- getNumberElements
numberElems <- Array.catMaybes <$> (Traversable.sequence $ map EditableNumber.set tagElems)
Traversable.sequence_ $ map (onInput numberElems) numberElems
getNumberElements :: Effect (Array { tag :: String, node :: Node })
getNumberElements = do
let fromElem tag elem = { tag: tag, node: Element.toNode elem }
h1 <- map (fromElem "h1") <$> Dom.selectElement (QuerySelector "h1")
lis <- map (fromElem "li") <$> Dom.selectElements (QuerySelector "ul > li")
pure $ (maybeToArray h1 <> lis)
onInput :: Array NumberElem -> NumberElem -> Effect Unit
onInput numberElems { elem, number } = do
Dom.onInput elem (\value -> do
case Parser.number value of
Just newNumber ->
numberElems
# map (\ne -> do
inputNode <- Dom.selectElementFrom ne.elem (QuerySelector "input")
case inputNode of
Just node -> Dom.setValue (Number.format (ne.number / number * newNumber)) node
_ -> pure unit
)
# Traversable.sequence_
_ ->
pure unit
)
maybeToArray :: forall a. Maybe a -> Array a
maybeToArray (Just x) = [ x ]
maybeToArray _ = []
|