diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..f5f802b --- /dev/null +++ b/Makefile @@ -0,0 +1,2 @@ +default: + python3 html-combiner.py \ No newline at end of file diff --git a/docs/media/blender/alien_tree.png b/docs/blender/alien_tree.png similarity index 100% rename from docs/media/blender/alien_tree.png rename to docs/blender/alien_tree.png diff --git a/docs/media/blender/alien_tree_preview.png b/docs/blender/alien_tree_preview.png similarity index 100% rename from docs/media/blender/alien_tree_preview.png rename to docs/blender/alien_tree_preview.png diff --git a/docs/media/blender/crab.png b/docs/blender/crab.png similarity index 100% rename from docs/media/blender/crab.png rename to docs/blender/crab.png diff --git a/docs/media/blender/crab_preview.png b/docs/blender/crab_preview.png similarity index 100% rename from docs/media/blender/crab_preview.png rename to docs/blender/crab_preview.png diff --git a/docs/media/blender/critters.mp4 b/docs/blender/critters.mp4 similarity index 100% rename from docs/media/blender/critters.mp4 rename to docs/blender/critters.mp4 diff --git a/docs/media/blender/decapod_shock.png b/docs/blender/decapod_shock.png similarity index 100% rename from docs/media/blender/decapod_shock.png rename to docs/blender/decapod_shock.png diff --git a/docs/media/blender/decapod_shock_preview.png b/docs/blender/decapod_shock_preview.png similarity index 100% rename from docs/media/blender/decapod_shock_preview.png rename to docs/blender/decapod_shock_preview.png diff --git a/docs/blender/index.html b/docs/blender/index.html index 8883886..a1aaf2d 100644 --- a/docs/blender/index.html +++ b/docs/blender/index.html @@ -10,50 +10,41 @@
- +
-

Blender creations

-

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I just like to make art in it and of course use it for game jams.

+

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I just like to make art in it and use it for game jams.

Alien Creatures animation

January 2022

youtu.be/AfRJvExamX4

- +

Alien Tree

January 2022

- Alien Tree + Alien Tree

Decapod Alien

January 2022

- Decapod Alien + Decapod Alien

Crab

October 2021

- Crab + Crab

Shork Wallpaper

This is a wallpaper for the game Shork.

May 2021

- Shork Wallpaper + Shork Wallpaper
diff --git a/docs/media/blender/shork_wallpaper.png b/docs/blender/shork_wallpaper.png similarity index 100% rename from docs/media/blender/shork_wallpaper.png rename to docs/blender/shork_wallpaper.png diff --git a/docs/media/blender/shork_wallpaper_preview.png b/docs/blender/shork_wallpaper_preview.png similarity index 100% rename from docs/media/blender/shork_wallpaper_preview.png rename to docs/blender/shork_wallpaper_preview.png diff --git a/docs/fractals/index.html b/docs/fractals/index.html index 2f41d80..ccd6601 100644 --- a/docs/fractals/index.html +++ b/docs/fractals/index.html @@ -7,23 +7,80 @@ Fractals +
- +
-

Fractals

-

This page is a collection of fractal renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS any more.

+

This page is a collection of fractal renderers I made in JS for a school assignment back in 2020.

Fractal tree

The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.

@@ -69,9 +126,9 @@

Copyright © 2022 - CrispyPin

diff --git a/docs/media/icons/favicon.png b/docs/icons/favicon.png similarity index 100% rename from docs/media/icons/favicon.png rename to docs/icons/favicon.png diff --git a/docs/media/icons/github.png b/docs/icons/github.png similarity index 100% rename from docs/media/icons/github.png rename to docs/icons/github.png diff --git a/docs/media/icons/itch.io.svg b/docs/icons/itch.io.svg similarity index 100% rename from docs/media/icons/itch.io.svg rename to docs/icons/itch.io.svg diff --git a/docs/logo.png b/docs/icons/logo.png similarity index 100% rename from docs/logo.png rename to docs/icons/logo.png diff --git a/docs/media/icons/youtube.png b/docs/icons/youtube.png similarity index 100% rename from docs/media/icons/youtube.png rename to docs/icons/youtube.png diff --git a/docs/index.html b/docs/index.html index a365be8..70b73f6 100644 --- a/docs/index.html +++ b/docs/index.html @@ -10,27 +10,64 @@
- +
-

Hello!

-

Welcome to my corner of the internet. I use this page to showcase some of my interesting projects in an easier to see way compared to just github. (This is very much a WIP)

+

Welcome to my corner of the internet. I use this page to showcase some of my interesting projects in an easier to see way compared to just github.

+ +
+

Voxel engine in godot-rust

+ https://github.com/CrispyPin/gd-voxel-rs +

+ I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. +

+ +

Demo of fast terrain generation

+
+ +
+ + https://github.com/CrispyPin/ovr-utils +

+ OVR Utils is a VR overlay application that has some useful tools for SteamVR. I have been working on it on and off since May 2021. +

+

+ I wanted an overlay that could tell me the time without having to open the steam dashboard, and to see the battery levels of my controllers easily, but couldn't find one for free that also had linux support. So I decided to create my own, and also wrote down a long list of other useful tools. So far only a few of these have been implemented, such as the image overlay and the keyboard. +

+
+ +
+

Blender creations

+

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I just like to make art in it and of course use it for game jams.

+ +
+ +
+ + https://github.com/CrispyPin/voxel-raymarcher + +
+ +
+

Game of life wallpaper

+

Source: https://github.com/CrispyPin/gol-wallpaper

+

See live here: gol.crispypin.cc

+ +
+ +
+

Fractals

+ While I was learning web development and javascript I made a page with fractals. I thought it was interesting enough to keep here. +
+

Copyright © 2022 - CrispyPin

diff --git a/docs/media/projects/raymarched-voxels.png b/docs/media/projects/raymarched-voxels.png deleted file mode 100644 index a558fdb..0000000 Binary files a/docs/media/projects/raymarched-voxels.png and /dev/null differ diff --git a/docs/media/projects/voxel/fig1.png b/docs/media/projects/voxel/fig1.png deleted file mode 100644 index 9b43ed0..0000000 Binary files a/docs/media/projects/voxel/fig1.png and /dev/null differ diff --git a/docs/media/projects/voxel/fig2.png b/docs/media/projects/voxel/fig2.png deleted file mode 100644 index 33e4919..0000000 Binary files a/docs/media/projects/voxel/fig2.png and /dev/null differ diff --git a/docs/media/projects/voxel/fig3.png b/docs/media/projects/voxel/fig3.png deleted file mode 100644 index fcb7370..0000000 Binary files a/docs/media/projects/voxel/fig3.png and /dev/null differ diff --git a/docs/projects/gol.png b/docs/projects/gol.png new file mode 100644 index 0000000..26e8c3d Binary files /dev/null and b/docs/projects/gol.png differ diff --git a/docs/projects/index.html b/docs/projects/index.html deleted file mode 100644 index 427ff06..0000000 --- a/docs/projects/index.html +++ /dev/null @@ -1,90 +0,0 @@ - - - - - - - - - Projects - - -
- -
- -
-
- **This page is a draft** -

Projects:

- - - - https://github.com/CrispyPin/gd-voxel-rs -

- I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. -

- -

Demo of fast terrain generation

- -

Greedy mesh visualisation

-

Greedy mesh algorithm

-

The algorithm I'm using is one I made myself, inspired by a few others. I could not find an easy to understand explanation of how to do it but this artice and this article gave me somewhere to start

- -

In this explanation I will assume basic knowledge of how meshes work and how to do the simplest form of culling for voxel meshes.

- - -

fig. 1: example set of voxels, with the simplest form of mesh generation applied.

- -

To start off, we can break down the problem to 2 dimensions by recognising that each direction along the axis as well as each layer along those directions is independent. We then only have to process a single 2D slice of the voxel domain at once. -

- - -

fig. 2: The algorithm only needs to consider one layer and direction at a time, highlighted in green

- -

The first step is to generate "strips", essentially create long quads that cover connected voxels. We can loop through the plane and keep track of at most one active strip. The active strip is the last one started and we grow it as more voxels under it are traversed. In the inner loop we check the voxel at that position as well as the one above. With this we can determine if we need to stop the current strip, start a new one or do nothing. If there is not currently an active strip, a new one should be created when the voxel below is filled and the one above is empty (an exposed surface).

- - -

fig.3: Long strips of adjacent voxels can be merged into fewer, long quads.

- - - https://github.com/CrispyPin/ovr-utils -

- OVR Utils is a VR overlay application that has some useful tools for SteamVR. I have been working on it on and off since May 2021. -

-

- I wanted an overlay that could tell me the time without having to open the steam dashboard, and to see the battery levels of my controllers easily, but couldn't find one for free that also had linux support. So I decided to create my own, and also wrote down a long list of other useful tools. So far only a few of these have been implemented, such as the image overlay and the keyboard. -

- - - https://github.com/CrispyPin/voxel-raymarcher - - - - https://github.com/CrispyPin/gol-wallpaper -

See live here: gol.crispypin.cc

- -
-
-

Copyright © 2022 - CrispyPin

- -
- - \ No newline at end of file diff --git a/docs/projects/raymarched-voxels.png b/docs/projects/raymarched-voxels.png new file mode 100644 index 0000000..58beffd Binary files /dev/null and b/docs/projects/raymarched-voxels.png differ diff --git a/docs/style.css b/docs/style.css index 2aae836..2b7424a 100644 --- a/docs/style.css +++ b/docs/style.css @@ -1,15 +1,25 @@ body { - font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; - background-color: #181818; - color: white; + font-family: sans-serif; + background-color: #111; + color: #fff; display: -ms-grid; display: grid; - -ms-grid-rows: 50px auto 1fr auto; - grid-template-rows: 50px auto 1fr auto; - -ms-grid-columns: 80px 1fr 80px; - grid-template-columns: 80px 1fr 80px; + -ms-grid-rows: 50px 1fr auto; + grid-template-rows: 50px 1fr auto; margin: 0; - min-height: 100vh; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; +} + +main { + padding: 0 32px 64px; + width: 800px; + background-color: #222; +} + +a:link { + color: #8bf; } a:visited { @@ -18,55 +28,19 @@ a:visited { .title-link a { text-decoration: none; - color: white; + color: #fff; } .title-link a:visited { - color: white; -} - -nav { - grid-column: 1 / -1; -} - -nav ul { - list-style-type: none; - margin: 0; - display: -ms-grid; - display: grid; - padding: 5px 25px; - grid-gap: 5px; - -ms-grid-columns: (minmax(175px, auto))[auto-fill]; - grid-template-columns: repeat(auto-fill, minmax(175px, auto)); -} - -nav li { - padding: 8px; -} - -nav a { - font-size: 24px; - color: #000; - text-decoration: none; - display: block; - text-align: center; -} - -nav a:visited { - color: #000; + color: #fff; } header { grid-column: 1 / -1; - background-color: #181818; + background-color: #111; padding: 0; } -header h1 { - font-size: 40px; - margin: 0; -} - footer { grid-column: 1 / -1; margin-top: 5px; @@ -78,75 +52,7 @@ footer p { margin: 5px; } -main { - padding: 0 150px 40px; - margin: 5px 100px; - grid-column: 2 / -2; - background-color: #282828; -} - -.demo-render { - margin: 20px; - width: -webkit-min-content; - width: -moz-min-content; - width: min-content; - background-color: #000; -} - -.controlbar { - background-color: #181818; - padding: 2px 5px; - height: -webkit-max-content; - height: -moz-max-content; - height: max-content; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: space-evenly; - -ms-flex-pack: space-evenly; - justify-content: space-evenly; - -ms-flex-line-pack: stretch; - align-content: stretch; - -ms-flex-wrap: wrap; - flex-wrap: wrap; -} - -.controlbar button, .controlbar input { - padding: 4px 6px; - height: 25px; - border: 1px solid #000; - border: 0; - cursor: pointer; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - margin: 2px; -} - -.controlbar label { - background-color: #181818; - color: #fb8; - margin: 2px; - font-family: 'Consolas', 'Courier New', Courier, monospace; -} - -.clickable, nav li, .controlbar button, .controlbar input { - border-radius: 2px; - background-color: #4a4; -} - -.clickable:hover, nav li:hover, .controlbar button:hover, .controlbar input:hover { - background-color: #4af; -} - -.clickable:active, nav li:active, .controlbar button:active, .controlbar input:active { - background-color: #46c; -} - -.clickable:disabled, nav li:disabled, .controlbar button:disabled, .controlbar input:disabled { - background-color: #8b8; - text-decoration: line-through; - color: #000; - cursor: default; +img { + max-width: 800px; } /*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/docs/style.css.map b/docs/style.css.map index c13cbd2..25c53af 100644 --- a/docs/style.css.map +++ b/docs/style.css.map @@ -1,6 +1,6 @@ { "version": 3, - "mappings": "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", + "mappings": "AAOA,AAAA,IAAI,CAAC;EACJ,WAAW,EAAE,UAAU;EACvB,gBAAgB,EATP,IAAI;EAUb,KAAK,EARI,IAAI;EAUb,OAAO,EAAE,IAAI;EACb,kBAAkB,EAAE,aAAa;EAEjC,MAAM,EAAE,CAAC;EACT,eAAe,EAAE,MAAM;CACvB;;AAED,AAAA,IAAI,CAAC;EACJ,OAAO,EAAE,WAAY;EAErB,KAAK,EAlBO,KAAK;EAoBjB,gBAAgB,EAvBJ,IAAI;CAwBhB;;AAED,AAAA,CAAC,AAAA,KAAK,CAAC;EACN,KAAK,EAAE,IAAI;CACX;;AAED,AAAA,CAAC,AAAA,QAAQ,CAAC;EACT,KAAK,EAAE,IAAI;CACX;;AAED,AAAA,WAAW,CAAC,CAAC,CAAC;EACb,eAAe,EAAE,IAAI;EACrB,KAAK,EAnCI,IAAI;CAuCb;;AAND,AAGC,WAHU,CAAC,CAAC,AAGX,QAAQ,CAAC;EACT,KAAK,EArCG,IAAI;CAsCZ;;AAGF,AAAA,MAAM,CAAC;EACN,WAAW,EAAE,MAAM;EACnB,gBAAgB,EA7CP,IAAI;EA8Cb,OAAO,EAAE,CAAC;CACV;;AAED,AAAA,MAAM,CAAC;EACN,WAAW,EAAE,MAAM;EACnB,UAAU,EAAE,GAAG;EACf,aAAa,EAAE,IAAI;EACnB,UAAU,EAAE,MAAM;CAIlB;;AARD,AAKC,MALK,CAKL,CAAC,CAAC;EACD,MAAM,EAAE,GAAG;CACX;;AAGF,AAAA,GAAG,CAAC;EACH,SAAS,EAxDG,KAAK;CAyDjB", "sources": [ "style.scss" ], diff --git a/docs/style.scss b/docs/style.scss index 6b7bdd8..f3226f9 100644 --- a/docs/style.scss +++ b/docs/style.scss @@ -1,26 +1,32 @@ -$main-item: #4a4; +$main-bg: #111; +$content-bg: #222; +$main-fg: #fff; -$main-item-hover: #4af; -$main-item-active: #46c; -$main-item-disabled: #8b8; -$main-bg: #181818; -$main-page-bg: #282828; - -$main-color: rgb(255, 255, 255); +$page-width: 800px; body { - font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + font-family: sans-serif; background-color: $main-bg; - color: $main-color; + color: $main-fg; display: grid; - grid-template-rows: 50px auto 1fr auto; + grid-template-rows: 50px 1fr auto; - grid-template-columns: 80px 1fr 80px; - margin: 0; - min-height: 100vh; + justify-content: center; +} + +main { + padding: 0 32px 64px ; + // grid-column: 2 / -2; + width: $page-width; + // justify-self: center; + background-color: $content-bg; +} + +a:link { + color: #8bf; } a:visited { @@ -29,35 +35,9 @@ a:visited { .title-link a { text-decoration: none; - color: $main-color; + color: $main-fg; &:visited { - color: $main-color; - } -} - -nav { - grid-column: 1 / -1; - ul { - list-style-type: none; - margin: 0; - display: grid; - padding: 5px 25px; - grid-gap: 5px; - grid-template-columns: repeat(auto-fill, minmax(175px, auto)); - } - li { - @extend .clickable; - padding: 8px; - } - a { - font-size: 24px; - color: #000; - text-decoration: none; - display: block; - text-align: center; - &:visited { - color: #000; - } + color: $main-fg; } } @@ -65,10 +45,6 @@ header { grid-column: 1 / -1; background-color: $main-bg; padding: 0; - h1 { - font-size: 40px; - margin: 0; - } } footer { @@ -81,62 +57,7 @@ footer { } } -main { - padding: 0 150px 40px ; - margin: 5px 100px; - grid-column: 2 / -2; - background-color: $main-page-bg; -} - -.demo-render { - margin: 20px; - width: min-content; - background-color: #000; -} - -.controlbar { - background-color: $main-bg; - padding: 2px 5px; - height: max-content; - display: flex; - - justify-content: space-evenly; - align-content: stretch; - flex-wrap: wrap; - - button, input { - @extend .clickable; - padding: 4px 6px; - height: 25px; - border: 1px solid #000; - border: 0; - cursor: pointer; - - flex-grow: 1; - margin: 2px; - } - label { - background-color: $main-bg; - color: #fb8; - margin: 2px; - font-family: 'Consolas', 'Courier New', Courier, monospace; - } -} - -.clickable { - border-radius: 2px; - background-color: $main-item; - &:hover { - background-color: $main-item-hover; - } - &:active { - background-color: $main-item-active; - } - &:disabled { - background-color: $main-item-disabled; - text-decoration: line-through; - color: #000; - cursor: default; - } +img { + max-width: $page-width; } diff --git a/docs/media/projects/voxel/crop.sh b/docs/voxels/crop.sh similarity index 100% rename from docs/media/projects/voxel/crop.sh rename to docs/voxels/crop.sh diff --git a/docs/media/projects/voxel/demo.mp4 b/docs/voxels/demo.mp4 similarity index 100% rename from docs/media/projects/voxel/demo.mp4 rename to docs/voxels/demo.mp4 diff --git a/docs/media/projects/voxel/demo2.mp4 b/docs/voxels/demo2.mp4 similarity index 100% rename from docs/media/projects/voxel/demo2.mp4 rename to docs/voxels/demo2.mp4 diff --git a/docs/voxels/fig1.png b/docs/voxels/fig1.png new file mode 100644 index 0000000..3139fc1 Binary files /dev/null and b/docs/voxels/fig1.png differ diff --git a/docs/voxels/fig2.png b/docs/voxels/fig2.png new file mode 100644 index 0000000..78bd96c Binary files /dev/null and b/docs/voxels/fig2.png differ diff --git a/docs/voxels/fig3.png b/docs/voxels/fig3.png new file mode 100644 index 0000000..ab400b6 Binary files /dev/null and b/docs/voxels/fig3.png differ diff --git a/docs/voxels/index.html b/docs/voxels/index.html new file mode 100644 index 0000000..3068864 --- /dev/null +++ b/docs/voxels/index.html @@ -0,0 +1,55 @@ + + + + + + + + + Voxel engine + + +
+ +
+
+

Godot-Rust Voxel Engine

+ https://github.com/CrispyPin/gd-voxel-rs +

+ I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. +

+ +

Demo of fast terrain generation

+ +

Greedy mesh visualisation

+

Greedy mesh algorithm

+

The algorithm I'm using is one I made myself, inspired by a few others. I could not find an easy to understand explanation of how to do it but this artice and this article gave me somewhere to start

+ +

In this explanation I will assume basic knowledge of how meshes work and how to do the simplest form of culling for voxel meshes.

+ + +

fig. 1: example set of voxels, with the simplest form of mesh generation applied.

+ +

To start off, we can break down the problem to 2 dimensions by recognising that each direction along the axis as well as each layer along those directions is independent. We then only have to process a single 2D slice of the voxel domain at once. +

+ + +

fig. 2: The algorithm only needs to consider one layer and direction at a time, highlighted in green

+ +

The first step is to generate "strips", essentially create long quads that cover connected voxels. We can loop through the plane and keep track of at most one active strip. The active strip is the last one started and we grow it as more voxels under it are traversed. In the inner loop we check the voxel at that position as well as the one above. With this we can determine if we need to stop the current strip, start a new one or do nothing. If there is not currently an active strip, a new one should be created when the voxel below is filled and the one above is empty (an exposed surface).

+ + +

fig.3: Long strips of adjacent voxels can be merged into fewer, long quads.

+ + +
+
+

Copyright © 2022 - CrispyPin

+ +
+ + \ No newline at end of file diff --git a/pages/blender/index.html b/pages/blender/index.html index 41beb99..c8e90d2 100644 --- a/pages/blender/index.html +++ b/pages/blender/index.html @@ -8,30 +8,30 @@

Blender creations

-

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I just like to make art in it and of course use it for game jams.

+

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I occasionally make art in it and of course use it for game jams.

Alien Creatures animation

January 2022

youtu.be/AfRJvExamX4

- +

Alien Tree

January 2022

- Alien Tree + Alien Tree

Decapod Alien

January 2022

- Decapod Alien + Decapod Alien

Crab

October 2021

- Crab + Crab

Shork Wallpaper

This is a wallpaper for the game Shork.

May 2021

- Shork Wallpaper + Shork Wallpaper
diff --git a/pages/fractals/index.html b/pages/fractals/index.html index 162b749..4ecf1f7 100644 --- a/pages/fractals/index.html +++ b/pages/fractals/index.html @@ -3,12 +3,78 @@ Fractals +

Fractals

-

This page is a collection of fractal renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS any more.

+

This page is a collection of fractal renderers I made in JS for a school assignment back in 2020.

Fractal tree

The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.

diff --git a/pages/index.html b/pages/index.html index fbe9e09..6e13034 100644 --- a/pages/index.html +++ b/pages/index.html @@ -8,7 +8,53 @@

Hello!

-

Welcome to my corner of the internet. I use this page to showcase some of my interesting projects in an easier to see way compared to just github. (This is very much a WIP)

+

Welcome to my corner of the internet. I use this page to showcase some of my interesting projects in an easier to see way compared to just github.

+ +
+

Voxel engine in godot-rust

+ https://github.com/CrispyPin/gd-voxel-rs +

+ I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. +

+ +

Demo of fast terrain generation

+
+ +
+ + https://github.com/CrispyPin/ovr-utils +

+ OVR Utils is a VR overlay application that has some useful tools for SteamVR. I have been working on it on and off since May 2021. +

+

+ I wanted an overlay that could tell me the time without having to open the steam dashboard, and to see the battery levels of my controllers easily, but couldn't find one for free that also had linux support. So I decided to create my own, and also wrote down a long list of other useful tools. So far only a few of these have been implemented, such as the image overlay and the keyboard. +

+
+ +
+

Blender creations

+

I have been using Blender since around august 2020 on and off, and did a course in it 2021, which boosted my motivation a lot. I occasionally make art in it and of course use it for game jams.

+ +
+ +
+ + https://github.com/CrispyPin/voxel-raymarcher + +
+ +
+

Game of life wallpaper

+

Source: https://github.com/CrispyPin/gol-wallpaper

+

See live here: gol.crispypin.cc

+ +
+ +
+

Fractals

+ While I was learning web development and javascript I made a page with fractals. I thought it was interesting enough to keep here. +
+
diff --git a/pages/projects/index.html b/pages/projects/index.html deleted file mode 100644 index ae42d61..0000000 --- a/pages/projects/index.html +++ /dev/null @@ -1,68 +0,0 @@ - - - - - Projects - - - -
-
- **This page is a draft** -

Projects:

- - - - https://github.com/CrispyPin/gd-voxel-rs -

- I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. -

- -

Demo of fast terrain generation

- -

Greedy mesh visualisation

-

Greedy mesh algorithm

-

The algorithm I'm using is one I made myself, inspired by a few others. I could not find an easy to understand explanation of how to do it but this artice and this article gave me somewhere to start

- -

In this explanation I will assume basic knowledge of how meshes work and how to do the simplest form of culling for voxel meshes.

- - -

fig. 1: example set of voxels, with the simplest form of mesh generation applied.

- -

To start off, we can break down the problem to 2 dimensions by recognising that each direction along the axis as well as each layer along those directions is independent. We then only have to process a single 2D slice of the voxel domain at once. -

- - -

fig. 2: The algorithm only needs to consider one layer and direction at a time, highlighted in green

- -

The first step is to generate "strips", essentially create long quads that cover connected voxels. We can loop through the plane and keep track of at most one active strip. The active strip is the last one started and we grow it as more voxels under it are traversed. In the inner loop we check the voxel at that position as well as the one above. With this we can determine if we need to stop the current strip, start a new one or do nothing. If there is not currently an active strip, a new one should be created when the voxel below is filled and the one above is empty (an exposed surface).

- - -

fig.3: Long strips of adjacent voxels can be merged into fewer, long quads.

- - - https://github.com/CrispyPin/ovr-utils -

- OVR Utils is a VR overlay application that has some useful tools for SteamVR. I have been working on it on and off since May 2021. -

-

- I wanted an overlay that could tell me the time without having to open the steam dashboard, and to see the battery levels of my controllers easily, but couldn't find one for free that also had linux support. So I decided to create my own, and also wrote down a long list of other useful tools. So far only a few of these have been implemented, such as the image overlay and the keyboard. -

- - - https://github.com/CrispyPin/voxel-raymarcher - - - - https://github.com/CrispyPin/gol-wallpaper -

See live here: gol.crispypin.cc

- -
- - - \ No newline at end of file diff --git a/pages/voxels/index.html b/pages/voxels/index.html new file mode 100644 index 0000000..cdf1dac --- /dev/null +++ b/pages/voxels/index.html @@ -0,0 +1,42 @@ + + + + + Voxel engine + + + +
+

Godot-Rust Voxel Engine

+ https://github.com/CrispyPin/gd-voxel-rs +

+ I am making a voxel engine in rust to learn rust and godot-rust as well as explore voxel systems. +

+ +

Demo of fast terrain generation

+ +

Greedy mesh visualisation

+

Greedy mesh algorithm

+

The algorithm I'm using is one I made myself, inspired by a few others. I could not find an easy to understand explanation of how to do it but this artice and this article gave me somewhere to start

+ +

In this explanation I will assume basic knowledge of how meshes work and how to do the simplest form of culling for voxel meshes.

+ + +

fig. 1: example set of voxels, with the simplest form of mesh generation applied.

+ +

To start off, we can break down the problem to 2 dimensions by recognising that each direction along the axis as well as each layer along those directions is independent. We then only have to process a single 2D slice of the voxel domain at once. +

+ + +

fig. 2: The algorithm only needs to consider one layer and direction at a time, highlighted in green

+ +

The first step is to generate "strips", essentially create long quads that cover connected voxels. We can loop through the plane and keep track of at most one active strip. The active strip is the last one started and we grow it as more voxels under it are traversed. In the inner loop we check the voxel at that position as well as the one above. With this we can determine if we need to stop the current strip, start a new one or do nothing. If there is not currently an active strip, a new one should be created when the voxel below is filled and the one above is empty (an exposed surface).

+ + +

fig.3: Long strips of adjacent voxels can be merged into fewer, long quads.

+ + +
+ + + \ No newline at end of file diff --git a/templates/footer.html b/templates/footer.html index bd9071b..f621956 100644 --- a/templates/footer.html +++ b/templates/footer.html @@ -1,8 +1,8 @@

Copyright © 2022 - CrispyPin

\ No newline at end of file diff --git a/templates/header.html b/templates/header.html index 9c8160c..a41af2f 100644 --- a/templates/header.html +++ b/templates/header.html @@ -1,4 +1,3 @@
- -
- \ No newline at end of file + + \ No newline at end of file diff --git a/templates/navbar.html b/templates/navbar.html deleted file mode 100644 index 96802be..0000000 --- a/templates/navbar.html +++ /dev/null @@ -1,9 +0,0 @@ - \ No newline at end of file