4 <title>Sixth 3D engine demos</title>
5 <!-- 2020-01-31 R 17:28 -->
7 <meta name="viewport" content="width=device-width, initial-scale=1">
8 <meta name="generator" content="Org-mode">
9 <meta name="author" content="Svjatoslav Agejenko">
10 <link href="https://bootswatch.com/3/darkly/bootstrap.min.css" rel="stylesheet">
11 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
12 <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
13 <style type="text/css">
14 footer {background-color: #111 !important;}
15 pre {background-color: #111; color: #ccc;}
17 <style type="text/css">
18 /* org mode styles on top of twbs */
35 background-color: #f5f5f5;
62 display: inline-block;
74 .bs-docs-sidebar.affix {
77 @media (min-width: 768px) {
83 /* All levels of nav */
84 .bs-docs-sidebar .nav > li > a {
91 .bs-docs-sidebar .nav > li > a:hover,
92 .bs-docs-sidebar .nav > li > a:focus {
95 text-decoration: none;
96 background-color: transparent;
97 border-left: 1px solid #A1283B;
99 .bs-docs-sidebar .nav > .active > a,
100 .bs-docs-sidebar .nav > .active:hover > a,
101 .bs-docs-sidebar .nav > .active:focus > a {
105 background-color: transparent;
106 border-left: 2px solid #A1283B;
109 /* Nav: second level (shown on .active) */
110 .bs-docs-sidebar .nav .nav {
111 display: none; /* Hide by default, but at >768px, show it */
112 padding-bottom: 10px;
114 .bs-docs-sidebar .nav .nav > li > a {
121 .bs-docs-sidebar .nav .nav > li > a:hover,
122 .bs-docs-sidebar .nav .nav > li > a:focus {
125 .bs-docs-sidebar .nav .nav > .active > a,
126 .bs-docs-sidebar .nav .nav > .active:hover > a,
127 .bs-docs-sidebar .nav .nav > .active:focus > a {
132 /* Nav: third level (shown on .active) */
133 .bs-docs-sidebar .nav .nav .nav {
134 padding-bottom: 10px;
136 .bs-docs-sidebar .nav .nav .nav > li > a {
143 .bs-docs-sidebar .nav .nav .nav > li > a:hover,
144 .bs-docs-sidebar .nav .nav .nav > li > a:focus {
147 .bs-docs-sidebar .nav .nav .nav > .active > a,
148 .bs-docs-sidebar .nav .nav .nav > .active:hover > a,
149 .bs-docs-sidebar .nav .nav .nav > .active:focus > a {
154 /* Show and affix the side nav when space allows it */
155 @media (min-width: 992px) {
156 .bs-docs-sidebar .nav > .active > ul {
159 /* Widen the fixed sidebar */
160 .bs-docs-sidebar.affix,
161 .bs-docs-sidebar.affix-bottom {
164 .bs-docs-sidebar.affix {
165 position: fixed; /* Undo the static from mobile first approach */
168 .bs-docs-sidebar.affix-bottom {
169 position: absolute; /* Undo the static from mobile first approach */
171 .bs-docs-sidebar.affix .bs-docs-sidenav,.bs-docs-sidebar.affix-bottom .bs-docs-sidenav {
176 @media (min-width: 1200px) {
177 /* Widen the fixed sidebar again */
178 .bs-docs-sidebar.affix-bottom,
179 .bs-docs-sidebar.affix {
184 <script type="text/javascript">
188 $('.bs-docs-sidebar li').first().addClass('active');
190 $(document.body).scrollspy({target: '.bs-docs-sidebar'});
192 $('.bs-docs-sidebar').affix();
197 <div id="content" class="container">
198 <div class="row"><div class="col-md-9"><h1 class="title">Sixth 3D engine demos</h1>
200 <div id="outline-container-sec-1" class="outline-2">
201 <h2 id="sec-1"><span class="section-number-2">1</span> General</h2>
202 <div class="outline-text-2" id="text-1">
204 <li>This is a subproject of <a href="https://www3.svjatoslav.eu/projects/sixth-3d/">Sixth 3D</a>:
206 <li>which in turn is a subproject of parent project <a href="https://www3.svjatoslav.eu/projects/sixth/">Sixth</a>.
211 <li>This program is free software: you can redistribute it and/or modify
212 it under the terms of the <a href="https://www.gnu.org/licenses/lgpl.html">GNU Lesser General Public License</a> as
213 published by the Free Software Foundation, either version 3 of the
214 License, or (at your option) any later version.
219 <li>Svjatoslav Agejenko
221 <li>Homepage: <a href="https://svjatoslav.eu">https://svjatoslav.eu</a>
223 <li>Email: <a href="mailto://svjatoslav@svjatoslav.eu">mailto://svjatoslav@svjatoslav.eu</a>
228 <li><a href="https://www.svjatoslav.eu/projects/">Other software projects hosted at svjatoslav.eu</a>
233 <div id="outline-container-sec-1-1" class="outline-3">
234 <h3 id="sec-1-1"><span class="section-number-3">1.1</span> Source code</h3>
235 <div class="outline-text-3" id="text-1-1">
237 <li><a href="https://www2.svjatoslav.eu/gitweb/?p=sixth-3d-demos.git;a=snapshot;h=HEAD;sf=tgz">Download latest snapshot in TAR GZ format</a>
240 <li><a href="https://www2.svjatoslav.eu/gitweb/?p=sixth-3d-demos.git;a=summary">Browse Git repository online</a>
243 <li>Clone Git repository using command:
244 <pre class="example">
245 git clone https://www2.svjatoslav.eu/git/sixth-3d-demos.git
254 <div id="outline-container-sec-2" class="outline-2">
255 <h2 id="sec-2"><span class="section-number-2">2</span> Overview</h2>
256 <div class="outline-text-2" id="text-2">
258 Goal of this project is to show off capabilities and API usage of
259 <a href="https://www3.svjatoslav.eu/projects/sixth-3d/">Sixth 3D</a> engine.
263 All <a href="#sec-4">example scenes in this repository</a> render at interactive
268 Download runnable JAR file: <a href="sixth-3d-demos.jar">sixth-3d-demos.jar</a>
272 To start demo application, use command:
274 <pre class="example">
275 java -jar sixth-3d-demos.jar
281 <div id="outline-container-sec-3" class="outline-2">
282 <h2 id="sec-3"><span class="section-number-2">3</span> Navigating in space</h2>
283 <div class="outline-text-2" id="text-3">
284 <table class="table table-striped table-bordered table-hover table-condensed">
294 <th scope="col" class="text-left">key</th>
295 <th scope="col" class="text-left">result</th>
300 <td class="text-left">cursor keys</td>
301 <td class="text-left">move: left, right, forward, backward</td>
305 <td class="text-left">mouse scroll wheel</td>
306 <td class="text-left">move: up, down</td>
310 <td class="text-left">dragging with mouse</td>
311 <td class="text-left">look around</td>
318 <div id="outline-container-sec-4" class="outline-2">
319 <h2 id="sec-4"><a id="ID-5f88b493-6ab3-4659-8280-803f75dbd5e0" name="ID-5f88b493-6ab3-4659-8280-803f75dbd5e0"></a><span class="section-number-2">4</span> Example scenes in this repository</h2>
320 <div class="outline-text-2" id="text-4">
322 <div id="outline-container-sec-4-1" class="outline-3">
323 <h3 id="sec-4-1"><span class="section-number-3">4.1</span> Raytracing through voxels</h3>
324 <div class="outline-text-3" id="text-4-1">
327 <p><img src="screenshots/raytracing fractal in voxel polygon hybrid scene.png" class="img-responsive" alt="raytracing fractal in voxel polygon hybrid scene.png">
332 Test scene that is generated simultaneously using:
335 <li>conventional polygons
337 <li>for realtime navigation, and
343 <li>for on-demand raytracing
350 Instead of storing voxels in dumb [X * Y * Z] array, dynamically
351 partitioned <a href="https://en.wikipedia.org/wiki/Octree">octree</a> is used to compress data. Press "r" key anywhere in
352 the scene to raytrace current view through compressed voxel
358 <div id="outline-container-sec-4-2" class="outline-3">
359 <h3 id="sec-4-2"><span class="section-number-3">4.2</span> Conway's Game of Life</h3>
360 <div class="outline-text-3" id="text-4-2">
362 The Game of Life, also known simply as Life, is a cellular automaton
363 devised by the British mathematician John Horton Conway in 1970.
367 <li><a href="https://en.wikipedia.org/wiki/Conway's_Game_of_Life">https://en.wikipedia.org/wiki/Conway's_Game_of_Life</a>
371 <li>2 cell states: alive / dead
373 <li>Each cell sees 8 neighboring cells.
375 <li>If alive cell neighbors count is 2 or 3, then cell survives,
378 <li>Dead cell becomes alive if neighbors count is exactly 3.
388 <p><img src="screenshots/life.png" class="img-responsive" alt="life.png">
393 Current application projects 2D game grid/matrix onto three
394 dimensional space. Extra dimension (height) is used to visualize
395 history (previous iterations) using glowing dots suspended in space.
401 <table class="table table-striped table-bordered table-hover table-condensed">
411 <th scope="col" class="text-left">key</th>
412 <th scope="col" class="text-left">result</th>
417 <td class="text-left">mouse click on the cell (cell)</td>
418 <td class="text-left">toggles cell state</td>
422 <td class="text-left"><space></td>
423 <td class="text-left">next iteration</td>
427 <td class="text-left">ENTER</td>
428 <td class="text-left">next iteeration with the history</td>
432 <td class="text-left">"c"</td>
433 <td class="text-left">clear the matrix</td>
440 <div id="outline-container-sec-4-3" class="outline-3">
441 <h3 id="sec-4-3"><span class="section-number-3">4.3</span> Text editors</h3>
442 <div class="outline-text-3" id="text-4-3">
445 <p><img src="screenshots/text editors.png" class="img-responsive" alt="text editors.png">
450 Initial test for creating user interfaces in 3D and:
453 <li>window focus handling
455 <li>picking objecs using mouse
457 <li>redirecting keyboard input to focused window
463 Window focus acts like a stack.
467 When window is clicked with the mouse, previously focused window (if
468 any) is pushed to the focus stack and new window receives focus. Red
469 frame appears around the window to indicate this.
473 When ESC key is pressed, window focus is returned to previous window
478 When any window is focused, all keyboard input is redirected to that
479 window, including cursor keys. To be able to navigate around the world
480 again, window must be unfocused first using ESC key.
487 <li>Improve focus handling:
489 <li>Perhaps add shortcut to navigate world without exiting entire
492 <li>Possibility to retain and reuse recently focused elements.
494 <li>Store user location in the world and view direction with the
495 focused window. So that when returning focus to far away object,
496 user is redirected also to proper location in the world.
500 <li>Possibility to store recently visited locations in the world and
508 <div id="outline-container-sec-4-4" class="outline-3">
509 <h3 id="sec-4-4"><span class="section-number-3">4.4</span> Mathematical formulas</h3>
510 <div class="outline-text-3" id="text-4-4">
513 <p><img src="screenshots/mathematical formulas.png" class="img-responsive" alt="mathematical formulas.png">
518 <li>TODO: instead of projecting 2D visualizations onto 3D space,
519 visualize some formula using all 3 dimensions avaliable.
524 <div id="outline-container-sec-4-5" class="outline-3">
525 <h3 id="sec-4-5"><span class="section-number-3">4.5</span> Sinus heightmaps and sphere</h3>
526 <div class="outline-text-3" id="text-4-5">
529 <p><img src="screenshots/sinus heightmaps and sphere.png" class="img-responsive" alt="sinus heightmaps and sphere.png">
534 Simple test scene. Easy to implement and looks nice.
539 </div><div class="col-md-3"><nav id="table-of-contents">
540 <div id="text-table-of-contents" class="bs-docs-sidebar">
542 <li><a href="#sec-1">1. General</a>
544 <li><a href="#sec-1-1">1.1. Source code</a></li>
547 <li><a href="#sec-2">2. Overview</a></li>
548 <li><a href="#sec-3">3. Navigating in space</a></li>
549 <li><a href="#sec-4">4. Example scenes in this repository</a>
551 <li><a href="#sec-4-1">4.1. Raytracing through voxels</a></li>
552 <li><a href="#sec-4-2">4.2. Conway's Game of Life</a></li>
553 <li><a href="#sec-4-3">4.3. Text editors</a></li>
554 <li><a href="#sec-4-4">4.4. Mathematical formulas</a></li>
555 <li><a href="#sec-4-5">4.5. Sinus heightmaps and sphere</a></li>
562 <footer id="postamble" class="">
563 <div><p class="author">Author: Svjatoslav Agejenko</p>
564 <p class="date">Created: 2020-01-31 R 17:28</p>
565 <p class="creator"><a href="http://www.gnu.org/software/emacs/">Emacs</a> 26.1 (<a href="http://orgmode.org">Org-mode</a> 9.1.9)</p>