#!/bin/sh

#dom="easylang.online"
#test $1 && dom=$1

src=$(pwd)

o=$HOME/out/easylang/aoc
mkdir -p $o
#rm -f $o/*

for i in show.html; do
	if test  ! -e  $o/$i -o $i -nt $o/$i; then
		echo cp -p $i $o
		cp -p $i $o
	fi
done

cd $o/../apps
for i in easy_code2.js easy_tut2.js; do
	if test $i -nt $o/$i -o ! -e $o/$i; then
		echo cp -p $i $o
		cp -p $i $o
	fi
done
cd $o/../wrk
for i in easyw.js easyw.wasm; do
	if test $i -nt $o/$i -o ! -e $o/$i; then
		echo cp -p $i $o
		cp -p $i $o
	fi
done

cd ../aoc
for i in $(seq 15 24); do
	ln -fs ../aoc$i $i
done


# --------------------------------------------------------------


make_big() {
	cd $src/../misc/aoc$1/

	exec >$o/aoc$1.html

	cat <<xxx
<!doctype html>
<meta charset=utf-8><title>$dom - AoC-$1</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="../icon.png" type="image/x-png">

<h3><a href=https://adventofcode.com/20$1/>AoC 20$1</a> done with Easylang</h3>

<a href=../apps><i>Easylang</i></a> does not have many features and has a simple syntax. It is statically typed and has as data types only strings and numbers (floating point), arrays of strings and numbers, and arrays of arrays. Arrays can grow. Programs compiled into an AST tree run in the browser or in the browser IDE. There are built-in features for canvas graphics.
<p>
It can be useful as a teaching and learning language due to its reduced feature set, simple syntax,
<a href=../ide/>browser IDE</a>, and built-in graphics.
<p>
However, since <i>Easylang</i> has no built-in functions for special things like sorting or hashmaps, you have to program them yourself, which makes the programs longer, but in a way more informative.

<div id=tut><b>Loading ...</b></div>
<script src=easy_code2.js></script>
<script src=easy_tut2.js></script>

<script>
xxx

	cat <<'xxx'
txt_split = "\n*\n"

txt_tutor = String.raw`-
*
xxx

	for i in $(seq 1 25); do
		if test -f $i.el; then
			s=$(head -1 $i.el | cut -c12-)
			echo "* $s"
			echo "*"
			echo "@ https://adventofcode.com/20$1/day/$i@AoC 20$1 - Day $i"
			echo "*"

			cat $i.el

# with String.raw not neccessary
#
#			if test $1$i = 2019 -o $1$i = 1813 -o $1$i = 1512 -o $1$i = 158; then
#				cat $i.el | $src/tr.py
#			else
#				cat $i.el | tr '\\' '\\\\'
#			fi
			echo "*"
		fi
	done
	cat <<'xxx'
+ Have fun :-)
`
function hook() {
	var dom = window.location.host
	tut.insertAdjacentHTML("beforeend", `
<p><hr><p>
The examples were created with <a href=..>Easylang<a>.
<p><small>christof.kaser@gmail.com</small>
`)
}
</script>
xxx

}

for i in $(seq 15 24); do
	make_big $i
done


# --------------------------------------------------------------

exec > $o/index.html

cat <<xxx
<!doctype html><title>Easylang examples</title>
<meta name="description" content="aoc solutions for Easylang - an easy programming language">
<meta charset=utf-8>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="../icon.png" type="image/x-png">

<style>
body{
  background-color:#eee;
  font:normal normal normal 16px/1.4 Arial,sans-serif;
  margin-left:16px;margin-right:16px;
  max-width:730px;
}


h2 {background-color:#bdb;padding:7px;padding-left:12px}
h3 {background-color:#bdb;padding:5px;padding-left:12px;margin-top:20px}

.col { columns:auto 4em }

</style>

<h2><a href=https://adventofcode.com/>AoC</a> done with Easylang</a></h2>

<i>Easylang</i> is a simple programming language with built-in graphical functions and an easy to use and offline usable <a href="../ide/">browser IDE</a> is well suited as a teaching and learning language.  You can also use it to write graphical applications that you can embed in a web page.
<p>
<a href="../">More ...</a>

<p><small>
A language that doesn’t have everything is actually easier to program in than some that do. -- Dennis M. Ritchie
</small>

<h3>Solutions</h3>

<div class=col>
<a href=../aoc/15/>2015</a><p>
<a href=../aoc/16/>2016</a><p>
<a href=../aoc/17/>2017</a><p>
<a href=../aoc/18/>2018</a><p>
<a href=../aoc/19/>2019</a><p>
<a href=../aoc/20/>2020</a><p>
<a href=../aoc/21/>2021</a><p>
<a href=../aoc/22/>2022</a><p>
<a href=../aoc/23/>2023</a><p>
<a href=../aoc/24/>2024</a><p>
</div>
xxx

cat >/dev/null <<xxx
<a href=../aoc/15/>2015</a><p>
xxx

vis15="18"
vis16="8 13"
vis17="19 22"
#vis18="6 10 13 15 17 18 20"
vis18="10 13 15 18 20"
#vis19="3 8 10 11 13 15 18 19 20 24"
vis19="3 8 10 20 24"
vis20="20 24"
vis21="8 9 11 13 15 23 24 25"
vis22="8 9 14"
vis23="23 24"
vis24=""

echo "<h3>Visualizations</h3>"
echo "<div class=col>"

f=""
for v in $vis15; do
	test $f && f="$f,"
	f="${f}15/$v.el"
done
echo "<a href=show.html?f=$f>2015</a><p>"
f=""
for v in $vis16; do
	test $f && f="$f,"
	f="${f}16/$v.el"
done
echo "<a href=show.html?f=$f>2016</a><p>"
f=""
for v in $vis17; do
	test $f && f="$f,"
	f="${f}17/$v.el"
done
echo "<a href=show.html?f=$f>2017</a><p>"
f=""
for v in $vis18; do
	test $f && f="$f,"
	f="${f}18/$v.el"
done
echo "<a href=show.html?f=$f>2018</a><p>"
f=""
for v in $vis19; do
	test $f && f="$f,"
	f="${f}19/$v.el"
done
echo "<a href=show.html?f=$f>2019</a><p>"
f=""
for v in $vis20; do
	test $f && f="$f,"
	f="${f}20/$v.el"
done
echo "<a href=show.html?f=$f>2020</a><p>"
f=""
for v in $vis21; do
	test $f && f="$f,"
	f="${f}21/$v.el"
done
echo "<a href=show.html?f=$f>2021</a><p>"
f=""
for v in $vis22; do
	test $f && f="$f,"
	f="${f}22/$v.el"
done
echo "<a href=show.html?f=$f>2022</a><p>"
f=""
for v in $vis23; do
	test $f && f="$f,"
	f="${f}23/$v.el"
done
echo "<a href=show.html?f=$f>2023</a><p>"

cat <<xxx
</div>
<h3>A year on one big web page</h3>

All tasks of one year on one big page. The programs are editable and runnable.
<p>

<div class=col>
<a href="aoc15.html">2015</a><p>
<a href="aoc16.html">2016</a><p>
<a href="aoc17.html">2017</a><p>
<a href="aoc18.html">2018</a><p>
<a href="aoc19.html">2019</a><p>
<a href="aoc20.html">2020</a><p>
<a href="aoc21.html">2021</a><p>
<a href="aoc22.html">2022</a><p>
<a href="aoc23.html">2023</a><p>
<a href="aoc24.html">2024</a><p>
</div>
<p>
<hr>
<small><small>christof.kaser@gmail.com</small></small>
xxx

for i in $(seq 15 24); do
	mkdir -p $o/../aoc$i
	cp $src/../misc/aoc$i/*.el $o/../aoc$i

cat >$o/../aoc$i/index.html <<xxx

<!doctype html>
<meta charset=utf-8>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Easylang - aoc$i</title>

<style>
*{box-sizing:border-box}
*:focus{outline: none}

body {
	background:#444;
	color:#fff;
	font-family:sans-serif;
}
#txt {
	width:100%;
	height:100%;
	padding:8px;
	border:0;
	margin:0;
	resize:none;
	color:#eee;
	background:#000;
	font:normal normal normal 14px/1.4 monospace;
	white-space:pre;
	overflow-y: scroll;
}
#txtwr {
	position:absolute;
	top:48px;
	left:0;
	right:0;
	bottom:0;
}
#menu {
	position:absolute;
	top:8px;
	left:0;
	right:0;
	height:36px;
	background:#444;
	color:#fff;
	white-space: nowrap;
	font-size:90%;
}
.lab {
	margin:5px;
}
.lnk {
	padding:3px;
	cursor: pointer;
	text-decoration: underline;
	margin:5px;
}
.lnksel {
	background-color:#fff;
	color:#000;
	padding:3px 8px;
	cursor: pointer;
}
a {
	color:#fff;
	padding:3px 8px;
	cursor: pointer;
}
select {
	background-color:#888;
	color:#fff;
	fontsize:110%;
	border-radius:8px;
	-moz-appearance: none;
	-webkit-appearance: none;
	padding:3px 3px;
	margin:2px 2px;
	border:1px solid lightgray;
	cursor: pointer;
	padding:4px;
}
select:hover {background-color:#ccc}
button {
	height:24px;
	width:24px;
	font-weight:bold;
	border-radius:8px;
	background-color:#888;
	color:#fff;
	padding:3px 3px;
	margin:2px 2px;
	border:1px solid lightgray;
	cursor: pointer;
}
button:hover {background-color:#ccc}

</style>

<span id=menu>
	<span class=lab>
		<button id=prev>&lt;</button>
		<select id=sel></select>
		<button id=next>&gt;</button>
		<span id=aoc class=lnk></span> -
		<a href=../>More</a> -
		<span id=edit class=lnk>Run/Edit</span>
	</span>
</span>

<span id=txtwr>
	<div id=txt spellcheck=false tabindex=0></div>
</span>

<script>

edit.onclick = function() {
	window.open("/ide/#code=" + encodeURIComponent(txt.textContent))
}
aoc.onclick = function() {
	window.open("https://adventofcode.com/20$i/day/" + day)
}
edit.onauxclick = edit.onclick
aoc.onauxclick = aoc.onclick

function load() {
	aoc.innerHTML = "AoC-$i Day " + day

	var req = new XMLHttpRequest()
	setTimeout(function() {
		if (req.status == 0) txt.textContent = "Loading ..."
	}, 500);

	req.open("GET", "" +  day + ".el")
	req.addEventListener("load", function(event) {
		if (req.status >= 200 && req.status < 300) {
			txt.textContent = req.responseText
			txt.focus()
			txt.scrollTop = 0

		} else {
			txt.textContent = "** error on loading **"
			console.warn(req.statusText, req.responseText);
		}
	})
	req.send();
}

function change() {
	this.blur()
	day = sel.selectedIndex + 1
	load()
}
sel.onchange = change

var days = 25

next.onclick = function() {
	sel.selectedIndex = (sel.selectedIndex + 1) % days
	change()
}
prev.onclick = function() {
	sel.selectedIndex = (sel.selectedIndex + days - 1) % days
	change()
}

var day = 1
if (location.search.startsWith("?day=")) {
	day = location.search.substr(5)
}
for (i = 1; i <= days; i++) {
	var o = document.createElement("option")
	o.value = i
	o.text = i
	sel.add(o)
	if (i == day) sel.selectedIndex = i - 1
}
change()

</script>

xxx

done

