-
Notifications
You must be signed in to change notification settings - Fork 3
/
configure-an-owl-in-one.html
208 lines (202 loc) · 11.3 KB
/
configure-an-owl-in-one.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
<!DOCTYPE HTML>
<html>
<head>
<title>Configure an Owl-in-One | diyActive</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="How to configure a reelyActive Owl-in-One.">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="style/main.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
<script type="text/javascript" src="js/diyactive.js"></script>
</head>
<body ng-app="diyActive">
<div ng-controller="InteractionCtrl">
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle"
ng-init="navCollapsed = true"
ng-click="navCollapsed = !navCollapsed">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="https://www.reelyactive.com">
<strong>reely</strong>Active
</a>
</div>
<div class="collapse navbar-collapse" ng-class="!navCollapsed && 'in'"
ng-click="navCollapsed = true">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="/"> diyActive </a></li>
<li class="dropdown" uib-dropdown on-toggle="toggled(open)">
<a href class="dropdown-toggle" uib-dropdown-toggle role="button"
data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
Quick links <span class="caret"></span>
</a>
<ul class="dropdown-menu" uib-dropdown-menu role="menu">
<li role="menuitem">
<a href="https://github.com/reelyactive/" target="_blank">
reelyActive on GitHub
</a>
</li>
<li role="menuitem">
<a href="https://www.npmjs.com/~reelyactive" target="_blank">
reelyActive on npmjs
</a>
</li>
<li role="separator" class="divider"></li>
<li role="menuitem">
<a href="https://www.reelyactive.com" target="_blank">
reelyActive website
</a>
</li>
<li role="menuitem">
<a href="https://getpareto.com" target="_blank">
Pareto by reelyActive
</a>
</li>
<li role="separator" class="divider"></li>
<li role="menuitem">
<a href="https://shop.reelyactive.com" target="_blank">
Our online store
</a>
</li>
<li role="menuitem">
<a href="https://reelyactive.com/blog/" target="_blank">
Our blog
</a>
</li>
</ul>
</li>
</ul>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3">
<h1>
Configure an Owl-in-One <br>
<small> The reelyActive plug-and-play sensor </small>
</h1>
<p> Our Owl-in-One is designed for ease of use: connect to power and network (via Ethernet) and the real-time data is automatically streamed to our Pareto service (<a href="https://getpareto.com/connect/" target="_blank">instructions</a>). This tutorial covers <i>alternative</i> use cases, the most common being connection to a WiFi network. </p>
<img src="images/owl-in-one-components.jpg"
class="img-responsive center-block"><br>
<div class="well">
<div class="row">
<div class="col-md-8">
<h3> Imagine owl the possibilities </h3>
The Owl-in-One combines the <a href="https://tessel.io/" target="_blank">Tessel 2</a> open hardware/software platform with the reelyActive <a href="reel-overview.html">reel architecture</a> which is compatible with all of <a href="open-source-software.html">our open source software</a>.
</div>
<div class="col-md-4">
<img src="images/osi-oshw.png"
class="img-responsive center-block">
</div>
</div>
</div>
<h2> Prerequisites <br>
<small> Node.js and the Tessel 2 CLI </small> </h2>
<p> The Owl-in-One is built on the Tessel 2 platform which, like our own, runs Node.js software. To configure the Tessel 2 and/or update its software, you'll need both Node.js and the t2-cli package. </p>
<h3> Install Node.js </h3>
<p> Do you have <b>Node.js</b> installed? </p>
<a ng-class="node === true ? 'btn btn-warning' : 'btn btn-default'"
ng-click="node = true"> Yes </a>
<a ng-class="node === false ? 'btn btn-warning' : 'btn btn-default'"
ng-click="node = false"> No </a>
<a class="btn btn-default" ng-click="node = null"> Unsure </a>
<!----- Node.js installed ----->
<div ng-show="node === true">
<h4> You're all set! </h4>
<p> Proceed to install the t2-cli package </p>
</div>
<!----- Install Node.js ----->
<div ng-show="node === false">
<h4> Install Node.js </h4>
<p> Click the button below to access the Node.js downloads page and then select the LTS version (recommended). </p>
<p class="text-center">
<a class="btn btn-primary" href="https://nodejs.org"
target="_blank" role="button"> Install Node.js </a>
</p>
</div>
<!----- Test for Node.js ----->
<div ng-show="node === null">
<h4> Verify if you have Node.js installed </h4>
<p> Open a terminal or command prompt, type <code>node --version</code> and press Enter. </p>
<img src="images/node-version.gif"
class="img-responsive center-block"><br>
<p> If the output is something like <b>vx.x.x</b>, you do indeed have Node.js installed and can click <a ng-click="node = true"><i>Yes</i></a> above. Otherwise click <a ng-click="node = false"><i>No</i></a> above. </p>
</div>
<h3> Install the Tessel 2 Command Line Interface </h3>
<p> Do you have the <b>t2-cli</b> package installed? </p>
<a ng-class="t2 === true ? 'btn btn-warning' : 'btn btn-default'"
ng-click="t2 = true"> Yes </a>
<a ng-class="t2 === false ? 'btn btn-warning' : 'btn btn-default'"
ng-click="t2 = false"> No </a>
<a class="btn btn-default" ng-click="t2 = null"> Unsure </a>
<!----- t2-cli installed ----->
<div ng-show="t2 === true">
<h4> You're all set! </h4>
<p> Proceed to configuration </p>
</div>
<!----- Install t2-cli ----->
<div ng-show="t2 === false">
<h4> Install the t2-cli package </h4>
<p> From the command line, run <code>npm install -g t2-cli</code> to install the t2-cli package. </p>
<p> Should you encounter any errors, see the <a href="https://tessel.github.io/t2-start/" target="_blank">Tessel 2 Start Guide</a> for instructions specific to your operating system. </p>
</div>
<!----- Test for t2-cli ----->
<div ng-show="t2 === null">
<h4> Verify if you have the t2-cli package installed </h4>
<p> Open a terminal or command prompt, type <code>t2 version</code> and press Enter. </p>
<!--<img src="images/t2-version.gif"
class="img-responsive center-block"><br>-->
<p> If the output includes something like <b>INFO t2-cli: x.x.x</b>, you do indeed have the t2-cli package installed and can click <a ng-click="t2 = true"><i>Yes</i></a> above. Otherwise click <a ng-click="t2 = false"><i>No</i></a> above. </p>
</div>
<h2> Connect to a WiFi network <br>
<small> Configure the Owl-in-One as a WiFi client </small> </h2>
<p> <i>First,</i> connect the Owl-in-One to your computer via USB and wait half a minute for it to boot up. </p>
<img src="images/owl-in-one-usb-connect.jpg"
class="img-responsive center-block"><br>
<p> <i>Then,</i> from the command line, type <code>t2 list</code> and you should see your Owl-in-One in the list with a name such as <tt>tesselActive-###</tt> where the number represents the last three digits of the ID on the back sticker. </p>
<p> Configure the WiFi with the following command, substituting the <i>SSID</i> and <i>password</i> as required: </p>
<pre>t2 wifi -n "SSID" -p "password"</pre>
<p> If the WiFi network is in range, and you correctly entered the <i>SSID</i> and <i>password</i>, expect to see <b>INFO Wifi Connected</b> on the command line. You can type <code>t2 wifi</code> for more details about the connection. </p><br>
<h2> Owl-in-One and Pareto: Seamless Integration </h2>
<img src="images/pareto-by-reelyactive.jpg"
class="img-responsive center-block"><br>
<p> Our Pareto platform combines the convenience of SaaS with plug-and-play hardware like the Owl-in-One. </p>
<p class="text-center">
<a class="btn btn-primary" href="https://getpareto.com"
target="_blank" role="button"> Visit getpareto.com </a>
<a class="btn btn-default" href="https://pareto.reelyactive.com"
target="_blank" role="button"> Log in to your account </a>
</p>
<hr>
<h2> What's next? </h2>
<p> Buy an Owl-in-One, learn how to connect a websocket client to Pareto to use the real-time data, or return to the diyActive home page. </p>
<p class="text-center">
<a class="btn btn-default" href="https://shop.reelyactive.com/products/owl-in-one-ble"
role="button"> Buy an Owl-in-One </a>
<a class="btn btn-default" href="pareto-socket-client.html"
role="button"> Connect to Pareto </a>
<a class="btn btn-success" href="/"
role="button"> Return to diyActive </a>
</p>
</div>
</div>
</div>
<footer class="footer">
<a href="/"
uib-tooltip="Do-it-yourself with reelyActive"
tooltip-placement="left"> diyActive </a> |
<a href="https://www.reelyactive.com"
uib-tooltip="We believe in an open Internet of Things"
tooltip-placement="right">
© reelyActive 2017-2018
</a>
</footer>
</div>
</body>
</html>