aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--lib/doml.js33
-rw-r--r--lib/style.css68
-rw-r--r--prog/euclideanAlgorithmInput.html69
-rw-r--r--prog/function.doml19
-rw-r--r--prog/function.html13
-rw-r--r--prog/input.html28
6 files changed, 218 insertions, 12 deletions
diff --git a/lib/doml.js b/lib/doml.js
index c813db9..181f574 100644
--- a/lib/doml.js
+++ b/lib/doml.js
@@ -151,6 +151,23 @@
'call': function(dataset, children, context) {
return context[dataset.name](children);
+ },
+
+ 'repeat': function(dataset, children, context) {
+ var times = me.evaluate(children[0], context);
+ for (var n = 0; n < times; n++) {
+ if (dataset.iteration) {
+ context[dataset.iteration] = n;
+ }
+ me.evaluate(children[1], context);
+ }
+ },
+
+ 'input': function(dataset, children, context) {
+ var msg = dataset.prompt || dataset.name;
+ var rawInput = prompt(dataset.prompt);
+ context[dataset.name] = me.Types[dataset.type](rawInput);
+ return context[dataset.name];
}
};
@@ -176,6 +193,22 @@
'bin-op': function(e) {
return [ e.dataset.op ];
+ },
+
+ 'input': function(e) {
+ return [ e.dataset.name ];
+ },
+
+ 'call': function(e) {
+ return [ e.dataset.name ];
+ },
+
+ 'function': function(e) {
+ return [ e.dataset.args ];
+ },
+
+ 'repeat': function(e) {
+ return [ e.dataset.iteration ];
}
};
diff --git a/lib/style.css b/lib/style.css
index 6b7d25f..3f7ec40 100644
--- a/lib/style.css
+++ b/lib/style.css
@@ -1,3 +1,8 @@
+* {
+ margin: 0;
+ padding: 0;
+}
+
body {
font-family: monospace;
}
@@ -15,8 +20,7 @@ var {
}
.statement-sequence {
- display: block;
- border: 2px solid #666;
+ flex-direction: column;
}
.statement-sequence > span {
@@ -32,7 +36,7 @@ var {
.assign::before {
content: 'Variable Assignment';
- color: darkmagenta;
+ color: blueviolet;
order: 1;
}
@@ -68,7 +72,7 @@ var {
.while::before {
content: 'While';
- color: darkmagenta;
+ color: blueviolet;
}
.return > span {
@@ -77,13 +81,13 @@ var {
.return::after {
content: 'Return';
- color: darkmagenta;
+ color: blueviolet;
order: 1;
}
.compare::before {
content: 'Comparison';
- color: darkmagenta;
+ color: blueviolet;
order: 1;
}
@@ -105,7 +109,7 @@ var {
.branch::before {
content: 'Logical Branch';
- color: darkmagenta;
+ color: blueviolet;
}
.branch > span {
@@ -123,3 +127,53 @@ var {
.bin-op > var {
order: 2;
}
+
+.input {
+ color: blue;
+}
+
+.input::before {
+ content: 'Input';
+ color: blueviolet;
+}
+
+.call::before {
+ content: 'Function Call';
+ color: blueviolet;
+}
+
+.call > var {
+ font-weight: bold;
+ color: darkorange;
+ order: 1;
+}
+
+.call > span {
+ order: 2;
+}
+
+.function {
+ border: 4px solid darkorange;
+ margin: 3px;
+ flex-direction: column-reverse;
+ padding-left: 0;
+ padding-right: 0;
+ background-color: white;
+}
+
+.function > var {
+ background-color: darkorange;
+}
+
+.print {
+ background-color: greenyellow;
+}
+
+.repeat {
+ flex-direction: column;
+}
+
+.repeat::before {
+ content: 'Repeat';
+ color: blueviolet;
+}
diff --git a/prog/euclideanAlgorithmInput.html b/prog/euclideanAlgorithmInput.html
new file mode 100644
index 0000000..dfba476
--- /dev/null
+++ b/prog/euclideanAlgorithmInput.html
@@ -0,0 +1,69 @@
+<!doctype html>
+<html>
+ <head>
+ <script type="text/javascript" src="../lib/doml.js"></script>
+ <script>
+ Doml.runOnLoad();
+ </script>
+ <link rel="stylesheet" href="../lib/style.css">
+ </head>
+ <body>
+ <span class="statement-sequence">
+ <span class="assign" data-name="EuclideanAlgorithm">
+ <span class="function" data-args="a,b">
+ <span class="statement-sequence">
+ <span class="while">
+ <span class="compare" data-op="!=">
+ <span class="variable" data-name="b"></span>
+ <span class="constant" data-val="0" data-type="number"></span>
+ </span>
+
+ <span class="branch">
+ <span class="compare" data-op=">">
+ <span class="variable" data-name="a"></span>
+ <span class="variable" data-name="b"></span>
+ </span>
+
+ <span class="assign" data-name="a">
+ <span class="bin-op" data-op="-">
+ <span class="variable" data-name="a"></span>
+ <span class="variable" data-name="b"></span>
+ </span>
+ </span>
+
+ <span class="assign" data-name="b">
+ <span class="bin-op" data-op="-">
+ <span class="variable" data-name="b"></span>
+ <span class="variable" data-name="a"></span>
+ </span>
+ </span>
+ </span>
+ </span>
+
+ <span class="branch">
+ <span class="compare" data-op="==">
+ <span class="variable" data-name="a"></span>
+ <span class="constant" data-val="1" data-type="number"></span>
+ </span>
+ <span class="print">
+ <span class="constant" data-val="Relatively prime" data-type="string"></span>
+ </span>
+ <span class="print">
+ <span class="constant" data-val="Found GCD" data-type="string"></span>
+ <span class="variable" data-name="a"></span>
+ </span>
+ </span>
+ </span>
+ </span>
+ </span>
+
+ <span class="input" data-prompt="Enter the first value" data-name="val1" data-type="number"></span>
+ <span class="input" data-prompt="Enter the second value" data-name="val2" data-type="number"></span>
+
+ <span class="call" data-name="EuclideanAlgorithm">
+ <span class="variable" data-name="val1"></span>
+ <span class="variable" data-name="val2"></span>
+ </span>
+ </span>
+ </body>
+</html>
diff --git a/prog/function.doml b/prog/function.doml
new file mode 100644
index 0000000..841cb0b
--- /dev/null
+++ b/prog/function.doml
@@ -0,0 +1,19 @@
+statement-sequence {
+ assign(name=myFunc) {
+ function(args=stringToPrint,val1,val2) {
+ print {
+ variable(name=stringToPrint)
+ bin-op(op=+) {
+ variable(name=val1)
+ variable(name=val2)
+ }
+ }
+ }
+ }
+
+ call(name=myFunc) {
+ constant(val="hello, world!" type="string")
+ constant(val="3.5" type="number")
+ constant(val="7" type="number")
+ }
+}
diff --git a/prog/function.html b/prog/function.html
index 2fe8d40..f0bf334 100644
--- a/prog/function.html
+++ b/prog/function.html
@@ -5,7 +5,7 @@
<script>
Doml.runOnLoad();
</script>
- <link type="stylesheet" href="../lib/style.css">
+ <link rel="stylesheet" href="../lib/style.css">
</head>
<body>
<span class="statement-sequence">
@@ -21,10 +21,13 @@
</span>
</span>
- <span class="call" data-name="myFunc">
- <span class="constant" data-val="hello, world!" data-type="string"></span>
- <span class="constant" data-val="3.5" data-type="number"></span>
- <span class="constant" data-val="7" data-type="number"></span>
+ <span class="repeat" data-iteration="loopTime">
+ <span class="constant" data-val="5" data-type="number"></span>
+ <span class="call" data-name="myFunc">
+ <span class="constant" data-val="hello, world!" data-type="string"></span>
+ <span class="constant" data-val="3.5" data-type="number"></span>
+ <span class="variable" data-name="loopTime"></span>
+ </span>
</span>
</span>
</body>
diff --git a/prog/input.html b/prog/input.html
new file mode 100644
index 0000000..07ca54a
--- /dev/null
+++ b/prog/input.html
@@ -0,0 +1,28 @@
+<!doctype html>
+<html>
+ <head>
+ <script src="../lib/doml.js"></script>
+ <script>
+ Doml.runOnLoad();
+ </script>
+ <link rel="stylesheet" href="../lib/style.css">
+ </head>
+ <body>
+ <span class="statement-sequence">
+ <span class="assign" data-name="greet">
+ <span class="function" data-args="name">
+ <span class="print">
+ <span class="constant" data-val="Hello," data-type="string"></span>
+ <span class="variable" data-name="name"></span>
+ </span>
+ </span>
+ </span>
+
+ <span class="input" data-prompt="What is your name?" data-name="personToGreet" data-type="string"></span>
+
+ <span class="call" data-name="greet">
+ <span class="variable" data-name="personToGreet"></span>
+ </span>
+ </span>
+ </body>
+</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-04-20 06:12:41 +0000