

% 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{Pharo Syntax in a Nutshell}
\subtitle{}
\author{Damien Cassou, Stéphane Ducasse and Luc Fabresse}
\institute{http://stephane.ducasse.free.fr}
\date{}
\slidesid{W1S05}

\begin{document}

\frame[plain]{\titlepage}



\begin{frame}[fragile]

\frametitle{Getting a Feel About Syntax}

Give you the general feel to get started:

\begin{itemize}
\item Overview of syntactical elements and constructs
\item Three kinds of messages to minimize parentheses
\item Overview of block syntax
\end{itemize}

This lecture is an \textbf{overview}

No stress if you do not get it right now!

We will repeat in future lectures
\end{frame}



\begin{frame}[fragile]

\frametitle{The Complete Syntax on a Postcard}

No need to understand everything! 
But \symbol{34}everything\symbol{34} is on this screen :)

\begin{listing}{}
exampleWithNumber: x
  "This method illustrates the complete syntax."
  <aMethodAnnotation>

  | y |
  true & false not & (nil isNil)
    ifFalse: [ self halt ].
  y := self size + super size.
  #($a #a 'a' 1 1.0)
    do: [ :each | Transcript
            show: (each class name);
            show: (each printString);
            show: ' ' ].
  ^ x < y
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Hello World}

\begin{listing}{}
'Hello World' asMorph openInWindow
\end{listing}

We send the message \code{asMorph} to a string and obtain a graphical element that we open in a window by sending it the message \code{openInWorld}
\end{frame}



\begin{frame}[fragile]

\frametitle{Getting the Pharo Logo from the Web}

\begin{listing}{}
(ZnEasy getPng: 'http://pharo.org/web/files/pharo.png')
   asMorph openInWindow
\end{listing}

\begin{itemize}
\item \code{ZnEasy} designates a class
\begin{itemize}
\item Class names start with an uppercase character
\end{itemize}

\item Message \code{getPng:} is sent to the \code{ZnEasy} class with a string as argument
\begin{itemize}
\item \code{getPng:} is a keyword message 
\end{itemize}

\item \code{'http://pharo.org/web/files/pharo.png'} is a string
\item Messages \code{asMorph} and \code{openInWindow} are from left to right
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Syntactic Elements}

\begin{tabular}{lll}
\toprule
comment & \symbol{34}a comment\symbol{34} &  \\
character & \$c \$\# \$@ &  \\
string & 'lulu' 'l''idiot' &  \\
symbol (unique string) & \#mac \#+ &  \\
literal array & \#(12 23 36) &  \\
integer & 1, 2r101 &  \\
real & 1.5 6.03e-34,4, 2.4e7 &  \\
boolean & true, false &  \\
 & (instances of True and False) &  \\
undefined & nil &  \\
 & (instance of UndefinedObject) &  \\
point & 10@120 &  \\
\bottomrule
\end{tabular}
\end{frame}



\begin{frame}[fragile]

\frametitle{Essential Constructs}

\begin{itemize}
\item Temporary variable declaration: \code{\textbar{} var \textbar{}}
\item Variable assignment: \code{var := aValue}
\item Separator: \code{message . message}
\item Return: \code{\string^ expression}
\item Block (lexical closures, a.k.a anonymous method)
\end{itemize}

\begin{listing}{}
[ :x | x + 2 ] value: 5
> 7 
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Essence of Pharo Computation}

\begin{itemize}
\item Objects (created using messages)
\item Messages 
\item Blocks (anonymous methods)
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Three Kinds of Messages to Minimize Parentheses}

\begin{itemize}
\item Unary message
\begin{itemize}
\item Syntax: \code{receiver selector}
\item \code{9 squared}
\item \code{Date today}
\end{itemize}

\item Binary message
\begin{itemize}
\item Syntax: \code{receiver selector argument}
\item \code{1+2}
\item \code{3@4}
\end{itemize}

\item Keyword message
\begin{itemize}
\item Syntax: \code{receiver key1: arg1 key2: arg2}
\item \code{2 between: 10 and: 20}
\end{itemize}

\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Message Precedence}

(Msg) \textgreater{} Unary \textgreater{} Binary \textgreater{} Keywords

\begin{itemize}
\item First we execute \code{()}
\item Then unary, then binary and finally keyword messages
\end{itemize}

This order minimizes \code{()} needs

But let us start with messages
\end{frame}



\begin{frame}[fragile]

\frametitle{Sending an Unary Message}

\begin{listing}{}
receiver selector
\end{listing}

Example

\begin{listing}{}
10000 factorial
\end{listing}

We send the message \code{factorial} to the object \code{10000}
\end{frame}



\begin{frame}[fragile]

\frametitle{Sending a Binary Message}

\begin{listing}{}
receiver selector argument
\end{listing}

Example

\begin{listing}{}
1 + 3
\end{listing}

We send the message \code{+} to the object \code{1} with the object \code{3} as argument
\end{frame}



\begin{frame}[fragile]

\frametitle{Sending a Keyword Message}

\begin{listing}{}
receiver keyword1: arg1 keyword2: arg2
\end{listing}

equivalent to C like syntax

\begin{listing}{}
receiver.keyword1keyword2(arg1, arg2)
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Example: Sending an HTTP Request}

\begin{listing}{}
ZnClient new
 url: 'https://en.wikipedia.org/w/index.php';
 queryAt: 'title' put: 'Pharo';
 queryAt: 'action'  put: 'edit';
 get
\end{listing}

\begin{itemize}
\item \code{new} is a unary message sent to a class
\item \code{queryAt:put:} is a keyword message
\item \code{get} is a unary message
\item \code{;} (called a cascade) sends all messages to the same receiver
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Messages are Everywhere!}

\begin{itemize}
\item Conditionals
\item Loops
\item Iterators
\item Concurrency
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Conditionals are also Message Sends}

\begin{listing}{}
factorial
  "Answer the factorial of the receiver."
  self = 0 ifTrue: [ ^ 1 ].
  self > 0 ifTrue: [ ^ self * (self - 1) factorial ].
  self error: 'Not valid for negative integers'
\end{listing}

\begin{itemize}
\item \code{ifTrue:} is sent to an object, a boolean!
\item \code{ifFalse:ifTrue:}, \code{ifTrue:ifFalse:} and \code{ifFalse:} also exist
\end{itemize}

You can read their implementation, this is not magic!
\end{frame}



\begin{frame}[fragile]

\frametitle{Loops are also Message Sends}

\begin{listing}{}
1 to: 4 do: [ :i| Transcript << i ]
> 1
> 2
> 3
> 4
\end{listing}

\begin{itemize}
\item \code{to:do:} is a message sent to an integer
\item Many other messages implement loops: \code{timesRepeat:}, \code{to:by:do:}, \code{whileTrue:}, \code{whileFalse:}, ...
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{With Iterators}

We ask the collection to perform the iteration on itself

\begin{listing}{}
#(1 2 -4 -86)
  do: [ :each | Transcript show: each abs printString ; cr ]
> 1
> 2
> 4
> 86
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Blocks Look like Functions}

fct(x) = x*x+3

\begin{listing}{}
fct := [ :x | x * x + 3 ]
\end{listing}

fct(2)

\begin{listing}{}
fct value: 2
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Blocks}

\begin{itemize}
\item Kind of anonymous methods
\end{itemize}

\begin{listing}{}
[ :each | Transcript show: each abs printString ; cr ]
\end{listing}

\begin{itemize}
\item Are lexical closures
\item Are plain objects:
\begin{itemize}
\item can be passed as method arguments
\item can be stored in variables
\item can be returned
\end{itemize}

\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Block Usage}

\begin{listing}{}
#(1 2 -4 -86) 
  do: [ :each | Transcript show: each abs printString ; cr ]
> 1
> 2
> 4
> 86
\end{listing}

\begin{itemize}
\item \code{{[} {]}} delimits the block
\item \code{:each} is the block argument
\item \code{each} will take the value of each element of the array
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Class Definition Template}


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

\end{frame}



\begin{frame}[fragile]

\frametitle{Class Definition within the IDE}


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

\end{frame}



\begin{frame}[fragile]

\frametitle{Method Definition}

\begin{itemize}
\item Methods are public
\item Methods are virtual (\textit{i.e.,} looked up at runtime)
\item By default return \code{self}
\end{itemize}

\begin{listing}{}
messageSelectorAndArgumentNames
   "comment stating purpose of message"

  | temporary variable names |
  statements
\end{listing}
\end{frame}



\begin{frame}[fragile]

\frametitle{Method Definition Example}


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

\end{frame}



\begin{frame}[fragile]

\frametitle{Messages Summary}

3 kinds of messages:

\begin{itemize}
\item Unary: \code{Node new}
\item Binary: \code{1+2}, \code{3@4}
\item Keywords: \code{2 between: 10 and: 20}
\end{itemize}

Message Priority:

\begin{itemize}
\item (Msg) \textgreater{} unary \textgreater{} binary \textgreater{} keyword
\item Same-Level messages: from left to right
\end{itemize}
\end{frame}



\begin{frame}[fragile]

\frametitle{Conclusion}

\begin{itemize}
\item Compact syntax
\item Few constructs but really expressive
\item Mainly messages and closures
\item Three kinds of messages
\item Support for Domain Specific Languages
\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:
