headless render + terminal display pages

content/projects/bevy_headless_render/index.md

@@ -0,0 +1,13 @@
++++
+title = "bevy_headless_render"
+[taxonomies]
+categories = ["bevy plugin"]
+languages = ["rust"]
+[extra]
+github = ["exvacuum/bevy_headless_render"]
+crates = ["bevy_headless_render"]
++++
+
+this plugin is pretty simple, it just allows you to set up a render texture to be extracted for use on the CPU every frame
+
+i made this plugin as part of the [white (I)](@/projects/white_I/index.md) project super early on when i needed a copy of the rendered frame in the main world to be rendered as braille to the screen

content/projects/bevy_terminal_display/index.md

@@ -0,0 +1,28 @@
++++
+title = "bevy_terminal_display"
+[taxonomies]
+categories = ["bevy plugin"]
+languages = ["rust"]
+[extra]
+very_cool = true
+github = ["exvacuum/bevy_terminal_display"]
+crates = ["bevy_terminal_display"]
++++
+
+this plugin allows you to render from a camera to the terminal using [unicode braille characters](https://en.wikipedia.org/wiki/Braille_Patterns)
+
+![sponza](sponza.png)
+
+it makes use of the [bevy_headless_render](@/projects/bevy_headless_render/index.md) plugin for headless rendering, and then uses the [bevy_dither_post_process](@/projects/bevy_dither_post_process/index.md) plugin to dither the captured frame before converting the black and white pixels into the appropriate characters and printing them to the terminal
+
+this plugin uses the [ratatui](https://crates.io/crates/ratatui) and [crossterm](https://crates.io/crates/crossterm) for rendering to the terminal
+
+this plugin manages a `TerminalInput` resource which keeps track of pressed keys
+
+this plugin also has facilities for creating and rendering ratatui widgets
+
+here's an example of a dialog box and option selection widget i've implemented in my [white (I)](@/projects/white_I/index.md) project
+
+![dialog widget](dialog.png)
+
+in that project, i also make use of the [bevy_outline_post_process](@/projects/bevy_outline_post_process/index.md) for additional visual contrast

sass/style.scss

@@ -1,5 +1,28 @@
 @use "everforest";
 
+/// Stole this from Stack Overflow (https://stackoverflow.com/a/54702294) {{{
+
+.rainbow_text_animated {
+    background: linear-gradient(to right, everforest.$red, everforest.$orange, everforest.$yellow, everforest.$green, everforest.$blue, everforest.$purple);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    animation: rainbow_animation 1s ease-in-out infinite;
+    background-size: 400% 100%;
+}
+
+@keyframes rainbow_animation {
+    0%,100% {
+        background-position: 0 0;
+    }
+
+    50% {
+        background-position: 100% 0;
+    }
+}
+
+/// }}}
+
 body {
   color: everforest.$fg;
   background-color: everforest.$bg0;

templates/projects.html

@@ -11,7 +11,17 @@
 <b>{{category.name}}</b>
 <ul>
 	{% for page in category.pages %}
-	<li><a href="{{ page.permalink | safe }}">{{ page.title }}{% if page.description %}: {{ page.description }}{% endif %}</a>{% if page.extra.wip %} (<span class="wip-indicator">wip</span>){% endif %}</li>
+	<li>
+		<a href="{{ page.permalink | safe }}">
+			{{ page.title }}{% if page.description %}: {{ page.description }}{% endif %}
+		</a>
+		{% if page.extra.wip %}
+		 (<span class="wip-indicator">wip</span>)
+		{% endif %}
+		{% if page.extra.very_cool %}
+		 (<span class="rainbow_text_animated">VERY COOL</span>)
+		{% endif %}
+	</li>
 	{% endfor %}
 </ul>
 {% endfor %}