1 00:00:00,740 --> 00:00:01,930 Welcome back everybody. 2 00:00:02,000 --> 00:00:05,740 All right so I'm just going to hide the CSSA here because we don't need that anymore. 3 00:00:05,750 --> 00:00:09,770 And for the most part we're just going to be talking a little bit about HTML and javascript here because 4 00:00:09,770 --> 00:00:14,930 remember e-mail sets up what it is visually and how the Web site works and Javascript will add in the 5 00:00:14,930 --> 00:00:21,470 functionality meaning that Javascript can add something like a calculator or any kind of functionality 6 00:00:21,470 --> 00:00:25,330 you'd normally see on your desktop was Ishmail just simply displays. 7 00:00:25,340 --> 00:00:25,980 All right. 8 00:00:26,090 --> 00:00:28,950 So you can see here if we run Messias. 9 00:00:29,000 --> 00:00:31,000 Everything works good with pop et cetera. 10 00:00:31,130 --> 00:00:37,100 Now we need to do is we need to add in a button here and this will show this will be able to call functions 11 00:00:37,100 --> 00:00:38,990 which I'll describe here very shortly. 12 00:00:38,990 --> 00:00:39,440 OK. 13 00:00:39,560 --> 00:00:42,230 So I'm just going to type in button here and I'm going to type in the name. 14 00:00:42,230 --> 00:00:44,840 This is a button just like this. 15 00:00:44,870 --> 00:00:48,150 And I'm going to type in slash button just like that. 16 00:00:48,160 --> 00:00:48,520 All right. 17 00:00:48,530 --> 00:00:53,830 Now if we go ahead and click this button you can see that it has been rendered this in real time. 18 00:00:53,900 --> 00:00:58,490 And if we click this button it does nothing and the reason is is that again we haven't told this button 19 00:00:58,490 --> 00:01:02,900 to do anything and since we have told the button we haven't told the button to do anything. 20 00:01:02,900 --> 00:01:04,100 It won't do anything. 21 00:01:04,100 --> 00:01:07,890 However we run Rajai us the javascript file says Pop. 22 00:01:08,060 --> 00:01:10,460 And that's what it'll do if I get rid of this. 23 00:01:10,460 --> 00:01:16,770 Guess what it doesn't do anything because we have essentially there's nothing to justify. 24 00:01:16,790 --> 00:01:18,400 So there's nothing for the computer run. 25 00:01:18,650 --> 00:01:21,170 Now we need to do is need to add something onto this button. 26 00:01:21,290 --> 00:01:26,110 And what it will do is it will call a function here and explain what the function is in just the second. 27 00:01:26,120 --> 00:01:32,020 But if you just bear with me for a second and just type in on click K go equals to apostrophe's. 28 00:01:32,120 --> 00:01:33,390 That's all we need to do here. 29 00:01:33,560 --> 00:01:39,630 And what we're going to do is in these two apostrophe's we're going to call this my cool function. 30 00:01:39,640 --> 00:01:40,160 OK. 31 00:01:40,430 --> 00:01:42,380 And then we enter two brackets at the end of that. 32 00:01:42,380 --> 00:01:44,760 So you can see that it says my call function. 33 00:01:44,930 --> 00:01:51,770 And you also notice that the cool in function are capitalized while the my is not. 34 00:01:51,770 --> 00:01:57,830 So usually the first word you don't capitalize yet the other where did you catheterize And the reason 35 00:01:57,830 --> 00:02:00,650 is is that this doesn't look as good as this. 36 00:02:00,980 --> 00:02:06,470 It's just the way your brain kind of filters out the information and it looks a little bit better like 37 00:02:06,470 --> 00:02:06,740 this. 38 00:02:06,740 --> 00:02:09,140 All right so now we have Michael function. 39 00:02:09,230 --> 00:02:12,070 We need to hop over to the javascript and create a function. 40 00:02:12,110 --> 00:02:16,260 So let's just go ahead and we'll type in function and we're going to go to my. 41 00:02:16,280 --> 00:02:17,000 Cool. 42 00:02:17,000 --> 00:02:19,370 We're just going to type in function just like that. 43 00:02:19,370 --> 00:02:21,120 And of course you need the two brackets. 44 00:02:21,200 --> 00:02:26,150 And then we need to curly brackets or push enter twice and there we go we've got two curly brackets. 45 00:02:26,180 --> 00:02:30,860 Now again if we push this button it does nothing because there's nothing in the function to do. 46 00:02:31,070 --> 00:02:36,920 So I'm just going to go ahead and type in alert and I'm going to type in pop just like that. 47 00:02:36,920 --> 00:02:38,370 Pay just that. 48 00:02:38,420 --> 00:02:44,930 And if we type this in just what it says Pop we can change the pop to awesome whatever you really want 49 00:02:44,930 --> 00:02:47,440 to your name and it changes as well. 50 00:02:47,600 --> 00:02:53,990 So what this is is that the button tells you tells the function to do something he calls a specific 51 00:02:53,990 --> 00:02:54,650 function. 52 00:02:54,650 --> 00:03:00,590 So if I were to take this in let's say a real world situation let's say you have a button and you have 53 00:03:00,590 --> 00:03:02,420 a series of let's say 10 boxes. 54 00:03:02,420 --> 00:03:02,980 Right. 55 00:03:03,020 --> 00:03:10,070 And you push the button and a little robot grabs a certain box right box number one. 56 00:03:10,190 --> 00:03:12,560 Well that's essentially what this is. 57 00:03:12,650 --> 00:03:17,160 The button goes ahead and it calls a box of code for you to further computer run. 58 00:03:17,180 --> 00:03:23,180 That's pretty much all all it is here and we can have one function we can have 10 functions we can have 59 00:03:23,180 --> 00:03:28,760 100 functions we can have 100 buttons with 100 functions if you really want to all with different names. 60 00:03:28,890 --> 00:03:32,830 And so that's essentially what a function is is the block of code that does something. 61 00:03:32,920 --> 00:03:36,140 And that's pretty much all we need to know for this tutorial. 62 00:03:36,140 --> 00:03:37,650 I'll see you guys next time.