create.html


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

<link rel="stylesheet" href="/table-battles/cards.css">
<style>
.card { box-shadow: var(--drop-shadow) }
</style>
<div id="preview"></div>
<script>

var select = document.querySelector("select[name='scenario']")
var preview = document.getElementById("preview")
var list = null

window.onload = async function () {
	fetch("/table-battles/info/scenarios.html")
		.then(r => r.text())
		.then(html => {
			list = (new DOMParser()).parseFromString(html, "text/html")
		})
}

select.onchange = function (evt) {
	if (list) {
		let node = list.getElementById("scenario_" + parseInt(select.value))
		if (node)
			preview.replaceChildren(node.cloneNode(true))
		else
			preview.replaceChildren()
	}
}

</script>