1
00:00:00,000 --> 00:00:00,230

2
00:00:00,230 --> 00:00:03,520
>> SPEAKER: Let's implement a web page
using a bit of HTML and JavaScript

3
00:00:03,520 --> 00:00:06,900
that geolocates a user, that is,
figures out where they are

4
00:00:06,900 --> 00:00:10,740
geographically in terms of their
latitude and longitude coordinates.

5
00:00:10,740 --> 00:00:15,430
Notice here as an attribute on my body
tag, I have onload, which specifies a

6
00:00:15,430 --> 00:00:18,340
bit of JavaScript that should get
executed as soon as the body of the

7
00:00:18,340 --> 00:00:19,580
page has loaded.

8
00:00:19,580 --> 00:00:22,660
Now that function appears to be called
geolocate, And that function, I've

9
00:00:22,660 --> 00:00:28,340
begun to implement, up top here in
between script tags called geolocate.

10
00:00:28,340 --> 00:00:30,590
>> Now let's implement this function.

11
00:00:30,590 --> 00:00:34,850
First, let's check if the type
of a special property called

12
00:00:34,850 --> 00:00:42,740
navigator.geolocation does not equal,
quote unquote, "undefined," then I'm

13
00:00:42,740 --> 00:00:44,430
going to do the following.

14
00:00:44,430 --> 00:00:45,680
Navigator.geoloc
ation.getCurrentPosition.

15
00:00:45,680 --> 00:00:49,990

16
00:00:49,990 --> 00:00:53,710
And now I need to specify an argument,
specifically the name of a function

17
00:00:53,710 --> 00:00:57,160
that I'd like to be called when Get
Current Position has figured out where

18
00:00:57,160 --> 00:00:58,300
their user is.

19
00:00:58,300 --> 00:01:02,460
And I'm just going to arbitrarily call
that function for now, callback.

20
00:01:02,460 --> 00:01:06,860
>> Else, if that property was in fact
undefined, I'm going to specify

21
00:01:06,860 --> 00:01:13,520
instead alert "Your browser does
not support geolocation!"

22
00:01:13,520 --> 00:01:14,980
and leave it at that.

23
00:01:14,980 --> 00:01:16,720
So what is it that I typed here?

24
00:01:16,720 --> 00:01:19,620
>> Well, it turns out that most modern
web browsers support a global

25
00:01:19,620 --> 00:01:22,960
variable, an object, so to speak,
called navigator, that has

26
00:01:22,960 --> 00:01:26,430
navigator-specific, that is
browser-specific functionality.

27
00:01:26,430 --> 00:01:30,210
Inside of there is a property called
geolocation which specifically

28
00:01:30,210 --> 00:01:34,010
contains information and functionality
related to the geolocation, the

29
00:01:34,010 --> 00:01:35,580
finding, of users.

30
00:01:35,580 --> 00:01:38,820
>> Inside of that object, meanwhile,
there appears to be a function,

31
00:01:38,820 --> 00:01:41,790
otherwise known has a method,
called Get Current Position.

32
00:01:41,790 --> 00:01:45,750
And that's the function we're using
in order to find a user.

33
00:01:45,750 --> 00:01:48,890
>> Let's though now implement the callback
function that's actually

34
00:01:48,890 --> 00:01:51,730
going to get called when the
user has been located.

35
00:01:51,730 --> 00:01:56,030
Let's go ahead and declare that as well
with function callback and let's

36
00:01:56,030 --> 00:02:00,550
call the argument that I know it will
be receiving say, position.

37
00:02:00,550 --> 00:02:04,020
That is going to be, it turns out, an
object that somehow represents the

38
00:02:04,020 --> 00:02:05,970
user's position in the world.

39
00:02:05,970 --> 00:02:11,890
>> Then inside of this function, let's
output with alert position.coords,

40
00:02:11,890 --> 00:02:15,830
which stands for coordinates, .latitude
and then concatenate on to

41
00:02:15,830 --> 00:02:19,155
that a comma and a space and then on
to that, position.coords.longitude.

42
00:02:19,155 --> 00:02:23,010

43
00:02:23,010 --> 00:02:26,150
>> Let's go ahead and save this file, open
the page in a browser, and see if

44
00:02:26,150 --> 00:02:27,590
we can't find myself.

45
00:02:27,590 --> 00:02:36,190
http://localhost /geolocation-0.html.

46
00:02:36,190 --> 00:02:38,020
And there I am, in Cambridge,
Massachusetts.

47
00:02:38,020 --> 00:02:39,680