OVERVIEW
In the sample zip file, in the 'static' folder, there is a file called 'app.xml'. This file holds the html code for your Hangouts Extension. It is, strictly speaking, not an html file. It has a header and footer that are xml code, and then a CDATA section that holds html styled code. There is no 'body' tag and no 'head' tag, but there's html code that the Hangout presents inside the browser window beside the Hangout video screen. It is challenging to edit this file, as it is organized in two types of markup. Also in this file is all the javascript that you want to include in your project.
I wanted to edit my html in a separate file. That way I could load it into a browser locally and find out what my page was going to look like to some degree. This would keep the number of unnecessary deployments to a minimum. I also wanted to edit my javascript in a separate file. I wanted the advantages of using an editor that had context highlighting. What I ended up doing was to edit the files separately, and then concatenating them together into one file using a simple bash script. The bash script needed to be run every time the files were edited, or just before a deployment.
The app is basically contained in the app.xml file. It does reference several other files in the same directory. These are javascript libraries like the one for ros, and graphics files in the png format. The app.xml file, and the path to that file, are referenced in the Hangouts API console. This is the crucial reference that the Hangout uses to display the extension. You need an App Engine account and you need to create an App Engine project before you can enable the Hangout extension or even see the screen where the app.xml file url goes. You can, however, read about this console here.
Sunday, November 24, 2013
Details
GIT FILE STRUCTURE
I'm using git and debian 'jessie' for my development environment. The git repository is google code. The repository name is telenp. The organization of the repository is not standard, but it's exceedingly simple. There is one folder called 'telenp'. Inside that folder are the different project-folders that the project might call for. One is the 'awesometelenp' folder. The 'awesometelenp' folder holds the code that is both the Google Hangouts Extension and the App Engine App. This is because the Google App Engine is used in this project to host the Hangouts extension code.
It is anticipated that there will be at least one more folder in the telenp folder. This will be for the ROS node that will pass instructions off from the Hangouts screen to the Turtlebot motors. This node, though not strictly necessary, would make sure that each instruction to the Turtlebot came with sequence numbers. This sub-project should be called something like 'turtlebot_tele_presence' as the robot is meant to act as a telepresence robot.
Another prospective folder might be the 'turtlebot_tele_presence_kinect' folder. This node might be used to filter kinect data. A diagram for the file structure follows.
APP ENGINE
To edit the code from the Google Hangout Extension, on the same computer change directory to the folder '~/telenp/awesometelenp/'. There you can edit the various files used in the Extension. To upload them to the App Engine instance, type the following:
RE-USE
To use the ROS node, you would download the code and compile it and make sure it's on the path (ROS_PACKAGE_PATH) and then compile and use it. There is nothing special about it except that it is for use with the Turtlebot.
To use the other part of the project, especially the contents of the 'awesometelenp' folder, for your own project, you must change the name of the project to something else, and then edit the app.yaml file to reflect the name change. The 'awesometelenp' project is something that I set up with Google App Engine, but you can change the name to something else and register it yourself as your own project.
I'm using git and debian 'jessie' for my development environment. The git repository is google code. The repository name is telenp. The organization of the repository is not standard, but it's exceedingly simple. There is one folder called 'telenp'. Inside that folder are the different project-folders that the project might call for. One is the 'awesometelenp' folder. The 'awesometelenp' folder holds the code that is both the Google Hangouts Extension and the App Engine App. This is because the Google App Engine is used in this project to host the Hangouts extension code.
It is anticipated that there will be at least one more folder in the telenp folder. This will be for the ROS node that will pass instructions off from the Hangouts screen to the Turtlebot motors. This node, though not strictly necessary, would make sure that each instruction to the Turtlebot came with sequence numbers. This sub-project should be called something like 'turtlebot_tele_presence' as the robot is meant to act as a telepresence robot.
Another prospective folder might be the 'turtlebot_tele_presence_kinect' folder. This node might be used to filter kinect data. A diagram for the file structure follows.
- telenp/
- awesometelenp/
- turtlebot_tele_presence/
- turtlebot_tele_presence_kinect/
/home/<username>/telenp/turtlebot_tele_presence/This way you can work on the project, commit changes etc., and have the working node in your ros setup.
APP ENGINE
To edit the code from the Google Hangout Extension, on the same computer change directory to the folder '~/telenp/awesometelenp/'. There you can edit the various files used in the Extension. To upload them to the App Engine instance, type the following:
$ appcfg.py update .There is a space and a dot at the end of the command line. This works if you're in the 'awesometelenp' folder. You must have the google python package installed on your system. This is found here.
RE-USE
To use the ROS node, you would download the code and compile it and make sure it's on the path (ROS_PACKAGE_PATH) and then compile and use it. There is nothing special about it except that it is for use with the Turtlebot.
To use the other part of the project, especially the contents of the 'awesometelenp' folder, for your own project, you must change the name of the project to something else, and then edit the app.yaml file to reflect the name change. The 'awesometelenp' project is something that I set up with Google App Engine, but you can change the name to something else and register it yourself as your own project.
Saturday, November 23, 2013
Start Coding
ROSBRIDGE JAVASCRIPT
One component of rosbridge is a javascript library. The library makes it easier to post topics and messages in the ROS environment. I began to work on the javascript part of the project before I actually had the turtlebot robot at all. I'm not entirely comfortable with javascript, so the process was challenging for me.
BACKGROUND
The first thing I did was to create the appengine project, as suggested by the google links here and here. I downloaded the python google appengine management package. This package has 'appcfg.py' in it, which is an important python file that uploads your appengine project to the web. (You can get that here.) Then I downloaded the sample hangout project, which I would use as a template in for my project. This sample file can be found here.
Before deploying I edited my app.yaml file. Then I began editing the files in the 'static' sub directory. During this process I deployed my extension several times to see that it was working. I began editing the html and javascript files that came with the sample project.
MISTAKE
Here is where I first used the rosbridge javascript library. Without thinking I included that library in the html using 'script' tags. Then I went back and edited my javascript file. I included the file I had written in the html file, with the assumption that it would be able to reference the rosbridge library that had already been included.
Here's the point. I didn't know enough javascript and html to know that I would have to do more than just include the two files in the same html file. What I had to do was first reference the javascript rosbridge library in the top of the file, and then copy and paste the text from my personal javascript library into the html file - between script tags - in a position below the rosbridge reference. This was something of a revelation to me, and only after doing that did my use of the rosbridge library begin to work.
One component of rosbridge is a javascript library. The library makes it easier to post topics and messages in the ROS environment. I began to work on the javascript part of the project before I actually had the turtlebot robot at all. I'm not entirely comfortable with javascript, so the process was challenging for me.
BACKGROUND
The first thing I did was to create the appengine project, as suggested by the google links here and here. I downloaded the python google appengine management package. This package has 'appcfg.py' in it, which is an important python file that uploads your appengine project to the web. (You can get that here.) Then I downloaded the sample hangout project, which I would use as a template in for my project. This sample file can be found here.
Before deploying I edited my app.yaml file. Then I began editing the files in the 'static' sub directory. During this process I deployed my extension several times to see that it was working. I began editing the html and javascript files that came with the sample project.
MISTAKE
Here is where I first used the rosbridge javascript library. Without thinking I included that library in the html using 'script' tags. Then I went back and edited my javascript file. I included the file I had written in the html file, with the assumption that it would be able to reference the rosbridge library that had already been included.
Here's the point. I didn't know enough javascript and html to know that I would have to do more than just include the two files in the same html file. What I had to do was first reference the javascript rosbridge library in the top of the file, and then copy and paste the text from my personal javascript library into the html file - between script tags - in a position below the rosbridge reference. This was something of a revelation to me, and only after doing that did my use of the rosbridge library begin to work.
Tuesday, November 12, 2013
new blog
GENERAL
I wanted an independent study project for Spring 2014 in the Computer Science department at my college. They had a Turtlebot robot outfitted with ROS (Robot Operating System). I proposed that I implement a telepresence robot with that hardware and using the Google+ Hangout platform to transmit audio and video. This robot was supposed to allow a user to navigate a remote area while the operator was physically located some distance away. The project idea was accepted, and this blog has been created to chronicle the progress I make.
The Spring 2014 semester has not started yet, but I've made some small progress on the project.
There is a Google Hangouts API that allows you to develop 'Extensions' for the Hangout platform. I investigated this. The Hangouts API requires that the code for the Extension be hosted on some web server. In the documentation they suggest Google App Engine, so I use App Engine as my serving location.
I also investigated Google Code Project Hosting for my code repository. For the code repository I use Git version control.
The names of these various components follow. The app Extension on Google Hangouts is called 'Tele NP'. As of this writing it is in the 'development' stage, so it is not available to any app user. The App Engine serving component is called 'awesometelenp.appspot.com'. If you navigate to this URL you see a cryptic message on the screen because the server is configured to work with Google Hangouts exclusively. The project hosting is called 'https://code.google.com/p/telenp/' or 'telenp'.
CODING
The Google Hangouts Extensions are written in Javascript, and the App Engine can host code in Python or Java. ROS code is written in C++ or Python, so I'm hoping to use the languages Javascript and Python almost exclusively. I'm hoping not to program in Java or C++.
The Javascript in Hangouts is run locally on the computer end node for that hangout but there is a provision for passing info from one computer to the group in the hangout. Also there's a provision for monitoring information that is broadcast by any one computer in the group to the rest of the group. This is accomplished by including a specific Javascript library from Google in your code.
The Hangout will automatically transmit the video and audio information from one computer to another, so all that is left to do is to transmit instructions from one computer to another regarding how to move the turtlebot. The Google Javascript library can take care of getting the instructions from a remote computer, and all that is left to do is to transmit those instructions to the hardware.
ROS is installed on the turtlebot, and that should be able to control the wheels of the robot. What we need to do then is to get the instructions from the javascript in the Extension to the ROS framework for robot movement. We hope to do this with a ROS library called 'rosbridge'. At this writing I have not tested rosbridge, but it uses web sockets to interact between the Extension (or any javascript) and the ROS operating system.
This is a simplified picture of how I want to proceed with the project. I may want to add my own ROS node to control more finely how ROS uses the Hangout data, but if I do this it will be after testing the simpler situation where no special ROS node is required.
I wanted an independent study project for Spring 2014 in the Computer Science department at my college. They had a Turtlebot robot outfitted with ROS (Robot Operating System). I proposed that I implement a telepresence robot with that hardware and using the Google+ Hangout platform to transmit audio and video. This robot was supposed to allow a user to navigate a remote area while the operator was physically located some distance away. The project idea was accepted, and this blog has been created to chronicle the progress I make.
The Spring 2014 semester has not started yet, but I've made some small progress on the project.
There is a Google Hangouts API that allows you to develop 'Extensions' for the Hangout platform. I investigated this. The Hangouts API requires that the code for the Extension be hosted on some web server. In the documentation they suggest Google App Engine, so I use App Engine as my serving location.
I also investigated Google Code Project Hosting for my code repository. For the code repository I use Git version control.
The names of these various components follow. The app Extension on Google Hangouts is called 'Tele NP'. As of this writing it is in the 'development' stage, so it is not available to any app user. The App Engine serving component is called 'awesometelenp.appspot.com'. If you navigate to this URL you see a cryptic message on the screen because the server is configured to work with Google Hangouts exclusively. The project hosting is called 'https://code.google.com/p/telenp/' or 'telenp'.
CODING
The Google Hangouts Extensions are written in Javascript, and the App Engine can host code in Python or Java. ROS code is written in C++ or Python, so I'm hoping to use the languages Javascript and Python almost exclusively. I'm hoping not to program in Java or C++.
The Javascript in Hangouts is run locally on the computer end node for that hangout but there is a provision for passing info from one computer to the group in the hangout. Also there's a provision for monitoring information that is broadcast by any one computer in the group to the rest of the group. This is accomplished by including a specific Javascript library from Google in your code.
The Hangout will automatically transmit the video and audio information from one computer to another, so all that is left to do is to transmit instructions from one computer to another regarding how to move the turtlebot. The Google Javascript library can take care of getting the instructions from a remote computer, and all that is left to do is to transmit those instructions to the hardware.
ROS is installed on the turtlebot, and that should be able to control the wheels of the robot. What we need to do then is to get the instructions from the javascript in the Extension to the ROS framework for robot movement. We hope to do this with a ROS library called 'rosbridge'. At this writing I have not tested rosbridge, but it uses web sockets to interact between the Extension (or any javascript) and the ROS operating system.
This is a simplified picture of how I want to proceed with the project. I may want to add my own ROS node to control more finely how ROS uses the Hangout data, but if I do this it will be after testing the simpler situation where no special ROS node is required.
Subscribe to:
Posts (Atom)