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
51
52
53
54
55
|
module EditableNumber
( NumberElem
, set
) where
import Data.Maybe (Maybe(..))
import Effect (Effect)
import Prelude
import Web.DOM.Document (createElement, createTextNode) as Document
import Web.DOM.Element (setClassName, setAttribute, toNode) as Element
import Web.DOM.Internal.Types (Element, Node)
import Web.DOM.Node (textContent) as Node
import Web.DOM.Text (toNode) as Text
import Web.HTML (window) as HTML
import Web.HTML.HTMLDocument (toDocument) as HTMLDocument
import Web.HTML.Window (document) as Window
import Dom (replaceElement, appendNodes) as Dom
import Number (format) as Number
import Parser (TextWithNumber)
import Parser (textWithNumber) as Parser
type NumberElem =
{ elem :: Element
, number :: Number
}
set :: { tag :: String, node :: Node } -> Effect (Maybe NumberElem)
set { tag, node } = do
content <- Node.textContent node
case Parser.textWithNumber content of
Just twn -> do
textWithNumber <- textWithNumberElem tag twn
Dom.replaceElement node (Element.toNode textWithNumber)
pure (Just { elem: textWithNumber, number: twn.number })
Nothing ->
pure Nothing
textWithNumberElem :: String -> TextWithNumber -> Effect Element
textWithNumberElem tag { begin, number, end } = do
document <- HTMLDocument.toDocument <$> (HTML.window >>= Window.document)
elem <- Document.createElement tag document
beginNode <- Text.toNode <$> Document.createTextNode begin document
numberNode <- numberElem number
endNode <- Text.toNode <$> Document.createTextNode end document
Dom.appendNodes (Element.toNode elem) [ beginNode, Element.toNode numberNode, endNode ]
pure elem
numberElem :: Number -> Effect Element
numberElem number = do
document <- HTMLDocument.toDocument <$> (HTML.window >>= Window.document)
container <- Document.createElement "input" document
Element.setClassName "number" container
Element.setAttribute "value" (Number.format number) container
pure container
|
