Altered UvA presentation

2010-10-19-uva/.gitignore

+*.aux
+*.log
+*.nav
+*.out
+*.snm
+*.toc
+*.pdf

2010-10-19-uva/2010-10-19-uva.tex

+\documentclass{beamer}
+\usepackage[dutch]{babel}
+\usepackage[utf8]{inputenc}
+\usepackage{beamerthemesplit}
+\usepackage{graphics}
+\usepackage{url}
+\usepackage{listings}
+
+\definecolor{kugreen}{RGB}{130,151,183}
+\setbeamercovered{transparent}
+
+\lstset
+{
+	tabsize=4,
+	showspaces=false,
+	showstringspaces=false,
+	showtabs=false
+}
+
+\mode<presentation>
+{
+	\usetheme{PaloAlto}
+	\usecolortheme[named=kugreen]{structure}
+	\useinnertheme{circles}
+	\usefonttheme[onlymath]{serif}
+	\setbeamercovered{transparent}
+	\setbeamertemplate{blocks}[rounded][shadow=false]
+}
+
+\logo{\includegraphics[width=1cm]{images/vo20-logo.png}}
+
+\title{Prototype vo20 \& java code editor}
+\subtitle{Informatica toetssysteem in webtechnologieën}
+\author{Taddeüs Kroes \& Sander van Veen}
+\institute{Universiteit van Amsterdam}
+\date{19 oktober 2010}
+
+\begin{document}
+
+\frame
+{
+	\titlepage
+}
+
+\frame
+{
+	\frametitle{Overzicht}
+	\tableofcontents[pausesection]
+}
+
+\section{Introductie}
+
+\subsection{Voortgezet Onderwijs 2.0}
+	
+\frame
+{
+	\frametitle{Wie? Wat? Waarom?}
+	
+	\begin{itemize}
+		\item Profielwerkstuk 2008
+		\item Informatica / Scheikunde
+		\item Automatisering
+	\end{itemize}
+}
+	
+\frame
+{
+	\frametitle{Screenshots: Scheikunde (1)}
+	
+	\includegraphics[width=10cm]{images/toetspagina-1.png}
+}
+	
+\frame
+{
+	\frametitle{Screenshots: Scheikunde (2)}
+	
+	\includegraphics[width=10cm]{images/toetspagina-2.png}
+}
+	
+\frame
+{
+	\frametitle{Screenshots: Scheikunde (3)}
+	
+	\includegraphics[width=10cm]{images/toetspagina-3.png}
+}
+	
+\frame
+{
+	\frametitle{Screenshots: Scheikunde (4)}
+	
+	\includegraphics[width=10cm]{images/redox-voorbeeld.png}
+}
+
+%\section{Technologie\"en}
+
+%\frame
+%{
+%	\frametitle{JavaScript preprocessor}
+%	
+%	\begin{itemize}
+%		\item includes \\
+%		\texttt{\#include "ds.form.js"} \\
+%		\texttt{\#include "ds.tree.js"} \\
+%		\item dependencies \\
+%		\texttt{\#define DS\_\$\_hide} \\
+%		\texttt{\#include "ds.dom.js"} \\
+%		\texttt{\$('\#header$\,$a').hide()} \\
+%		\item conditions \\
+%		\texttt{\#ifdef DS\_DEBUG} \\
+%		\texttt{console.log("$ $user status = "$ $ + user.status);} \\
+%		\texttt{\#endif} \\
+%		\item macro's \\
+%		\texttt{\#define ASSERT(x) $\setminus$ \\
+%		\hspace{1cm} (!x \&\& throw new Exception(x))} \\
+%	\end{itemize}
+%}
+
+%\frame
+%{
+%	\frametitle{CSS enhancements}
+%	
+%	\begin{itemize}
+%		\item nested selectors
+%		\lstinputlisting{code/nested-selectors.css}
+%		\item server imports
+%		\lstinputlisting{code/server-imports.css}
+%		\item inline images
+%	\end{itemize}
+%}
+ 
+%\section{Management}	
+%
+%\frame
+%{
+%	\frametitle{Mappenstructuur}
+%	
+%	\begin{itemize}
+%	\item Framework en applicatie gescheiden:
+%		\begin{itemize}
+%		\item Minder conflicten bij het committen.
+%		\item Centrale updates.
+%		\item Gescheiden unit tests, bugtracking etc..
+%		\end{itemize}
+%	\item Gescheiden onderdelen:
+%		\begin{itemize}
+%		\item Media (JavaScript, stylesheets, images)
+%		\item Helpers
+%		\item Models
+%		\item Modules
+%		\item Unit tests
+%		\end{itemize}
+%	\item applicatie $>$ module $>$ action
+%	\end{itemize}
+%}
+
+%\frame
+%{
+%	\frametitle{Toegepaste design patterns}
+%	
+%	\begin{itemize}
+%	\item Model View Controller
+%	\item ActiveRecord
+%	\lstinputlisting[language=PHP]{code/activerecord.php}
+%	\item Factory (boot class / db connection handler)
+%	\end{itemize}
+%}
+
+%\frame
+%{
+%	\frametitle{Onderhoud}
+%	
+%	\begin{itemize}
+%	\item Version control (Subversion of Git) \\
+%	\texttt{\\ \$ phake upgrade}
+%	\item Bug tracking (Trac)
+%	\item Debian packages \\
+%	\texttt{\\ \$ sudo apt-get install duoworks} \\
+%	\texttt{\$ sudo apt-get update \&\& sudo apt-get upgrade}
+%	\end{itemize}
+%}
+
+\section{DuoWorks}
+% - Phake
+% - Database abstractie laag (Library_Data)
+% - XHP
+% - User library: authenticatie en authorisatie
+% - Overige beveiliging:
+%    - sql injections
+%    - null byte injection
+%    - content escaping (XHP) tegen XSS
+% - Internationalization (gettext)
+% - Unit testing
+
+\subsection{Gebruikte technieken}
+
+\frame
+{
+	\frametitle{Gebruikte technieken (1)}
+	
+	\textbf{Command line interface}
+	\begin{itemize}
+	\item Vergemakkelijkt updates en algemene taken.
+	\item Phakefile is eenvoudig uit te breiden.
+	\end{itemize}
+	\textbf{Data library}
+	\begin{itemize}
+	\item Een driver voor elk database type.
+	\item Database in 3 stappen:
+		\begin{enumerate}
+		\item Design in MySQL Workbench.
+		\item Exporteren SQL bestand.
+		\item Models genereren met Phakefile.
+		\end{enumerate}
+	\end{itemize}
+}
+
+%\frame
+%{
+%	\frametitle{Gebruikte technieken (2)}
+%	
+%	\textbf{Facebook's XHP}
+%	\begin{itemize}
+%	\item Objectgeori\"enteerde helpers in XML syntax.
+%	\item Voorkomt \emph{cross-site scripting}.
+%	\end{itemize}
+%}
+
+\frame
+{
+	\frametitle{Gebruikte technieken (2)}
+	
+	\textbf{Internationalisering door \texttt{gettext}}
+	\begin{itemize}
+	\item Gemakkelijke syntax: \texttt{\_('Translate this please...')}.
+	\item Ook leesbaar als vertaling niet beschikbaar is.
+	\item Geschikt gemaakt voor JavaScript.
+	\end{itemize}
+	\textbf{Unit testing}
+	\begin{itemize}
+	\item Lokaliseren van scriptfouten.
+	\item Alle tests in \'e\'en commando, fouten worden direct geprint.
+	\item Coverage (code \& webpagina's)
+	\end{itemize}
+	\textbf{Code management}
+	\begin{itemize}
+	\item Version control (Git)
+	\item Bug tracking (Trac)
+	\end{itemize}
+}
+
+\subsection{Beveiliging}
+
+\frame
+{
+	\frametitle{Beveiliging}
+	
+	\textbf{Authorisatie en authenticatie}
+	\begin{itemize}
+	\item Centrale en lokale authorisatie
+	\item Session based
+	\end{itemize}
+	\textbf{Overige beveiliging}
+	\begin{itemize}
+	\item Cross site scripting (XSS)
+	\item SQL injections
+	\item Null byte injection
+	\item Remote file inclusion
+	\end{itemize}
+	\textbf{Updates distributie}
+	\begin{itemize}
+	\item Debian packages \\
+	\texttt{\$ sudo apt-get install duoworks} \\
+	\texttt{\$ sudo apt-get update \&\& sudo apt-get upgrade}
+	\end{itemize}
+}
+
+\section{Code editor}
+
+\subsection{Studenten}
+
+\frame
+{
+	\frametitle{Code editor: Studenten}
+	
+	\textbf{Studenten}
+
+	\begin{itemize}
+	\item code opslaan en laden (filebrowser)
+	\item code compileren en uitvoeren
+	\item fullscreen weergave
+	\item java API documentatie (en C man pages)
+	\item syntax highlighting
+	\item zonder installatie aan de slag
+	\end{itemize}
+}
+
+\subsection{Docenten}
+
+\frame
+{
+	\frametitle{Code editor: Docenten}
+
+	\textbf{Docenten}
+	
+	\texttt{svn co svn://vo20.nl/uva/binds3/assignments/}
+	
+	\begin{itemize}
+	\item in \'e\'en keer de opdrachten van alle studenten per vak
+	\item specifieke opdracht van alle leerlingen inzien\\
+	\end{itemize}
+	
+	\subsection{Beveiliging}
+	
+	\textbf{Beveiliging}
+	
+	\begin{itemize}
+	\item limieten voor cpu, memory, runtime
+	\item sandbox
+	\item java policy
+	\end{itemize}
+}
+
+\section{Toekomst}
+	
+\frame
+{
+	\frametitle{Toekomstbeeld}
+	
+	\begin{itemize}
+	\item Verschillende vakken
+	\item Nakijk module
+	\item Automatisch nakijken
+	\begin{itemize}
+		\item Mini unit tests
+		\item Fuzzy matching van code
+	\end{itemize}
+	\item Met meerdere gebruikers aan dezelfde code werken
+	\end{itemize}
+}
+
+\end{document}
+

2010-10-19-uva/code/activerecord.php

+$exams = Exam::find('all', array(
+	'include' => 'course',
+	'where' => array('user_id = $1',
+	                 $this->user->id)
+));
+
+foreach( $exams as $exam ) {
+	echo $exam->course."\n";
+	$exam->update(array('name' => 'foo'));
+}

2010-10-19-uva/code/model.php

+<?php
+
+class Foo extends \DuoWorks\Model
+{
+	protected $columns = array('id','foo','bar');
+	
+	public static function constraints()
+	{
+		return array(
+			// 'foo' is numeric and may not be omitted
+			'foo' => array('required', 'numeric' => _('Only numbers allowed.')),
+			// 'bar' Should be at most 10 characters long
+			'bar' => 'length:-10'
+		);
+	}
+}

2010-10-19-uva/code/nested-selectors.css

+#id ul li.foo { color: red }
+#id div.bar { color: green }
+
+#id {
+	ul li.foo { color: red }
+	div.bar { color: green }
+}

2010-10-19-uva/code/server-imports.css

+@server import url(css/reset.css);
+@server import url(css/header.css);
+@server import url(css/body.css);

2010-10-19-uva/code/xhp.php

+// PHP file:
+<div>
+	<?php
+	if( $some_bool ) {
+	?>
+		<span class="foo"></span>
+	<?php
+	} else {
+	?>
+		<div class="bar"></div>
+	<?php
+	}
+	?>
+</div>
+
+// XHP file:
+<?php
+$foo = $some_bool ? <span class="foo" /> : <div class="bar" />;
+echo <div>{$foo}</div>;
+?>