

% add the PATH to retrieve cls and sty beamer styles files
\makeatletter
\providecommand*{\input@path}{}
\edef\input@path{{../../support/beamer/}\input@path}% prepend
\makeatother

% \documentclass{pharoslides}
% \documentclass[aspectratio=169]{pharoslides} % format 16/9
\documentclass[withvideo]{pharoslides} % format 16/9 + incrustation video

\graphicspath{{./figures/}{../}{../../support/beamer/imgs/}}

%Information to be included in the title page:
\title{A Simple HTTP Application}
\subtitle{As a pretext to revisit Pharo Syntax}
\author{Damien Cassou, Stéphane Ducasse and Luc Fabresse}
\institute{http://stephane.ducasse.free.fr}
\date{}
\slidesid{W3S04}

\begin{document}

\frame[plain]{\titlepage}



\begin{frame}[fragile]

\frametitle{A Tiny Book Server}


\begin{center}
\includegraphics[width=0.8\textwidth]{figures/TeapotWelcome.png}\end{center}

\end{frame}



\begin{frame}[fragile]

\frametitle{Getting a Book}

\begin{listing}{}
ZnClient new
  url: 'http://localhost:8181/books/1';
  get
\end{listing}

\begin{itemize}
\item Class name starts with an uppercase
\item \code{new} is a message sent to the class \code{ZnClient}
\item \code{url:} and \code{get} are both sent to the instance of \code{ZnClient}
\end{itemize}


\begin{center}
\includegraphics[width=0.8\textwidth]{figures/TeapotOneBook.png}\end{center}

\end{frame}



\begin{frame}[fragile]

\frametitle{Adding a Book}

\begin{listing}{}
ZnClient new
  url: 'http://localhost:8181/books/1';
  formAt: 'author' put: 'van Caekenberghe et al';
  formAt: 'title'  put: 'Entreprise Pharo';
  post
\end{listing}

\code{formAt: 'author' put: 'van Caekenberghe et al'}

is equivalent to 

\code{formAtput('author' , 'van Caekenberghe et al')}
\end{frame}



\begin{frame}[fragile]

\frametitle{The Full Server}

\begin{listing}{}
books := Dictionary new.
teapot := Teapot configure: { 
    #defaultOutput -> #json. #port -> 8181 }.
teapot
 GET: '/' -> '<h1>A simple book server</h1>'; output: #html;
 GET: '/books' -> books;
 GET: '/books/<id:IsInteger>' 
   -> [ :request | books at: (request at: #id) asString];
 POST: '/books/<id>' 
   -> [ :request | | book |
          book := { 'author' -> (request at: #author). 
          'title'  -> (request at: #title) } asDictionary.
          books at: (request at: #id) put: book ];   
 start.
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Configuring a Server}

\begin{listing}{}
  | books teapot |
  books := Dictionary new.
  teapot := Teapot configure: {  #defaultOutput -> #json.   #port -> 8181 . #debugMode -> true }.
\end{listing}

\begin{itemize}
\item \code{\textbar{} \textbar{}} delimits local variable definition
\item \code{:=} assignment
\item \code{\#port} is a symbol (aka unique string)
\item \code{configure:} is a message sent to the class \code{Teapot}
\item In \code{configure:}, \code{:} means that the message is expecting an argument
\item \code{\{ . . \}} is an array of three elements
\item \code{-\textgreater{}} creates a key-value pair
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Defining The Server Routes}

\begin{listing}{}
teapot
 GET: '/' 
   -> '<h1>A simple book server</h1>'; output: #html;
 GET: '/books' 
   -> books;
 GET: '/books/<id:IsInteger>' 
   -> [ :request | books at: (request at: #id) asString];
 POST: '/books/<id>' 
   -> [ :request | | book |
      book := { 'author' -> (request at: #author) . 
        'title' -> (request at: #title) } asDictionary.
      books at: (request at: #id) put: book ];   
 start.
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{More About Syntax}

Processing URIs such as:
\code{http://localhost:8181/books/1}

\begin{listing}{}
teapot 
 GET: '/books/<id:IsInteger>'
   -> [ :request | books at: (request at: #id) asString];
\end{listing}

\begin{itemize}
\item \code{{[} :request \textbar{} books at: (request at: \#id) asString {]}} is a block 
\item acts as an anonymous method
\begin{itemize}
\item \code{:request} is an argument
\item \code{at:} is a message accepting one argument
\end{itemize}

\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Conclusion}

\begin{itemize}
\item Teapot is a cool package \code{http://smalltalkhub.com/\#!/\textasciitilde{}zeroflag/Teapot}
\item A web server in one page
\item Based on Zinc a really strong and well designed HTTP client/server
\end{itemize}
\end{frame}




% \setlength{\textwidth}{\originaltextwidth}
\setbeamertemplate{background canvas}{\insertBorderForHandout}

\begin{frame}[plain]

\begin{minipage}{\originaltextwidth}
\centering
\large


\vspace{2em}

A course by

\vspace{1em}

\hspace{-20px}\includegraphics[height=32px]{inriaLogo}\hspace{3em}\raisebox{7px}{and}\hspace{3em}\raisebox{-6px}{\includegraphics[height=30px]{logoutop}}

\vspace{2em}

in collaboration with

\vspace{1em}

\includegraphics[height=40px]{unisciellogo}\hskip 1.5em%
\raisebox{5px}{\includegraphics[height=30px]{unitlogo}}\hskip 2em%
\raisebox{8px}{\includegraphics[height=24px]{univLilleLogo}}\hskip 2em%
\raisebox{3px}{\includegraphics[height=29px]{logo-IMT}}\hskip 2em%
\raisebox{1px}{\includegraphics[height=32px]{minesDouaiLogo}}

\vspace{2.5em}

\includegraphics[width=50px]{by-nc-nd} \tiny \hskip 0.5em \raisebox{5px}{Inria 2016}

\medskip

\tiny
Except where otherwise noted, this work is licensed under CC BY-NC-ND 3.0 France

\url{https://creativecommons.org/licenses/by-nc-nd/3.0/fr/} 

\end{minipage}
\end{frame}

\end{document}

%%% Local Variables:
%%% mode: latex
%%% TeX-master: t
%%% End:
