Graphical user interface is one of the most important parts of the Media Center
application. Entertainer user interface is implemented with Clutter and GTK. Frontend
consists of GTK-window that contains toolbar, menu bar, status bar and the most
important part ,\textit{Clutter stage}, which is displayed via Clutter-GTK widget.
Frontend also includes preferences dialog, content management dialog and log viewer.
All these three sub components can be also executed as separated processes without
executing the whole frontend. These dialogs are discussed more depth in chapter 6.

In this chapter we concentrate to the Clutter part of the GUI. The main class of 
the GUI is \textit{UserInterface} that is responsible of managing screen changes 
and creating all screens. \textit{UserInterface} object also receives all user 
actions. When key press is received, UserInterface object method \texttt{handle\_key\_press\_event()}
is called. This method decides how to react to key press action. Usually it just
forwards event to the current screen. Current screen has internal logic for events.

\subsubsection*{Entertainer UI layers}
Entertainer UI can be thinked as a set of layers that are piled on to each other.
This screen stack is illustrated in the figure \ref{fig:layers}.

\begin{figure}[htb]
	\begin{center}
		\includegraphics[angle=0,scale=0.7]{diagrams/gui_layers.png}
		\caption{Entertainer GUI layers.}
		\label{fig:layers}
	\end{center}
\end{figure}

Figure above shows how video is always displayd under menu overlay and screen
widgets. If video is not running the whole layer doesn't exists. In this case
the background layer is displayed through menu overlay image. If current screen
is OSD type, then menu overlay layer is hidden. This way OSD screens allow user
to see video playback on screen as it should be seen. Menu overlay layer is drawn
only when user is navigating in menus. This figure omits the possibility of two
screens to be displayed at the same time. This happends when another screen is
type of DIALOG. Dialogs are shown on top of the current screen.

\subsubsection*{Screen life cycle}
Entertainer has two important concepts: \textit{Screen} and \textit{Transition}. 
These both are also interfaces that many classes implement. Screen is a set of 
Clutter actors, which together create one view. View is what users sees on screen.
Transition is a mechanism to animate screen switches. Say, when user selects
photo album from the photo album list, we need to switch from the photo screen 
to the album screen. When this happens. We call UserInterface objects's c\texttt{hangeScreen()}.
This call creates a new screen (in this case album screen) and then gives current
screen and new screen to the Transition object, which animates screen switch.

Screen is created when it is needed, in other words, when user enters to that screen.
When screen object is created it is added to the Clutter stage object. It's also
pushed into the \textit{Screen history}, which is a stack of Screen objects. 
\texttt{ScreenHistory} object keeps record of recent screens. This allows user
to navigate "back" just like in web-browsers. History size can be changed from
the preferences dialog. Screen is added to the stage when it is created, but
when we remove it? There are two possibilites: When history size is exceeded the
oldest screen is removed. Also when user navigates to "back", the current screen
is NOT added into the history and it is removed from stage immediately. If we would
add screens into the history when navigating back, then we would create an endless
loop of two screens.

\subsubsection*{Creating a new Screen or Transition effect}
If you want to create a new view to the Entertainer, say e-mail reader, you need 
to write a new \texttt{EmailScreen} class that implements \texttt{Screen} interface. 
If you want to create a new transition effect you just implement \texttt{Transition} 
interface which contains only two methods. It's recommended to look into the
 \texttt{FadeTransition} class to get the idea how transitions effects work.
\textbf{Notice} that if animation direction is "backwards" then you need to
remove old screen from the stage after animation has been displayed. This can
be done by using 'completed' signal with Clutter \texttt{Timeline} object.