PostScript or should I say NotJavaScript

[ipdf/sam.git] / chapters / Background_DOM.tex

diff --git a/chapters/Background_DOM.tex b/chapters/Background_DOM.tex
index de0fe99..494f2b9 100644 (file)
--- a/chapters/Background_DOM.tex
+++ b/chapters/Background_DOM.tex
@@ -20,18 +20,12 @@ var node = document.getElementById("curvedshape"); // Find the node by its uniqu
 node.style.fill = "#000000"; // Change the ``style'' attribute and set the CSS fill colour
 \end{minted}
 
-To illustrate the power of this technique we have produced our own example to generate an SVG interactively using HTML. The example generates successive iterations of a particular type of fractal curve first described by Koch\cite{koch1904surune} in 1904 and a popular example in modern literature \cite{goldman_fractal}. Unfortunately as it is currently not possible to include HTML within a PDF, we are only able to provide some examples of the output as static images in Figure \ref{koch}.
+To illustrate the power of this technique we have produced our own example to generate an SVG interactively using HTML. The example generates successive iterations of a particular type of fractal curve first described by Koch\cite{koch1904surune} in 1904 and a popular example in modern literature \cite{goldman_fractal}. Unfortunately as it is currently possible to directly include W3C HTML in a PDF, we are only able to provide some examples of the output as static images in Figure \ref{koch}.
 
 In HTML5, Javascript is not restricted to merely manipulating the DOM to alter the appearance of a document. The \verb/<canvas>/ tag and associated API provide a means to directly set the values of pixels on a display. This sort of low level API is inteded for performance intensive graphical applications such as web based games\footnote{For an example by the author including both the canvas2d and experimental WebGL APIs see \url{http://rabbitgame.net}}. As Hayes points out, there is some similarity between the \verb/<canvas>/ API and the PostScript interpreted approach to drawing\cite{hayes2012pixelsor}.
 
 \begin{figure}[H]
-\begin{minipage}[t]{0.3\textwidth}
-       \begin{figure}[H]
-       \centering
-       \includegraphics[width=1\textwidth]{figures/shape.pdf}
-       \end{figure}
-\end{minipage}
-\begin{minipage}[t]{0.5\textwidth}
+\begin{minipage}[t]{0.65\textwidth}
 \begin{minted}{xml}
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
@@ -58,6 +52,12 @@ In HTML5, Javascript is not restricted to merely manipulating the DOM to alter t
                stroke:#000000;"/>
 </svg>
 \end{minted}
+\end{minipage}
+\begin{minipage}[t]{0.3\textwidth}
+       \begin{figure}[H]
+       \centering
+       \includegraphics[width=1\textwidth]{figures/shape.pdf}
+       \end{figure}
 \end{minipage}
        \caption{Vector image and a possible SVG representation}\label{SVG}
 \end{figure}