write solver specific intros
This commit is contained in:
parent
4c40acbb1f
commit
a6c2adf0f0
|
@ -4,7 +4,7 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="generator" content="by-hand" />
|
<meta name="generator" content="by-hand" />
|
||||||
<meta name="viewpost" context="width=device-width, inital-scale=1.0, user-scalable=yes" />
|
<meta name="viewport" context="width=device-width, inital-scale=1.0, user-scalable=yes" />
|
||||||
<title>ΣBP Solver</title>
|
<title>ΣBP Solver</title>
|
||||||
<link rel="stylesheet" type="text/css" href="style.css">
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
<script async type="module" src="main.js"></script>
|
<script async type="module" src="main.js"></script>
|
||||||
|
@ -17,13 +17,19 @@
|
||||||
<div class="menu-item">
|
<div class="menu-item">
|
||||||
<p class="menu-header">Choose an equation set</p>
|
<p class="menu-header">Choose an equation set</p>
|
||||||
<select id="eq-set" name="eq-set">
|
<select id="eq-set" name="eq-set">
|
||||||
<option value="euler"/> Euler</option>
|
<option value="euler"> Euler</option>
|
||||||
<option value="maxwell"/> Maxwell</option>
|
<option value="maxwell"> Maxwell</option>
|
||||||
<option value="shallow"/> Shallow Water</option>
|
<option value="shallow"> Shallow Water</option>
|
||||||
</select>
|
</select>
|
||||||
<p>
|
<div class="eq-set-options" id="euler-options">
|
||||||
And here will be specific content for the solver in question
|
The compressible Euler equations
|
||||||
</p>
|
</div>
|
||||||
|
<div class="eq-set-options" id="maxwell-options">
|
||||||
|
The Maxwell equations in 2D
|
||||||
|
</div>
|
||||||
|
<div class="eq-set-options" id="shallow-options">
|
||||||
|
The Shallow Water Equations describes the surface of a body of water
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid menu-item">
|
<div class="grid menu-item">
|
||||||
<p class="menu-header">Grid</p>
|
<p class="menu-header">Grid</p>
|
||||||
|
|
|
@ -142,6 +142,9 @@ class LineDrawer {
|
||||||
}
|
}
|
||||||
|
|
||||||
(async function run() {
|
(async function run() {
|
||||||
|
const eq_sel = document.getElementById("eq-set");
|
||||||
|
display_eqset(eq_sel.value);
|
||||||
|
|
||||||
const wasm = await init("./sbp_web_bg.wasm");
|
const wasm = await init("./sbp_web_bg.wasm");
|
||||||
setPanicHook();
|
setPanicHook();
|
||||||
const canvas = document.getElementById("glCanvas");
|
const canvas = document.getElementById("glCanvas");
|
||||||
|
@ -240,8 +243,6 @@ class LineDrawer {
|
||||||
resizeCanvas();
|
resizeCanvas();
|
||||||
window.addEventListener("resize", resizeCanvas, false);
|
window.addEventListener("resize", resizeCanvas, false);
|
||||||
|
|
||||||
// window.requestAnimationFrame(drawMe);
|
|
||||||
|
|
||||||
const menu = document.getElementById("menu");
|
const menu = document.getElementById("menu");
|
||||||
const menu_toggle = document.getElementById("toggle-menu");
|
const menu_toggle = document.getElementById("toggle-menu");
|
||||||
menu_toggle.addEventListener("click", () => {
|
menu_toggle.addEventListener("click", () => {
|
||||||
|
@ -252,10 +253,27 @@ class LineDrawer {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const eq_sel = document.getElementById("eq-set");
|
|
||||||
eq_sel.addEventListener("change", (e) => {
|
eq_sel.addEventListener("change", (e) => {
|
||||||
console.log("equation changed, wants: ", e.target.value);
|
console.log("equation changed, wants: ", e.target.value);
|
||||||
|
display_eqset(eq_sel.value);
|
||||||
});
|
});
|
||||||
|
function display_eqset(value) {
|
||||||
|
const euler_options = document.getElementById("euler-options");
|
||||||
|
euler_options.style.display = "none";
|
||||||
|
const maxwell_options = document.getElementById("maxwell-options");
|
||||||
|
maxwell_options.style.display = "none";
|
||||||
|
const shallow_options = document.getElementById("shallow-options");
|
||||||
|
shallow_options.style.display = "none";
|
||||||
|
if (value === "euler") {
|
||||||
|
euler_options.style.display = "block";
|
||||||
|
} else if (value === "maxwell") {
|
||||||
|
maxwell_options.style.display = "block";
|
||||||
|
} else if (value === "shallow") {
|
||||||
|
shallow_options.style.display = "block";
|
||||||
|
} else {
|
||||||
|
console.error(`Unknown value ${value}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
let animation = null;
|
let animation = null;
|
||||||
let is_setup = false;
|
let is_setup = false;
|
||||||
|
|
|
@ -8,3 +8,4 @@ select#eq-set { width: 100%; }
|
||||||
.controls:hover { opacity: 1.0; }
|
.controls:hover { opacity: 1.0; }
|
||||||
.menu-item { flex-shrink: 0; }
|
.menu-item { flex-shrink: 0; }
|
||||||
.horizontal-flex { display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
|
.horizontal-flex { display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
|
||||||
|
.eq-set-options { display: none; }
|
||||||
|
|
Loading…
Reference in New Issue