1
00:00:00,870 --> 00:00:06,510
All right guys so up to this point we've gone over all the absolute basics and the javascript language

2
00:00:06,520 --> 00:00:12,300
so things like variables and data types conditionals functions loops in the next section we're going

3
00:00:12,300 --> 00:00:18,990
to start to get into the DOM of the document object model where we'll learn how to select elements in

4
00:00:18,990 --> 00:00:26,100
the DOM how to change them how to work with them style things work with events traverse the dorm.

5
00:00:26,130 --> 00:00:31,590
So basically working with the UI up to this point we've been just dealing with the core language and

6
00:00:31,590 --> 00:00:35,250
using the console as an output to see the results.

7
00:00:35,250 --> 00:00:35,580
All right.

8
00:00:35,580 --> 00:00:41,520
Now before we get into the DOM in the next section I just want to take a few minutes to talk about and

9
00:00:41,520 --> 00:00:43,360
look at the window object.

10
00:00:43,380 --> 00:00:47,160
All right because the document object is actually part of the window object.

11
00:00:47,310 --> 00:00:53,400
As with many other things the window is the global object in client side javascript.

12
00:00:53,400 --> 00:00:56,490
Now I know many of you probably aren't familiar with No.

13
00:00:56,530 --> 00:00:59,450
Yes I know a lot of you are but many of you are not.

14
00:00:59,550 --> 00:01:06,480
And what it is is it's a javascript runtime that runs as a standalone process on your machine and your

15
00:01:06,480 --> 00:01:07,290
computer.

16
00:01:07,380 --> 00:01:14,730
All right so your system your computer system is your environment in no J.S. while in client side javascript

17
00:01:15,060 --> 00:01:21,730
which is what this course is about the window or the browser is the global environment.

18
00:01:21,860 --> 00:01:22,330
OK.

19
00:01:22,350 --> 00:01:29,010
And what's cool is no J S and Chrome both use the same javascript engine called V8 and it works the

20
00:01:29,010 --> 00:01:31,650
same way just in different environments.

21
00:01:31,650 --> 00:01:33,860
Now the window object has a lot to it.

22
00:01:33,900 --> 00:01:41,820
Ok things that use well things that javascript developers use all the time like local storage the new

23
00:01:41,820 --> 00:01:49,470
fecche API the navigator object which includes geolocation and then and even includes methods like alert

24
00:01:49,500 --> 00:01:50,930
and prompt and.

25
00:01:50,930 --> 00:01:54,320
So I want to take a look at some of these properties and methods.

26
00:01:54,320 --> 00:02:00,960
All right now if we were to go over here in the console and just typed in window and then click this

27
00:02:00,960 --> 00:02:06,030
little arrow you can see all the different parts of windows including the alert method.

28
00:02:06,570 --> 00:02:12,390
If we go down here you'll see like clear interval clear time out will get into that stuff later on we

29
00:02:12,390 --> 00:02:14,880
can close the window with the Close method.

30
00:02:15,060 --> 00:02:16,280
You can see the document.

31
00:02:16,290 --> 00:02:20,010
This is actually the into the document object.

32
00:02:20,010 --> 00:02:27,240
So the core of the dom fetch which is the fecche API to make each UDP requests.

33
00:02:27,240 --> 00:02:33,750
We also have to see if we can get like the inner hign inner width of the window which will take a look

34
00:02:33,750 --> 00:02:35,490
at local storage.

35
00:02:35,490 --> 00:02:38,150
That whole API is in the window object.

36
00:02:38,310 --> 00:02:44,460
So Navigator which is stuff that has to do with the browser which will take a look at all of the events

37
00:02:44,460 --> 00:02:45,600
that are available.

38
00:02:45,630 --> 00:02:48,420
So it has a lot to it.

39
00:02:48,540 --> 00:03:00,280
All right so what we'll do is over here let's say window methods objects and properties.

40
00:03:00,310 --> 00:03:00,610
Right.

41
00:03:00,630 --> 00:03:06,850
So even if we were even if we do a console log like let's say console log 1 to 3.

42
00:03:06,870 --> 00:03:09,990
We could even do window console log.

43
00:03:10,290 --> 00:03:10,680
OK.

44
00:03:10,680 --> 00:03:13,780
Now nobody really does that because there's no need to.

45
00:03:13,830 --> 00:03:20,950
We're at the top of the window object so we don't we don't need that but it is part of the window.

46
00:03:20,970 --> 00:03:29,610
So a couple of things I want to go over our alert prompt and confirm now alert is basically just that

47
00:03:29,610 --> 00:03:37,950
it's a little box that pops up with an alert so we can say window dot alert and we'll just say hello

48
00:03:37,950 --> 00:03:42,510
world and save and run and we get this little pop up that says Hello world.

49
00:03:42,510 --> 00:03:48,980
Now most of the time you won't see the window here so it will be just alert and that works just fine.

50
00:03:48,990 --> 00:03:49,370
All right.

51
00:03:49,380 --> 00:03:53,480
So I want to comment that though let's also get rid of this console log right here.

52
00:03:53,490 --> 00:03:55,140
Don't need that.

53
00:03:55,200 --> 00:04:03,650
So in addition to alert we have prompt so prompt is similar to alert except it takes an input.

54
00:04:03,690 --> 00:04:07,220
So what we'll do here is create a variable we'll call it input.

55
00:04:07,260 --> 00:04:14,070
We'll set it to prompt and then what we'll do is we can take that input and do whatever we want with

56
00:04:14,070 --> 00:04:14,250
it.

57
00:04:14,250 --> 00:04:16,810
So I'm just going to alert back.

58
00:04:16,920 --> 00:04:19,370
So we'll stay alert and put.

59
00:04:19,380 --> 00:04:25,490
Now if I save we're going to get this drop down here with this textfield and we'll just put in Hello

60
00:04:27,770 --> 00:04:30,050
click on it first and then say hello.

61
00:04:30,330 --> 00:04:31,440
And OK.

62
00:04:31,590 --> 00:04:35,390
And now you see it'll just alert it back out because that's what we chose to do with it.

63
00:04:35,400 --> 00:04:37,890
But you can do whatever you want with it.

64
00:04:37,890 --> 00:04:40,130
All right so that is prompt.

65
00:04:40,200 --> 00:04:47,610
We also have confirm now this is use often when you're deleting something because you know the person

66
00:04:47,610 --> 00:04:53,970
could just click delete by accident or you know you just want to make sure that that they are sure that

67
00:04:53,970 --> 00:04:56,320
they want to do whatever it is they're doing.

68
00:04:56,550 --> 00:05:04,060
So to do this we'll do an if statement and we'll say if confirmed and then it takes a parameter of the

69
00:05:04,060 --> 00:05:04,760
message.

70
00:05:04,760 --> 00:05:07,350
So let's say Are you sure.

71
00:05:07,390 --> 00:05:07,770
All right.

72
00:05:07,780 --> 00:05:14,890
And then if they'll have either OK or Cancel So if they click OK then whatever you put in here will

73
00:05:14,890 --> 00:05:15,250
run.

74
00:05:15,250 --> 00:05:20,260
So we'll just say console log Yes and save and you can see if we get.

75
00:05:20,260 --> 00:05:23,500
Are you sure if I click OK we get yes.

76
00:05:23,500 --> 00:05:24,760
Now if I could cancel.

77
00:05:24,760 --> 00:05:26,050
Nothing will happen.

78
00:05:26,230 --> 00:05:34,120
If you want something to happen you could just put an else and you could say console log and let's say

79
00:05:34,150 --> 00:05:35,540
no.

80
00:05:35,540 --> 00:05:35,880
All right.

81
00:05:35,890 --> 00:05:37,860
So if I click OK we get yes.

82
00:05:37,990 --> 00:05:40,380
And if I could cancel we get no.

83
00:05:40,660 --> 00:05:43,720
OK so that is confirmed.

84
00:05:43,810 --> 00:05:49,050
Now these aren't the best looking things I mean I would suggest putting alerts.

85
00:05:49,050 --> 00:05:54,700
For instance if you have like an error message on form validation I would suggest using the DOM and

86
00:05:54,700 --> 00:05:57,590
then you know outputting a nice looking bootstrap alert.

87
00:05:57,600 --> 00:06:05,980
Or something like that rather than using these these are kind of a high 90s type of web applications

88
00:06:07,210 --> 00:06:09,910
but they are there for you to use.

89
00:06:09,910 --> 00:06:13,580
All right so now I want to do is look at some properties.

90
00:06:13,600 --> 00:06:16,850
So for instance we can get the height and width of the window.

91
00:06:16,900 --> 00:06:20,880
OK you might need that for some kind of interactive application.

92
00:06:20,890 --> 00:06:30,760
What I'm going to do is is declare a variable avowe and then down here console log it just so you don't

93
00:06:30,760 --> 00:06:34,740
have a million different console logs to see these values.

94
00:06:34,750 --> 00:06:39,870
All right so we can get the outer height and width.

95
00:06:40,330 --> 00:06:47,950
So we'll save that equals window Daut our height.

96
00:06:48,030 --> 00:06:52,680
Let's save that see undefined.

97
00:06:53,400 --> 00:06:54,430
Why's that.

98
00:06:54,570 --> 00:06:56,050
I put two T's.

99
00:06:56,460 --> 00:06:56,890
All right.

100
00:06:56,950 --> 00:07:00,490
So the outer height right now is 10 87.

101
00:07:00,520 --> 00:07:06,270
If I were to go ahead and shrink this down and reload we get 863.

102
00:07:06,330 --> 00:07:06,820
All right.

103
00:07:06,900 --> 00:07:12,870
And you could actually create an event where and will get into events later where if you resize the

104
00:07:12,870 --> 00:07:20,980
window this will constantly change and you can do different things with that in terms of you know styling.

105
00:07:21,060 --> 00:07:23,330
Now we can also get the odor with.

106
00:07:23,370 --> 00:07:28,500
So if we go ahead and say over with and say we'll get five 10.

107
00:07:28,500 --> 00:07:32,640
But if I were to make this a little bigger and reload we get 561.

108
00:07:32,680 --> 00:07:33,030
All right.

109
00:07:33,030 --> 00:07:35,990
An hour is going to be from the outer edges.

110
00:07:36,180 --> 00:07:39,030
We also have inner With which will be inside.

111
00:07:39,030 --> 00:07:43,240
So if you have scrollbars For instance it will be inside the scroll bars.

112
00:07:43,290 --> 00:07:51,070
So what I'll do is just copy this and paste set and then this will be inner Huyton with.

113
00:07:51,090 --> 00:07:56,420
So we'll just change this to Inner in there.

114
00:07:56,670 --> 00:08:01,580
Let's take a look at the height so I'll just comment that out and save we get 4:42.

115
00:08:01,820 --> 00:08:04,690
We look at the width we get for 92.

116
00:08:04,700 --> 00:08:05,030
All right.

117
00:08:05,040 --> 00:08:10,970
Now notice that the height was only 442 because it's not counting this.

118
00:08:11,050 --> 00:08:14,170
It's it's from here to here.

119
00:08:14,640 --> 00:08:15,720
All right.

120
00:08:15,810 --> 00:08:20,460
Actually you know what I want to do is comment that Vanco 4:42.

121
00:08:20,490 --> 00:08:24,360
What if I make this the chrome tool smaller and reload.

122
00:08:24,360 --> 00:08:26,170
We get six so seven.

123
00:08:26,250 --> 00:08:26,620
All right.

124
00:08:26,630 --> 00:08:29,180
And noticed that the outer height didn't count.

125
00:08:29,180 --> 00:08:38,380
This was from top you know very the very top to the very bottom Kite's that's inner inner heightened

126
00:08:38,380 --> 00:08:44,120
with an outer heightened with now we can also get scroll points.

127
00:08:44,800 --> 00:08:53,610
So if you want to figure out where you are in terms of scrolling we could say Val he calls window dot

128
00:08:53,620 --> 00:08:54,940
scroll.

129
00:08:55,000 --> 00:08:59,380
Why what should be on the vertical axis.

130
00:08:59,410 --> 00:09:04,600
So if I save we're going to get zero because we don't even have scrollbars So obviously we're at the

131
00:09:04,600 --> 00:09:05,600
very top.

132
00:09:05,770 --> 00:09:15,550
Now what I want to do just temporarily is create a div here and say style ghouls and let's say margined

133
00:09:15,580 --> 00:09:22,120
top 1000 pixels and that will give us a scroll bar.

134
00:09:22,150 --> 00:09:22,590
OK.

135
00:09:22,600 --> 00:09:29,860
And now you can see if I reload we're at 400 or scroll up here reload right 100 and so on.

136
00:09:29,860 --> 00:09:30,220
All right.

137
00:09:30,220 --> 00:09:33,760
And you can do the same thing with a horizontal scroll.

138
00:09:33,880 --> 00:09:39,880
If you scroll X I'm going to demonstrate it it works the same exact way.

139
00:09:40,120 --> 00:09:40,750
All right.

140
00:09:40,750 --> 00:09:42,680
Just get rid of that div..

141
00:09:43,540 --> 00:09:44,400
All right.

142
00:09:44,980 --> 00:09:50,410
And you know what this is good for is those those sites where you scroll down and you have the animations

143
00:09:50,410 --> 00:09:52,370
happen as you're scrolling down.

144
00:09:52,390 --> 00:09:56,180
That way you know what point you're at and when to show the animations.

145
00:09:57,260 --> 00:09:58,670
All right now a few things.

146
00:09:58,770 --> 00:10:00,160
A few other things I want to look at.

147
00:10:00,160 --> 00:10:05,610
That is the location object in the history object which is part of the window object.

148
00:10:05,610 --> 00:10:15,180
All right so what we're going to do here is let's go and let's put a comment in here which is a location

149
00:10:15,840 --> 00:10:16,680
object.

150
00:10:16,680 --> 00:10:17,040
All right.

151
00:10:17,040 --> 00:10:25,540
So I'm going to set Val equal to window Daut location so we can see what that includes.

152
00:10:25,560 --> 00:10:26,810
If we look at this.

153
00:10:26,860 --> 00:10:33,440
So using this object here you can see we can get things like the host which is the in the end.

154
00:10:33,450 --> 00:10:39,350
In this case the loopback address and the port the host name which is just the address we can get just

155
00:10:39,360 --> 00:10:39,980
the poor.

156
00:10:39,990 --> 00:10:42,520
We can get the pathname which is just slash.

157
00:10:42,720 --> 00:10:44,690
We can get the eight track to the origin.

158
00:10:44,690 --> 00:10:46,480
A lot of these things are the same.

159
00:10:46,560 --> 00:10:52,080
The protocol which is each GTP we have some methods like reload and replace.

160
00:10:52,080 --> 00:10:59,530
We can redirect with that with with the location object we can get query strings with search.

161
00:10:59,550 --> 00:11:01,620
So there's quite a bit here.

162
00:11:01,740 --> 00:11:07,500
Now I want to just show you that we can print out some of these things or use them if we want.

163
00:11:07,500 --> 00:11:16,100
So let's say we wanted the hostname we could say window location hostname and save and you can see just

164
00:11:16,110 --> 00:11:24,690
fix this and you can see we'll get our address here and if you want if you are on a server with a domain

165
00:11:24,690 --> 00:11:27,190
name it would show the domain name here.

166
00:11:27,450 --> 00:11:30,310
OK we can get things like the port loops

167
00:11:33,200 --> 00:11:38,110
so we go ahead and show the poor number which should be fifty five hundred.

168
00:11:38,360 --> 00:11:39,670
In my case.

169
00:11:39,860 --> 00:11:45,140
Another thing we could do is a Tref which will give us everything it will give us the protocol.

170
00:11:45,510 --> 00:11:51,110
You can see it gives us the protocol it gives us the hostname and the poor.

171
00:11:51,110 --> 00:11:51,380
All right.

172
00:11:51,380 --> 00:11:54,450
Another cool thing we can get is the search parameters.

173
00:11:54,620 --> 00:12:00,080
So if we say Dot search we're not going to have anything here by default but if we go up here and add

174
00:12:00,080 --> 00:12:06,950
a question mark and let's say Heidy equals 1 then that's what's going to show in Dot search it's going

175
00:12:06,950 --> 00:12:08,620
to show the query string.

176
00:12:08,630 --> 00:12:14,010
So if we were to do ampersand I would say ampersand name.

177
00:12:14,150 --> 00:12:15,890
Actually I'll just go ahead and do that.

178
00:12:15,890 --> 00:12:20,370
So we have name equals Bradd and member equals standard.

179
00:12:20,390 --> 00:12:20,750
All right.

180
00:12:20,750 --> 00:12:27,110
So later on what I want to do in this video but later on I'd like to do an exercise will actually extract

181
00:12:27,110 --> 00:12:33,560
these these values from the R L and put them into our script and you can imagine some of the cool things

182
00:12:33,620 --> 00:12:34,590
you could do with that.

183
00:12:34,610 --> 00:12:39,950
So you can have links that people click on or form or get forms that people submit.

184
00:12:39,950 --> 00:12:43,730
That will give you these parameters and then you can do cool things with them.

185
00:12:43,730 --> 00:12:44,480
All right.

186
00:12:44,480 --> 00:12:46,520
So that is search.

187
00:12:46,730 --> 00:12:52,560
Now we can also do certain things with the location object like redirect.

188
00:12:52,580 --> 00:13:00,740
So if we wanted to redirect we could say window Daut location and we could take that H ref value k remember

189
00:13:00,950 --> 00:13:02,080
we showed what it was.

190
00:13:02,110 --> 00:13:03,640
We can also set it.

191
00:13:03,770 --> 00:13:11,690
So let's say HTP and will say Google dot com and save.

192
00:13:11,690 --> 00:13:14,760
And now when it reloads we get redirected to Google.

193
00:13:14,760 --> 00:13:15,110
Right.

194
00:13:15,110 --> 00:13:20,530
And usually this would be within your web site but you can also do external You are Elle's.

195
00:13:20,540 --> 00:13:20,900
All right.

196
00:13:20,900 --> 00:13:23,940
Another thing we can do is reload the page.

197
00:13:24,080 --> 00:13:30,630
So if we say window Daut location Daut reload.

198
00:13:30,890 --> 00:13:40,820
Now if I save this and we go to our site which is 1 2 7 5 loopback address 50 500 it's going to keep

199
00:13:40,820 --> 00:13:47,180
reloading you'll see that it keeps stuttering because it's just constantly reloading which obviously

200
00:13:47,450 --> 00:13:48,440
isn't very helpful.

201
00:13:48,440 --> 00:13:52,420
But if he didn't need to reload the page you could use that.

202
00:13:52,430 --> 00:14:01,790
So I'm just going to comment that I'll also comment out the redirect.

203
00:14:02,290 --> 00:14:08,120
All right so you can use the location object to redirect and reload the page reload.

204
00:14:08,130 --> 00:14:12,040
You would use in some kind of function you wouldn't just put it right in the global scope so that it

205
00:14:12,040 --> 00:14:14,050
keeps reloading.

206
00:14:14,310 --> 00:14:18,440
All right so now what I want to do is take a look at the history object.

207
00:14:18,930 --> 00:14:30,390
So go down here it's history object show up with that lower case.

208
00:14:30,470 --> 00:14:35,610
Now history is just that you can get your browsing history.

209
00:14:35,610 --> 00:14:44,300
So first thing we'll look at is let's say window it's history dot go.

210
00:14:44,490 --> 00:14:44,790
All right.

211
00:14:44,790 --> 00:14:51,510
And this will actually bring us back to wherever we came from and we can do negative one to go back

212
00:14:51,510 --> 00:14:55,170
to the site before this negative two to go before that.

213
00:14:55,170 --> 00:15:01,290
So what I'm going to do is just browse to a couple of sites so let's go to Google dot com.

214
00:15:01,290 --> 00:15:07,980
Let's go to Facebook dot com.

215
00:15:07,980 --> 00:15:15,090
Go to Twitter and then we'll go back to our site.

216
00:15:15,970 --> 00:15:16,670
OK.

217
00:15:16,770 --> 00:15:25,790
So if I go window down history don't go and then pass in here let's say negative one and save and reload.

218
00:15:25,950 --> 00:15:30,670
It's going to go to Twitter if I change it to negative to save.

219
00:15:30,690 --> 00:15:35,850
And then we go back to our site and you can see it takes us to Facebook.

220
00:15:35,850 --> 00:15:36,210
All right.

221
00:15:36,210 --> 00:15:42,810
So I'm just comment so and we'll go back

222
00:15:46,590 --> 00:15:49,890
all right so we can also check out the history link.

223
00:15:50,050 --> 00:15:55,750
If we were to actually put it in the Val say window Daut

224
00:15:58,340 --> 00:16:06,070
history dot Lang and save and you can see we have six so basically have six sites behind us.

225
00:16:06,200 --> 00:16:12,980
So the last thing I want to look at is the navigator object.

226
00:16:13,670 --> 00:16:20,000
Right now the navigator object has to do with the actual browser not the window or the environment but

227
00:16:20,000 --> 00:16:21,260
the browser itself.

228
00:16:21,260 --> 00:16:28,970
So Chrome Firefox now it's called Navigator because it's actually named after the old Netscape Navigator

229
00:16:29,000 --> 00:16:29,870
browser.

230
00:16:30,080 --> 00:16:33,440
All right so there's quite a few things that we can take a look at here.

231
00:16:33,440 --> 00:16:43,490
So first of all let's just put inside of our valve variable window Daut navigator and save.

232
00:16:43,580 --> 00:16:49,220
And if we take a look here at this object you can see we have quite a few things available so we have

233
00:16:49,220 --> 00:16:52,380
the app code name app name.

234
00:16:52,670 --> 00:16:58,540
Now app name is always going to be Netscape unless you are using IEEE then it will be IP.

235
00:16:58,670 --> 00:16:59,410
God forbid.

236
00:16:59,450 --> 00:17:03,590
Hopefully you're not using the app version.

237
00:17:03,800 --> 00:17:08,110
Basically this is either going to be 4.0 or 5.0.

238
00:17:08,270 --> 00:17:11,420
This isn't the version of chrome.

239
00:17:11,420 --> 00:17:15,140
Actually no and easier if we just print some stuff out so I can show you.

240
00:17:15,320 --> 00:17:23,230
But real quick just to look and see geolocation is actually part of the Navigator object.

241
00:17:23,360 --> 00:17:23,950
What else.

242
00:17:23,960 --> 00:17:29,900
The User-Agent Cade's so that we can get the type of browser we're using from this.

243
00:17:29,900 --> 00:17:32,060
Now notice it does say Mozilla.

244
00:17:32,060 --> 00:17:36,750
It says Safari it's as Chrome but it does give us the correct version.

245
00:17:36,770 --> 00:17:40,280
I am using 6:1 point whatever.

246
00:17:40,820 --> 00:17:42,600
Let's see storage.

247
00:17:42,620 --> 00:17:45,540
So navigator storage manager.

248
00:17:46,460 --> 00:17:52,460
Some other stuff you can see the vendor of the browser Google link platform so you can get the user's

249
00:17:52,460 --> 00:17:58,150
operating system which is if if it's on Windows it will be Win32.

250
00:17:58,150 --> 00:18:01,670
I believe if it's on a Mac it'll be Darwin.

251
00:18:02,090 --> 00:18:02,470
All right.

252
00:18:02,480 --> 00:18:07,110
So let's look at some of this stuff will put it in the air in the Val hair.

253
00:18:07,400 --> 00:18:14,090
So we say window Daut navigate or dot app name.

254
00:18:14,090 --> 00:18:18,850
Then again that's just going to give us Netscape unless Ron I e.

255
00:18:19,160 --> 00:18:20,070
All right.

256
00:18:20,150 --> 00:18:22,070
We can also get the version.

257
00:18:22,190 --> 00:18:31,300
So if we just go ahead and I'll just copy that down and we can say app version which will give us 5.0.

258
00:18:31,310 --> 00:18:35,760
Now this has to do with specifying fourth and fifth generation browsers.

259
00:18:35,780 --> 00:18:36,160
All right.

260
00:18:36,170 --> 00:18:38,810
And then you can see down here it gives us the version of chrome.

261
00:18:38,810 --> 00:18:44,060
So if you want to actually use this to extract someone's version of their browser you're going to have

262
00:18:44,060 --> 00:18:49,850
to do a little bit of magic and use regular expressions and kind of filtered through this.

263
00:18:49,940 --> 00:18:50,300
All right.

264
00:18:50,300 --> 00:18:52,970
Same thing with User-Agent and anything else.

265
00:18:52,970 --> 00:18:55,740
So actually let's take a look at User-Agent.

266
00:18:55,880 --> 00:18:58,190
That should give us pretty much the same thing.

267
00:18:58,190 --> 00:19:05,900
So that's going to be navigator Daut user agent and we'll save it and see it looks very similar.

268
00:19:06,020 --> 00:19:14,080
It has the bra the generation 5.0 and then it has different versions here.

269
00:19:14,090 --> 00:19:22,970
All right let's see what else can we look at so we can get the operating system on the platform and

270
00:19:22,970 --> 00:19:30,050
we can get that with navigator Daut platform and that gives us Win32.

271
00:19:30,050 --> 00:19:37,220
So you could do you know if window navigator platform equals Win32 then do something on Windows if it

272
00:19:37,220 --> 00:19:40,220
equals Darwyn then do something on Mac.

273
00:19:40,760 --> 00:19:48,670
And then I forget what it does for Linux so we can just look at the vendor so go ahead and do

274
00:19:52,590 --> 00:19:55,410
Vandar that will give us Google Inc.

275
00:19:55,440 --> 00:19:59,230
We can also get the language we can get the language of the browser.

276
00:20:02,950 --> 00:20:09,730
Which of course in my case is Ian Desch U.S. and there's some other stuff too but it's not really worth

277
00:20:09,730 --> 00:20:10,520
going through.

278
00:20:10,670 --> 00:20:15,210
But I just wanted to show you that the these are part of the window object.

279
00:20:15,430 --> 00:20:21,490
We will probably use some of this stuff later on especially like redirecting with location and stuff

280
00:20:21,490 --> 00:20:22,490
like that.

281
00:20:22,840 --> 00:20:26,120
But that's going to be it for this video guys in the next section.

282
00:20:26,140 --> 00:20:28,480
We're going to start getting into the dorm.

283
00:20:28,510 --> 00:20:35,110
OK so we're going to get into the document object model and start to look at nodes different elements

284
00:20:35,110 --> 00:20:44,170
how to select elements how to change content how to change styles how to basically work within the UI

285
00:20:44,170 --> 00:20:48,180
change the UI at events all kinds of stuff like that.

286
00:20:48,190 --> 00:20:48,490
All right.

287
00:20:48,490 --> 00:20:51,250
So thanks for watching and I will see you in the next section.