1
0
mirror of https://codeberg.org/setop/elm-scripting synced 2025-11-08 21:49:57 +00:00

Compare commits

..

2 Commits

Author SHA1 Message Date
5916566385 feat: can pass content as flags 2025-10-15 13:44:19 +02:00
0758e1e9b4 feat: handle innerHTML 2025-10-07 22:19:07 +02:00
10 changed files with 138 additions and 95 deletions

View File

@@ -1,2 +1 @@
elm 0.19.1 elm 0.19.1
python 3.13.1-v2

View File

@@ -22,8 +22,8 @@ Next, we concatenate this with the Elm JavaScript output and an app launcher sni
## Limitations ## Limitations
* No event loop * No event loop
* Hence, no [TEA](https://guide.elm-lang.org/architecture/); the `main` function must return a static view * Hence, no [TEA](https://guide.elm-lang.org/architecture/); no `update` can be triggered
* Hence, no Time, no Random, no Json Encoder/Decoder (!), no Http * Hence, no Time, no Random, no Http
* Nodes can only have one parent (this should always be the case) * Nodes can only have one parent (this should always be the case)
* Does not scale well : creating thousands of Nodes consumes a [lot of RAM](#Performances) * Does not scale well : creating thousands of Nodes consumes a [lot of RAM](#Performances)
@@ -37,19 +37,73 @@ Next, we concatenate this with the Elm JavaScript output and an app launcher sni
```elm ```elm
module Hello exposing(main) module Hello exposing(main)
import Html exposing (p, text) import Html exposing (text)
main = p [] [text "Hello World!"] main = text "Hello World!"
``` ```
4. Run `./build.sh src/Hello.elm`; this generates the corresponding HTML code: 4. Run `./elmscript.sh src/Hello.elm`
```html This produces the expected output:
<p>
```text
Hello World! Hello World!
</p>
``` ```
## passing input
Input content can be passed to the script via the standard input. The content is then passed to the Elm script as "flags". The script must then use `Browser.element` and implement `init flags` function.
Create `src/Greet.elm` with the following content:
```elm
module Greet exposing (main)
import Browser
import Html exposing (text)
main =
Browser.element
{ init = \f -> (f, Cmd.none)
, update = \m _ -> (m, Cmd.none)
, view = \m -> text ("hello " ++ m)
, subscriptions = always Sub.none
}
```
Run `./elmscript.sh src/Greet.elm <<< 'Elm'`
This produces the expected output: `hello Elm`.
I's even more natural when passing file :
* run `elm install elm-explorations/markdown`
* create `src/MdRender.elm` with the following content:
```elm
module MdRender exposing (main)
import Browser
import Html.Attributes exposing (class)
import Markdown
main =
Browser.element
{ init = \s -> (s, Cmd.none)
, update = \m c -> (m, Cmd.none)
, view = \m -> Markdown.toHtml [class "content"] m
, subscriptions = always Sub.none
}
```
* run `./elmscript.sh src/MdRender.elm < README.md > README.html`
## Performances ## Performances
Acceptable for small scripts : 250ms on a modest x86_64 CPU and 64MB RAM for a 500 records into a table ; but is does not scale well as everything is loaded before processing ; no streaming contrary to the usual Unix way. Acceptable for small scripts : 250ms on a modest x86_64 CPU and 64MB RAM for a 500 records into a table ; but is does not scale well as everything is loaded before processing ; no streaming contrary to the usual Unix way.

12
TODO.md
View File

@@ -1,8 +1,8 @@
# Major # Major
- find a way to process external data - [ ] find a way to process external data
- [ ] from stdout (use case : json) - [x] from stdout (use case : json), use flags
- [ ] from files (use case : SSG) - [ ] from files (use case : SSG)
- [ ] from http (use case : spider) - [ ] from http (use case : spider)
@@ -19,10 +19,10 @@
# Minor # Minor
- [ ] support for Elm debug (`-d`) mode (qjs does not implement `console.warn`, only `console.log`) - [ ] support for Elm debug (`-d`) mode (qjs does not implement `console.warn`, only `console.log`)
- [ ] in debug mode, keep the output - [ ] in debug mode, keep the output
- [x] allow to specify or guess the main module name - [x] allow to specify or guess the main module name
- [x] if `innerHTML` attribute is set, output its value instead of the node tree - [x] if `innerHTML` attribute is set, output its value instead of the node tree
- [ ] allow to create standalone (`-s`) HTML document instead of fragment - [x] allow to create standalone (`-s`) HTML document instead of fragment => use template engine instead
- [ ] silence elm compiler message when successful - [x] silence elm compiler message when successful
- [ ] skip compilation steps if source has not been modified ; run directly ; this mean keeping the output - [ ] skip compilation steps if source has not been modified ; run directly ; this mean keeping the output
- [ ] add proper copyright and license - [x] add proper copyright and license

View File

@@ -1,18 +0,0 @@
#!/bin/sh -eu
w1="$(mktemp out_$$_1_XXXX.js)"
elm make --output=${w1} $1 1>&2
sed -i -e 's!console.warn(!console.log(!g' ${w1}
w2="$(mktemp out_$$_XXXX.js)"
cat dom.js ${w1} launch.js > ${w2}
rm ${w1}
qjs --std ${w2}
# if qjs fails, output file will stay for debugging, else
rm ${w2}

View File

@@ -1,19 +0,0 @@
#!/bin/sh -eu
CMDD=$(dirname $(realpath 0))
w1="$(mktemp out_$$_1_XXXX.js)"
elm make --optimize --output=${w1} $1 1>&2
w2="$(mktemp out_$$_XXXX.js)"
cat ${CMDD}/dom.js ${CMDD}/preelm.js ${w1} ${CMDD}/postelm.js > ${w2}
rm ${w1}
qjs --std ${w2}
# if qjs fails, output file will stay for debugging, else
rm ${w2}

50
dom.js
View File

@@ -5,28 +5,36 @@ function Node(parent, tag) {
this.text = null; this.text = null;
// attributes are stored directly on the node object // attributes are stored directly on the node object
// see https://github.com/elm/virtual-dom/blob/master/src/Elm/Kernel/VirtualDom.js#L511 // see https://github.com/elm/virtual-dom/blob/master/src/Elm/Kernel/VirtualDom.js#L511
// but Html.Attributes.attribute/2 uses Element.setAttribute
this.setAttribute = (key, val) => {
// as of now, there is no check if key conflict with the ones defined by Dom implementation
this[key] = val;
}
this.children = []; // List of Node this.children = []; // List of Node
this.replaceChild = (newNode, domNode) => { this.replaceChild = (newNode, domNode) => {
this.children[domNode.pos-1] = newNode; this.children[domNode.pos-1] = newNode;
newNode.pos = domNode.pos; newNode.pos = domNode.pos;
}; };
if (parent != null) { if (parent != null) {
this.pos = parent.children.push(this); this.pos = parent.children.push(this);
} }
this.appendChild = (node) => { this.appendChild = (node) => {
node.pos = this.children.push(node); node.pos = this.children.push(node);
} }
this.dump = (d=0) => { this.replaceData = (offset, count, data) => {
if (this.text != null) { this.text = data; // elm runtime will always replace the whole text
print(this.text); }
return this.dump = (d=0) => {
} if (this.text != null) {
if (this.innerHTML) { print(this.text);
print(this.innerHTML); return
return }
} if (this.innerHTML) {
std.printf("<%s", this.tagName) print(this.innerHTML);
// Set.difference(other) is not avalable in qjs return
}
std.printf("<%s", this.tagName)
// Set.difference(other) is not avalable in qjs
for (a of Object.keys(this)) { for (a of Object.keys(this)) {
if (!NodeKeys.has(a)) { if (!NodeKeys.has(a)) {
std.printf(' %s="%s"', a, this[a]) std.printf(' %s="%s"', a, this[a])
@@ -35,18 +43,18 @@ function Node(parent, tag) {
if (this.children.length==0) { if (this.children.length==0) {
print("/>") print("/>")
} else { } else {
print(">") print(">")
for (c of this.children) { for (c of this.children) {
c.dump(d+1) c.dump(d+1)
} }
print("</"+this.tagName+">"); print("</"+this.tagName+">");
} }
} }
return this; return this;
} }
var document = new Node(null, "document"); const document = new Node(null, "document");
var target = new Node(document, "target"); const target = new Node(document, "target");
const NodeKeys = new Set(Object.keys(target)); const NodeKeys = new Set(Object.keys(target));
// getElementById is only used once, to get node Elm must hook into. // getElementById is only used once, to get node Elm must hook into.
@@ -59,6 +67,6 @@ document.createTextNode = (text) => { t = new Node(null, "#text" ); t.text = tex
// workaround for elm-explorations/markdown Markdown.toHtml // workaround for elm-explorations/markdown Markdown.toHtml
global = {}; const global = {};

41
elmscript.sh Executable file
View File

@@ -0,0 +1,41 @@
#!/bin/sh -eu
CMDD=$(dirname $(realpath 0))
w1="$(mktemp out_$$_1_XXXX.js)"
elm make --optimize --output=${w1} $1 1>/dev/null
w2="$(mktemp out_$$_XXXX.js)"
cat ${CMDD}/dom.js >> ${w2}
cat << EEE >> ${w2}
try {
EEE
cat ${w1} >> ${w2}
cat << EEE >> ${w2}
Elm[Object.keys(Elm)[0]].init({
node: document.getElementById("elm")
EEE
flags=$(grep -c 'main = $elm$browser$Browser$element' ${w1} || true)
if [ $flags -eq 1 ];
then
cat << EEE >> ${w2};
, flags: std.in.readAsString()
EEE
fi
cat << EEE >> ${w2}
});
document.children[0].dump();
} catch(e) {
throw e;
}
EEE
rm ${w1}
qjs --std ${w2}
# if qjs fails, output file will stay for debugging, else
rm ${w2}

View File

@@ -1,13 +0,0 @@
// above is the DOM implementation
// and the Elm app code
// here we lanch the app
Elm[Object.keys(Elm)[0]].init({ node: document.getElementById("elm") });
document.children[0].dump();
} catch(e) {
throw e;
}

View File

@@ -1,6 +0,0 @@
try {
// here will come the Elm app code

View File

@@ -1,3 +0,0 @@
#!/bin/sh -eu
countuniq0 build.sh dom.js postelm.js preelm.js