add bevy animation but still not in right spot
This commit is contained in:
parent
87ad2ef372
commit
5fbd2d8956
7
website/assets/load_bevy_anim.js
Normal file
7
website/assets/load_bevy_anim.js
Normal file
@ -0,0 +1,7 @@
|
||||
import init from '/out/bevyanim.js'
|
||||
|
||||
init().catch((error) => {
|
||||
if (!error.message.startsWith("Using exceptions for control flow, don't mind me. This isn't actually an error!")) {
|
||||
throw error;
|
||||
}
|
||||
});
|
||||
1
website/assets/my_new_effect.ron
Normal file
1
website/assets/my_new_effect.ron
Normal file
@ -0,0 +1 @@
|
||||
(spawn_rate:0.01,spawn_amount:22,emission_shape:Circle(0.0),lifetime:(12.0,0.0),linear_speed:Some((400.0,0.46)),linear_acceleration:Some((0.0,0.0)),direction:Some(((0.0,0.0),1.0)),angular_speed:Some((0.0,0.18)),angular_acceleration:Some((0.0,0.3)),scale:Some((5.0,1.0)),color:None,gravity_direction:None,gravity_speed:None,linear_damp:Some((0.0,0.0)),angular_damp:Some((0.0,0.25)),scale_curve:None,color_curve:Some((points:[((red:0.012286487,green:0.046665076,blue:0.10946172,alpha:1.0),0.1,None),((red:0.9646863,green:0.1651323,blue:0.004391431,alpha:1.0),0.12,None)])))
|
||||
2326
website/assets/out/bevyanim.js
Normal file
2326
website/assets/out/bevyanim.js
Normal file
File diff suppressed because it is too large
Load Diff
BIN
website/assets/out/bevyanim_bg.wasm
Normal file
BIN
website/assets/out/bevyanim_bg.wasm
Normal file
Binary file not shown.
17
website/assets/out/index.html
Normal file
17
website/assets/out/index.html
Normal file
@ -0,0 +1,17 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<body style="margin: 0px;">
|
||||
<canvas id="bevy-canvas1" width="100vw" height="100vh"></canvas>
|
||||
<script type="module">
|
||||
import init from './bevyanim.js'
|
||||
|
||||
init().catch((error) => {
|
||||
if (!error.message.startsWith("Using exceptions for control flow, don't mind me. This isn't actually an error!")) {
|
||||
throw error;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
1
website/assets/out/my_new_effect.ron
Normal file
1
website/assets/out/my_new_effect.ron
Normal file
@ -0,0 +1 @@
|
||||
(spawn_rate:0.01,spawn_amount:22,emission_shape:Circle(0.0),lifetime:(12.0,0.0),linear_speed:Some((400.0,0.46)),linear_acceleration:Some((0.0,0.0)),direction:Some(((0.0,0.0),1.0)),angular_speed:Some((0.0,0.18)),angular_acceleration:Some((0.0,0.3)),scale:Some((5.0,1.0)),color:None,gravity_direction:None,gravity_speed:None,linear_damp:Some((0.0,0.0)),angular_damp:Some((0.0,0.25)),scale_curve:None,color_curve:Some((points:[((red:0.012286487,green:0.046665076,blue:0.10946172,alpha:1.0),0.1,None),((red:0.9646863,green:0.1651323,blue:0.004391431,alpha:1.0),0.12,None)])))
|
||||
@ -43,6 +43,17 @@ function drawConnections() {
|
||||
}
|
||||
}
|
||||
|
||||
function moveBevy() {
|
||||
const canvas_el = document.getElementById("bevy-canvas1");
|
||||
const content_el = document.getElementById("hero");
|
||||
const content_box = content_el.getBoundingClientRect();
|
||||
canvas_el.setAttribute("width", content_box.width);
|
||||
canvas_el.setAttribute("height", content_box.height);
|
||||
canvas_el.setAttribute("top", content_box.top);
|
||||
canvas_el.setAttribute("left", content_box.left);
|
||||
}
|
||||
|
||||
window.addEventListener("scroll", (event) => {
|
||||
drawConnections();
|
||||
moveBevy();
|
||||
});
|
||||
@ -8,4 +8,11 @@ body{
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
#bevy-canvas1{
|
||||
position:fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
@ -57,8 +57,10 @@ pub fn App() -> impl IntoView {
|
||||
#[component]
|
||||
fn HomePage() -> impl IntoView {
|
||||
view! {
|
||||
<canvas id="p-e-canvas"></canvas>
|
||||
<div class="md:flex md:flex-row min-h-screen md:justify-center md:items-center">
|
||||
<script type="module" src="/load_bevy_anim.js">
|
||||
</script>
|
||||
<canvas id="bevy-canvas1" width="100vw"></canvas>
|
||||
<div id="hero" class="md:flex md:flex-row min-h-screen md:justify-center md:items-center">
|
||||
<img class="max-w-lg rounded hidden md:block" src="/founder_portrait.jpg" />
|
||||
<div class="flex flex-col m-4 p-2 items-start max-w-lg">
|
||||
<ul class="flex flex-row justify-around w-full">
|
||||
@ -72,6 +74,8 @@ fn HomePage() -> impl IntoView {
|
||||
projects outlined on this website. If you want to hire me or ask questions about my projects reach out to me "<a class="underline" href="mailto:liam.fitzpatrick@live.com">here</a>.</P>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<canvas id="p-e-canvas"></canvas>
|
||||
|
||||
|
||||
<div id="p-e-content" class="min-h-screen">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user