titaniumtown/YTBN-Graphing-Software
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI improvements

Browse Source
This commit is contained in:
Simon Gardling 2022-03-01 00:36:13 -05:00
parent 2cdf5ccd31
commit 5c38fe514f
6 changed files with 89 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
Cargo.toml
View File

@ -24,6 +24,7 @@ meval = { git = "https://github.com/Titaniumtown/meval-rs.git" }
eframe = { git = "https://github.com/Titaniumtown/egui", default-features = false, features = ["egui_glow"] }
git-version = "0.3.5"
include-flate = { git = "https://github.com/Titaniumtown/include-flate.git" }
web-sys = "0.3.56"
[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
instant = { version = "0.1.12" }

4
src/egui_app.rs
View File

@ -241,8 +241,8 @@ impl epi::App for MathApp {
Plot::new("plot")
.set_margin_fraction(Vec2::ZERO)
.view_aspect(1.0)
.data_aspect(1.0)
// .view_aspect(1.0)
// .data_aspect(1.0)
.include_y(0)
.show(ui, |plot_ui| {
let bounds = plot_ui.plot_bounds();

20
src/function.rs
View File

@ -23,26 +23,6 @@ pub struct Function {
integral_num: usize,
}
impl Clone for Function {
fn clone(&self) -> Self {
let expr: Expr = self.func_str.parse().unwrap();
let func = expr.bind("x").unwrap();
Self {
function: Box::new(func),
func_str: self.func_str.clone(),
min_x: self.min_x,
max_x: self.max_x,
pixel_width: self.pixel_width,
back_cache: self.back_cache.clone(),
front_cache: self.front_cache.clone(),
integral: self.integral,
integral_min_x: self.integral_min_x,
integral_max_x: self.integral_max_x,
integral_num: self.integral_num,
}
}
}
impl Function {
pub fn new(
func_str: String, min_x: f64, max_x: f64, pixel_width: usize, integral: bool,

13
src/lib.rs
View File

@ -35,9 +35,16 @@ pub fn start(canvas_id: &str) -> Result<(), wasm_bindgen::JsValue> {
init_tracing_wasm();
// Used in order to hook into `panic!()` to log in the browser's console
log_helper("Initializing console_error_panic_hook...");
std::panic::set_hook(Box::new(console_error_panic_hook::hook));
log_helper("Initialized console_error_panic_hook!");
log_helper("Initializing panic hooks...");
std::panic::set_hook(Box::new(|panic_info| {
web_sys::window()
.and_then(|window| window.document())
.and_then(|document| document.body())
.and_then(|element| element.set_attribute("data-panicked", "true").ok());
console_error_panic_hook::hook(panic_info);
}));
log_helper("Initialized panic hooks!");
log_helper("Finished initializing!");

14
www/index.html
View File

@ -7,17 +7,29 @@
<meta charset="utf-8">
<title>Integral Demonstration</title>
<link rel="stylesheet" href="style.css">
</head>
</head>
<body>
<noscript>Please enable Javascript, this page uses both WebAssembly and Javascript to run.</noscript>
<canvas id="canvas"></canvas>
<div id="panic">
<h1>application encountered a panic!</h1>
<div>the application will no longer respond to user inputs</div>
<div>check the console for more information</div>
</div>
<div class="centered" id="loading">
<p style="font-size:16px">
Loading…
</p>
<div class="lds-dual-ring"></div>
</div>
<script type="module">
import init, { start } from '../pkg/integral_site.js';
async function run() {
await init();
document.getElementById("loading").remove();
start("canvas");
}
run();

63
www/style.css
View File

@ -48,4 +48,67 @@ canvas {
font-size: 24px;
font-family: Ubuntu-Light, Helvetica, sans-serif;
text-align: center;
}
/* ---------------------------------------------- */
/* Loading animation from https://loading.io/css/ */
.lds-dual-ring {
display: inline-block;
width: 24px;
height: 24px;
}
.lds-dual-ring:after {
content: " ";
display: block;
width: 24px;
height: 24px;
margin: 0px;
border-radius: 50%;
border: 3px solid #fff;
border-color: #fff transparent #fff transparent;
animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
body[data-panicked = true] {
background-color: #ce2828;
#panic {
display: block;
}
}
#panic {
display: none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #ce2828;
color: #000;
font-weight: bold;
text-align: center;
padding: 1em 2em;
border-radius: 2em;
pointer-events: none;
h1 {
margin: 0;
}
z-index: 1000000;
}