autostudio.tex 3.05 KB
Newer Older
Omran Saleh's avatar
Omran Saleh committed
1
2
3
To provide a more abstraction level,  we have developed a web application called \textbf{AutoStudio}. It is a very user friendly and easy to use web application to run cross-platform using HTML5, Draw2D touch\footnote{\url{http://www.draw2d.org/draw2d/index.html}}, and node.js\footnote{\url{http://www.nodejs.org}}.   AutoStudio has several functionalities:
\begin{itemize}
\item It enables users to leverage the emerging \PipeFlow language graphically via a collection of operators (represented by icons) which could be ``dragged and dropped'' onto a drawing canvas.  The user can assemble the operators in order to create a dataflow graph in a logical way and visually show how they are related, and from this graph, equivalent \PipeFlow script can be generated.  By clicking on the operator icon, a pop-up window appears to let the user specify the parameters of \PipeFlow operators, which are required. Moreover, the user can display the help contents for each operator.  
Omran Saleh's avatar
Omran Saleh committed
4
5
\item Contacting the \PipeFlow  system to generate the right script (e.g., Storm, Spark, or PipeFabric scripts) based upon the user's selection of language from the dashboard page. This makes the user to be not aware of any of stream-processing languages syntax including \PipeFlow and their constructs.  By this application, the user can trigger the execution of the script  through the \PipeFlow system  via calling the respective engine. Moreover, it handles real-time stats including execution and performance results sent by  \PipeFlow system when the script is in execution. When the execution is complete, the application can send an email to the user .
\item It provides the options of saving the generated scripts or flow-designs for future reference, loading the saved script and executing it whenever required. 
Omran Saleh's avatar
Omran Saleh committed
6
7
\item An evaluation tool for the generated scripts where the user is interested  in comparing as well as  evaluating the performance of stream- processing systems in terms of throughput, latency, and resource consumption such as CPU and memory. The evaluation can be performed online using dynamic figures or offline using static figures.
\end{itemize}
Omran Saleh's avatar
Omran Saleh committed
8
AutoStudio prominently uses open source softwares and frameworks. The client side including HTML5, JavaScript, Cascading Style Sheets (CSS),  jQuery (and helping libraries), twitter bootstrap, and hogan.js  is used for building the graphical user interface, performing Ajax requests, file uploading and downloading, etc. AutoStudio extensively uses pre-compiled hogan templates where the data returned from the server is simply passed to these templates for quick rendering. In addition, Draw2D touch is used to enable creation of diagram applications in a browser by creating and manipulating operators and connections.  In the server side, we used a web server suitable for data-intensive real-time applications. Therefore, node.js and its supporting modules such as nodemailer and socket.io were employed.
Omran Saleh's avatar
Omran Saleh committed
9

Omran Saleh's avatar
Omran Saleh committed
10
11
12
13
14
15
\begin{figure}[hb]
  \centering
  \includegraphics[width=3.5in, height = 2in]{autostudio.png}
  \caption
   {Front-end web application: AutoStudio}
\end{figure}
Omran Saleh's avatar
Omran Saleh committed
16