From: Mart Lubbers Date: Mon, 25 Sep 2023 13:40:26 +0000 (+0200) Subject: initial version of lay talk X-Git-Url: https://git.martlubbers.net/?a=commitdiff_plain;h=176f89c0e0c4868ac6987ce1cc8bd71e783e960e;p=phd-thesis.git initial version of lay talk --- diff --git a/img/blte.png b/img/blte.png new file mode 100644 index 0000000..9e1fa54 Binary files /dev/null and b/img/blte.png differ diff --git a/img/chrome.png b/img/chrome.png new file mode 100644 index 0000000..d017b63 Binary files /dev/null and b/img/chrome.png differ diff --git a/img/cloud.png b/img/cloud.png new file mode 100644 index 0000000..edf4421 Binary files /dev/null and b/img/cloud.png differ diff --git a/img/ff.png b/img/ff.png new file mode 100644 index 0000000..8d2096d Binary files /dev/null and b/img/ff.png differ diff --git a/img/gsm.jpg b/img/gsm.jpg new file mode 100644 index 0000000..0b8dc45 Binary files /dev/null and b/img/gsm.jpg differ diff --git a/img/iot.png b/img/iot.png new file mode 100644 index 0000000..fde16ee Binary files /dev/null and b/img/iot.png differ diff --git a/img/itasks.png b/img/itasks.png new file mode 100644 index 0000000..055b482 Binary files /dev/null and b/img/itasks.png differ diff --git a/img/lamp.png b/img/lamp.png new file mode 100644 index 0000000..68b3cc8 Binary files /dev/null and b/img/lamp.png differ diff --git a/img/laptop.png b/img/laptop.png new file mode 100644 index 0000000..76d0879 Binary files /dev/null and b/img/laptop.png differ diff --git a/img/lora.png b/img/lora.png new file mode 100644 index 0000000..24c5f2e Binary files /dev/null and b/img/lora.png differ diff --git a/img/magn.png b/img/magn.png new file mode 100644 index 0000000..83ce3d5 Binary files /dev/null and b/img/magn.png differ diff --git a/img/mail.png b/img/mail.png new file mode 100644 index 0000000..3622214 Binary files /dev/null and b/img/mail.png differ diff --git a/img/mcu.jpeg b/img/mcu.jpeg new file mode 100644 index 0000000..0776bcf Binary files /dev/null and b/img/mcu.jpeg differ diff --git a/img/orchestra.png b/img/orchestra.png new file mode 100644 index 0000000..d74c82d Binary files /dev/null and b/img/orchestra.png differ diff --git a/img/phone.png b/img/phone.png new file mode 100644 index 0000000..bbb4518 Binary files /dev/null and b/img/phone.png differ diff --git a/img/pi.jpg b/img/pi.jpg new file mode 100644 index 0000000..e075c6a Binary files /dev/null and b/img/pi.jpg differ diff --git a/img/pir.jpg b/img/pir.jpg new file mode 100644 index 0000000..d9d8a87 Binary files /dev/null and b/img/pir.jpg differ diff --git a/img/server.png b/img/server.png new file mode 100644 index 0000000..3cd348e Binary files /dev/null and b/img/server.png differ diff --git a/img/spaghetti.jpg b/img/spaghetti.jpg new file mode 100644 index 0000000..e45bb2b Binary files /dev/null and b/img/spaghetti.jpg differ diff --git a/img/stepper.jpg b/img/stepper.jpg new file mode 100644 index 0000000..307fb0f Binary files /dev/null and b/img/stepper.jpg differ diff --git a/img/tablet.png b/img/tablet.png new file mode 100644 index 0000000..6a3927b Binary files /dev/null and b/img/tablet.png differ diff --git a/img/wifi.png b/img/wifi.png new file mode 100644 index 0000000..c3e2619 Binary files /dev/null and b/img/wifi.png differ diff --git a/talk.tex b/talk.tex index 9be7da0..5949b87 100644 --- a/talk.tex +++ b/talk.tex @@ -1,21 +1,27 @@ -\documentclass[aspectratio=169]{beamer} +\documentclass[aspectratio=169,ignorenonframetext,hyperref={pdfpagelabels=false}]{beamer} \usepackage[utf8]{inputenc} +\usepackage[T1,T2A]{fontenc} +\usepackage[british]{babel} \usepackage{relsize} +\usepackage{tikz} +\usetikzlibrary{pie,positioning,shapes,automata,fit,shadows,matrix,backgrounds,shapes.geometric} \graphicspath{{./img}} \beamertemplatenavigationsymbolsempty% \urlstyle{same} +\usefonttheme{serif} +\newcommand{\IOT}{\texorpdfstring{Io\kern-1ptT}{IoT}} % Add slide numbers -\setbeamertemplate{footline}{% - \quad% - \usebeamercolor[fg]{page number in head/foot}% - \usebeamerfont{page number in head/foot}% - \insertframenumber% - \kern1em\vspace{2pt}% -} +%\setbeamertemplate{footline}{% +% \quad% +% \usebeamercolor[fg]{page number in head/foot}% +% \usebeamerfont{page number in head/foot}% +% \insertframenumber% +% \vspace{2mm} +%} \title{\texorpdfstring{\larger[2]}{}Orchestrating the Internet of Things\texorpdfstring{\\}{\ }with Task-Oriented Programming} \subtitle{\texorpdfstring{\larger[2]}{}a purely functional rhapsody} @@ -28,16 +34,167 @@ \maketitle \end{frame} -\begin{frame}{Internet of Things (IoT)}{A layered heterogeneous distributed system} - +\begin{frame}[plain] + \begin{figure} + \centering + \includegraphics[height=.95\textheight]{iot}\\ +% {\tiny \url{https://freesvg.org/internet-world} (CC 0)} + \end{figure} \end{frame} -\begin{frame}{Tierless programming} +\begin{frame}[plain] + \begin{figure} + \centering + \begin{tikzpicture}[node distance=3em,nodes={rectangle,draw,minimum width=12em, minimum height=3em}] + \begin{uncoverenv}<2-> + \node (1) [] {presentation \begin{uncoverenv}<4->\includegraphics[height=2em]{phone}\end{uncoverenv}}; + \node (2) [below=of 1] {application \begin{uncoverenv}<6->\includegraphics[height=2em]{laptop}\end{uncoverenv}}; + \node (3) [below=of 2] {perception \begin{uncoverenv}<7->\includegraphics[height=2em]{lamp}\includegraphics<7->[height=2em]{magn}\end{uncoverenv}}; + + \draw [<->] (1) -- (2); + \draw [<->] (2) -- (3); + + \draw [fill=white] + ([xshift=1em,yshift=-2em]1.south west) + -- ([xshift=1em,yshift=-1em]1.south west) + -- ([yshift=-1em,xshift=1em]1.south east) + -- ([xshift=1em]1.north east) + -- ([xshift=5em]1.north east) + -- node [draw=none,midway,sloped,below,yshift=-2pt] {\large network \begin{uncoverenv}<9->\includegraphics[height=2em,origin=c,angle=90]{mail}\end{uncoverenv}} ([xshift=5em]3.south east) + -- ([xshift=1em]3.south east) + -- ([yshift=1em,xshift=1em]3.north east) + -- ([xshift=1em,yshift=1em]3.north west) + -- ([xshift=1em,yshift=2em]3.north west) + -- ([yshift=2em,xshift=1em]3.north east) + -- ([yshift=-2em,xshift=1em]1.south east) + -- cycle; + + \draw [densely dotted] (1.south) -- (2.north); + \draw [densely dotted] (2.south) -- (3.north); + \end{uncoverenv} + + \node<1-2> (text) [draw=none,fit=(1) (2) (3),xshift=20em] {}; + \node<1-2> [draw=none] at (text.center) {\includegraphics[width=11em]{iot}}; + \node<3-8> (text) [fit=(1) (2) (3),xshift=20em] {}; + \node<3> [draw=none,align=left] at (text.center) {% + \includegraphics[width=3em]{ff}% + \includegraphics[width=3em]{chrome}% + \includegraphics[width=3em]{phone}\\ + \includegraphics[width=9em]{tablet} + }; + \node<4-5> [draw=none,align=left] at (text.center) {% + \includegraphics[width=5.5em]{laptop}% + \includegraphics[width=5.5em]{cloud}\\ + \begin{uncoverenv}<5> + \includegraphics[width=11em]{server} + \end{uncoverenv} + }; + \node<6> [draw=none,align=left] at (text.center) {% + \includegraphics[width=5.5em]{mcu} + \includegraphics[width=5.5em]{pi}\\ + \includegraphics[width=5.5em]{pir} + \includegraphics[width=5.5em]{stepper} + }; + \node<7-8> [draw=none,align=left] at (text.center) {% + \includegraphics[width=4em]{wifi}\\ + \includegraphics[width=11em]{gsm}\\ + \begin{uncoverenv}<8> + \includegraphics[width=5.5em]{lora}% + \includegraphics[width=5.5em]{blte} + \end{uncoverenv} + }; + \uncover<9->{% + \node [draw=none] at (text.center) {% + \includegraphics<10>[height=15em,width=11em,keepaspectratio]{spaghetti}% + \includegraphics<11->[height=15em,width=11em,keepaspectratio]{orchestra} + }; + } + \draw<3> [line width=1.5pt,densely dotted](1.north east) -- (text.north west); + \draw<3> [line width=1.5pt,densely dotted](1.south east) -- (text.south west); + \draw<4-5> [line width=1.5pt,densely dotted](2.north east) -- (text.north west); + \draw<4-5> [line width=1.5pt,densely dotted](2.south east) -- (text.south west); + \draw<6> [line width=1.5pt,densely dotted](3.north east) -- (text.north west); + \draw<6> [line width=1.5pt,densely dotted](3.south east) -- (text.south west); + \draw<7-8> [line width=1.5pt,densely dotted]([xshift=3em]1.north east) -- (text.north west); + \draw<7-8> [line width=1.5pt,densely dotted]([xshift=3em]3.south east) -- (text.south west); + \end{tikzpicture} + \end{figure} + \uncover<9->{% + \begin{center} + \Huge \strut\only<-10>{Driven by software}\only<12>{Task-Oriented Programming} + \end{center} + } \end{frame} -\begin{frame}{Task-oriented programming (TOP)} +\begin{frame}[shrink] + \begin{columns}[t] + \begin{column}{.4\textwidth} + \begin{block}{Task-oriented programming} + \begin{itemize} + \item Task + \begin{itemize} + \item Abstraction over work + \end{itemize} + \item Declarative programming + + \begin{itemize} + \item Focus on \emph{What} and not \emph{How}. + \end{itemize} + \item<2-> mTask: Domain-specific language + + \begin{itemize} + \item Constrained TOP language for small computers. + \end{itemize} + \item<4-> iTask: TOP for the web + \item<6-> Tierless programming + \begin{itemize} + \item Maintainability + \item Security + \item Interoperability + \end{itemize} + \end{itemize} + \end{block} + \end{column} + \begin{column}{.6\textwidth} + \begin{figure} + \begin{tikzpicture}[node distance=3em,nodes={rectangle,draw,minimum width=10em, minimum height=3em}] + \node (1) [] {presentation \includegraphics[height=1em]{phone}}; + \node (2) [below=of 1] {application \includegraphics[height=1em]{laptop}}; + \node (3) [below=of 2] {perception \includegraphics[height=1em]{lamp}\includegraphics[height=1em]{magn}}; + + \draw [<->] (1) -- (2); + \draw [<->] (2) -- (3); + + \draw [fill=white] + ([xshift=1em,yshift=-2em]1.south west) + -- ([xshift=1em,yshift=-1em]1.south west) + -- ([yshift=-1em,xshift=1em]1.south east) + -- ([xshift=1em]1.north east) + -- ([xshift=4em]1.north east) + -- node (net) [draw=none,midway,sloped,below,yshift=-2pt] {\large network \includegraphics[height=1em,origin=c,angle=90]{mail}} ([xshift=4em]3.south east) + -- ([xshift=1em]3.south east) + -- ([yshift=1em,xshift=1em]3.north east) + -- ([xshift=1em,yshift=1em]3.north west) + -- ([xshift=1em,yshift=2em]3.north west) + -- ([yshift=2em,xshift=1em]3.north east) + -- ([yshift=-2em,xshift=1em]1.south east) + -- cycle; + + \draw [densely dotted] (1.south) -- (2.north); + \draw<-2> [densely dotted] (2.south) -- (3.north); + + \begin{uncoverenv}<3-> + \node (mtask) [dotted,line width=3pt,fit={(3)},label={[fill=white]\large\bf mTask}] {}; + \end{uncoverenv} + \begin{uncoverenv}<5-> + \node (itask) [densely dotted,line width=2pt,inner sep=1em,fit={(1) (2) (3) ([xshift=5em]1.north east)},label=above:{\large\bf iTask}] {}; + \end{uncoverenv} + \end{tikzpicture} + \end{figure} + \end{column} + \end{columns} \end{frame} \end{document}