1 00:00:00,660 --> 00:00:06,260 In this lecture we are going to add some finishing touches to the web browser. 2 00:00:06,680 --> 00:00:17,160 A web browser is technically working but we just want to add some extra features to make it look a bit 3 00:00:17,160 --> 00:00:18,240 more polished. 4 00:00:19,410 --> 00:00:23,280 We are going to have things like a context menu. 5 00:00:23,340 --> 00:00:28,000 We are going to update the title bar. 6 00:00:28,230 --> 00:00:35,550 We're also going to enable all to completion. 7 00:00:35,550 --> 00:00:38,190 So let's add a context menu. 8 00:00:38,220 --> 00:00:46,290 So open up your tool box and go to menu on toolbars and there should be one for context menu. 9 00:00:46,290 --> 00:00:54,550 Just just double click on the context menu strip and from high that dash. 10 00:00:54,600 --> 00:01:05,490 That's the context menu that context menus only appear when you right click on something but in C shop 11 00:01:05,550 --> 00:01:14,520 with individual studio will show you your context meaning as if there where a main menu so that you 12 00:01:14,520 --> 00:01:17,390 can edit it more easily. 13 00:01:17,400 --> 00:01:21,570 So we already added a context menu. 14 00:01:21,690 --> 00:01:27,630 So what you need to do is choose your web browser component which is this one. 15 00:01:27,660 --> 00:01:36,780 Make sure it shows as web browser here in the properties pay and what we're going to do with for the 16 00:01:36,780 --> 00:01:38,080 properties for the web browser. 17 00:01:38,100 --> 00:01:45,000 We are going to change this context menu strip currently saying no we're going to change it to the context 18 00:01:45,000 --> 00:01:46,600 menu we've just added. 19 00:01:46,800 --> 00:01:48,380 So if I click on the dropdown. 20 00:01:48,420 --> 00:01:57,000 This is what we just added our change it to context menu strip one another property likely change is 21 00:01:57,000 --> 00:02:02,020 this one here is called E's web browser contexts. 22 00:02:02,160 --> 00:02:04,520 Currently it's set to true. 23 00:02:04,530 --> 00:02:08,240 Change it to force. 24 00:02:08,250 --> 00:02:10,290 What that does it. 25 00:02:10,470 --> 00:02:18,660 It disables the default context menu for the web browser so that your new one the one you just added 26 00:02:18,840 --> 00:02:20,130 is used instead 27 00:02:23,010 --> 00:02:32,100 at the moment when you your web the title bar for the page always sticks to the name of your web browser 28 00:02:32,490 --> 00:02:35,970 for example each you should say blue line. 29 00:02:35,970 --> 00:02:46,080 When the Web page loads but we are going to change that so that it will automatically update to include 30 00:02:46,110 --> 00:02:50,400 the title from the web page that is currently loaded. 31 00:02:51,000 --> 00:02:51,390 All right. 32 00:02:51,450 --> 00:02:56,400 So to do that we need to change something in the event list for the web browser. 33 00:02:56,610 --> 00:02:59,930 So click on the web browser here and click on event. 34 00:02:59,940 --> 00:03:07,980 This little bold here and you should see this here that says document complete it so double click on 35 00:03:07,980 --> 00:03:08,520 that. 36 00:03:08,520 --> 00:03:11,220 And that will give us a Skeletor code. 37 00:03:11,670 --> 00:03:16,590 So this is the event handler for this event. 38 00:03:16,590 --> 00:03:25,650 So we're going to write some piece of code that will help update the title when that is clicked. 39 00:03:26,050 --> 00:03:31,780 All right let right write some code to control that so time start with a text 40 00:03:35,170 --> 00:03:41,830 followed by we'll going to said that two equals to the name of your browser. 41 00:03:41,860 --> 00:03:44,620 In my case my blue line. 42 00:03:47,420 --> 00:03:51,260 OK. 43 00:03:52,300 --> 00:04:01,360 So after you said the text recourse to the name of your web browser they put a dash and because this 44 00:04:01,360 --> 00:04:05,890 is a tax you need surrounded wheat quotes it's a string. 45 00:04:05,890 --> 00:04:14,620 Then after that you put a plus sign which is concatenate you use plus concatenate concatenation means 46 00:04:14,620 --> 00:04:21,510 when you add together and then followed by the name of the web browser. 47 00:04:22,150 --> 00:04:24,520 Dot the document 48 00:04:27,520 --> 00:04:28,600 and then the title 49 00:04:31,270 --> 00:04:33,000 then you put a semicolon 50 00:04:36,870 --> 00:04:47,970 the text refers to the text property of the window so that line of code is line of code here will update 51 00:04:48,540 --> 00:04:58,410 the window title bar to read the this name of the browser which is blue line here followed by the title 52 00:04:58,770 --> 00:05:09,650 of the document that just got loaded so it appends it this using this plus sign it adds it together. 53 00:05:09,990 --> 00:05:20,340 The last thing we are going to do for this lecture is to enable or to completion auto completion is 54 00:05:20,340 --> 00:05:27,160 commonly used in Web browsers to show a list of recently visited Web sites. 55 00:05:27,390 --> 00:05:34,770 So as the user types in that domain for example if you're typing maybe WWL Google dot com in the location 56 00:05:34,770 --> 00:05:42,740 bar you would be shown a list of Web sites that start in on that start with that name. 57 00:05:42,800 --> 00:05:46,160 OK that you have visited recently. 58 00:05:46,620 --> 00:05:52,590 So this is easy to set up so let's go back to our design view and click on the combo. 59 00:05:52,590 --> 00:06:01,110 Make sure you've got your combo box selected and there is a property that's an ode to completion complete 60 00:06:01,110 --> 00:06:02,610 source property. 61 00:06:02,610 --> 00:06:03,850 Let's look for that. 62 00:06:04,710 --> 00:06:10,510 So there's a property for the combo box called or two complete source. 63 00:06:10,560 --> 00:06:12,170 Currently it is set to None. 64 00:06:12,170 --> 00:06:17,940 Just click on that and change it and set it to all you RL. 65 00:06:19,030 --> 00:06:24,270 Okay so that should be say your work. 66 00:06:24,270 --> 00:06:28,500 And let's test the application to stop browser click on Start 67 00:06:32,270 --> 00:06:32,830 All right. 68 00:06:32,840 --> 00:06:34,670 So less time paying of Web sites. 69 00:06:34,670 --> 00:06:51,320 How typing w w w dot that's 2 B B C dot com and click on Go 70 00:06:54,800 --> 00:06:55,330 is noted. 71 00:06:55,380 --> 00:07:02,830 You see that it is added the BBC website to the name of our web browser. 72 00:07:02,850 --> 00:07:04,310 So the title has changed. 73 00:07:04,330 --> 00:07:07,020 Notice that the so list is here. 74 00:07:07,140 --> 00:07:10,590 So our page is working as designed. 75 00:07:10,770 --> 00:07:11,940 All right. 76 00:07:12,140 --> 00:07:18,270 And you can see if we go to BBC again this combo box will be populated to all the Web sites. 77 00:07:18,300 --> 00:07:19,980 You virtually visit. 78 00:07:19,980 --> 00:07:21,080 It will have the list. 79 00:07:21,120 --> 00:07:24,390 So you want wanted to go for BBC again. 80 00:07:24,420 --> 00:07:25,800 It just gives me a list. 81 00:07:26,670 --> 00:07:27,180 Excellent. 82 00:07:27,180 --> 00:07:28,370 So let's try. 83 00:07:29,730 --> 00:07:32,590 Let's try something else. 84 00:07:32,700 --> 00:07:37,620 Let's try a b c. 85 00:07:37,620 --> 00:07:38,130 Dot com 86 00:07:42,270 --> 00:07:43,790 so this is ABC website. 87 00:07:43,790 --> 00:07:48,380 Notice this is added the title to the name of my browser. 88 00:07:49,430 --> 00:07:54,680 So yeah the Maya web browser is working as designed. 89 00:07:55,730 --> 00:07:56,270 Excellent. 90 00:07:56,270 --> 00:07:57,890 Thank you so much for your time. 91 00:07:58,160 --> 00:08:00,550 I hope it has been useful. 92 00:08:00,560 --> 00:08:02,460 You can tweak it more if you wish. 93 00:08:02,460 --> 00:08:04,940 There's always room for improvement. 94 00:08:04,940 --> 00:08:06,170 Thanks for watching. 95 00:08:06,170 --> 00:08:07,060 Take care. 96 00:08:07,070 --> 00:08:07,790 All the best. 97 00:08:07,790 --> 00:08:08,490 Bye for now.