## For instruction on writing tutorials
## http://www.ros.org/wiki/WritingTutorials
####################################
##FILL ME IN
####################################
## for a custom note with links:
## note = This tutorial is under construction !
## for the canned note of "This tutorial assumes that you have completed the previous tutorials:" just add the links 
## note.0= 
## descriptive title for the tutorial
## title= Web App Basics 
## description= The basics of making/using Web Apps
## the next tutorial description (optional)
## next =
## links to next tutorial (optional)
## next.0.link=
## next.1.link=
## what level user is this tutorial for 
## level= (BeginnerCategory, IntermediateCategory, AdvancedCategory)
## keywords =
####################################

<<IncludeCSTemplate(TutorialCSHeaderTemplate)>>

<<TableOfContents(4)>>

The easiest way to add functionality to the WebUI is to create a plugin for the WebUI called an App.  These apps can be as simple just a button to  launch a launch file (for example, the tuck arms application) or as complex as having realtime interactive updating from the roscore on the robot (the navigation application).  Furthermore, the web apps can be dynamically added to your website by just adding its package to the ROS_PACKAGE_PATH.

This tutorial will walk you through making the most basic web app, a talker listener.  It will use the standard python talker and display the chatter in the WebUI app.

First, grab an svn copy of this app: 
{{{
 svn co `roslocate svn sample_application`
}}}


= App File Structure =
In order for the WebUI to find and use your application, it must have a specific structure.  First, manifest file must declare a dependency on "webui".  This is used to find the app within the package file.

Next, your application must have an app file with the .app extension. Create sample_application.app  and copy the below into this file.

{{{
name: Sample App
package: sample_application
launch_file: sample_application/talker_listener.launch
description: A sample ROS app to show the structure of an complete application.  It shows how to build a webui and register a plugin.
icon: images/screenshot.png
provides: sample
depends:

}}}

This file declares basic information about the Web app used to generate a standard info page, find the launch file, and control web app runtime dependencies.  Most of these entries are self explanatory.  Name is the app name as it is to be displayed in the GUI.  The launch file specifies the location of the launch file to be triggered.  This path must be package_name/launch_file_package_path. The icon entry gives the path to the icon used to represent the app.  This path is specified from the src/sample_application folder.





   

## AUTOGENERATED DO NOT DELETE 
## TutorialCategory
## FILL IN THE STACK TUTORIAL CATEGORY HERE