Merge branch 'master' of https://koljastrohm-games.com:3000/GraphDrawer/NodeShuffler

README.md

@@ -2,4 +2,4 @@
 
 See the documentation at
 
-https://koljastrohm-games.com:3000/GraphDrawer/NodeShuffler/releases
+https://gogs.koljastrohm-games.com/GraphDrawer/NodeShuffler/releases

doc/chapter/1introduction.tex

@@ -7,14 +7,10 @@ Then each stage of the node placing algorithm by Brandes and Köpf~\cite{brandes
 After each step the current progress of the algorithm is displayed visually.
 
 In chapter~\ref{ch:architecture} we provide an overview over the \appname 's internal architecture while chapter~\ref{ch:ui} presents and explains the graphical user interface.
-To provide an overview of what is going on, chapter~\ref{ch:progress} lists features and their degree of completion.
 A glossary of some of the more difficult terms we can be found in the appendix (table~\ref{table:glossary}).
 
 \appname\ is currently a work in progress so keep in mind that any of the here presented screenshot, diagram or other information may be slightly outdated\footnote{even this one}.
 Also note that some PDF viewers have problems with vector graphics exported from Visual Paradigm, so if you feel like there is a missing line in a class or component diagram, you are wrong.
-You may want to use Internet Explorer 11, where this bug does not exist.
+We recommend Internet Explorer 11, where this bug does not exist.
 
-Yet another note: Some of our tables span multiple pages so make sure to always check the next and previous pages.
-This was necessary because our tables tend to get quite large.
-
-The current development state can also been retrieved from \url{http://gogs.koljastrohm-games.com/GraphDrawer/NodeShuffler}.
+\appname\ is open source and the current development state can also been retrieved from \url{http://gogs.koljastrohm-games.com/GraphDrawer/NodeShuffler}.

doc/chapter/2architecture.tex

@@ -1,20 +1,27 @@
 \section{Assumptions}\label{sec:assumptions}
-The following assumptions are made for the implementation of the node placement algorithm:
+Our implementation makes the folliowing assumptions:
 \begin{enumerate}
     \item \label{itm:hyperedges} There are no hyperedges.
     \item \label{itm:constraints} There are no port constraints.
     \item \label{itm:labels} There are no labels.
     \item \label{itm:cross-hierarchy-edges} There are no cross-hierarchy edges
-    \item \label{itm:multi-layer-edge} No edges over multiple layers (the previous phases should have added dummy nodes).
-    \item \label{itm:connected} Graphs are connected (see below).
+    \item \label{itm:multi-layer-edge} No edges over multiple layers (the previous phases should add dummy nodes).
+    \item \label{itm:connected} Graphs are connected.
 \end{enumerate}
 
 Assumptions~\ref{itm:hyperedges},~\ref{itm:constraints} and~\ref{itm:labels} were made just to make it easier for us by reducing the complexity of the task.
 Assumption~\ref{itm:cross-hierarchy-edges} was made because these are not possible with the Sugiyama approach.
 
 Regarding assumption~\ref{itm:connected}, we found an example where for a disconnected graph the algorithm behaved incorrectly.
-Maybe we will get rid of this assumption later, see chapter~\ref{ch:progress}.
-This example is included in the appendix (figures~\ref{fig:error_disconnected_img} and~\ref{fig:error_disconnected}).
+This example is included in the appendix (figure~\ref{fig:error_disconnected}).
+
+
+\section{Known Issues}\label{sec:knownIssues}
+Only the most important unsolved issues are listed here.
+For a complete list, see \url{http://gogs.koljastrohm-games.com/GraphDrawer/NodeShuffler/issues}.
+\begin{itemize}
+    \item[\done] The most important issues were solved.
+\end{itemize}
 
 
 \section{Overview}\label{sec:components}
@@ -27,12 +34,14 @@ Meanwhile the view displays the same \code{LayeredGraphNode}s and \code{LayeredG
 
 Figure~\ref{fig:components} contains a component diagram that illustrates these dependencies of the different packages.
 
-Advantages of this architecture include:
+Advantages of our architecture include:
 \begin{itemize}
-    \item Modularity, since the class \code{BKNodePlacement} can easily be replaced by other node placement algorithms.
-    Minor changes to the internal data structure might be necessary.
-    \item It is easily possible to open multiple windows for different graphs.
+    \item It is possible to open multiple windows for different graphs.
     This happens already, for example, when loading a graph from a file or when generating a new random graph.
+    \item Modularity, since the class \code{BKNodePlacement} can be replaced by other node placement algorithms.
+    Minor changes to the internal data structure might be necessary.
+    \item Abstraction: When implementing an algorithm there is no need to worry about making \enquote{step over} or \enquote{step out} commands.
+    Also it is not necessary to define how to undo a step (except for some rare cases), although we do not keep a list of states: This would cost too much Memory (10~743 steps for the graph in figure~\ref{fig:originalpapergraph}).
 \end{itemize}
 
 \begin{figure}[htp]
@@ -43,46 +52,48 @@ Advantages of this architecture include:
 \end{figure}
 
 
-\section{System Requirements}\label{sec:systemRequirements}
-{
-\centering
-\small
-\begin{longtable}{l l p{6cm}}
-    \rowcolor{gray!50}
-    \textbf{Requirement} & \textbf{Minimum} & \textbf{Recommended} \\
-    Free disk space & 150MB & 150MB \\
-    \rowcolor{gray!25}
-    Free RAM & 300MB (single window) & More for multiple windows/graphs \\
-    \rowcolor{gray!25}
-    & & At least 2 GB for running the automatic tests. \\
-    Display & 1024 × 768 resolution & 1920 x 1080 resolution \\
-    \rowcolor{gray!25}
-    CPU & capable of running java applications & faster is better \\
-    GPU & not any & not any\\
-    \rowcolor{gray!25}
-    Internet connection & not any & not any\\
-    \\
-    \caption{System Requirements}
-    \label{table:systemRequirements}
-\end{longtable}
-}
-
-\section{Software Dependencies}\label{sec:softwareDependencies}
-{
-\centering
-\small
-\begin{longtable}{l p{1cm} p{6cm}}
-    \rowcolor{gray!50}
-    \textbf{Dependency} && \textbf{Version} \\
-    Java && $\geq8$ \\
-    \rowcolor{gray!25}
-    JSON-java~\ref{leary_json-java:_2018} && \\
-    Eclipse Layout Kernel~\ref{noauthor_elk:_2018} && \\
-    \\
+\section{System Requirements and Software Dependencies}\label{sec:systemRequirements}
+The software \appname\ relies on is listed in table~\ref{table:softwareDependencies}.
+The requirements to any system running \appname\ are demanded in table~\ref{table:systemRequirements}.
+
+\begin{table}[htp]
+    \centering
+    \small
+    \begin{tabular}{l p{1cm} p{6cm}}
+        \rowcolor{gray!50}
+        \textbf{Dependency} && \textbf{Version} \\
+        Java && $\geq8$ \\
+        \rowcolor{gray!25}
+        JSON-java~\cite{leary_json-java:_2018} && \\
+        Eclipse Layout Kernel~\cite{noauthor_elk:_2018} && \\
+        \\
+    \end{tabular}
     \caption[Software Dependencies]{Software Dependencies. If no version is given, all should work and the latest is recommended.}
     \label{table:softwareDependencies}
-\end{longtable}
-}
+\end{table}
+
+\begin{table}[htp]
+    \centering
+    \small
+    \begin{tabular}{l l p{6cm}}
+        \rowcolor{gray!50}
+        \textbf{Requirement} & \textbf{Minimum} & \textbf{Recommended} \\
+        Free disk space & 150MB & 150MB \\
+        \rowcolor{gray!25}
+        Free RAM & 300MB (single window) & More for multiple windows/graphs \\
+        \rowcolor{gray!25}
+        & & At least 2 GB for running the automatic tests. \\
+        Display & $1024 \times 768$ resolution & $1920 \times 1080$ resolution \\
+        \rowcolor{gray!25}
+        CPU & capable of running java applications & faster is better \\
+        GPU & capable of 2D rendering & rendering in $1920 \times 1080$ resolution\\
+        \rowcolor{gray!25}
+        Internet connection & not any & not any\\
+        \\
+    \end{tabular}
+    \caption{System Requirements}
+    \label{table:systemRequirements}
+\end{table}
 
 \section{Input File Format}\label{sec:inputFileFormat}
 The input to \appname\ is a JSON file.
@@ -99,26 +110,47 @@ For parsing the JSON file the JSON-java library~\cite{leary_json-java:_2018} is
 The classes for reading and writing those JSON files are displayed in figure~\ref{fig:io}.
 The internal representation of graphs is further explained in the section~\ref{sec:graph}.
 
-\centering
-\begin{longtable}{|l|l|l|p{8.5cm}|}
-    \hline
-    Attribute & Type & Optional & Explanation \\\hline\hline
-    name & string & yes & If not omitted, this must be unique for a given parent node. \\\hline
-    width & integer & yes & The minimum width of the node.
-    The node can be wider if it contains other nodes that need more space.
-    If the whole layout is too large, it is resized, such that all nodes are proportionately shrunk: In that case the minimum width can be exceeded after the shrinking.
-    Default 40.\\\hline
-    height & integer & yes & The minimum height of the node.
-    The node can be higher if it contains other nodes that need more space.
-    If the whole layout is too large, it is resized, such that all nodes are proportionately shrunk: In that case the minimum height can be exceeded after the shrinking.
-    Default 40.\\\hline
-    dummy & boolean & yes & Iff this is explicitly set to true, then the node is a dummy node. This attribute is necessary, because we expect previous stages to have eliminated multilayer edges, see section~\ref{sec:assumptions}. \\\hline
-    layers & < < node > > & yes & The layers of nodes inside this node (Hierarchy). \\\hline
-    edges & < edge > & yes & The edges between nodes whose parent node is this node. \\\hline
+\begin{table}[htp]
+    \centering
+    \small
+    \begin{tabular}{l l l p{8.5cm}}
+        \rowcolor{gray!50}
+        \textbf{Attribute} & \textbf{Type} & \textbf{Optional} & \textbf{Explanation} \\
+        source & string & no & The name of the source of this edge.
+        Must be a node with the same parent node as the node specified by the \code{target} attribute. \\
+        \rowcolor{gray!25}
+        target & string & no & The name of the target of this edge.
+        Must be a node with the same parent node as the node specified by the \code{source} attribute. \\
+    \end{tabular}
+    \caption{Edge Attributes}
+    \label{table:edge-attributes}
+\end{table}
+
+\begin{table}[htp]
+    \centering
+    \small
+    \begin{tabular}{l l l p{8.5cm}}
+        \rowcolor{gray!50}
+        \textbf{Attribute} & \textbf{Type} & \textbf{Optional} & \textbf{Explanation} \\
+        name & string & yes & If not omitted, this must be unique for a given parent node. \\
+        \rowcolor{gray!25}
+        width & integer & yes & The minimum width of the node.
+        The node can be wider if it contains other nodes that need more space.
+        If the whole layout is too large, it is resized, such that all nodes are proportionately shrunk: In that case the minimum width can be exceeded after the shrinking.
+        Default 40.\\
+        height & integer & yes & The minimum height of the node.
+        The node can be higher if it contains other nodes that need more space.
+        If the whole layout is too large, it is resized, such that all nodes are proportionately shrunk: In that case the minimum height can be exceeded after the shrinking.
+        Default 40.\\
+        \rowcolor{gray!25}
+        dummy & boolean & yes & Iff this is explicitly set to true, then the node is a dummy node. This attribute is necessary, because we expect previous stages to have eliminated multilayer edges, see section~\ref{sec:assumptions}. \\
+        layers & < < node > > & yes & The layers of nodes inside this node (Hierarchy). \\
+        \rowcolor{gray!25}
+        edges & < edge > & yes & The edges between nodes whose parent node is this node. \\\\
+    \end{tabular}
     \caption[Node Attributes]{Node Attributes. < \emph{element type} > is a list.}
     \label{table:node-attributes}
-\end{longtable}
-\raggedright
+\end{table}
 
 \begin{figure}[htp]
     \centering
@@ -127,20 +159,6 @@ The internal representation of graphs is further explained in the section~\ref{s
     \label{fig:io}
 \end{figure}
 
-\begin{table}[htp]
-    \centering
-    \begin{longtable}{|l|l|l|p{8.5cm}|}
-        \hline
-        Attribute & Type & Optional & Explanation \\\hline\hline
-        source & string & no & The name of the source of this edge.
-        Must be a node with the same parent node as the node specified by the \code{target} attribute. \\\hline
-        target & string & no & The name of the target of this edge.
-        Must be a node with the same parent node as the node specified by the \code{source} attribute. \\\hline
-    \end{longtable}
-    \caption{Edge Attributes}
-    \label{table:edge-attributes}
-\end{table}
-
 %\begin{figure}[htp]
 %    \centering
 %    \includegraphics[width=0.9\textwidth]{img/json.png}
@@ -151,22 +169,22 @@ The internal representation of graphs is further explained in the section~\ref{s
 \begin{figure}[htp]
     \begin{lstinputlisting}[language=json,emph={}]{src/graph.json}
     \end{lstinputlisting}
-    \caption[Example input file]{Example input file that is understood by \appname.}
+    \caption[Example input file]{Example input file that is understood by \appname.
+    The graph is also displayed in figure~\ref{fig:full-application-example}.}
     \label{fig:json-example}
 \end{figure}
 
 
 \section{Internal graph representation, \code{graph}}\label{sec:graph}
-One feature that is important to us, is to be able to work with hierarchical graphs (cf.\ chapter~\ref{ch:progress}).
+One feature that is important to us, is to be able to work with hierarchical graphs.
 Therefore a node can contain other nodes and edges.
-So far this is similar to what we described in section~\ref{sec:inputFileFormat}.
-Additionally, there are multiple attributes that are used during the computation or as output variables.
+In addition to the variables described in section~\ref{sec:inputFileFormat}, there are multiple attributes that are used during the computation or as output variables.
 \begin{itemize}
     \item The \member{parent} of a node is the node that contains it in the hierarchy.
     \item \member{dummy} specifies whether this node is a dummy node.
     \item \member{name} is the name of the node.
     \item The attributes \member{shift}, \member{sink},  \member{root} and  \member{align} correspond to the variables used by Brandes and Köpf~\cite{brandes_fast_2001}.
-    They are summarized in table~\ref{table:bk-variables}.
+    %They are summarized in table~\ref{table:bk-variables}.
     \item The attribute \member{xUndef} determines whether the x coordinate of the node has already been assigned a value.
     \item The attributes \member{x} and \member{y} are the coordinates of the node relative to its \member{parent}.
     \item The attributes \member{w} and \member{h} are the width and height of the node.
@@ -175,6 +193,7 @@ Additionally, there are multiple attributes that are used during the computation
 \end{itemize}
 The last six bullet points are available separately for each of the four extremal layouts.
 The last four bullet points are also separately available for the combined layout.
+To achieve this, they are stored in the internal classes \code{LayoutInfo} and \code{CombinedLayoutInfo}.
 
 Similarly, edges have the following attributes in addition to those given through the JSON format:
 \begin{itemize}
@@ -193,28 +212,29 @@ There you will find some less important (from a documentation point of view) att
 
 \begin{figure}[htp]
     \centering
-    \includegraphics[width=\linewidth,trim=0 7cm 0 0,clip]{img/graph.pdf}
-    \caption{Class diagram of the \code{graph} package.}
+    \includegraphics[width=0.95\linewidth,trim=0 2cm 0 0,clip]{img/graph.pdf}
+    \caption[Class diagram of the \code{graph} package]{Class diagram of the \code{graph} package. Getters, setters and constructors are omitted.
+    The package \code{graph.io} is displayed in figure~\ref{fig:io}}
     \label{fig:graph}
 \end{figure}
 
-\begin{table}[htp]
-    \begin{longtable}{|l|p{10cm}|}
-        \hline
-        Attribute & Explanation \\\hline\hline
-        \member{root} & The root node of the block of this node.
-        Unique for all nodes in the same block. \\\hline
-        \member{sink} & The topmost sink in the block graph that can be reached from the block that this node belongs to.
-        Only used for nodes that are the root of a block.
-        Unique for all nodes in the same class. \\\hline
-        \member{shift} & The shift of the class that this node belongs to.
-        Only used for nodes that are a sink of a class. \\\hline
-        \member{align} & The next node in the same block as this node.
-        The \member{align} of the last node in the block is the root node of the block again.\\\hline
-    \end{longtable}
-    \caption{Variables also used by Brandes and Köpf~\cite{brandes_fast_2001}}
-    \label{table:bk-variables}
-\end{table}
+%\begin{table}[htp]
+%    \begin{longtable}{|l|p{10cm}|}
+%        \hline
+%        Attribute & Explanation \\\hline\hline
+%        \member{root} & The root node of the block of this node.
+%        Unique for all nodes in the same block. \\\hline
+%        \member{sink} & The topmost sink in the block graph that can be reached from the block that this node belongs to.
+%        Only used for nodes that are the root of a block.
+%        Unique for all nodes in the same class. \\\hline
+%        \member{shift} & The shift of the class that this node belongs to.
+%        Only used for nodes that are a sink of a class. \\\hline
+%        \member{align} & The next node in the same block as this node.
+%        The \member{align} of the last node in the block is the root node of the block again.\\\hline
+%    \end{longtable}
+%    \caption{Variables also used by Brandes and Köpf~\cite{brandes_fast_2001}}
+%    \label{table:bk-variables}
+%\end{table}
 
 
 \section{The actual algorithm}\label{sec:theActualAlgorithm}
@@ -229,7 +249,7 @@ The \code{PseudoCodeNode}s are arranged hierarchically to form a whole pseudocod
 All the stages are displayed in class diagram~\ref{fig:bk} while the different kinds of \code{CodeLine}s are listed in class diagram~\ref{fig:codeline}.
 This separation was made to distinguish viewable \code{PseudoCodeNode}s from executable \code{CodeLine}s.
 
-For the execution of the \code{CodeLine}s a \code{PseudoCodeProcessor} interacts with its own \code{ProcessController} and \code{Memory}.
+For the execution of the \code{CodeLine}s a \code{PseudoCodeProcessor} interacts with its own \newline\code{ProcessController} and \code{Memory}.
 Note that the \code{ProcessController} is not a controller in the MVC sense that it processes user input, but in the sense that it \emph{controls} the execution of steps/stages.
 This works the following:
 \begin{enumerate}
@@ -243,6 +263,33 @@ This works the following:
 A class diagrams for the \code{processor} package is displayed in figure~\ref{fig:processor}.
 
 
+\section{View}\label{sec:view}
+This section only covers the software architecture regarding the views.
+For an explanation of what is actually displayed, see chapter~\ref{ch:ui}
+
+\begin{itemize}
+    \item The main window displays a \code{JLayeredPane} on the left where the graph is shown and a \code{menu} of the class \code{JPanel} on the right, where \code{NiceButton}s and \code{PseudoCodeNode}s are located.
+    The main window itself is a \code{JFrame} from the Swing library.
+    \item Additionally a legend, class \code{LegendView}, that is another \code{JPanel} is displayed on the bottom.
+    \item The \code{PseudoCodeNode}s are rendered by the \code{PseudoCodeRenderer} class.
+    For example, this class highlights selected code lines.
+    \item \code{EdgeView} and \code{NodeView} are \code{JPanel}s, which means they can be drawn onto the \code{JLayeredPane}.
+    For this they have to know about which part of the graph and which layout they belong to (some attributes).
+    \item A \code{NiceButton} is a \code{JButton} that has an image on it.
+    \item Next to the \code{PseudoCodeRenderer} is an object of the class \code{PseudoCodeLines}, that extends \code{JComponent}.
+    \item A \code{RenderHelper} that contains some additional utility functions for the views.
+    \item Dialogs like the \code{OptionsDialog} and the \code{RandomGraphDialog} are \code{JDialog}s.
+\end{itemize}
+A class diagram of the package \code{view} is displayed in figure~\ref{fig:view}.
+
+\begin{figure}[htp]
+    \centering
+    \includegraphics[width=\linewidth,trim=0 11cm 0 0,clip]{img/main_and_view.pdf}
+    \caption[Class diagram of the packages \code{view} and \code{main}]{Class diagram of the packages \code{view} and \code{main}.
+    Getters, setters and contructors are not omitted because most of them perform nontrivial computations.}
+    \label{fig:view}
+\end{figure}
+
 \begin{figure}[htp]
     \centering
     \includegraphics[width=\linewidth,trim=0 11cm 0 0,clip]{img/bk.pdf}
@@ -260,33 +307,7 @@ A class diagrams for the \code{processor} package is displayed in figure~\ref{fi
 \begin{figure}[htp]
     \centering
     \includegraphics[width=\linewidth,trim=0 5cm 0 0,clip]{img/processor.pdf}
-    \caption{Class diagram of the \code{processor} package.}
+    \caption[Class diagram of the \code{processor} package.]{Class diagram of the \code{processor} package.
+    Constructors and trivial getters and setters are omitted.}
     \label{fig:processor}
-\end{figure}
-
-
-\section{View}\label{sec:view}
-This section only covers the software architecture regarding the views.
-For an explanation of what is actually displayed, see chapter~\ref{ch:ui}
-\TODO{outdated}
-
-\begin{itemize}
-    \item The main window displays a \code{lane} of the class \code{JLayeredPane} and a \code{menue} of the class \code{JPanel}.
-    The main window itself is a \code{JFrame} from the Swing library.
-    \item The \code{lane} display the current status of the graph.
-    \item The \code{menue} display \code{NiceButton}s and pseudocode.
-    \item \code{EdgeView} and \code{NodeView} are \code{JPanel}s, which means they can be drawn onto the \code{JFrame}.
-    For this they have to know about which part of the graph and which layout they belong to (some attributes).
-    \item A \code{NiceButton} is a \code{JButton} that has an image on it.
-    \item For rendering the pseudocode we use a \code{PseudoCodeRenderer} that is a \code{DefaultTreeCellRenderer}.
-    For example, it sets line numbers and highlights selected code lines.
-    \item A \code{RenderHelper} that contains some additional utility functions for the views.
-\end{itemize}
-A class diagram of the packages \code{view} and \code{main} is displayed in figure~\ref{fig:view}.
-
-\begin{figure}[htp]
-    \centering
-    \includegraphics[width=0.9\linewidth,trim=0 8cm 0 0,clip]{img/main_and_view.pdf}
-    \caption{Class diagram of the packages \code{view} and \code{main}.}
-    \label{fig:view}
 \end{figure}

doc/chapter/3ui.tex

@@ -1,28 +1,31 @@
-Note that since the application is still under construction, so not all screenshots may be up to date.
+Note that the application is still under construction, so not all screenshots may be up to date.
 
 \section{Graphical presentation of the running algorithm}\label{sec:graphicalPresentationOfTheRunningAlgorithm}
-A first sketch of how we want \appname\ to look is shown in figure~\ref{fig:sketch}.
 The current development status is displayed in figure~\ref{fig:full-application-example}.
 Another example graph and an explanation of the shapes and colors is provided in figure~\ref{fig:example}.
 Figure~\ref{fig:originalpapergraph} compares our results to those of Brandes and Köpf~\cite{brandes_fast_2001}.
 
-\begin{figure}[htp]
-    \centering
-    \includegraphics[width=\linewidth]{img/skizze}
-    \caption[First sketch of the planned layout]{A first sketch of the planned layout, created with Microsoft Paint.
-    The buttons are (first row, from left to right): step over, step into, step out, run, pause, debug; and (second row, from left to right): step back over, step back into, step back out, run backwards, load graph, save graph, generate random graph.
-    Currently a button to open the preferences dialog is located in the second row at the empty position.
-    The actions corresponding to the buttons are the same as described for the keyboard input in table~\ref{table:keys}, at least for the features that are already implemented (all of them).
-    The left four rectangles show the progress of the four extremal layouts.
-    The right rectangle shows pseudocode of the algorithm and the position of the current step.}
-    \label{fig:sketch}
-\end{figure}
+Some features that are not visible from the screenshots:
+\begin{itemize}
+    \item Hovering the mose over a node highlights it in all layouts.
+    \item It is possible to configure the view to only show the extremal layout the algorithm is currently working on.
+    This can be helpful when working with large graphs on small screens.
+    \item Tooltips are shown when hovering over code lines and nodes in the graph,
+    These tooltips show the state of the variables.
+    \item The display scales with the size of the window.
+\end{itemize}
+
+To avoid clutter we do not draw the edges of the block graph.
 
 \begin{figure}[htp]
     \centering
     \includegraphics[width=\linewidth]{img/full-application-example}
     \caption[Full application window]{The full window of the application before any steps of the algorithm have been executed.
-    The displayed graph has been loaded from figure~\ref{fig:json-example}.}
+    The displayed graph has been loaded from figure~\ref{fig:json-example}.
+    The buttons are (first row, from left to right): step over, step into, step out, run, pause, debug; and (second row, from left to right): step back over, step back into, step back out, run backwards, preferences, load graph, save graph, generate random graph.
+    The actions corresponding to the buttons are the same as described for the keyboard input in table~\ref{table:keys}, at least for the features that are already implemented (all of them).
+    The left four rectangles show the progress of the four extremal layouts.
+    The right rectangle shows pseudocode of the algorithm and the position of the current step.}
     \label{fig:full-application-example}
 \end{figure}
 
@@ -37,7 +40,8 @@ Figure~\ref{fig:originalpapergraph} compares our results to those of Brandes and
     The background color of a node indicates the class that this node belongs to.
     The node that is currently in the focus of the algorithm (whatever this means for the current stage) is highlighted in black color.
     Although edges are not drawn during the node placement phase we added them here as straight lines to improve readability.
-    If any edge was marked as conflicted, it would have been drawn in red color.}
+    If any edge was marked as conflicted, it would have been drawn in red color.
+    To provide this information to the user at runtime a legend has been added, which is visible in figure~\ref{fig:full-application-example}}.
     \label{fig:example}
 \end{figure}
 
@@ -66,44 +70,45 @@ Figure~\ref{fig:originalpapergraph} compares our results to those of Brandes and
 \section{User interface}\label{sec:userInterface}
 Currently the two main ways to interact with the application are keyboard events and graphical button-clicking.
 The possible keyboard inputs are listed in table~\ref{table:keys}.
-These can also be used by clicking on one of the buttons displayed in figures~\ref{fig:sketch} and~\ref{fig:full-application-example}.
+To improve the user experience even further, these can also be used by clicking on one of the buttons displayed in figure~\ref{fig:full-application-example}.
 
-%\begin{table}[htp]
-    \begin{longtable}{|l|p{12cm}|}
-        \hline
-        Key & Action \\\hline\hline
-        Alt + Left arrow key & Perform one forward step of the algorithm, \enquote{step into}. \\\hline
-        Alt + Right arrow key & Perform one \enquote{step into} in backwards direction---i.e.\ undo one step of the algorithm. \\\hline
-        Alt + Up arrow key & Perform one \enquote{step over} in backwards direction. \\\hline
-        Alt + Down arrow key & Perform one \enquote{step over} in forwards direction. \\\hline
-        Alt + Page down & Perform one \enquote{step out} in forwards direction. \\\hline
-        Alt + Page up & Perform one \enquote{step out} in backwards direction. \\\hline
-        Alt + P & Activate automatic forwards execution. \\\hline
-        Alt + R & Activate automatic backwards execution. \\\hline
-        Alt + Pause & Pause automatic execution. \\\hline
+\begin{table}[htp]
+    \centering
+    \small
+    \begin{longtable}{l p{12cm}}
+        \rowcolor{gray!50}
+        \textbf{Key} & \textbf{Action} \\
+        Alt + Left arrow key & Perform one forward step of the algorithm, \enquote{step into}. \\
+        \rowcolor{gray!25}
+        Alt + Right arrow key & Perform one \enquote{step into} in backwards direction---i.e.\ undo one step of the algorithm. \\
+        Alt + Up arrow key & Perform one \enquote{step over} in backwards direction. \\
+        \rowcolor{gray!25}
+        Alt + Down arrow key & Perform one \enquote{step over} in forwards direction. \\
+        Alt + Page down & Perform one \enquote{step out} in forwards direction. \\
+        \rowcolor{gray!25}
+        Alt + Page up & Perform one \enquote{step out} in backwards direction. \\
+        Alt + P & Activate automatic forwards execution. \\
+        \rowcolor{gray!25}
+        Alt + R & Activate automatic backwards execution. \\
+        Alt + Pause & Pause automatic execution. \\
+        \rowcolor{gray!25}
         Alt + G & Generate a random graph (opens dialog window~\ref{fig:random-graph-dialog}).
-        Ensures that the generated graph is connected.\\\hline
-        Alt + S & Save the current graph to a file (opens a dialog window). \\\hline
-        Alt + L & Load a graph from a file (opens a dialog window). \\\hline
-        Alt + D & Show a debug table (opens window~\ref{fig:debug-table}) and also printlines its content. \\\hline
-        Alt + O & Opens the preferences dialog~\ref{fig:preferences}. \\\hline
-        \caption[Overview of the available keyboard commands]{Overview of the available keyboard commands.
-        The lazy user might not want to learn these by rote but instead use the buttons displayed in figures~\ref{fig:sketch} and~\ref{fig:full-application-example}.}
-        \label{table:keys}
+        Ensures that the generated graph is connected.\\
+        Alt + S & Save the current graph to a file (opens a dialog window). \\
+        \rowcolor{gray!25}
+        Alt + L & Load a graph from a file (opens a dialog window). \\
+        Alt + D & Show a debug table (opens window~\ref{fig:debug-table}) and also printlines its content. \\
+        \rowcolor{gray!25}
+        Alt + O & Opens the preferences dialog~\ref{fig:preferences}. \\
     \end{longtable}
-%\end{table}
+    \caption[Overview of the available keyboard commands]{Overview of the available keyboard commands.
+    The lazy user might not want to learn these by rote but instead use the buttons displayed in figure~\ref{fig:full-application-example}.}
+    \label{table:keys}
+\end{table}
+
+The decision to open new windows was made to save room in each single window.
+For example the fields for generating a random graph are rarely used, so the were chosen to be displayed in a separate dialog when needed.
 
-One interaction that is available neither on keyboard nor on a button is setting breakpoints.
-For this, the user performs a triple click on one of the lines in the pseudocode.
-Upon reaching the beginning of that stage (beginning in running direction) the automatic execution pauses.
-Imagine the following scenario:
-\begin{enumerate}
-    \item The user starts up \appname.
-    \item The user sets a breakpoint on \enquote{Extremal Layout: leftmost lower} (this is the third extremal layout in the order they are computed).
-    \item The user activates automatic forwards execution.
-    \item The algorithm pauses when reaching the first step of \enquote{Extremal Layout: leftmost lower}.
-    \item The user activates automatic forwards execution again.
-    \item After the stage of \enquote{Extremal Layout: leftmost lower} is roughly halfway finished, the user pauses the automatic execution and activates automatic \emph{backwards} execution.
-    \item The algorithm would stop at the last step of \enquote{Extremal Layout: leftmost lower} (which is the first step in backwards direction), but this is obviously not reached from the middle of that stage.
-    So the algorithm just runs backwards to the beginning of whole BK Node Placement Algorithm (first step of the preprocessing).
-\end{enumerate}
+There is one interaction that is available neither on keyboard nor on a button: Breakpoints.
+For this, the user performs a triple click on one of the lines in the pseudocode or a single click on one of the line numbers.
+Upon reaching the beginning of that stage (beginning in forwards direction) the automatic execution pauses.

doc/chapter/4progress.tex

@@ -1,73 +0,0 @@
-\section{Features}\label{sec:features}
-
-The following features are either planned (\planned), under construction (\progress) or done (\done):
-\begin{itemize}
-    \item[\done] Reading a graph from an input file as described in section~\ref{sec:inputFileFormat}.
-    \item[\done] Creating random graphs for testing purposes.
-    \begin{itemize}
-        \item[\done] Saving those randomly created graphs.
-    \end{itemize}
-    \item[\done] Drawing a graph with specified node sizes and positions.
-    \item[\done] Running the node placement algorithm by Brandes and Köpf~\cite{brandes_fast_2001}.
-    \begin{itemize}
-        \item[\done] Calculating the conflicts between edges.
-        \begin{itemize}
-            \item[\done] Differentiating between dummy nodes and non-dummy nodes.
-        \end{itemize}
-        \item[\done] Calculating the blocks.
-        \item[\done] Compacting the layout.
-        \item[\done] Combining the layouts.
-    \end{itemize}
-    \item[\done] Illustrating the progress while the algorithm is running in the form of
-    \begin{itemize}
-        \item[\done] Drawing the nodes at their current position.
-        \begin{itemize}
-            \item[\done] Hovering the mose over a node to highlight it in all layouts.
-            \item[\done] Drawing the nodes in the color of their blocks.
-            \item[\done] Drawing a colored background to show the class assignments.
-            \item[\done] Drawing dummy nodes differently from other nodes.
-        \end{itemize}
-        \item[\done] Drawing the edges just as plain straight lines.
-        \begin{itemize}
-            \item[\done] Drawing the conflicted edges in a different color.
-        \end{itemize}
-        \item[\planned] Drawing the edges of the block graph (yet another color, low priority).
-        \item[\done] Drawing the four extremal layouts and the combined layout separately.
-        \begin{itemize}
-            \item[\done] Optionally, drawing the only the extremal layout the algorithm is currently working on.
-        \end{itemize}
-        \item[\done] Showing pseudocode and the position where the algorithm currently is.
-        \begin{itemize}
-            \item[\done] Clicking on the pseudocode to set a breakpoint at (not \reserved{goto}) a specific location.
-            \item[\done] Customizing the font size of the code.
-        \end{itemize}
-        \item[\done] Showing a legend to explain the shapes and colors.
-        \item[\done] Showing tooltips when hovering over code lines and nodes in the graph that show the state of the variables.
-    \end{itemize}
-    \item[\done] Running the algorithm step by step manually.
-    \item[\done] Running the algorithm step by step with configurable delay (\enquote{automatic execution}).
-    \item[\done] Running the algorithm only on the expanded parts of the source code (\enquote{step overrun}).
-    \begin{itemize}
-        \item[\done] Right clicking the code to expand or collapse all lines up to a specified level.
-    \end{itemize}
-    \item[\done] Using debugger-like commands such as \enquote{step into}, \enquote{step over}, \enquote{step out}.
-    \item[\done] Running the algorithm backwards, both manually and automatic, using \enquote{step backwards into}, \enquote{step backwards over}, \enquote{step backwards out}.
-    \item[\done] Adding buttons and other graphical elements to support the user interface (low priority, see figure~\ref{fig:sketch}).
-    Currently there is only keyboard input (cf.\ section~\ref{sec:userInterface}).
-    \begin{itemize}
-        \item[\done] Displaying the buttons.
-        \item[\done] Making all the buttons work.
-    \end{itemize}
-    \item[\done] Working with hierarchical graphs.
-    \item[\done] Scaling the display with the (adjustable) window size.
-    \item[\planned] Working with disconnected graphs (cf.\ section~\ref{sec:assumptions}), either by modifying the algorithm or by processing the connected components one by one (low priority).
-    \item[\done] Creating ElkNode~\cite{noauthor_elk:_2018} objects from LayeredGraphNode (\ref{sec:graph}) objects.
-    \item[\planned] Creating LayeredGraphNode (\ref{sec:graph}) objects from ElkNode~\cite{noauthor_elk:_2018} objects (low priority).
-\end{itemize}
-
-\section{Known Issues}\label{sec:knownIssues}
-Only the most important unsolved issues are listed here.
-For a complete list, see \url{http://gogs.koljastrohm-games.com/GraphDrawer/NodeShuffler/issues}.
-\begin{itemize}
-    \item[\done] The most important issues were solved.
-\end{itemize}

doc/chapter/4retrospection.tex

@@ -0,0 +1,11 @@
+The biggest challenge we faced was to define create a framework for running algorithms backwards and with different granularity while maximizing abstraction where possible (cf. section~\ref{sec:components}).
+Multiple attempts of restructuring the architecture were needed to find a satisfactory solution.
+
+The only thing we are not yet content with is the modularity aspect:
+We chose to only present the user a single algorithm and our internal data structure is also strongly oriented towards the node placement algorithm by Brandes and Köpf.
+It would be much more beautiful to
+\begin{itemize}
+    \item store the global variables of the specific algorithm, like \member{sink} and \member{root} in our case, in the global part of the \code{Memory} of the \code{Processor}.
+    \item be able to load arbitrary algorithms at runtime.
+\end{itemize}
+We leave these features for future work to address.

doc/chapter/5retrospection.tex

@@ -1 +0,0 @@
-\TODO{Under construction}

doc/chapter/6contributors.tex

@@ -1,34 +0,0 @@
-\begin{table}[ht]
-	\centering
-    \small
-    \begin{longtable}{p{7cm} p{7cm}}
-        \rowcolor{gray!50}
-		\textbf{Competency} & \textbf{Contributor} \\
-		Producer & Eren Bora Yilmaz \\
-        \rowcolor{gray!25}
-        Producer & Kolja Samuel Strohm \\
-		Lead Designer & Kolja Samuel Strohm \\
-        \rowcolor{gray!25}
-		Documentation & Eren Bora Yilmaz \\
-        Lead Systems Programmer & Kolja Samuel Strohm \\
-        \rowcolor{gray!25}
-		Lead Graphics Programmer & Kolja Samuel Strohm \\
-		Non-German Comments & Eren Bora Yilmaz \\
-        \rowcolor{gray!25}
-		Operations Director & Kolja Samuel Strohm \\
-        Director Of Quality Assurance & Eren Bora Yilmaz \\
-        \rowcolor{gray!25}
-		Senior Community Manager & Eren Bora Yilmaz \\
-		Lead Artist & Eren Bora Yilmaz \\
-        \rowcolor{gray!25}
-        Creative Director & Kolja Samuel Strohm \\
-        Localization Producer & Eren Bora Yilmaz \\
-        \rowcolor{gray!25}
-        Manual Code Formatting & Kolja Samuel Strohm \\
-        Black-Box Testing & Eren Bora Yilmaz \\
-        \\\\\rowcolor{gray!25}
-		Special Thanks & Jens Burmeister \\\\
-	\end{longtable}
-	\caption{Contributors}
-	\label{table:contributors}
-\end{table}

doc/chapter/appendix.tex

@@ -1,44 +1,64 @@
-\begin{table}[ht]
-	\centering
+\begin{table}[htp]
+    \centering
     \small
-    \begin{longtable}{p{3cm} p{8cm} p{4cm}}
+    \begin{tabular}{p{7cm} p{7cm}}
         \rowcolor{gray!50}
-		\textbf{Term} & \textbf{Explanation} & \textbf{Example} \\
-		Phase & One phase of the Sugiyama approach~\cite{sugiyama_methods_1981} & Node Placement \\
+        \textbf{Competency} & \textbf{Contributor} \\
+        Producer & Eren Bora Yilmaz \\
         \rowcolor{gray!25}
-		Stage & One stage of the BK algorithm~\cite{brandes_fast_2001} & Balancing \\
-		Step & Atomic part of a stage of the BK algorithm~\cite{brandes_fast_2001} & Computing one $x$ coordinate during balancing stage \\
-		\rowcolor{gray!25}
-        \appname & The name of the application for which this is the documentation & \\
-        \member{sink} & See table~\ref{table:bk-variables} & \\
+        Producer & Kolja Samuel Strohm \\
+        Lead Designer & Kolja Samuel Strohm \\
+        \rowcolor{gray!25}
+        Documentation & Eren Bora Yilmaz \\
+        Lead Systems Programmer & Kolja Samuel Strohm \\
+        \rowcolor{gray!25}
+        Lead Graphics Programmer & Kolja Samuel Strohm \\
+        Non-German Comments & Eren Bora Yilmaz \\
+        \rowcolor{gray!25}
+        Operations Director & Kolja Samuel Strohm \\
+        Director Of Quality Assurance & Eren Bora Yilmaz \\
+        \rowcolor{gray!25}
+        Senior Community Manager & Eren Bora Yilmaz \\
+        Lead Artist & Eren Bora Yilmaz \\
+        \rowcolor{gray!25}
+        Creative Director & Kolja Samuel Strohm \\
+        Localization Producer & Eren Bora Yilmaz \\
+        \rowcolor{gray!25}
+        Manual Code Formatting & Kolja Samuel Strohm \\
+        Black-Box Testing & Eren Bora Yilmaz \\
+        \\\\\rowcolor{gray!25}
+        Special Thanks & Jens Burmeister \\\\
+    \end{tabular}
+    \caption{Contributors}
+    \label{table:contributors}
+\end{table}
+
+\begin{table}[ht]
+    \centering
+    \small
+    \begin{tabular}{p{4cm} p{7cm} l}
+        \rowcolor{gray!50}
+        \textbf{Term} & \textbf{Explanation} & \textbf{Example} \\
+        Phase & One phase of the Sugiyama approach~\cite{sugiyama_methods_1981} & Node Placement \\
         \rowcolor{gray!25}
-        \member{shift} & See table~\ref{table:bk-variables} & \\
-        \member{root} & See table~\ref{table:bk-variables} & \\
+        Stage & One stage of the BK algorithm~\cite{brandes_fast_2001} & Balancing \\
+        Step & Atomic part of a stage of the BK algorithm~\cite{brandes_fast_2001} & Initializing a \reserved{for}-loop \\
         \rowcolor{gray!25}
-        \member{align} & See table~\ref{table:bk-variables} & \\
+        \appname & The name of the application for which this is the documentation & \\
         Extremal layout & Defines in which order the layers are traversed and if a node is aligned with its upper or lower median. & Leftmost lower \\
         \rowcolor{gray!25}
         Automatic execution & The state of the \code{ProcessController} where it repeatedly sends step commands with a certain delay & See section~\ref{sec:userInterface} \\
         Automatic backwards execution & Special case of automatic execution in backwards direction & See section~\ref{sec:userInterface} \\
         \rowcolor{gray!25}
-        pseudocode & Code that does not clearly belong to a specific programming language.
+        Pseudocode & Code that does not clearly belong to a specific programming language.
         It can actually be executed, although we call it pseudocode. & see figure~\ref{fig:full-application-example} \\
-        step overrun & The state of the \code{ProcessController} where it repeatedly sends step commands, but only inserts a delay after steps whose line of pseudocode is currently unfolded in the pseudocode view. & See section~\ref{sec:userInterface} \\
-        \rowcolor{gray!25}
         Processor & See section~\ref{sec:theActualAlgorithm}. & \\
         \\\\
-	\end{longtable}
-	\caption{Glossary for the most difficult terms as we use them.}
-	\label{table:glossary}
+    \end{tabular}
+    \caption{Glossary for the most difficult terms as we use them.}
+    \label{table:glossary}
 \end{table}
 
-\begin{figure}[htp]
-    \centering
-    \includegraphics[width=0.33\linewidth]{img/random-graph-dialog}
-    \caption[Random graph dialog]{Dialog for generating random graphs.}
-    \label{fig:random-graph-dialog}
-\end{figure}
-
 \begin{figure}[htp]
     \centering
     \includegraphics[width=\linewidth]{img/debug-table}
@@ -46,25 +66,38 @@
     \label{fig:debug-table}
 \end{figure}
 
-\begin{figure}[htp]
-    \centering
-    \includegraphics[width=0.33\linewidth]{img/preferences}
-    \caption[Preferences]{The dialog for adjusting the preferences.}
-    \label{fig:preferences}
-\end{figure}
 
 \begin{figure}[htp]
-    \centering
-    \includegraphics[width=0.33\linewidth]{img/error_disconnected}
-    \caption[Error caused by disconnected graph]{An illustration of the error caused by the graph displayed in figure~\ref{fig:error_disconnected}.
-    In the lowest layer the two nodes are drawn at the same position.}
-    \label{fig:error_disconnected_img}
+    \begin{subfigure}[t]{.4\textwidth}
+        \centering
+        \includegraphics[width=0.8\linewidth]{img/random-graph-dialog}
+        \caption[Random graph dialog]{Dialog for generating random graphs.}
+        \label{fig:random-graph-dialog}
+    \end{subfigure}
+    \begin{subfigure}[t]{.6\textwidth}
+        \centering
+        \includegraphics[width=0.9\linewidth]{img/preferences}
+        \caption[Preferences]{The dialog for adjusting the preferences.}
+        \label{fig:preferences}
+    \end{subfigure}
+    \caption[Dialogs]{Dialogs}
+    \label{fig:dialogs}
 \end{figure}
 
+
 \begin{figure}[htp]
-    \begin{lstinputlisting}[language=json,emph={},basicstyle=\scriptsize\ttfamily,numberstyle=\tiny]{src/error_disconnected.json}
-    \end{lstinputlisting}
-    \caption[Disconnected graph causing an error]{Example graph where the node placement algorithm does not behave correctly, possibly because it is not connected.
-    The error is illustrated in figure~\ref{fig:error_disconnected_img}.}
+    \begin{subfigure}[b]{.5\textwidth}
+        \begin{lstinputlisting}[language=json,emph={},basicstyle=\tiny\ttfamily,numberstyle=\tiny]{src/error_disconnected.json}
+        \end{lstinputlisting}
+        \caption{A disconnected graph causing an error}
+        \label{fig:error_disconnected_json}
+    \end{subfigure}
+    \begin{subfigure}[b]{.5\textwidth}
+        \centering
+        \includegraphics[width=0.7\linewidth]{img/error_disconnected}
+        \caption[Illustration of the disconnected graph causing an error]{\code{n6} and \code{n7} drawn on each other}
+        \label{fig:error_disconnected_img}
+    \end{subfigure}
+    \caption[Error in disconnected graph]{Example graph where the node placement algorithm does not behave correctly, possibly because it is not connected.}
     \label{fig:error_disconnected}
 \end{figure}

doc/custom_hyphenations.tex

@@ -10,4 +10,5 @@
 \hyphenation{re-con-struc-tion}
 \hyphenation{rou-tings}
 \hyphenation{Aa-chen}
-\hyphenation{Sa-bour}
+\hyphenation{Sa-bour}
+\hyphenation{back-wards}

doc/doc.tex

@@ -189,16 +189,16 @@ frame=tb}
 
 %\usepackage{showframe} % overfull hboxes deutlich sichtbar machen
 
-% draft note
-\usepackage{everypage}
-\usepackage{datetime}
-\AddEverypageHook{%
-\begin{picture}
-    (0,0)%
-    \put(140,30){\fbox{\textbf{Draft of~\today~\currenttime}}}
-    %
-\end{picture}\hfill
-}
+%% draft note
+%\usepackage{everypage}
+%\usepackage{datetime}
+%\AddEverypageHook{%
+%\begin{picture}
+%    (0,0)%
+%    \put(140,30){\fbox{\textbf{Draft of~\today~\currenttime}}}
+%    %
+%\end{picture}\hfill
+%}
 
 \begin{document} %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
     \pagenumbering{Roman} % Seitenummerierung mit großen römischen Zahlen
@@ -221,9 +221,9 @@ frame=tb}
         Kolja Samuel Strohm (1036051)\\
         Summer term 2018\\
         \vspace{8mm}
-	    \includegraphics[width=10cm]{img/logo}
+	    \includegraphics[height=10cm]{img/logo}
     \end{center}
-    \clearpage\null\clearpage
+    \clearpage%\null\clearpage
 
     \pagestyle{scrheadings} %Seitenstil festlegen, damit die folgenden Einträge auch wirksam sind
     \cfoot*{\pagemark} %center, Fuß
@@ -257,14 +257,8 @@ frame=tb}
     \chapter{UI and visuals}\label{ch:ui}
     \input{chapter/3ui}
 
-    \chapter{Current Progress}\label{ch:progress}
-    \input{chapter/4progress}
-
     \chapter{Retrospection}
-    \input{chapter/5retrospection}
-
-    \chapter{Contributors}
-    \input{chapter/6contributors}
+    \input{chapter/4retrospection}
 
     \appendix
     \chapter{Appendix}\label{ch:appendix}

doc/src/error_disconnected.json

@@ -1,44 +1,15 @@
 {
    "layers":[
-      [
-      { "name": "n0" },
-      { "name": "n1" },
-      { "name": "n2" }
-      ],
-      [
-      { "name": "n3" },
-      { "name": "n4" },
-      { "name": "n5" }
-      ],
-      [
-      { "name": "n6" },
-      { "name": "n7" }
-      ]
+      [ { "name": "n0" }, { "name": "n1" }, { "name": "n2" } ],
+      [ { "name": "n3" }, { "name": "n4" }, { "name": "n5" } ],
+      [ { "name": "n6" }, { "name": "n7" } ]
    ],
    "edges":[
-      {
-         "source":"n0",
-         "target":"n5"
-      },
-      {
-         "source":"n1",
-         "target":"n5"
-      },
-      {
-         "source":"n2",
-         "target":"n5"
-      },
-      {
-         "source":"n3",
-         "target":"n7"
-      },
-      {
-         "source":"n4",
-         "target":"n7"
-      },
-      {
-         "source":"n5",
-         "target":"n7"
-      }
+      { "source":"n0", "target":"n5" },
+      { "source":"n1", "target":"n5" },
+      { "source":"n2", "target":"n5" },
+      { "source":"n3", "target":"n7" },
+      { "source":"n4", "target":"n7" },
+      { "source":"n5", "target":"n7" }
    ]
 }

src/processor/PseudoCodeProcessor.java

@@ -42,6 +42,7 @@ public class PseudoCodeProcessor extends Thread {
     private boolean renderImage = true;
     private JFrame view;
     private ProcessController controller;
+    private boolean insideNotSkipLoop = false; // needet to avoid stack overflow errors
     
     /**
      * creates a new {@link PseudoCodeProcessor}
@@ -77,8 +78,12 @@ public class PseudoCodeProcessor extends Thread {
             skip = false;
             return CodeStatus.UNFINISHED;
         case SKIP:
+            skip = true;
+            if( insideNotSkipLoop )
+                return CodeStatus.UNFINISHED;
             return forwardStepOverUntilNotSkip();
         case STOP:
+            skip = false;
             return CodeStatus.BREAKPOINT;
         default:
             break;
@@ -162,14 +167,14 @@ public class PseudoCodeProcessor extends Thread {
     }
     
     private CodeStatus forwardStepOverUntilNotSkip() {
-        skip = true;
         if( programPointer == null )
             return CodeStatus.FINISHED;
-        int stackSize = mem.getSize();
         CodeStatus status = CodeStatus.UNFINISHED;
         do {
+            insideNotSkipLoop = true;
             status = forwardStep();
-        } while( mem.getSize() > stackSize && status == CodeStatus.UNFINISHED && skip );
+            insideNotSkipLoop = false;
+        } while( status == CodeStatus.UNFINISHED && skip );
         return status;
     }
     
@@ -207,8 +212,12 @@ public class PseudoCodeProcessor extends Thread {
             skip = false;
             return CodeStatus.UNFINISHED;
         case SKIP:
+            skip = true;
+            if( insideNotSkipLoop )
+                return CodeStatus.UNFINISHED;
             return backwardStepOverUntilNotSkip();
         case STOP:
+            skip = false;
             return CodeStatus.BREAKPOINT;
         default:
             break;
@@ -236,14 +245,14 @@ public class PseudoCodeProcessor extends Thread {
     
     private CodeStatus backwardStepOverUntilNotSkip()
     {
-        skip = true;
         if( programPointer == null )
             return CodeStatus.FINISHED;
-        int stackSize = mem.getSize();
         CodeStatus status = CodeStatus.UNFINISHED;
         do {
+            insideNotSkipLoop = true;
             status = backwardStep();
-        } while( mem.getSize() > stackSize && status == CodeStatus.UNFINISHED && skip );
+            insideNotSkipLoop = false;
+        } while( status == CodeStatus.UNFINISHED && skip );
         return status;
     }
     

src/processor/StackFrame.java

@@ -34,6 +34,12 @@ public class StackFrame {
     	return type;
     }
     
+    /**
+     * declare a new variable
+     * @param name the name of the variable
+     * @param value the value of the variable
+     * @param <T> the type of the variable
+     */
     public <T> void declare( String name, T value )
     {
         if( data.containsKey( name ) )

src/test/RandomProcessor.java

@@ -6,13 +6,13 @@ import graph.LayeredGraphNode;
 import processor.PseudoCodeNode;
 import processor.PseudoCodeProcessor;
 
-public class RandomProcessor extends PseudoCodeProcessor {
+class RandomProcessor extends PseudoCodeProcessor {
 
     private static final double STEP_OVER = 0.1;
     private static final double STEP_OUT = 0.1;
     private static final int ITERATIONS = 1000;
     
-    public RandomProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
+    RandomProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
         super(start, graph, view);
     }
     
@@ -50,6 +50,7 @@ public class RandomProcessor extends PseudoCodeProcessor {
                 if( !controlStack.isEmpty() )
                     throw new IllegalStateException( "There are too manny Objects in the control Stack." );
                 System.out.println( "Random Iteration " + i + " finished successfully." );
+                getController().setStepOption( Math.abs( getController().getStepOption() - 1 ) );
             }
         } catch (Exception e) {
             e.printStackTrace();

src/test/StepInProcessor.java

@@ -6,9 +6,9 @@ import graph.LayeredGraphNode;
 import processor.PseudoCodeNode;
 import processor.PseudoCodeProcessor;
 
-public class StepInProcessor extends PseudoCodeProcessor{
+class StepInProcessor extends PseudoCodeProcessor{
 
-    public StepInProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
+    StepInProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
         super(start, graph, view);
     }
     

src/test/StepOverProcessor.java

@@ -6,9 +6,9 @@ import graph.LayeredGraphNode;
 import processor.PseudoCodeNode;
 import processor.PseudoCodeProcessor;
 
-public class StepOverProcessor extends PseudoCodeProcessor {
+class StepOverProcessor extends PseudoCodeProcessor {
 
-    public StepOverProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
+    StepOverProcessor(PseudoCodeNode start, LayeredGraphNode graph, JFrame view) {
         super(start, graph, view);
     }
     

src/test/TestProcessor.java

@@ -2,6 +2,7 @@ package test;
 
 import javax.swing.JFrame;
 import javax.swing.JTree;
+import javax.swing.tree.DefaultTreeModel;
 
 import bk.BKNodePlacement;
 import graph.LayeredGraphNode;
@@ -17,7 +18,7 @@ class TestProcessor {
     
     public static void main(String[] args) throws InterruptedException {
     	
-    	RandomGraphGenerator r = new RandomGraphGenerator( 0.2, 0.8, 3, 15, 2, 15, 3 );
+    	RandomGraphGenerator r = new RandomGraphGenerator( 0.2, 0.8, 3, 5, 2, 5, 3 );
         LayeredGraphNode graph = r.createRandomNode( null, 0, true );
         SweepCrossingMinimizer cminzer = new SweepCrossingMinimizer();
         for( int i = 0; i < 10; i++ )
@@ -31,14 +32,32 @@ class TestProcessor {
         BKNodePlacement algorithm = new BKNodePlacement();
         JTree pseudoTree = new JTree();
         PseudoCodeNode tree = algorithm.createPseudocodeTree( pseudoTree );
+        pseudoTree.setModel( new DefaultTreeModel( tree ) );
         JFrame frame = new JFrame( "NodeShuffler" );
         PseudoCodeProcessor processor = new StepInProcessor( tree, graph, frame );
+        tree.setController( processor.getController() );
+        processor.start();
+        processor.join();
+        processor = new StepInProcessor( tree, graph, frame );
+        tree.setController( processor.getController() );
+        for( int i = pseudoTree.getRowCount() - 1; i > 0; i-- )
+            pseudoTree.collapseRow( i );
+        processor.getController().setStepOption( 1 );
+        processor.start();
+        processor.join();
+        processor = new StepOverProcessor( tree, graph, frame );
+        tree.setController( processor.getController() );
         processor.start();
         processor.join();
         processor = new StepOverProcessor( tree, graph, frame );
+        tree.setController( processor.getController() );
+        for( int i = pseudoTree.getRowCount() - 1; i > 0; i-- )
+            pseudoTree.collapseRow( i );
+        processor.getController().setStepOption( 1 );
         processor.start();
         processor.join();
         processor = new RandomProcessor( tree, graph, frame );
+        tree.setController( processor.getController() );
         processor.start();
         processor.join();
         System.out.println( "Tests Finished." );

src/view/LegendView.java

@@ -38,6 +38,13 @@ public class LegendView extends JPanel {
 		g.setColor( Color.BLACK );
 		g.drawString( "block root", x, fm.getMaxAscent() + PADDING );
 		x += fm.stringWidth( "block root" ) + PADDING * 4;
+        
+        g.setColor( Color.LIGHT_GRAY );
+        g.fillOval( x, PADDING, height / 3, height - PADDING*2 );
+        x += height / 3 + PADDING;
+        g.setColor( Color.BLACK );
+        g.drawString( "dummy node", x, fm.getMaxAscent() + PADDING );
+        x += fm.stringWidth( "dummy node" ) + PADDING * 4;
 		
 		g.setColor( Color.LIGHT_GRAY );
         ((Graphics2D)g).setStroke(new BasicStroke(2));