-
Notifications
You must be signed in to change notification settings - Fork 1
/
user_docs.html
389 lines (369 loc) · 14.1 KB
/
user_docs.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
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Documentation</h1>
<hr />
<b>[VERSION 1.0]</b> AIRPACT-Fire platforms covered:
Website, Android, and iOS.
<hr />
<p>
Hi, there! Here's a little documentation about our project. If you have
questions which are not answered here, please send an email to one of us
(you can find our contact info in the <b>Developer</b> tab).
</p>
<h2>1. Tutorials</h2>
<h3>1.1. Managing Profile</h3>
<h4>1.1.1. Logging In</h4>
<p>
If you don't already have an account, you're going to want to register for
one <a href="">here</a>.
</p>
<p>
Now, we're going to assume you've already got an account. If you're not
logged in yet, go to the navigation bar at the top of the page (see
Figure 5) and click <i>Login</i> on the right — this will bring you
to a page where you will need to login with your credentials. The page you
see should be the same as in Figure 6.
</p>
<u>
Figure 5. Navigation bar on home page.
</u>
<br />
<u>
Figure 6. Login page.
</u>
<p>
As soon as you login, you'll be brought to your profile page, as you can
see in Figure 7.
</p>
<u>
Figure 7. Profile page.
</u>
<h4>1.1.2. Edit Profile Information</h4>
<p>
Once you're looking at your profile page (Figure 7), click the <i>Edit</i>
button at the top of the content area, directly underneath your <i>Bio</i>.
That'll bring you to the page where you can edit your profile (Figure 8).
Go ahead and edit any of these fields, and once you are done don't forget
to click <i>Submit</i> at the bottom!
</p>
<u>
Figure 8. Edit profile page.
</u>
<h4>1.1.3. Managing Pictures</h4>
<p>
At your profile page (Figure 7), there will be a link labelled
<i>Manage Pictures</i> right above your personal image gallery. Click that.
</p>
<p>
Here's is the control panel (Figure 9) of all the pictures you've taken.
Currently, we only support deleting images, so you can click <i>Delete</i>
on any image you'd like. We recommend only excersizing this functionality
when necessary, because we are primarily interested in collecting your data!
</p>
<u>
Figure 9. Manage pictures control-panel.
</u>
<h3>1.2. Uploading an Image</h3>
<h4>1.2.1. Website [<a href="">video</a>]</h4>
<p>
Before you do anything, you need to log into your account. Please follow
Section 1.1.1 for how to log on to the site.
</p>
<p>
There will be a navigation menu on the left of the main page content, as
seen in Figure 7. Click on <i>Upload</i>, and you will be directed to a
page that looks like Figure 8.
<p>
<u>
Figure 8. Navigation menu.
</u>
<u>
Figure 9. Image upload page.
</u>
<p>
<b>Note:</b> Your site Administrator must certify your account in order for
you to upload an image on the website. Please contact this person if you
are brought to a page saying that your account is not certified.
</p>
<p>
Obviously, first thing you need to do is upload an image. It's a good idea
to visit Section 3.1. to see what types of images we support! Once you've
uploaded a good image, you'll see something like in Figure 9.
</p>
<u>
Figure 10. Uploaded image.
</u>
<p>
But, you're not done yet! You must place the near and far targets on your
image. What you must do here is place the <i>Near Object</i> on a solid natural
object, such as a mountain; then, you must place the <i>Far Object</i> on
a point in the sky, which is hopefully a light blue color (take a look at
Figure 10).
</p>
<u>
Figure 11. Targets correctly placed on uploaded image.
</u>
<p>
Great! now you must add the estimated <i>Visual Range</i> in the image,
which we'll use to compare with our computation. Next, enter the
distance to the <i>Near Target</i> (we're assuming you're good at this).
</p>
<p>
<b>Note:</b> Currently, all distances on the site are in kilometers.
</p>
<p>
Now enter the <i>Location</i> of the image, but first please read Section
3.2 on how to give a nice, descriptive location tag. After that you have
the option of adding a simple description about image, but you should only
do this if there is some information which is missing from the picture
itself that would be useful for researchers to know.
</p>
<p>
Voila! Your image has just been uploaded and you can now view it in the
<a href="">gallery</a>.
</p>
<h4>1.2.2. Android [<a href="">video</a>]</h4>
<p>
First off, make sure you download and install the latest AIRPACT-Fire Android app
<a href="">here</a>. Once you've done that, you're ready to get started!
</p>
<p>
Go ahead and open your app up. It should look something like in Figure 1.
</p>
<u>
Figure 1. App in Android home screen.
</u>
<p>
Once clicked, it may take a little bit to open up the login page
(until then, you may just be staring at a blank white screen for about 10
seconds). The login page will appear (Figure 2) and you will then see the
available <i>Username</i> and <i>Password</i> fields. You will need to be
registered as a user, and that can be done either on the app (by hitting
<i>Register here</i>) or through the website <a href="">here</a>. If you area
have trouble registering, please contact your Administrator.
</p>
<p>
<b>Note:</b> An internet connection is required the first time you login to app.
After that point, you are free to use the app locally (for that particular
username and password).
</p>
<u>
Figure 2. Login screen.
</u>
<p>
Okay, so you've logged in. Cool! Now you have access to all the app's
functionality. Since we're trying to get you to submit a picture, go ahead
and click the <i>Capture</i> button on the top-left of the home screen.
</p>
<u>
Figure 3. Home screen.
</u>
<p>
Following the previous step will open up your default camera app. Take a
picture of the landscape or scene of interest and press the confirmation
button. Please see Section 3.1 for our standard on what images should
contain.
</p>
<p>
You will now see the <i>Select Targets</i> page. Here you will do the
following:
<ol type="a">
<li><i>Algorithm</i> — Select desired visual range algorithm to run on
the image.</li>
<li><i>Select</i> — Place your <i>Low</i> and <i>High</i> targets, with
the <i>Low</i> target being the one placed on the low-contrast point
(e.g. a mountain, tree, etc.), and the <i>High</i> target being placed at
a point dependent on the algorithm you picked. Right now, we have two
options:
<ul>
<li>
<i>Near-Far</i>: The <i>High</i> target would be placed
on a similar low-contrast point, further from the object upon which
the <i>Low</i> target was placed.
</li>
<li>
<i>Near-Sky</i>: The <i>High</i> target would be placed on a point on
the sky almost directly above the low-contrast point.
</li>
</ul>
Once you've got both your targets placed, now comes the tricky part. You
must now estimate the distance of the object under your <i>Low</i>
target. We're assuming you're an expert user (e.g. forest ranger), so this
should be pretty easy for you. You have your choice of distance units,
miles or kilometers.
</li>
<li><i>Submit</i> — Alright, so you've got the main stuff done.
Now, we just need you to enter a custom <i>Location</i> tag to this particular
image. A good example would be "mount baker" if you are at Mount Baker,
or "palouse hills" if you're staring at the Palouse hills. This will be
used to group with other images of both a similar view and location, so
do keep this in mind. Once you've added your location tag, you can add
an optional description about any additional information that would be of
use to either you or your fellow users or data analyst researchers. </li>
</ol>
Depending on your internet connectivity, you can either locally
<i>Queue</i> the image, which allows you to submit the image later in your
local post gallery; or, you could <i>Submit</i> the image, which will
attempt to push the image (along with the accompanying data you've provided)
to the website. You'll see a message indicating the success or failure of
your submission. If it's successful, you can visit the image in website's
<a href="">gallery</a>. Otherwise, it'll just be queued locally. From there,
you can attempt to submit a later time.
</p>
<p>
There you go! If all went well, you've just successfully submitted your
image to the website.
</p>
<h4>1.2.3. iOS</h4>
<p>
<i>Our iOS app is currently under development. Stay tuned for the alpha
build!</i>
</p>
<h3>1.3. Search Gallery</h3>
<p>
Once on the site, make sure you head over to the <a href="">
gallery</a>, which you can also find on the navigation menu as
<i>Gallery</i>. Either way, you will arrive at a page which looks
like Figure 12.
</p>
<u>
Figure 12. Gallery page.
</u>
<p>
Either you can simply browse the gallery manually, moving through the
many pages through the page navigation controls at the bottom, or you can
search through specific types of images using the search tools at the
top (Figure 13). Note that you first must click the button labelled
<i>Show Search Options</i>.
</p>
<u>
Figure 13. Gallery search tools.
</u>
<p>
Here are the fields that can be used when filtering through image posts:
<ol>
<li>Visual range.</li>
<li>Location — this is a user-defined location tag. like
"mount-baker."</li>
<li>Beginning date.</li>
<li>End date.</li>
</ol>
These search fields can be used exclusively or in conjunction, and
furthermore, you can sort posts (ascending or descending) by either
time or visual range.
</p>
<p>
To conduct your search, all you need to do is hit the <i>Search</i> button.
Your results should should up within a second or two.
</p>
<h3>1.4. View Image Data</h3>
<p>
Head over to the website's <a href="">gallery</a> page. Then select any
single image of interest; if you want specific search tools for finding
that image, refer to Section 1.3.
</p>
<p>
Once you've got your image, just click it and you will arrive at a page
that looks just like Figure 14.
</p>
<u>
Figure 14. Image details page.
</u>
<h3>1.5. Post Image from Queue (Android)</h3>
<p>
Make sure you're at the home screen of the app (Figure 3). From the
home screen, hit the <i>Gallery</i> button and you will be brought to a
page like Figure 15.
</p>
<u>
Figure 15. Gallery screen.
</u>
<p>
Okay, so you can see all your posts here (if you don't, you probably
haven't posted anything). Now you need to find your queued post in the
gallery, which will be indicated by a yellow/orange bar directly above the
image. Once you've found the image, click it and you'll be brought to a
page like Figure 16.
</p>
<u>
Figure 16. Post details page.
</u>
<p>
Now, all you've got to do is hit the <i>Submit</i> button and practice
patience as you await a response from the server. If it's successful, then
you'll see a message at the bottom of your screen indicating so. Otherwise,
this message will indicate a failure. If it doesn't work, make sure you've
got a good internet connection and try again. (If you're continuing to see
erros, contact you website's Administrator. They'll be able to see more
clearly what's going on.)
</p>
<p>
Sweet! If all the preceding steps went well for you, then the image should
be successfully removed from your phone's local image gallery.
</p>
<h2>2. API</h2>
<p>
For the API documentation, please download this <a href="">PDF</a>.
</p>
<h2>3. Standards</h2>
<h3>3.1. Images</h3>
<p>
Here are some things that really help us out as we try to process and
analyze the images you submit. Please keep the following things in mind
when capturing an image:
<ul>
<li>Capture your images in daylight. Our algorithms are not suited for
nighttime lighting conditions.</li>
<li>We do not currently support landscape photos. Please keep your phone
completely vertical (portrait mode) when capturing an image.</li>
<li>Avoid facing the sun. If this cannot be avoided, try and find a
positioning of the phone in which the image will contain no "glare."</li>
<li>We recommend taking a picture of natural landscapes (like mountains,
hillsides, forests, etc.) with about 10-20% of the picture containing
open sky (clouds are okay). See Figure 4 for an example of the type of
images we're looking for.</li>
</ul>
</p>
<u>
Figure 4. Camera app on landscape scene.
</u>
<h3>3.2. Location</h3>
<p>
How you specify the location on each of your uploaded image matters quite a bit.
We use this word or phrase to help us group your image with other similar
images of the same scene (but perhaps at different date in times). Doing
this right helps us see trends in (our computed) visual range, which helps
indirectly measure the changes in air quality over time.
</p>
<p>
When giving a location tag, take into account the following:
<ul>
<li>Your absolute position.</li>
<li>The direction you're facing.</li>
</ul>
Here are some examples of good location tags:
<ul>
<li>mount-baker-front</li>
<li>mount-ranier-forest</li>
<li>palouse-hills</li>
<li>moscow-mountain-back</li>
</ul>
</p>
<h2>4. Algorithms</h2>
<h3>4.1. Near-Sky</h3>
<i>The Near-Sky algorithm is currently under development.</i>
<h3>4.2. Near-Far</h3>
<i>TODO</i>
<hr />
<p>
Documentation written by Luke Weber. <br />
Tutorial videos recorded and edited by Brian Soto. <br />
Review pending by Michael Sheremet. <br />
<br />
Last modified 02/26/2017.
</p>
</body>
</html>