enhance: clean up + doc

index.html

@@ -45,8 +45,6 @@
           </p>
         </footer>
 
-
-  
       </nav>
   </div>
 

src/bezier/BezierDemo.ts

@@ -3,6 +3,10 @@ import { UI } from "../uitls/UI";
 
 import { Curve2d } from './Curve2d';
 
+
+/**
+ * Prepares the scene for the demo.
+ */
 export function bezierDemo(render: RenderManager, ui: UI) {
     const curve = new Curve2d();
     curve.objects().forEach(obj => { render.add(obj); });

src/init.ts

 import * as RotCube from "./ambient/RotatingCube"
 import * as Main from "./main"
 
-
+/**
+ * Initializes the application. Sets specifically the link actions to 
+ * "load" the canvas.
+ */
 function init() {
+    // elements where to modify hidden class 
     const sceneElement = document.querySelector(".scene") as HTMLAnchorElement;
     const mainElement = document.querySelector(".main") as HTMLAnchorElement;
 
+    // set the link actions
     const bezierLink = document.querySelector("#bezier") as HTMLAnchorElement;
     const quaternionLink = document.querySelector("#quaternion") as HTMLAnchorElement;
     const simulationLink = document.querySelector("#simulation") as HTMLAnchorElement;
 
+    // actions to be performed when the link is clicked
     bezierLink.addEventListener("click", () => {
         sceneElement.classList.remove("hidden");
         mainElement.classList.add("hidden");
@@ -28,11 +34,9 @@ function init() {
         // TODO: add simulation
     });
 
-
+    // start animation
     RotCube.init();
     RotCube.render();
 }
 
 init();
-
-export { };
\ No newline at end of file

src/main.ts

@@ -4,11 +4,20 @@ import { UI } from "./uitls/UI";
 import { bezierDemo } from "./bezier/BezierDemo";
 import { quaternionDemo } from "./quaternion/QuaternionDemo";
 
+
+/**
+ * function to initialize the application with.
+ * It is called in demos with the appropriate parameter to start rendering.
+ */
 export const examples : {[key: string]: (render: RenderManager, ui: UI) => void}  = {
     "bezier": bezierDemo,
     "quaternion": quaternionDemo
 };
 
+
+/**
+ * function to start scene rendering.
+ */
 export function demos(d:  (render: RenderManager, ui: UI) => void) {
 
     console.log("demos");

src/quaternion/QuaternionDemo.ts

@@ -5,6 +5,10 @@ import { AmbientLight, GridHelper, Mesh, MeshLambertMaterial, PointLight } from
 import { OBJLoader } from "three/examples/jsm/loaders/OBJLoader";
 import { RotationObject } from "./RotationObject";
 
+
+/**
+ * Prepares the scene for the demo.
+ */
 export function quaternionDemo(render: RenderManager, ui: UI) {
 
     const rot = new RotationObject();

src/style.css

@@ -5,20 +5,10 @@
   font-family: 'Poppins', sans-serif;
 }
 
-.main.hidden {
-  display: none;
-}
-
-.scene.hidden {
-  display: none;
-}
-
-.return {
-  position: absolute;
-  top: 1em;
-  left: 1em;
-  background: #fff;
-  z-index: 1;
+canvas {
+  left: 0;
+  top: 0;
+  position: fixed;
 }
 
 header {
@@ -40,6 +30,22 @@ footer {
   align-items: center;
 }
 
+.main.hidden {
+  display: none;
+}
+
+.scene.hidden {
+  display: none;
+}
+
+.return {
+  position: absolute;
+  top: 1em;
+  left: 1em;
+  background: #fff;
+  z-index: 1;
+}
+
 .welcome {
   position: relative;
   top: 25vh;
@@ -64,13 +70,6 @@ nav {
   /* z-index: 1; */
 }
 
-.title-nav {
-  position: absolute;
-  color: white;
-  bottom: 0;
-  left: 12%;
-}
-
 nav ul {
   position: absolute;
   left: 12%;
@@ -83,6 +82,13 @@ nav ul {
 
 }
 
+.title-nav {
+  position: absolute;
+  color: white;
+  bottom: 0;
+  left: 12%;
+}
+
 .nav-link {
   position: relative;
   color: #CBCFD3;
@@ -105,43 +111,3 @@ nav ul {
   font-weight: bold;
 }
 
-.menu-close {
-  position: absolute;
-  top: 45vh;
-  left: 2%;
-  width: 2rem;
-  height: 1rem;
-  cursor: pointer;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-around;
-}
-
-.menu-close:hover {
-  opacity: 0.6;
-}
-
-.menu-close span {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  width: 70%;
-  height: 2px;
-  background-color: white;
-}
-
-.menu-close span:nth-child(1) {
-  transform: translate(-50%, -50%) rotate(45deg);
-}
-
-.menu-close span:nth-child(2) {
-  transform: translate(-50%, -50%) rotate(-45deg);
-}
-
-
-canvas {
-  left: 0;
-  top: 0;
-  position: fixed;
-}
\ No newline at end of file