forked from RobotWebTools/robotwebtools.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
237 lines (236 loc) · 10.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
<html>
<head>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/custom.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="#">Robot Web Tools</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="active"><a href="#about">Home</a></li>
<li><a href="#architecture">Architecture</a></li>
<li><a href="#tools">Tools</a></li>
<li><a href="#tutorials">Tutorials</a></li>
<li><a href="#community">Community</a></li>
</ul>
</div>
</div>
</div>
</div>
<article id="about">
<div class="container">
<h2>Welcome to Robot Web Tools</h2>
<div class="content">
<p class="lead">
Robot Web Tools is a collection of open-source modules and tools for
building web-based robot apps.
</p>
<p>
Robot Web Tools allows web applications to interface with a variety
of robots running middleware like the popular <a
href="http://www.ros.org">Robot Operating System</a> (ROS). The <a
href="#architecture">Robot Web Architecture</a> section contains a
lengthier explanation about ROS and its integration with the web.
</p>
<p>
Check out the <a href="#tools">Tools</a> section for community
developer robot web tools like ros.js, the <a
href="#tutorials">Tutorials</a> section for guides on getting
started, and finally the <a href="#community">Community</a> section
for how to get involved or get help.
</p>
</div>
</div>
</article>
<article id="architecture" >
<div class="container">
<h2>Robot Web Architecture</h2>
<div class="content">
<p>
A variety of routes are available for architecting a robot web
application. A common route is building web technologies on an
existing robot framework. The Robot Operating System (ROS) is one of
the more popular robot middlewares to build upon.
</p>
<p>
ROS is one of the top frameworks to program robots and can run on a
variety of robots, from a <a href="http://turtlebot.com/">TurtleBot</a>
to a <a href="http://www.willowgarage.com/pages/pr2/overview">PR2</a> to
an Arduino connected to a computer. ROS - and other robot middleware
frameworks - provide common robot functionality, including drivers for
interfacing with a variety of sensors and actuators and algorithms for
navigation, perception, and manipulation.
</p>
<p>
While ROS works great for applications on the robot, another layer
is needed to connect external devices and applications, like an
Arduino or web app. Rosbridge is both a JSON spec for interacting
with ROS and a transport layer, providing a WebSocket for clients to
communicate over.
</p>
<p>
In the browser layer sits ros.js, a JavaScript library that
communicates with ROS on the robot over rosbridge's WebSocket
server. It's a lightweight, evented library that provides a
convenient abstraction to core ROS functionality.
</p>
<p>
Ros.js is meant to be a lightweight, core component of the
client-side robot web application. However, the real benefits of the
Robot Web Tools organization is JavaScript modules and tools that
build off these foundations. Check out the <a href="#tools">Tools
section</a> for a list of what the community has contributed. And
please add your own!
</p>
</div>
</div>
</article>
<article id="tools">
<div class="container">
<h2>Tools</h2>
<div class="content">
<p>
Robot Web Tools is a collection of community created tools, from
JavaScript modules that interface with ROS or localize in a 2D map to
deployment tools.
</p>
<p>
Below is a collection of the current tools contributed to by the
community. Feel free to send a pull request and add your own!
</p>
<ul>
<li>
<a href="https://github.com/robotwebtools/rosjs">ros.js</a> - Ros.js
is the core library for exposing ROS-level functionality. It provides
publishing and subscribing to topics, calling services, and listing
params.
</li>
<li>
<a
href="https://github.com/robotwebtools/rosbridge_suite">rosbridge</a>
- Rosbridge is the gateway between ROS and the web. Ros.js
communicates with rosbridge, which translates the JSON to ROS
commands.
</li>
<li>
<a href="https://github.com/RobotWebTools/actionlibjs">actionlib.js</a>
- Actionlib.js behaves as an action client to an <a
href="http://www.ros.org/wiki/actionlib">action server</a> running on
the server or robot.
</li>
<li>
<a href="https://github.com/RobotWebTools/map2djs">map2d.js</a> - A 2D
map of the robot's environment rendered with HTML canvas. Uses ROS'
occupancy grid for data.
</li>
<li>
<a
href="https://github.com/RobotWebTools/keyboardteleopjs">keyboardteleop.js</a>
- Based on keyboard commands, sends direction messages to a robot
using ROS' Twist message.
</li>
<li>
<a href="https://github.com/RobotWebTools/nav2djs">nav2d.js</a> - Tell
the robot to navigate to a specific point on the map.
</li>
<li>
<a
href="https://github.com/RobotWebTools/mjpegcanvasjs">mjpegcanvas.js</a>
- Displays video from the robot by displaying the robot's <a
href="http://www.ros.org/wiki/mjpeg_server">video stream</a>.
</li>
</ul>
</div>
</div>
</article>
<article id="tutorials">
<div class="container">
<h2>Tutorials</h2>
<div class="content">
<p>
Luckily, Robot Web Tools is more than just software. There's a great
deal of tutorials and documentation contributed by the community, to
help get you started, like:
</p>
<ul>
<li>
<a href="http://www.ros.org/wiki/ROS/Introduction">Introduction to
ROS</a> - While not web specific, ros.org provides a great
introduction to the concepts of the Robot Operating System.
</li>
<li>
<a href="http://www.ros.org/wiki/ROS/Tutorials">Programming
ROS</a> - This series of tutorials gets you started on creating
your own ROS nodes on the robot in C++ or Python. Not necessary
for creating a web application, but a great resource to better
understand ROS concepts.
</li>
<li>
<a href="http://rosbridge.org/doku.php?id=tutorials:ardrone">AR
Drone with ros.js</a> - The tutorial covers how to use rosbridge
and ros.js to control an <a href="http://ardrone.com">AR Drone</a>
from the web browser.
</li>
</ul>
</div>
</div>
</article>
<article id="community">
<div class="container">
<h2>Community</h2>
<div class="content">
<p>
Robotics can be intimidating. The Robot Web Tools community goal is
to make robots more accessible to all. There's a few ways you can
get involved or get help:
</p>
<ul>
<li>
Ask Questions - We have a <a
href="https://groups.google.com/forum/?fromgroups#!forum/robot-web-tools">Robot
Web Tools Google Group</a>, frequented by roboticists and web
developers. For ROS-specific questions, there's an excellent
question and answer site <a
href="http://answers.ros.org">answers.ros.org</a>.
</li>
<li>
Submit bugs - Most of the repos are hosted on GitHub or another
developer friendly code host. Please submit issues, feature
requests, and more. It also helps to explain your use case. Even
better, send a pull request with your patch!
</li>
<li>
Add your projects - Robot Web Tools is contributed to by students,
hobbyists, and professionals. If you have a module, library, or
project you'd like included, just <a
href="https://github.com/RobotWebTools/robotwebtools.github.com">send
a pull request</a> for this
site.
</li>
</ul>
</div>
</div>
</article>
<footer>
<div class="container">
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">
<img alt="Creative Commons License" style="border-width:0"
src="http://i.creativecommons.org/l/by/3.0/80x15.png" />
</a>
<br />
<span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">Robot
Web Tools</span> is licensed under a <a rel="license"
href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Creative
Commons Attribution 3.0 Unported License</a>.<br />Based on a work at
<a xmlns:dct="http://purl.org/dc/terms/"
href="https://github.com/RobotWebTools/robotwebtools.github.com"
rel="dct:source">https://github.com/RobotWebTools/robotwebtools.github.com</a>.
</div>
</footer>
</body>
</html>