Skip to content

Commit fbd6716

Browse files
HeinrichApfelmusHeinrichApfelmus
committed
Add CodeMirror editor for evaluation input
1 parent 99e6037 commit fbd6716

4 files changed

Lines changed: 76 additions & 7 deletions

File tree

‎src/Main.hs‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@ foreign import javascript unsafe "$1.target.value"
2323
foreign import javascript unsafe "$1.value"
2424
js_input_value :: JSVal -> IO JSString
2525

26+
foreign import javascript unsafe "view.state.doc.toString()"
27+
js_view_state_doc_toString :: IO JSString
28+
2629
foreign import javascript "$1.innerHTML = $2"
2730
js_element_setInnerHtml :: JSVal -> JSString -> IO ()
2831

@@ -45,8 +48,7 @@ setup = do
4548
-- | Handle button clicks.
4649
onEvalButtonClick :: JSVal -> IO ()
4750
onEvalButtonClick event = do
48-
exprInput <- js_document_getElementById (toJSString "expr")
49-
expr <- fromJSString <$> js_input_value exprInput
51+
expr <- fromJSString <$> js_view_state_doc_toString
5052

5153
let svg = eval expr
5254
outDiv <- js_document_getElementById (toJSString "out")

‎www/disco-live.html‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@
66
</head>
77

88
<body>
9-
<div>
10-
<input type="text" id="expr"/>
11-
<label for="expr">Expression</label>
12-
<input type="button" id="eval" value="Evaluate"/>
9+
<script defer src="vendor/codemirror-6.js"></script>
10+
<script defer src="js/editor.js"></script>
11+
<div>
12+
<div id="editor">
1313
</div>
14+
<input type="button" id="eval" value="Evaluate"/>
1415
<div id="out">
1516
</div>
16-
<script type="module" src="runtime.js"></script>
17+
</div>
18+
<script type="module" src="runtime.js"></script>
1719
</body>
1820
</html>

‎www/js/editor.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
(function() {
2+
'use strict'
3+
const {basicSetup, EditorView} = CM["codemirror"]
4+
window.view = new EditorView({
5+
doc: "1 + 2",
6+
parent: document.querySelector("#editor"),
7+
extensions: [basicSetup]
8+
})
9+
})()

‎www/vendor/codemirror-6.js‎

Lines changed: 56 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)