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
56
|
module EditableNumber
( NumberElem
, set
) where
import Control.Monad.Eff (Eff)
import Data.Maybe (Maybe(..))
import DOM (DOM)
import DOM.HTML (window) as DOM
import DOM.HTML.Types (htmlDocumentToDocument) as DOM
import DOM.HTML.Window (document) as DOM
import DOM.Node.Document (createElement, createTextNode) as DOM
import DOM.Node.Element (setClassName, setAttribute) as DOM
import DOM.Node.Node (textContent) as DOM
import DOM.Node.Types (Element, Node)
import DOM.Node.Types (elementToNode, textToNode) as DOM
import Prelude
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 :: forall e. { tag :: String, node :: Node } -> Eff (dom :: DOM | e) (Maybe NumberElem)
set { tag, node } = do
content <- DOM.textContent node
case Parser.textWithNumber content of
Just twn -> do
textWithNumber <- textWithNumberElem tag twn
Dom.replaceElement node (DOM.elementToNode textWithNumber)
pure (Just { elem: textWithNumber, number: twn.number })
Nothing ->
pure Nothing
textWithNumberElem :: forall e. String -> TextWithNumber -> Eff (dom :: DOM | e) Element
textWithNumberElem tag { begin, number, end } = do
document <- DOM.htmlDocumentToDocument <$> (DOM.window >>= DOM.document)
elem <- DOM.createElement tag document
beginNode <- DOM.textToNode <$> DOM.createTextNode begin document
numberNode <- numberElem number
endNode <- DOM.textToNode <$> DOM.createTextNode end document
Dom.appendNodes (DOM.elementToNode elem) [ beginNode, DOM.elementToNode numberNode, endNode ]
pure elem
numberElem :: forall e. Number -> Eff (dom :: DOM | e) Element
numberElem number = do
document <- DOM.htmlDocumentToDocument <$> (DOM.window >>= DOM.document)
container <- DOM.createElement "input" document
DOM.setClassName "number" container
DOM.setAttribute "value" (Number.format number) container
pure container
|