fixed merge

7 files changed, 568 insertions, 28 deletions

diff --git a/.gitignore b/.gitignore
index 74caed0..7b7818a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -26,6 +26,7 @@
 *.nav
 *.snm
 *-SAVE-ERROR
+*.bkp
 
 # output files
 *.pdf
diff --git a/design.tex b/design.tex
index 08ea7cc..88d7cc8 100644
--- a/design.tex
+++ b/design.tex
@@ -24,9 +24,94 @@ workflows.
 
 \section{Overview}
 
-\subsection{Core}
+As described above, the cr\^epe game engine's goal is to offer a Unity-like
+experience tailored for developing 2D games similar to Jetpack Joyride. That is why
+Jetpack Joyride and Unity provided the main inputs for this game engine design.
+Firstly, a quick overview will be given of the Unity game engine, in particular the
+\gls{ecs}. Secondly, this Overview will quickly talk you through some of the most
+important parts of the game engine, and why these parts are needed to create the
+Jetpack Joyride game.
+
+\subsection{ECS}
+
+The Unity game engine is structured using the Entity Component System (\gls{ecs}) (as
+shown in \cref{fig:ecs-block-diagram}). The \gls{ecs} is made out of three main
+subsystems, namely entities, components and systems. Entities are just IDs. An entity
+is also called a GameObject in Unity and it is made out of one (or more) components.
+Components are the classes that hold the data. The components determine what kind of
+entity it is (e.g. an enemy, audio, and so on). Systems take care of the behavior of
+the entities. Systems mainly read and write the enity's components data. The
+\gls{ecs} clearly distinguishes the data (components) from the functionality
+(systems).
 
-\subsection{Patterns}
+\begin{figure}
+	\centering
+	\includegraphics[width=0.5\textwidth]{img/ECSBlockDiagram.png}
+	\caption{ECS design pattern}
+	Source: \autocite{img:ecs-block-diag}
+	\label{fig:ecs-block-diagram}
+\end{figure}
+
+The \gls{ecs} will also be used at the cr\^epe game engine. Everything (from the
+protagonist and bullets to the walls and enemies) in the cr\^epe game engine will be
+a GameObject (i.e.~entity). The game programmer must program his game by creating all
+kind of GameObjects and placing them in one (or multiple) scenes, just like Unity.
+
+\subsection{Jetpack Joyride}
+
+Firstly, some background information about Jetpack Joyride. Jetpack Joyride is a
+side-scrolling endless runner action video game created by Halfbrick Studios. The
+protagonist is called Barry Steakfries, who the player controls as he steals a
+bullet-powered jet pack from a top-secret laboratory
+\autocite{wikipedia:jetpack-joyride}. A screenshot from the game can be seen in
+\cref{fig:jetpack-joyride} (pleae be aware that the goal of this project is not to
+create an exact replica of Jetpack Joyride, it is only used as a source of
+inspiration).
+
+\begin{figure}
+	\centering
+	\includegraphics[width=0.5\textwidth]{img/JetpackJoyride.jpg}
+	\caption{Jetpack Joyride}
+	Source: \autocite{img:jetpack-joyride}
+	\label{fig:jetpack-joyride}
+\end{figure}
+
+The protagonist wears a jetpack with which he can float in the air. The player must
+avoid obstacles (such as lasers, missiles and zappers) by floating at the right
+height. The player can control the protagonist's jetpack, thereby also controlling
+the protagonist's height. The protagonist experiences gravity and other forces (like
+the force from his jetpack pushing him upwards). These forces should be easily
+programmable by the game programmer. That is why a physics system is needed in the
+cr\^epe game engine. Only very limited/easy physics are needed for Jetpack Joyride,
+that is why this is only supported by the cr\^epe game engine.
+
+The protagonist must avoid obstacles. That is why the cr\^epe game engine should also
+support a collision system. Again, only very limited/easy collision is needed for
+Jetpack Joyride, that is why only very limited/easy collision is supported by the
+cr\^epe game engine.
+
+The game must, of course, also be visible to and playable by the user. A rendering
+system will take care of rendering (displaying) the game and its GameObjects. An
+input system will take care of all the inputs (mouse and keyboard).
+
+Jetpack Joyride also offers audio. A system will take care of the audio in the
+cr\^epe game engine.
+
+Particles are very common in Jetpack Joyride, e.g. underneath the jetpack and behind
+the rockets. Particles will be supported by the particle system.
+
+The start of a scene is described in a scene. However, the game programmer might also
+want to write game logic code which is running during the game (e.g. to switch to a
+new scene or to perform a custom action at a collision). For these purposes, Unity
+uses scripts. These scripts will also be supported by the cr\^epe game engine.
+
+Finally, as an extra, replay functionality will be supported by the cr\^epe game
+engine. A dedicated replay system will be used to support replay.
+
+It turns out that a physics, collision, rendering, input, audio, particle, script,
+and replay system are needed to create the Jetpack Joyride game. These systems form
+the main part of the \gls{ecs}. The design of these eight systems in combination with
+\gls{ecs}, will be briefly discussed in the next parts of this design document.
 
 \section{Design}
 
diff --git a/figs.drawio b/figs.drawio
index b3f6eea..3dec3aa 100644
--- a/figs.drawio
+++ b/figs.drawio
@@ -1,4 +1,4 @@
-<mxfile host="Electron" agent="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/24.7.17 Chrome/128.0.6613.36 Electron/32.0.1 Safari/537.36" version="24.7.17" pages="9">
+<mxfile host="Electron" agent="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/24.7.17 Chrome/128.0.6613.36 Electron/32.0.1 Safari/537.36" version="24.7.17" pages="10">
   <diagram id="ehgrrEZq6aIl9GSG0JpL" name="Main">
     <mxGraphModel dx="1793" dy="883" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="3300" pageHeight="2339" math="0" shadow="0">
       <root>
@@ -69,10 +69,10 @@
         <mxCell id="5-8bWhzpOWirDYeo3-Cj-57" value="+position : Point" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
           <mxGeometry y="26" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-58" value="+rotation : Point" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-58" value="+rotation : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
           <mxGeometry y="43" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-59" value="+scale : int" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-59" value="+scale : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
           <mxGeometry y="60" width="160" height="17" as="geometry" />
         </mxCell>
         <mxCell id="5-8bWhzpOWirDYeo3-Cj-60" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=1;labelPosition=right;points=[];portConstraint=eastwest;fontSize=12;perimeterSpacing=0;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;verticalLabelPosition=middle;" parent="5-8bWhzpOWirDYeo3-Cj-56" vertex="1">
@@ -329,38 +329,32 @@
           <mxGeometry y="68" width="160" height="17" as="geometry" />
         </mxCell>
         <mxCell id="5-8bWhzpOWirDYeo3-Cj-122" value="Sprite" style="swimlane;fontStyle=1;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;movable=1;resizable=1;rotatable=1;deletable=1;editable=1;locked=0;connectable=1;direction=east;" parent="1" vertex="1">
-          <mxGeometry x="1710" y="500" width="160" height="170" as="geometry">
+          <mxGeometry x="1710" y="500" width="160" height="136" as="geometry">
             <mxRectangle x="330" y="540" width="160" height="26" as="alternateBounds" />
           </mxGeometry>
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-123" value="+sprite : Resource" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;fontColor=#ff0000;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-123" value="+ shared_ptr&lt;Texture&gt; sprite_image" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;fontColor=#000000;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
           <mxGeometry y="26" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-124" value="+color" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-124" value="+ color : Color" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
           <mxGeometry y="43" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-125" value="+flipX" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-125" value="flip : FlipSettings" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
           <mxGeometry y="60" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-126" value="+flipY" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-127" value="+sortingLayer : uint8_t" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
           <mxGeometry y="77" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-127" value="+sortingLayer" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-128" value="+orderInLayer : uint8_t" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
           <mxGeometry y="94" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-128" value="+orderInLayer" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
-          <mxGeometry y="111" width="160" height="17" as="geometry" />
-        </mxCell>
         <mxCell id="5-8bWhzpOWirDYeo3-Cj-129" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=1;labelPosition=right;points=[];portConstraint=eastwest;fontSize=12;perimeterSpacing=0;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;verticalLabelPosition=middle;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
-          <mxGeometry y="128" width="160" height="8" as="geometry" />
-        </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-130" value="+set_render() : void" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
-          <mxGeometry y="136" width="160" height="17" as="geometry" />
+          <mxGeometry y="111" width="160" height="8" as="geometry" />
         </mxCell>
         <mxCell id="ZHgyX9xX1EySbdOx-EKd-65" value="+get_instances_max() : int" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;fontColor=#0000FF;" parent="5-8bWhzpOWirDYeo3-Cj-122" vertex="1">
-          <mxGeometry y="153" width="160" height="17" as="geometry" />
+          <mxGeometry y="119" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="5-8bWhzpOWirDYeo3-Cj-131" value="Animator" style="swimlane;fontStyle=1;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;movable=1;resizable=1;rotatable=1;deletable=1;editable=1;locked=0;connectable=1;direction=east;" parent="1" vertex="1">
+        <mxCell id="5-8bWhzpOWirDYeo3-Cj-131" value="Animator" style="swimlane;fontStyle=1;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;movable=1;resizable=1;rotatable=1;deletable=1;editable=1;locked=0;connectable=1;direction=east;strokeColor=#FF0000;" parent="1" vertex="1">
           <mxGeometry x="1880" y="653" width="170" height="85" as="geometry">
             <mxRectangle x="330" y="540" width="160" height="26" as="alternateBounds" />
           </mxGeometry>
@@ -739,24 +733,30 @@
           </mxGeometry>
         </mxCell>
         <mxCell id="ZHgyX9xX1EySbdOx-EKd-1" value="Camera" style="swimlane;fontStyle=1;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;movable=1;resizable=1;rotatable=1;deletable=1;editable=1;locked=0;connectable=1;direction=east;" parent="1" vertex="1">
-          <mxGeometry x="600" y="577" width="160" height="102" as="geometry">
+          <mxGeometry x="600" y="577" width="160" height="143" as="geometry">
             <mxRectangle x="330" y="540" width="160" height="26" as="alternateBounds" />
           </mxGeometry>
         </mxCell>
-        <mxCell id="ZHgyX9xX1EySbdOx-EKd-2" value="+backgroundColor" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
+        <mxCell id="ZHgyX9xX1EySbdOx-EKd-2" value="+ bg_color : Color" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
           <mxGeometry y="26" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="ZHgyX9xX1EySbdOx-EKd-3" value="+ascpectWidth" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
+        <mxCell id="ZHgyX9xX1EySbdOx-EKd-3" value="+ aspect_width : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
           <mxGeometry y="43" width="160" height="17" as="geometry" />
         </mxCell>
-        <mxCell id="ZHgyX9xX1EySbdOx-EKd-4" value="+ascpectHeight" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
+        <mxCell id="xyZsm_uoETzsuu8GtZ24-1" value="+ aspect_height : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" vertex="1" parent="ZHgyX9xX1EySbdOx-EKd-1">
           <mxGeometry y="60" width="160" height="17" as="geometry" />
         </mxCell>
+        <mxCell id="xyZsm_uoETzsuu8GtZ24-2" value="+ x,y : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" vertex="1" parent="ZHgyX9xX1EySbdOx-EKd-1">
+          <mxGeometry y="77" width="160" height="17" as="geometry" />
+        </mxCell>
+        <mxCell id="xyZsm_uoETzsuu8GtZ24-3" value="+ zoom : double" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;" vertex="1" parent="ZHgyX9xX1EySbdOx-EKd-1">
+          <mxGeometry y="94" width="160" height="17" as="geometry" />
+        </mxCell>
         <mxCell id="ZHgyX9xX1EySbdOx-EKd-5" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=1;labelPosition=right;points=[];portConstraint=eastwest;fontSize=12;perimeterSpacing=0;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;verticalLabelPosition=middle;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
-          <mxGeometry y="77" width="160" height="8" as="geometry" />
+          <mxGeometry y="111" width="160" height="8" as="geometry" />
         </mxCell>
         <mxCell id="ZHgyX9xX1EySbdOx-EKd-66" value="+get_instances_max() : int" style="text;align=left;verticalAlign=bottom;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=1;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;strokeWidth=1;horizontal=1;movable=1;resizable=1;deletable=1;editable=1;locked=0;connectable=1;fontColor=#0000FF;" parent="ZHgyX9xX1EySbdOx-EKd-1" vertex="1">
-          <mxGeometry y="85" width="160" height="17" as="geometry" />
+          <mxGeometry y="119" width="160" height="17" as="geometry" />
         </mxCell>
         <mxCell id="ZHgyX9xX1EySbdOx-EKd-7" value="" style="endArrow=block;html=1;rounded=0;movable=1;resizable=1;rotatable=1;deletable=1;editable=1;locked=0;connectable=1;endFill=0;strokeWidth=1;endSize=14;edgeStyle=orthogonalEdgeStyle;fontColor=#FF0000;strokeColor=#fa0000;exitX=0.5;exitY=0;exitDx=0;exitDy=0;" parent="1" source="ZHgyX9xX1EySbdOx-EKd-1" target="5-8bWhzpOWirDYeo3-Cj-106" edge="1">
           <mxGeometry width="50" height="50" relative="1" as="geometry">
@@ -2476,4 +2476,409 @@
       </root>
     </mxGraphModel>
   </diagram>
+  <diagram id="HwAwsUWtoMPbd-VC63Ug" name="Rendering/AssetManager">
+    <mxGraphModel dx="3068" dy="1938" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
+      <root>
+        <mxCell id="0" />
+        <mxCell id="1" parent="0" />
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-1" value="" style="rounded=0;whiteSpace=wrap;html=1;dashed=1;fillColor=none;" vertex="1" parent="1">
+          <mxGeometry x="-1670" y="-610" width="2470" height="560" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-2" value="" style="rounded=0;whiteSpace=wrap;html=1;dashed=1;fillColor=none;" vertex="1" parent="1">
+          <mxGeometry x="-1673" y="-37" width="2470" height="1160" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-3" value="Texture" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-1250" y="234.32" width="240" height="164" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-4" value="+ Texture(path, reload)" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="26" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-5" value="+ Texture(unique_ptr&lt;Resource&gt;, reload)" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="52" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-6" value="~Texture" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="78" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-7" value="- &#x9;void load(std::unique_ptr&lt;api::Resource&gt; res);&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="104" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-8" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="130" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-9" value="- SDL_texture unique_ptr" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-3">
+          <mxGeometry y="138" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-10" value="&lt;&lt;singleton&gt;&gt;&#xa;AssetManager" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=38;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-1620" y="-440" width="380" height="247" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-11" value="- static AssetManager &amp; get_instance();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="38" width="380" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-12" value="- AssetManager();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="64" width="380" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-13" value="- virtual ~AssetManager()" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="90" width="380" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-14" value="template &lt;typename resource&gt;&#xa;std::shared_ptr&lt;resource&gt; cache(path, bool reload)" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="116" width="380" height="35" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-15" value="- virtual ~AssetManager()" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="151" width="380" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-16" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="177" width="380" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-17" value="template &lt;typename resource&gt;&#xa;- map&lt;path, shared_ptr&lt;resource&gt;&gt; cache" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="185" width="380" height="35" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-18" value="- friend class Texture" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry y="220" width="380" height="27" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-19" value="Sprite" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-534.06" y="220" width="240" height="190" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-20" value="+ &#x9;Sprite(crepe::Texture&amp; image, const Color&amp; color, const flip_settings&amp; flip ) :  sprite_image(&amp;image), color(color), flip(flip){}&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="26" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-21" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="52" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-22" value="shared_ptr&lt;Texture&gt; image" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="60" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-23" value="+ Color color" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="86" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-24" value="+ flip_settings flip" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="112" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-25" value="+ uint8_t sortingLayer" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="138" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-26" value="+ uint8_t orderInLayer" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry y="164" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-27" value="&lt;&lt;singleton&gt;&gt;&#xa;SdlContext" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=37;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-1160" y="-440" width="450" height="361" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-28" value="- SdlContext();" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="37" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-29" value="virtual ~SdlContext();" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="63" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-30" value="- static SdlContext &amp; get_instance();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="89" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-31" value="- void draw(const api::Sprite&amp;, const api::Transform&amp;);&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="115" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-32" value="- void presentScreen();" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="141" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-33" value="- void clearScreen();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="167" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-34" value="- void draw(const api::Sprite&amp;, const api::Transform&amp;);&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="193" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-35" value="- SDL_Texture* setTextureFromPath(const char*);" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="219" width="450" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-36" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="245" width="450" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-37" value="- friend class Texture" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="253" width="450" height="27" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-38" value="- friend class RenderSystem" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="280" width="450" height="27" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-39" value="- SDL_Window* window" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="307" width="450" height="27" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-40" value="- SDL_Renderer* renderer" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry y="334" width="450" height="27" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-41" value="RenderSystem" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=25;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-520" y="-324.5" width="240" height="130" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-42" value="- RenderSystem()" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-41">
+          <mxGeometry y="25" width="240" height="22" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-43" value="- ~ RenderSystem()" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-41">
+          <mxGeometry y="47" width="240" height="22" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-44" value="- void SortLayers()" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-41">
+          <mxGeometry y="69" width="240" height="22" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-45" value="+ void update() override" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-41">
+          <mxGeometry y="91" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-46" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-41">
+          <mxGeometry y="117" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-47" value="&lt;&lt;interface&gt;&gt;&#xa;&lt;&lt;singleton&gt;&gt;&#xa;System" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=50;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-520" y="-580" width="240" height="162" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-48" value="+ static System &amp; get_instance();" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry y="50" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-49" value="+ virtual void update() = 0;&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry y="76" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-50" value="# System() {};&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry y="102" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-51" value="# virtual ~System() {};&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry y="128" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-52" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry y="154" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-53" value="Color" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-610" y="480" width="400" height="580" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-54" value="+ Color(double red, double green, double blue, double alpha);&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="26" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-55" value=" + static const Color &amp; get_white();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="52" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-56" value=" + static const Color &amp; get_red();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="78" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-57" value=" + static const Color &amp; get_green();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="104" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-58" value=" + static const Color &amp; get_blue();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="130" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-59" value=" + static const Color &amp; get_cyan();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="156" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-60" value=" + static const Color &amp; get_magenta();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="182" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-61" value=" + static const Color &amp; get_yellow();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="208" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-62" value=" + static const Color &amp; get_black();&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="234" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-63" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="260" width="400" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-64" value="- double r" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="268" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-65" value="- double g" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="294" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-66" value="- double b" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="320" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-67" value="- double a" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="346" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-68" value="- static Color white" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="372" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-69" value="- static Color red" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="398" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-70" value="- static Color green" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="424" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-71" value="- static Color blue" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="450" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-72" value="- static Color cyan" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="476" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-73" value="- static Color magenta" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="502" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-74" value="- static Color yellow" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="528" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-75" value="- static Color black" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-53">
+          <mxGeometry y="554" width="400" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-76" value="Point" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="139.9999999999999" y="154" width="240" height="90.71" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-77" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-76">
+          <mxGeometry y="26" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-78" value="+ double x" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-76">
+          <mxGeometry y="34" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-79" value="+ double y" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-76">
+          <mxGeometry y="60" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-80" value="Component" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-534.06" width="240" height="90" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-81" value="+active: Boolean" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry y="26" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-82" value="+ gameId" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry y="52" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-83" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry y="78" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-84" value="Transform" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-220" y="140.64" width="240" height="112" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-85" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-84">
+          <mxGeometry y="26" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-86" value="+ Point position; // Translation (shift)&#xa;&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-84">
+          <mxGeometry y="34" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-87" value="+ double rotation; // Rotation, in radians&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-84">
+          <mxGeometry y="60" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-88" value="+ double scale; // Multiplication factoh&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-84">
+          <mxGeometry y="86" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-89" value="Resource" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-1600" y="234.32" width="240" height="164" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-90" value="+ Resource(const std::string &amp; src);" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="26" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-91" value="+ const std::istream &amp; read();" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="52" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-92" value="+ const char * canonical()&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;rounded=0;shadow=0;html=0;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="78" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-93" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="104" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-94" value="- &#x9;std::string src;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="112" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-95" value="- &#x9;std::ifstream file;&#xa;" style="text;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry y="138" width="240" height="26" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-96" value="TODO:Animator" style="swimlane;fontStyle=2;align=center;verticalAlign=top;childLayout=stackLayout;horizontal=1;startSize=26;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;marginBottom=0;rounded=0;shadow=0;strokeWidth=1;" vertex="1" parent="1">
+          <mxGeometry x="-940" y="234.32" width="240" height="49.36" as="geometry">
+            <mxRectangle x="230" y="140" width="160" height="26" as="alternateBounds" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-97" value="" style="line;html=1;strokeWidth=1;align=left;verticalAlign=middle;spacingTop=-1;spacingLeft=3;spacingRight=3;rotatable=0;labelPosition=right;points=[];portConstraint=eastwest;" vertex="1" parent="HgKoQxlyUx1tn9zsXLrm-96">
+          <mxGeometry y="26" width="240" height="8" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-98" value="" style="endArrow=block;endSize=16;endFill=0;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-96" target="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-740" y="440" as="sourcePoint" />
+            <mxPoint x="-570" y="439.99999999999994" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-99" value="" style="endArrow=block;endSize=16;endFill=0;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-84" target="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-720" y="450" as="sourcePoint" />
+            <mxPoint x="-560" y="450" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-100" value="" style="endArrow=block;endSize=16;endFill=0;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-19" target="HgKoQxlyUx1tn9zsXLrm-80">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-710" y="460" as="sourcePoint" />
+            <mxPoint x="-550" y="460" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-101" value="" style="endArrow=diamondThin;endFill=1;endSize=24;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-53" target="HgKoQxlyUx1tn9zsXLrm-19">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-827" y="550" as="sourcePoint" />
+            <mxPoint x="-667" y="550" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-102" value="" style="endArrow=diamondThin;endFill=1;endSize=24;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-76" target="HgKoQxlyUx1tn9zsXLrm-84">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="110.62230769230791" y="360" as="sourcePoint" />
+            <mxPoint x="109.99769230769243" y="290" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-103" value="" style="endArrow=open;endFill=1;endSize=12;html=1;entryX=0;entryY=0.5;entryDx=0;entryDy=0;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-96" target="HgKoQxlyUx1tn9zsXLrm-20">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-770" y="340" as="sourcePoint" />
+            <mxPoint x="-540" y="290" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-104" value="1" style="text;html=1;align=center;verticalAlign=middle;resizable=0;points=[];labelBackgroundColor=#ffffff;" vertex="1" connectable="0" parent="HgKoQxlyUx1tn9zsXLrm-103">
+          <mxGeometry x="0.3336" y="-3" relative="1" as="geometry">
+            <mxPoint x="29.44" y="-12" as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-105" value="0..1" style="text;html=1;align=center;verticalAlign=middle;resizable=0;points=[];labelBackgroundColor=#ffffff;" vertex="1" connectable="0" parent="HgKoQxlyUx1tn9zsXLrm-103">
+          <mxGeometry x="-0.8674" y="1" relative="1" as="geometry">
+            <mxPoint y="-8" as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-106" value="" style="endArrow=block;dashed=1;endFill=0;endSize=12;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-3" target="HgKoQxlyUx1tn9zsXLrm-89">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-1600" y="1080" as="sourcePoint" />
+            <mxPoint x="-1440" y="1080" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-107" value="" style="endArrow=block;dashed=1;endFill=0;endSize=12;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-3" target="HgKoQxlyUx1tn9zsXLrm-10">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-1240" y="326.32000000000016" as="sourcePoint" />
+            <mxPoint x="-1350" y="326.32000000000016" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-108" value="" style="endArrow=block;dashed=1;endFill=0;endSize=12;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-3" target="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-1162.1648026738653" y="244.32000000000016" as="sourcePoint" />
+            <mxPoint x="-1371.0965419719755" y="-162" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-109" value="Extends" style="endArrow=block;endSize=16;endFill=0;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-41" target="HgKoQxlyUx1tn9zsXLrm-47">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-660" y="-320" as="sourcePoint" />
+            <mxPoint x="-500" y="-320" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-110" value="" style="endArrow=block;dashed=1;endFill=0;endSize=12;html=1;" edge="1" parent="1" source="HgKoQxlyUx1tn9zsXLrm-41" target="HgKoQxlyUx1tn9zsXLrm-27">
+          <mxGeometry width="160" relative="1" as="geometry">
+            <mxPoint x="-1092.867033190796" y="244.32000000000016" as="sourcePoint" />
+            <mxPoint x="-980.2586031358178" y="-96" as="targetPoint" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-111" value="&lt;b&gt;&lt;font style=&quot;font-size: 50px&quot;&gt;API&lt;/font&gt;&lt;/b&gt;" style="text;html=1;align=center;verticalAlign=middle;resizable=0;points=[];autosize=1;" vertex="1" parent="1">
+          <mxGeometry x="684" y="11" width="93" height="31" as="geometry" />
+        </mxCell>
+        <mxCell id="HgKoQxlyUx1tn9zsXLrm-112" value="&lt;b&gt;&lt;font style=&quot;font-size: 50px&quot;&gt;Engine&lt;/font&gt;&lt;/b&gt;" style="text;html=1;align=center;verticalAlign=middle;resizable=0;points=[];autosize=1;" vertex="1" parent="1">
+          <mxGeometry x="612" y="-132" width="177" height="31" as="geometry" />
+        </mxCell>
+      </root>
+    </mxGraphModel>
+  </diagram>
 </mxfile>
diff --git a/img/JetpackJoyride.jpg b/img/JetpackJoyride.jpg
new file mode 100644
index 0000000..d1c0e9e
--- /dev/null
+++ b/img/JetpackJoyride.jpg
diff --git a/readme.md b/readme.md
index ece6512..858d319 100644
--- a/readme.md
+++ b/readme.md
@@ -11,7 +11,7 @@ snippets for specific formatting.
 
 Prerequisites:
 - A LaTeX distribution that includes XeLaTeX and latexmk
-- PlantUML
+- PlantUML ([1.2024.7 or later](#plantuml)!)
 - Python 3
 - Fonts (see see [style.md](./style.md) for download links)
 
@@ -33,7 +33,30 @@ additional configuration files for the following editors:
 - `sources.bib` contains all bibliography entries / references
 - `glossary.bib` contains all glossary entries
 
+## PlantUML
+
+To check if your PlantUML version is recent enough, run:
+```
+$ plantuml -version
+```
+
+To upgrade PlantUML manually, download the latest (GPL) \.jar from
+[here][plantuml], and overwrite the \.jar file installed by your package
+manager:
+
+```
+$ curl -sLo- https://github.com/plantuml/plantuml/releases/download/v1.2024.7/plantuml-1.2024.7.jar > plantuml.jar
+# mv plantuml.jar /usr/share/plantuml/plantuml.jar
+```
+
+> [!NOTE]
+> Ubuntu, Debian and Mint all place PlantUML's \.jar file under
+> `/usr/share/plantuml/plantuml.jar`, while it's under
+> `/usr/share/java/plantuml/plantuml.jar` on Arch. Check the contents of the
+> file returned by `command -v plantuml` to confirm this.
+
 [vscode]: https://code.visualstudio.com
 [latexworkshop]: https://marketplace.visualstudio.com/items?itemName=James-Yu.latex-workshop
 [vimtex]: https://github.com/lervag/vimtex
+[plantuml]: https://plantuml.com/en/download
 
diff --git a/sources.bib b/sources.bib
index 7d7b6f7..0ff00a1 100644
--- a/sources.bib
+++ b/sources.bib
@@ -164,7 +164,7 @@
 	date = {2016}
 }
 
-@misc{img:ECSBlockDiagram,
+@misc{img:ecs-block-diag,
 	title = {ECS Diagram},
 	author = {{Unity}},
 	url = {https://docs.unity3d.com/Packages/com.unity.entities@0.1/manual/images/ECSBlockDiagram.png},
@@ -194,3 +194,19 @@
   date = {2024}
 }
 
+@online{wikipedia:jetpack-joyride,
+	author = {{Wikipedia contributors}},
+	title = {Jetpack Joyride --- {Wikipedia}{,} The Free Encyclopedia},
+	year = {2024},
+	url = {https://en.wikipedia.org/w/index.php?title=Jetpack_Joyride&oldid=1252734266},
+	urldate = {2024-10-22},
+}
+
+@misc{img:jetpack-joyride,
+	title = {Jetpack Joyride},
+	author = {Halbrick},
+	url = {https://www.halfbrick.com/games/jetpack-joyride-2},
+	date = {2024},
+	urldate = {2024-10-22},
+}
+
diff --git a/time.txt b/time.txt
index 5237362..d426660 100644
--- a/time.txt
+++ b/time.txt
@@ -90,6 +90,8 @@ loek: 2024-10-27 4h implementation :: save manager
 loek: 2024-10-29 10m tooling :: documentation (fix plantuml theme errors)
 loek: 2024-10-30 30m project meeting (min/max component count constraints)
 loek: 2024-10-24 10m review :: PR review (#40, #41 and #42)
+loek: 2024-10-31 3h45m project meeting
+loek: 2024-10-31 2h50m docs :: design :: POCs
 
 max: 2024-09-02 1h project kickoff
 max: 2024-09-02 45m first project meeting
@@ -147,6 +149,14 @@ max: 2024-10-24 2h10m fourteenth project meeting
 max: 2024-10-25 3h started researching Scenes and Replay
 max: 2024-10-29 2h worked on UIObjects and Camera
 max: 2024-10-29 3h15m worked on Metadata Component, Camera and Scenes
+max: 2024-10-29 30m installing LaTeX on Linux
+max: 2024-10-29 30m discussing paricles/physics/colliders with Jaro
+max: 2024-10-30 4h refacting class diagram
+max: 2024-10-30 1h50m added SceneManager design to class diagram
+max: 2024-10-30 2h added ReplaySystem design to class diagram
+max: 2024-10-31 30m discussing with Jaro
+max: 2024-10-31 3h45m fiftheent project meeting
+max: 2024-10-31 3h30m creating chapter two of design
 
 wouter: 2024-09-02 1h project meeting :: project kickoff
 wouter: 2024-09-02 45m project meeting