1 00:00:00,506 --> 00:00:08,996 [ Silence ] 2 00:00:09,496 --> 00:00:11,816 >> Hello and welcome to S75. 3 00:00:12,146 --> 00:00:14,586 This is section the evening of July 9th. 4 00:00:14,586 --> 00:00:18,526 We're going to be doing a walkthrough for project zero 5 00:00:18,526 --> 00:00:24,096 and discussing some issues related to PHP, XML, and XPath. 6 00:00:24,676 --> 00:00:28,266 So the spec is up for project zero. 7 00:00:28,666 --> 00:00:34,346 If you go to S75 dot net you can see it's up on the main page. 8 00:00:34,346 --> 00:00:40,686 Wait, let's see, cs75 dot net. 9 00:00:40,876 --> 00:00:43,716 It's on the main page here. 10 00:00:44,166 --> 00:00:49,726 Project zero specification and a few of the instructions 11 00:00:49,726 --> 00:00:54,186 that I'm going to be doing tonight will be slightly 12 00:00:54,316 --> 00:00:55,926 different than your configuration 13 00:00:55,926 --> 00:00:58,406 because I haven't downloaded the latest version 14 00:00:58,406 --> 00:01:00,086 of the appliance yet, but I'm sure 15 00:01:00,086 --> 00:01:03,066 that we'll have an opportunity to confront some 16 00:01:03,066 --> 00:01:05,666 of the differences between what I'm doing 17 00:01:05,666 --> 00:01:08,976 and the current version of the appliance in future sections. 18 00:01:09,586 --> 00:01:14,386 So first of all, you'll want to create a Bitbucket account. 19 00:01:15,046 --> 00:01:18,666 So in the section labeled Bitbucket, 20 00:01:19,076 --> 00:01:21,016 you can see that it asks you to go 21 00:01:21,016 --> 00:01:23,116 to Bitbucket dot org slash plans. 22 00:01:24,206 --> 00:01:27,816 And I actually don't have a Bitbucket account 23 00:01:27,816 --> 00:01:28,996 so I'm going to sign up. 24 00:01:29,376 --> 00:01:34,136 You want to sign up for the free account and it says to be sure 25 00:01:34,136 --> 00:01:37,116 to use a dot edu address so that you're automatically upgraded 26 00:01:37,116 --> 00:01:40,466 to an unlimited student plan. 27 00:01:41,126 --> 00:01:49,146 And so I will use my name and click sign up. 28 00:01:49,146 --> 00:01:52,976 It doesn't look like there's any errors on the page. 29 00:01:53,516 --> 00:01:59,686 [ Background Sounds ] 30 00:02:00,186 --> 00:02:04,956 So now I have an unconfirmed e-mail address so I'll go 31 00:02:04,956 --> 00:02:10,826 to my e-mail account and will probably have an e-mail 32 00:02:10,826 --> 00:02:14,616 from Bitbucket asking me to confirm. 33 00:02:17,036 --> 00:02:19,136 There. Now I've been confirmed. 34 00:02:19,706 --> 00:02:24,716 So if you go back to the Bitbucket instructions, 35 00:02:25,136 --> 00:02:28,976 the first new thing is to create a new repository. 36 00:02:29,516 --> 00:02:34,876 [ Background Sounds ] 37 00:02:35,376 --> 00:02:37,066 Create repository. 38 00:02:38,516 --> 00:02:41,146 And we want to put project zero under name 39 00:02:45,416 --> 00:02:51,546 and we want a get repository and then we want both issue tracking 40 00:02:51,546 --> 00:02:53,896 and wiki under project management if we like. 41 00:02:54,956 --> 00:02:58,266 I'm actually not going to do that because I'm not going 42 00:02:58,266 --> 00:02:59,546 to be using those features. 43 00:03:00,646 --> 00:03:03,966 Under language, we'll select PHP. 44 00:03:07,546 --> 00:03:10,716 And then we'll input a value for the description 45 00:03:10,716 --> 00:03:12,016 and the website if you like. 46 00:03:12,406 --> 00:03:19,616 I'll put project zero for cs75. 47 00:03:20,516 --> 00:03:24,676 [ Silence ] 48 00:03:25,176 --> 00:03:35,636 So we created a repository and then you should find yourself 49 00:03:35,636 --> 00:03:40,516 at a page whose URL includes your username and project zero. 50 00:03:41,366 --> 00:03:47,426 So I actually haven't finished creating this URL. 51 00:03:47,426 --> 00:03:51,936 I'm not going to enter a website because this isn't going 52 00:03:51,936 --> 00:03:54,306 to be live on the internet. 53 00:03:54,306 --> 00:03:56,366 So here's my username and my project zero. 54 00:03:57,256 --> 00:04:05,916 The first thing you want to do is set up ssh and so if you go 55 00:04:05,916 --> 00:04:13,146 to your ssh directory, you can see I already have an id 56 00:04:13,146 --> 00:04:16,906 underscore rsa dot pub key 57 00:04:17,496 --> 00:04:24,976 and that is what you will create by doing ssh kegen. 58 00:04:25,526 --> 00:04:32,046 So I already have this rsa pub key and in order to get 59 00:04:32,536 --> 00:04:43,736 that pub key, you want to use geany. 60 00:04:44,516 --> 00:04:50,686 [ Background Sounds ] 61 00:04:51,186 --> 00:04:56,356 And then you'll go into your Bitbucket account 62 00:04:56,736 --> 00:05:04,966 and then paste the key into the field called ssh keys. 63 00:05:05,516 --> 00:05:12,776 [ Background Sounds ] 64 00:05:13,276 --> 00:05:16,976 So in account, ssh keys. 65 00:05:17,516 --> 00:05:23,566 [ Background Sounds ] 66 00:05:24,066 --> 00:05:25,356 Here's my whole ssh key. 67 00:05:25,526 --> 00:05:30,936 You want to copy the whole line with no new lines. 68 00:05:31,086 --> 00:05:35,026 So don't copy the new line if you can. 69 00:05:35,026 --> 00:05:36,536 And paste it in. 70 00:05:37,686 --> 00:05:43,256 Add key. It looks a lot like GitHub, 71 00:05:43,256 --> 00:05:49,346 this interface here is probably somehow related to GitHub. 72 00:05:50,466 --> 00:05:54,476 So now we want to create our initial commit 73 00:05:54,476 --> 00:05:55,676 into the repository. 74 00:05:56,286 --> 00:05:56,376 So. 75 00:05:58,516 --> 00:06:04,566 [ Background Sounds ] 76 00:06:05,066 --> 00:06:08,516 So this is the part that will be slightly different for me 77 00:06:08,516 --> 00:06:10,976 than for people running the appliance. 78 00:06:11,516 --> 00:06:43,636 [ Background Sounds ] 79 00:06:44,136 --> 00:06:47,806 So the equivalent of the v host's directory 80 00:06:48,006 --> 00:06:53,026 for me is the public html directory which is the directory 81 00:06:53,026 --> 00:06:56,106 where I will store all of my public facing html files. 82 00:06:56,376 --> 00:07:05,406 If I go into public html, then I will, 83 00:07:06,246 --> 00:07:14,226 let's see if they already you-- make a directory called public 84 00:07:15,376 --> 00:07:22,076 or called project zero and you can see 85 00:07:22,076 --> 00:07:25,216 that it doesn't have the right permissions. 86 00:07:25,216 --> 00:07:27,816 I need at least seven eleven permissions in order to be able 87 00:07:27,816 --> 00:07:30,916 to execute code in that directory and in order 88 00:07:30,916 --> 00:07:33,566 to make it a little bit more friendly 89 00:07:33,566 --> 00:07:36,376 to view online I'm going to give it a little bit more 90 00:07:36,376 --> 00:07:37,316 generous permissions. 91 00:07:37,956 --> 00:07:44,946 So I'm going to chmod 755 project zero. 92 00:07:45,516 --> 00:08:17,896 [ Background Sounds ] 93 00:08:18,396 --> 00:08:24,856 I have a project zero directory and this project zero shows up. 94 00:08:25,446 --> 00:08:30,206 So now let's go back to the walkthrough. 95 00:08:35,876 --> 00:08:39,106 I'm inside of the project zero directory inside 96 00:08:39,106 --> 00:08:41,866 of the directory that will let you show your html 97 00:08:41,866 --> 00:08:50,256 on your local host browser and these commands here are not, 98 00:08:50,256 --> 00:08:55,776 it's not necessary for you to be in this directory, 99 00:08:56,196 --> 00:09:03,936 at least for the config global, but I will do get git init 100 00:09:03,936 --> 00:09:08,106 and it says initialized empty git repository 101 00:09:09,306 --> 00:09:16,746 and then I will say git add hyphen hyphen all 102 00:09:17,936 --> 00:09:26,966 and git commit dash m initial commit. 103 00:09:27,496 --> 00:09:33,506 Okay, so you can see that it says one file changed 104 00:09:34,226 --> 00:09:36,956 and one insertion and zero deletions. 105 00:09:37,326 --> 00:09:40,596 So git is a source code manager. 106 00:09:40,796 --> 00:09:43,376 I've talked about git in previous sections. 107 00:09:43,476 --> 00:09:51,036 There are some resources about git in the project zero pdf. 108 00:09:51,926 --> 00:09:59,796 One of my favorite git resources for beginners is if you go 109 00:09:59,796 --> 00:10:11,306 to the s75 sections page where I store my code for on GitHub, 110 00:10:11,986 --> 00:10:22,676 you'll see down here that there a lot of git resources and one 111 00:10:23,146 --> 00:10:29,146 of my favorite videos is a YUI theater video 112 00:10:29,596 --> 00:10:35,996 where it really runs you through the different workflows for git 113 00:10:37,336 --> 00:10:44,646 and in general, I'll just give you the feel for it. 114 00:10:45,816 --> 00:10:47,846 So we'll do-- 115 00:10:48,516 --> 00:11:08,836 [ Background Sounds ] 116 00:11:09,336 --> 00:11:16,236 So you can see here that the project zero background is red 117 00:11:16,236 --> 00:11:19,356 because I specified this attribute, bgcolor equals red, 118 00:11:20,476 --> 00:11:28,826 and if I, let's say I want to work on a new feature, 119 00:11:29,106 --> 00:11:39,746 then I can do git branch or git checkout b, let's start working 120 00:11:39,746 --> 00:11:46,616 on the new feature called blue, and if I say git branch, 121 00:11:46,706 --> 00:11:50,286 you can see now that there's a star next to blue indicating 122 00:11:50,286 --> 00:11:55,406 that I now have the blue branch checked out 123 00:11:55,706 --> 00:12:00,966 and each branch is literally a separate branch in your code 124 00:12:01,686 --> 00:12:05,616 that can separate the different features that you're working 125 00:12:05,616 --> 00:12:08,846 on at one time and then later on you can merge them together. 126 00:12:09,376 --> 00:12:15,006 So now I can go into the index and change the background color 127 00:12:15,386 --> 00:12:22,326 to blue and refresh it here and it will be blue and-- 128 00:12:23,516 --> 00:12:31,856 [ Background Sounds ] 129 00:12:32,356 --> 00:12:36,086 If I do git add a, that's a synonym 130 00:12:36,086 --> 00:12:41,246 for git add hyphen hyphen all like we did before. 131 00:12:41,446 --> 00:12:45,356 If you git status it shows you 132 00:12:45,356 --> 00:12:53,186 that the index dot PHP is modified and it's not staged 133 00:12:53,186 --> 00:12:58,546 for commit so right now since there is nothing in this section 134 00:12:58,986 --> 00:13:01,846 of the git status message, 135 00:13:02,286 --> 00:13:04,726 nothing would actually be committed if I were 136 00:13:04,726 --> 00:13:05,696 to make a commit right now. 137 00:13:06,246 --> 00:13:08,696 In order to stage that modification, 138 00:13:08,696 --> 00:13:14,356 I can do git add a index dot PHP. 139 00:13:14,356 --> 00:13:19,526 Now if I do git status, you can see changes 140 00:13:19,526 --> 00:13:23,196 to be committed includes the modifications 141 00:13:23,656 --> 00:13:33,276 such as making this blue and then you can do a commit, 142 00:13:33,736 --> 00:13:38,196 git commit finished blue feature. 143 00:13:38,636 --> 00:13:43,316 This is my nice commit message. 144 00:13:43,316 --> 00:13:49,416 And now I'll do git branch and I can see I'm still 145 00:13:49,416 --> 00:13:53,546 in the blue branch if I do git checkout master. 146 00:13:54,816 --> 00:13:57,176 Now it says switch to branch master 147 00:13:57,666 --> 00:14:02,916 and you can see this directory is white, 148 00:14:03,146 --> 00:14:04,786 or this background is white, 149 00:14:04,786 --> 00:14:08,966 and if I do vim index dot PHP you can see 150 00:14:08,966 --> 00:14:15,566 that that background color is not even present here. 151 00:14:16,326 --> 00:14:22,586 But if I do git merge blue 152 00:14:22,916 --> 00:14:27,506 and the refresh the page, now it's blue. 153 00:14:28,116 --> 00:14:31,706 So basically what it did is it took the code 154 00:14:31,796 --> 00:14:36,096 from the blue branch and it merged it in tracking 155 00:14:36,406 --> 00:14:38,766 where all the insertions and deletions were 156 00:14:38,936 --> 00:14:40,666 in each of the sub files. 157 00:14:41,166 --> 00:14:44,246 So what this enables you to do is work on, 158 00:14:44,396 --> 00:14:47,596 keep your master branch clean 159 00:14:47,596 --> 00:14:52,946 as of your latest good-working version, 160 00:14:53,106 --> 00:14:58,876 and then you do git checkout b, no- 161 00:14:59,516 --> 00:15:07,306 [ Writing on Board ] 162 00:15:07,806 --> 00:15:15,056 Dash b and then feature name and that will switch you 163 00:15:15,056 --> 00:15:19,306 to a brand new branch called feature 164 00:15:19,576 --> 00:15:22,726 and then you can continue working on that feature and then 165 00:15:22,726 --> 00:15:28,496 at any time you can go back to the working version and get it. 166 00:15:28,496 --> 00:15:33,966 And so now let's finish setting up Bitbucket 167 00:15:34,296 --> 00:15:36,816 because you'll see the true value 168 00:15:37,356 --> 00:15:42,646 of git once Bitbucket is set up. 169 00:15:43,596 --> 00:15:45,926 So we've made an initial commit. 170 00:15:45,926 --> 00:15:47,636 I'm going to make this nice and big. 171 00:15:48,106 --> 00:15:48,246 And-- 172 00:15:49,516 --> 00:15:54,876 [ Background Sounds ] 173 00:15:55,376 --> 00:15:58,396 You can see, this is the command we're going 174 00:15:58,546 --> 00:16:02,046 to be working on right here. 175 00:16:02,146 --> 00:16:09,666 git remote add origin git at Bitbucket dot org 176 00:16:10,196 --> 00:16:13,746 and then you want a colon 177 00:16:14,286 --> 00:16:23,316 and then do your username pnore slash project zero dot git 178 00:16:24,186 --> 00:16:25,846 and that should be 179 00:16:26,516 --> 00:16:35,856 [ Background Sounds ] 180 00:16:36,356 --> 00:16:40,026 That should be this project, git, yeah, see, 181 00:16:40,136 --> 00:16:43,766 git at Bitbucket dot org slash pnore slash project zero 182 00:16:43,766 --> 00:16:43,976 dot git. 183 00:16:44,516 --> 00:16:53,546 [ Background Sounds ] 184 00:16:54,046 --> 00:17:00,126 And then git push u origin master. 185 00:17:01,466 --> 00:17:06,256 The very first time you'll have to say yes I do want to commit 186 00:17:06,256 --> 00:17:13,656 or I do want to acknowledge that that domain is trusted. 187 00:17:14,896 --> 00:17:17,976 And now if we visit-- 188 00:17:18,516 --> 00:17:31,626 [ Background Sounds ] 189 00:17:32,126 --> 00:17:33,166 Let's see. 190 00:17:35,336 --> 00:17:36,976 Our source code will appear here. 191 00:17:37,516 --> 00:17:42,016 [ Inaudible Comment ] 192 00:17:42,516 --> 00:17:43,246 Oh yeah, you're right. 193 00:17:44,016 --> 00:17:44,976 Here. So this should be-- 194 00:17:45,516 --> 00:17:53,556 [ Background Sounds ] 195 00:17:54,056 --> 00:18:00,646 Okay. So now I've messed it up. 196 00:18:00,756 --> 00:18:06,636 So basically your code will appear on Bitbucket 197 00:18:06,636 --> 00:18:11,836 after you push if you don't misspell get g-e-t 198 00:18:11,836 --> 00:18:21,156 at Bitbucket dot org and as long as you keep doing git commit 199 00:18:21,156 --> 00:18:25,136 and then git push, then the most recent version 200 00:18:25,136 --> 00:18:28,986 of your code will always be stored online and what 201 00:18:28,986 --> 00:18:34,746 that will mean is that any time you can delete your entire 202 00:18:34,746 --> 00:18:39,286 directory and then do git clone and then your Bitbucket URL 203 00:18:39,286 --> 00:18:41,986 and you will be able to download the most recent version 204 00:18:41,986 --> 00:18:44,656 of your code from online which will provide some insurance 205 00:18:44,656 --> 00:18:50,096 in case your appliance goes corrupt or something. 206 00:18:50,196 --> 00:18:57,546 So after you have git configured then you'll want 207 00:18:57,546 --> 00:19:02,576 to start thinking about how to encode the menu in XML. 208 00:19:02,576 --> 00:19:13,546 We've already talked a little bit about how to do XML in PHP, 209 00:19:13,546 --> 00:19:18,736 specifically in last week's lecture we talked about how 210 00:19:18,736 --> 00:19:21,966 to parse rss and David talked a little bit 211 00:19:21,966 --> 00:19:22,966 about that in his lecture. 212 00:19:23,516 --> 00:19:41,836 [ Background Sounds ] 213 00:19:42,336 --> 00:19:47,076 If you were here last week and you saw the section 214 00:19:47,076 --> 00:19:52,346 about working with model view controller in PHP, 215 00:19:53,126 --> 00:20:03,456 we created a simple model of a blog using an rss XML 216 00:20:03,456 --> 00:20:09,356 as a data storage mechanism and this is what that blog looked 217 00:20:09,776 --> 00:20:15,486 like and it has only one controller element, 218 00:20:15,486 --> 00:20:17,706 only one user interface element which is 219 00:20:17,746 --> 00:20:21,366 that you can press next buttons until you get to the end 220 00:20:21,366 --> 00:20:23,126 of the post and then grays out 221 00:20:23,126 --> 00:20:25,616 and then you can press previous buttons until it gets to the end 222 00:20:25,616 --> 00:20:29,416 of the post and then grays out and all of the information 223 00:20:29,686 --> 00:20:35,056 from each of these blog posts and the blog title 224 00:20:35,056 --> 00:20:39,156 and the blog subtitle is stored in an XML file. 225 00:20:39,156 --> 00:20:47,146 And so you can see that the context 226 00:20:47,436 --> 00:20:53,306 for this application divided up model view and controller 227 00:20:53,306 --> 00:20:54,946 into three separate folders. 228 00:20:55,386 --> 00:20:58,326 You can get a nice directory tree like this 229 00:20:58,326 --> 00:20:59,956 in ASCII using the tree command in Linux. 230 00:21:00,516 --> 00:21:08,576 [ Background Sounds ] 231 00:21:09,076 --> 00:21:16,916 Which gives you a nice printout and so in mvc 232 00:21:17,046 --> 00:21:21,556 in general how the flow of mvc goes 233 00:21:22,156 --> 00:21:25,756 from one file that's the entry point to the controller, 234 00:21:25,976 --> 00:21:30,906 the controller makes a request to the model 235 00:21:30,906 --> 00:21:35,406 and the model interacts with the data storage mechanism 236 00:21:35,406 --> 00:21:38,206 and then passes the data back to the controller 237 00:21:38,206 --> 00:21:42,446 and the controller then does any final formatting that's 238 00:21:42,446 --> 00:21:46,636 necessary and prepares the data to be sent off 239 00:21:46,636 --> 00:21:51,306 to the appropriate view where the view 240 00:21:51,306 --> 00:21:53,746 that the user sees is rendered 241 00:21:54,186 --> 00:21:58,096 and in this case this is the order of execution. 242 00:21:58,386 --> 00:22:03,286 So you can see that there's a separation 243 00:22:03,286 --> 00:22:06,656 between the controller and the model and the controller 244 00:22:06,656 --> 00:22:08,056 and the view and the controller. 245 00:22:08,056 --> 00:22:09,486 The controller is kind of the cement 246 00:22:09,486 --> 00:22:11,396 that binds it all together. 247 00:22:12,196 --> 00:22:24,716 So if we go into the model, data dot XML, you will have 248 00:22:25,936 --> 00:22:31,956 to invent your own XML schema for project zero. 249 00:22:32,046 --> 00:22:39,346 I chose rss because it's already a well-known XML format 250 00:22:39,346 --> 00:22:44,516 for doing blog things and the model in this case, 251 00:22:44,516 --> 00:22:46,896 parse is this XML file and renders each 252 00:22:46,896 --> 00:22:49,256 of these blog sections 253 00:22:50,076 --> 00:22:56,486 and provides the information necessary to gray this 254 00:22:56,636 --> 00:23:05,436 out if there are no previous blog posts. 255 00:23:06,096 --> 00:23:19,966 If we go to-- 256 00:23:20,516 --> 00:23:30,876 [ Background Sounds ] 257 00:23:31,376 --> 00:23:36,446 So the first point of entry is the controller which is up top 258 00:23:37,356 --> 00:23:46,836 and the data structure here, I've created an array 259 00:23:46,836 --> 00:23:52,896 of like queries basically to query the model with and each 260 00:23:52,896 --> 00:23:56,566 of these is a variable that I want to be filled 261 00:23:56,566 --> 00:24:00,776 in with some kind of data and when you're using mvc, 262 00:24:00,896 --> 00:24:06,966 you want your model to be separate from your controller 263 00:24:07,276 --> 00:24:09,936 and the idea is that a team that's halfway 264 00:24:09,936 --> 00:24:13,416 across the country could be working on the model 265 00:24:13,416 --> 00:24:16,246 and the could be coding all of the business logic 266 00:24:16,246 --> 00:24:18,696 into the model and then you could be coding 267 00:24:18,696 --> 00:24:20,626 on the controller and then at the end you'd be able 268 00:24:20,626 --> 00:24:21,756 to hook it up together. 269 00:24:22,046 --> 00:24:28,626 So it's important to have an interface that enables you 270 00:24:28,626 --> 00:24:33,916 to keep a separation between the model and the controller 271 00:24:33,916 --> 00:24:36,676 that just helps you write clean code. 272 00:24:36,946 --> 00:24:42,006 In this case, these variable names are variable names 273 00:24:42,006 --> 00:24:44,736 that I know that the model supports 274 00:24:44,866 --> 00:24:47,946 and this is slightly different from the version 275 00:24:48,406 --> 00:24:51,666 of the application that I presented last time 276 00:24:51,666 --> 00:24:55,076 where I actually put queries right in the controller. 277 00:24:56,796 --> 00:24:57,976 If you look at 278 00:24:58,516 --> 00:25:09,566 [ Background Sounds ] 279 00:25:10,066 --> 00:25:14,116 So here the controller is 65 lines long 280 00:25:14,116 --> 00:25:16,256 and here it's only 31 lines long. 281 00:25:16,666 --> 00:25:20,526 In general, if you find your controller inflating with logic, 282 00:25:21,286 --> 00:25:24,716 like notice here I have to do an if call, you know, 283 00:25:24,716 --> 00:25:29,476 if you have lots of logic inside of your controller in order 284 00:25:29,476 --> 00:25:32,276 to just render the data necessary 285 00:25:32,616 --> 00:25:37,616 for the view then you might have what's called a fat controller 286 00:25:38,026 --> 00:25:40,446 which is a good sign that you need to move some 287 00:25:40,446 --> 00:25:43,516 of that data back to the model. 288 00:25:43,786 --> 00:25:52,216 And the model in this application uses XPath 289 00:25:52,726 --> 00:25:56,716 which is an XML query language, as David mentioned, 290 00:25:56,716 --> 00:26:00,936 in order to access each of the variables. 291 00:26:01,546 --> 00:26:06,486 So for each of these variables like posts to display, 292 00:26:07,606 --> 00:26:15,126 it gets passed into the model and down here I iterate 293 00:26:15,126 --> 00:26:23,766 through each of the queries and if a function exists 294 00:26:24,306 --> 00:26:27,506 with the query name, like each one 295 00:26:27,506 --> 00:26:28,986 of these is an associate of array. 296 00:26:28,986 --> 00:26:32,666 We have post number to display it goes to 297 00:26:32,666 --> 00:26:35,026 and then a string of length zero. 298 00:26:35,336 --> 00:26:39,486 If a function exists called post to display, 299 00:26:39,996 --> 00:26:45,716 then I use the function call user func to call the function 300 00:26:45,716 --> 00:26:50,526 with that name and with the parameters indicated here, 301 00:26:50,526 --> 00:26:54,046 in this case no parameters or default parameters. 302 00:26:54,536 --> 00:26:59,426 So for each of these queries down here, 303 00:26:59,426 --> 00:27:03,276 as long as I create a function with the same name as the query 304 00:27:03,456 --> 00:27:09,166 and then return the value that is supposed to enter in here, 305 00:27:09,556 --> 00:27:19,086 then after the model is included then now the data variable will 306 00:27:19,086 --> 00:27:25,096 actually include this same 307 00:27:25,096 --> 00:27:30,206 or data array except the data will be filled in by the model. 308 00:27:30,646 --> 00:27:33,676 So if I comment out the time lines that were in front 309 00:27:34,226 --> 00:27:36,526 of this echo comment which is going 310 00:27:36,526 --> 00:27:39,776 to print recursive the data variable, 311 00:27:40,066 --> 00:27:46,866 you can see that it's filled in the post to display variable 312 00:27:46,866 --> 00:27:49,336 with the appropriate data. 313 00:27:50,816 --> 00:28:00,656 So the way that that has worked, [inaudible] stored a query here 314 00:28:00,656 --> 00:28:07,726 in post to display that is an XPath query. 315 00:28:08,226 --> 00:28:12,976 Here the query is, let me get the data open, app oh six-- 316 00:28:13,516 --> 00:28:23,266 [ Background Sounds ] 317 00:28:23,766 --> 00:28:23,966 Yeah? 318 00:28:24,516 --> 00:28:30,746 [inaudible comment] 319 00:28:31,246 --> 00:28:32,386 Okay. Yeah. 320 00:28:32,526 --> 00:28:32,896 That's fine. 321 00:28:33,076 --> 00:28:33,396 Thank you. 322 00:28:33,606 --> 00:28:33,706 Yeah. 323 00:28:34,516 --> 00:28:45,596 [ Background Sounds ] 324 00:28:46,096 --> 00:28:53,486 This particular query is the rss, it seeks the rss element, 325 00:28:53,486 --> 00:28:55,716 and then it seeks the channel element 326 00:28:55,716 --> 00:28:57,236 and then it seeks the item element 327 00:28:57,296 --> 00:29:00,376 and then it applies a filter to that 328 00:29:00,826 --> 00:29:06,276 where the position XPath method is equal to a digit 329 00:29:06,276 --> 00:29:10,786 and the digit here defaults to one, 330 00:29:11,396 --> 00:29:21,626 but here I find it really useful to look at the simple XML 331 00:29:21,976 --> 00:29:28,086 or to the notes that I've put on XPath in readme, 332 00:29:28,516 --> 00:29:35,396 so stylist studio's XPath reference this page here is 333 00:29:35,396 --> 00:29:40,576 at the bottom of my s75 sections page, this reference 334 00:29:40,726 --> 00:29:43,936 for stylist studio is a great reference 335 00:29:43,996 --> 00:29:46,956 for the XPath functions that are available to you 336 00:29:46,956 --> 00:29:51,486 and to just the general syntax of an XPath query. 337 00:29:52,226 --> 00:29:55,366 So here they're showing you 338 00:29:55,366 --> 00:30:04,346 that like this query would select the para children 339 00:30:04,886 --> 00:30:09,856 that have an attribute of type equal to warning. 340 00:30:11,286 --> 00:30:21,056 So when you're designing your XML structure, you want to think 341 00:30:21,056 --> 00:30:23,596 about making a structure that's easy to query 342 00:30:23,596 --> 00:30:28,016 with the XPath that you understand. 343 00:30:28,326 --> 00:30:40,296 So let's get out and let's look at menu dot XML. 344 00:30:40,666 --> 00:30:44,046 So this is a simple menu and-- 345 00:30:45,516 --> 00:31:01,636 [ Background Sounds ] 346 00:31:02,136 --> 00:31:05,976 So the way that you get to the point 347 00:31:05,976 --> 00:31:10,006 where you can actually read in the XML 348 00:31:10,006 --> 00:31:14,266 and conduct XPath queries on it, 349 00:31:14,556 --> 00:31:24,576 you have to use simple XML load file, I think that's it-- 350 00:31:25,516 --> 00:31:33,766 [ Background Sounds ] 351 00:31:34,266 --> 00:31:39,916 Let's just do a print r on this to begin with. 352 00:31:40,516 --> 00:32:05,016 [ Background Sounds ] 353 00:32:05,516 --> 00:32:08,066 Yeah. Simple XML element load file. 354 00:32:09,266 --> 00:32:15,216 So this file is in the same directory as menu to XML 355 00:32:15,656 --> 00:32:22,006 so let's take a look at what this looks like. 356 00:32:22,006 --> 00:32:26,906 It should be the same file actually. 357 00:32:27,556 --> 00:32:32,736 So you can see if I do a print r it doesn't look very great 358 00:32:32,736 --> 00:32:43,976 on the top so let's actually, echo pre. 359 00:32:44,516 --> 00:32:51,816 [ Background Sounds ] 360 00:32:52,316 --> 00:33:01,156 Alright, so simple XML load file returns a six simple XML element 361 00:33:01,156 --> 00:33:07,906 object and inside that object is an array, an associative array, 362 00:33:07,906 --> 00:33:11,516 well it's [inaudible] but the comment property goes 363 00:33:12,256 --> 00:33:17,356 to another simple XML object and the pizza's property 364 00:33:17,846 --> 00:33:26,146 of the simple XML object goes to another simple XML object. 365 00:33:26,926 --> 00:33:35,906 So in order to access, let's do-- 366 00:33:36,516 --> 00:34:01,096 [ Background Sounds ] 367 00:34:01,596 --> 00:34:14,086 If we do XML pizzas item and-- 368 00:34:17,516 --> 00:34:25,756 [ Background Sounds ] 369 00:34:26,256 --> 00:34:32,766 And this one is called tomato and cheese 370 00:34:33,016 --> 00:34:39,926 and in simple XML element or in the simple XML element class, 371 00:34:40,516 --> 00:34:47,606 [ Background Sounds ] 372 00:34:48,106 --> 00:34:54,736 It's more tricky to get a hold of the attributes 373 00:34:54,776 --> 00:34:59,596 which is why you might want to stay away 374 00:34:59,596 --> 00:35:03,806 from them and instead go-- 375 00:35:04,516 --> 00:35:20,796 [ Background Sounds ] 376 00:35:21,296 --> 00:35:25,906 Because now we can descend into this element. 377 00:35:26,516 --> 00:35:32,166 [ Background Sounds ] 378 00:35:32,666 --> 00:35:36,436 Like that. 379 00:35:37,146 --> 00:35:41,736 So here I called forth the tomato and cheese element 380 00:35:41,736 --> 00:35:45,856 by being able to descend into this. 381 00:35:46,376 --> 00:35:50,216 In each one of these on the menu, you're going to have 382 00:35:50,216 --> 00:35:54,796 to kind of take a look at the menu and figure out how it is 383 00:35:54,886 --> 00:35:56,366 that you want to break it up. 384 00:35:56,976 --> 00:36:03,956 You only have to do a few from each section. 385 00:36:04,516 --> 00:36:19,826 [ Background Sounds ] 386 00:36:20,326 --> 00:36:26,646 You want to think about how to uniquely identify each of these 387 00:36:26,646 --> 00:36:31,686 because somehow you're going to have to pass information 388 00:36:31,686 --> 00:36:38,216 about this exact purchase that's going to be passed 389 00:36:38,496 --> 00:36:45,116 over to the server and it needs to be able to identify 390 00:36:45,116 --> 00:36:52,456 that that element is actually the large broccoli pizza. 391 00:36:52,916 --> 00:36:59,976 So here we could do pizzas item name equals 392 00:37:00,516 --> 00:37:07,616 [ Background Sounds ] 393 00:37:08,116 --> 00:37:13,296 And then we could do a price element 394 00:37:13,626 --> 00:37:19,816 or we could do a size element. 395 00:37:20,356 --> 00:37:26,916 If we do a price element, then we're just going 396 00:37:27,126 --> 00:37:28,976 to have to do large or small. 397 00:37:29,516 --> 00:37:41,556 [ Background Sounds ] 398 00:37:42,056 --> 00:37:46,516 And you could dispense with the price altogether. 399 00:37:47,416 --> 00:37:48,846 Let's see, what it is the broccoli? 400 00:37:49,836 --> 00:37:55,006 Ten eighty five. 401 00:37:56,556 --> 00:37:58,056 Here's another issue. 402 00:37:58,236 --> 00:38:09,826 Let's parse the, let's say that you have pizza name to get 403 00:38:10,026 --> 00:38:23,706 in a variable and we want the broccoli one. 404 00:38:24,516 --> 00:38:29,456 [ Background Sounds ] 405 00:38:29,956 --> 00:38:33,526 Then you could do item. 406 00:38:34,136 --> 00:38:45,986 You could execute an XPath query on this with the XPath method. 407 00:38:46,986 --> 00:38:58,976 And you could say pizzas item name equals 408 00:38:59,516 --> 00:39:14,136 [ Background Sounds ] 409 00:39:14,636 --> 00:39:16,906 And let's see what that gives us. 410 00:39:17,516 --> 00:39:31,776 [ Background Sounds ] 411 00:39:32,276 --> 00:39:35,286 So let's put another one in here just to make sure 412 00:39:35,286 --> 00:39:35,976 that we're not getting the wrong one. 413 00:39:36,516 --> 00:39:42,586 [ Background Sounds ] 414 00:39:43,086 --> 00:39:43,746 That's another one. 415 00:39:44,926 --> 00:39:45,976 I'll add tomato and cheese. 416 00:39:46,516 --> 00:39:58,776 [ Background Sounds ] 417 00:39:59,276 --> 00:40:00,396 That one's cheaper. 418 00:40:01,066 --> 00:40:01,976 Nine seventy five. 419 00:40:02,516 --> 00:40:12,686 [ Background Sounds ] 420 00:40:13,186 --> 00:40:15,376 Okay, we're still getting the correct, 421 00:40:15,826 --> 00:40:18,496 assuming that you have the name of the pizza here 422 00:40:18,496 --> 00:40:20,636 and you already know what you are getting pizzas, 423 00:40:21,256 --> 00:40:24,746 we're getting the right pizza element here. 424 00:40:25,276 --> 00:40:35,826 And let's say that we have pizza size in a variable 425 00:40:36,736 --> 00:40:41,616 and it contains either the word large or the word small, 426 00:40:42,096 --> 00:41:00,976 then you could do the set we-- 427 00:41:01,516 --> 00:41:14,676 [ Background Sounds ] 428 00:41:15,176 --> 00:41:26,336 So now the pizza we want is indicated or is this array 429 00:41:26,336 --> 00:41:31,176 or this result right here with a single element 430 00:41:31,176 --> 00:41:34,586 that is now available inside the pizza we want variable, 431 00:41:35,226 --> 00:41:39,066 so if we wanted to get at the pizza size 432 00:41:39,396 --> 00:41:43,976 that we did then we should be able to-- 433 00:41:44,516 --> 00:42:03,556 [ Background Sounds ] 434 00:42:04,056 --> 00:42:05,526 Pizza we want. 435 00:42:06,246 --> 00:42:10,266 And this is an array so we have to do zero, 436 00:42:10,266 --> 00:42:12,816 and we have to iterate into the array in order 437 00:42:12,816 --> 00:42:15,946 to get the first object out. 438 00:42:17,036 --> 00:42:20,576 It just so happens that there's only one result. 439 00:42:20,576 --> 00:42:22,316 You might want to find want to find 440 00:42:22,316 --> 00:42:26,826 out how many XPath results there are in which case you'd want 441 00:42:26,826 --> 00:42:33,876 to do count of the array and in this case it'll do one 442 00:42:34,106 --> 00:42:37,976 because there's only one result. 443 00:42:38,516 --> 00:42:47,706 [ Background Sounds ] 444 00:42:48,206 --> 00:42:53,086 And if we want to get at the, let's put the small size in just 445 00:42:53,086 --> 00:42:53,976 so that we know we're getting the right one. 446 00:42:54,516 --> 00:43:05,936 [ Background Sounds ] 447 00:43:06,436 --> 00:43:08,976 So for broccoli it's six eighty five. 448 00:43:09,516 --> 00:43:16,546 [ Background Sounds ] 449 00:43:17,046 --> 00:43:20,566 And we want to get at the pizza size. 450 00:43:21,516 --> 00:43:28,666 [ Background Sounds ] 451 00:43:29,166 --> 00:43:31,356 And it echoes out ten eight five. 452 00:43:32,146 --> 00:43:37,236 So now what if you wanted to get two of these 453 00:43:37,896 --> 00:43:41,766 and then print that out? 454 00:43:45,456 --> 00:43:50,596 If I do this, if I get ten eighty five times two I get 455 00:43:50,646 --> 00:43:55,926 twenty so there's something funky going on there and it has 456 00:43:55,926 --> 00:43:57,546 to do with the type conversion. 457 00:43:57,546 --> 00:44:03,826 When you get things out of XML, they have to be converted 458 00:44:03,826 --> 00:44:08,766 into the form that you want to use it in PHP. 459 00:44:08,766 --> 00:44:11,886 So let's say that we want to-- 460 00:44:12,516 --> 00:44:18,936 [ Background Sounds ] 461 00:44:19,436 --> 00:44:19,976 Store it as a float. 462 00:44:20,516 --> 00:44:36,476 [ Background Sounds ] 463 00:44:36,976 --> 00:44:39,146 Okay, so now we get a better answer. 464 00:44:39,146 --> 00:44:42,526 You can see it's twenty-one point seven, 465 00:44:42,976 --> 00:44:49,206 but floats are approximations and that's a big problem 466 00:44:49,206 --> 00:44:52,066 with money if you're approximating with cents. 467 00:44:52,066 --> 00:44:54,216 Now grant it with a pizza restaurant, 468 00:44:54,786 --> 00:44:57,096 you're probably not going to get into the quantities 469 00:44:57,096 --> 00:44:58,446 where it's really going to matter 470 00:44:58,796 --> 00:45:05,196 but when you're building things for clients you should assume 471 00:45:05,196 --> 00:45:08,236 that it's really important for you not to mess 472 00:45:08,326 --> 00:45:13,396 with their money, so in this case it might actually be smart 473 00:45:13,396 --> 00:45:17,926 for you to think twice about storing this as a float 474 00:45:17,926 --> 00:45:20,076 and dealing with it as a float. 475 00:45:20,756 --> 00:45:24,356 Floats are always, 476 00:45:24,546 --> 00:45:27,446 approximations are always one number divided by another number 477 00:45:27,586 --> 00:45:29,956 and it's that what you're getting is the number that's 478 00:45:29,986 --> 00:45:33,536 closest to whatever that is and if you add enough 479 00:45:33,536 --> 00:45:35,786 of them together eventually you'll get a rounding error. 480 00:45:36,476 --> 00:45:40,596 You might get two numbers that add 481 00:45:40,596 --> 00:45:45,466 up to ten point nine nine instead of adding up to eleven. 482 00:45:46,096 --> 00:45:50,866 So instead, what we could do is store it like this, 483 00:45:51,686 --> 00:45:59,556 in pennies because pennies are quantifiable and then 484 00:45:59,796 --> 00:46:03,196 at the point where we actually display it 485 00:46:03,776 --> 00:46:10,796 out to the screen we can still divide it by 100 486 00:46:10,796 --> 00:46:12,726 and still get twenty-one point seven 487 00:46:13,216 --> 00:46:16,206 and at this point you might be wondering how you get it 488 00:46:16,686 --> 00:46:25,506 to format the right way and there's in some 489 00:46:25,956 --> 00:46:36,626 of the model code for this section, app model-- 490 00:46:37,516 --> 00:46:47,036 [ Background Sounds ] 491 00:46:47,536 --> 00:46:52,976 So this function, sprintf, is often used to format strings. 492 00:46:53,516 --> 00:47:04,366 [ Background Sounds ] 493 00:47:04,866 --> 00:47:17,056 You can also use number format and which takes a number 494 00:47:18,016 --> 00:47:23,966 and then a number of decimals so let's try that. 495 00:47:24,516 --> 00:47:41,996 [ Background Sounds ] 496 00:47:42,496 --> 00:47:48,946 Okay. So now we need a dollar sign. 497 00:47:49,406 --> 00:47:54,176 If you put it in single quotes the dollar sign will appear 498 00:47:54,176 --> 00:47:55,336 as you want. 499 00:47:55,626 --> 00:47:59,256 If you put it in double quotes, then you'll kind 500 00:47:59,256 --> 00:48:02,776 of confuse PHP a little bit but it'll probably be okay 501 00:48:03,166 --> 00:48:06,626 because when you use double quotes, it interpolates it. 502 00:48:07,136 --> 00:48:10,396 So actually here I shouldn't be using double quotes, 503 00:48:10,436 --> 00:48:12,606 I should be using single quotes 504 00:48:12,666 --> 00:48:16,646 because every time you use double quotes on a string, 505 00:48:16,646 --> 00:48:19,006 PHP wastes a few clock cycles trying to see 506 00:48:19,006 --> 00:48:22,246 if there is a variable in there that it needs to interpolate, 507 00:48:22,776 --> 00:48:25,726 but let's see if this works. 508 00:48:25,986 --> 00:48:26,836 Yeah, that works okay. 509 00:48:27,436 --> 00:48:32,166 So now you can display the total out to the screen 510 00:48:32,696 --> 00:48:36,746 but if you do all your math in terms of pennies, 511 00:48:36,746 --> 00:48:39,136 then you'll never get any rounding errors 512 00:48:39,136 --> 00:48:39,936 or anything like that. 513 00:48:40,416 --> 00:48:46,046 You might want to use the ceil function in order to get 514 00:48:47,376 --> 00:48:52,076 to the ceiling if you're rounding things. 515 00:48:52,236 --> 00:48:56,566 You might want to get to the floor function if you want 516 00:48:56,566 --> 00:48:58,936 to round to the floor. 517 00:49:00,296 --> 00:49:12,236 In general, you're going to have to somehow create a way 518 00:49:12,236 --> 00:49:20,266 to display the menu and then make a way for a user 519 00:49:20,266 --> 00:49:26,546 to select an item and pass a unique identifier of that item 520 00:49:26,916 --> 00:49:35,046 to the user or to the server and one way that you can do that is 521 00:49:35,126 --> 00:49:44,106 by passing each of these parameters at git parameters. 522 00:49:44,246 --> 00:49:51,036 So you could do a level one equals pizzas and level two, 523 00:49:51,496 --> 00:49:59,066 or you could even, since each of this is a separate category, 524 00:49:59,736 --> 00:50:02,496 you could say, instead of calling these pizzas, 525 00:50:03,356 --> 00:50:11,636 you just get rid of the item and instead call this pizza. 526 00:50:12,776 --> 00:50:18,066 Now you have a really simple categorization 527 00:50:18,766 --> 00:50:25,676 where when you're displaying the pizzas menu you can pass 528 00:50:25,676 --> 00:50:31,886 in the menu name and then pass in the name 529 00:50:31,886 --> 00:50:33,536 of the element you want to select 530 00:50:33,606 --> 00:50:36,966 and then the relevant price and you'll have 531 00:50:36,966 --> 00:50:42,076 to keep track using the session, a variable. 532 00:50:42,076 --> 00:50:43,806 You'll have to keep track 533 00:50:43,806 --> 00:50:47,276 of what is stored in the user's cart. 534 00:50:47,386 --> 00:50:51,446 You can go back to previous sections code if you want 535 00:50:52,466 --> 00:50:57,536 to see a few examples of that. 536 00:50:57,766 --> 00:51:08,726 So in six, sorry, no-- in six twenty-seven we talked 537 00:51:08,726 --> 00:51:14,936 about session so in here you can go through these examples 538 00:51:14,936 --> 00:51:21,066 in order to see how to use the session on variable. 539 00:51:21,276 --> 00:51:25,766 The basic gist of it is that you need to call session start 540 00:51:25,766 --> 00:51:29,696 at the very top of the code and since you're going 541 00:51:29,796 --> 00:51:39,456 to be using templates, you'll want to do this in one template 542 00:51:39,456 --> 00:51:45,056 and then include that in all of pages that the user sees 543 00:51:45,426 --> 00:51:51,806 so that all of the users don't see each other's carts. 544 00:51:52,776 --> 00:51:59,076 One little thing to think about is that the session, 545 00:51:59,696 --> 00:52:05,506 the way the session works is that it's literally a folder 546 00:52:05,506 --> 00:52:10,396 on the server that is named like a long number 547 00:52:10,396 --> 00:52:15,746 and that long number equals a number that is stored 548 00:52:15,746 --> 00:52:20,046 on the user's computer in a cookie that is sent along 549 00:52:20,046 --> 00:52:26,396 with the request to the server and so if you think 550 00:52:26,396 --> 00:52:30,836 about every single user having a different number 551 00:52:30,836 --> 00:52:37,016 and a different folder on the browser, then you'll see 552 00:52:37,016 --> 00:52:41,386 that you probably don't want to store the menu 553 00:52:41,896 --> 00:52:45,586 in the session variable because essentially then what you'll be 554 00:52:45,586 --> 00:52:50,796 doing is for user one, two, three, you'll store a menu 555 00:52:51,166 --> 00:52:55,896 and then for user one, two, four you'll store the same menu 556 00:52:55,896 --> 00:52:59,046 and so there'll be a lot 557 00:52:59,046 --> 00:53:02,516 of storage duplication if you do that. 558 00:53:02,926 --> 00:53:10,336 Instead, you should think of a way to generate the views 559 00:53:10,336 --> 00:53:19,686 from the XML in realtime or cash them in some other way. 560 00:53:19,906 --> 00:53:25,516 And so that you aren't unnecessarily burdening the 561 00:53:25,626 --> 00:53:29,596 server with the details of the menu. 562 00:53:30,056 --> 00:53:43,006 So let's see, I wanted to show you a few different XPath tools 563 00:53:44,146 --> 00:53:56,736 so if you go to GitHub dot come slash codekiln slash s75 hyphen 564 00:53:56,776 --> 00:54:02,046 sections you can get all of the code for each of the sections 565 00:54:02,046 --> 00:54:05,446 and then down here on under XPath, 566 00:54:06,026 --> 00:54:09,336 there are a few different tips. 567 00:54:09,906 --> 00:54:19,616 Here you can use this add-on called scraper in order to test 568 00:54:19,616 --> 00:54:24,066 out XPath so you'd open up Chrome 569 00:54:24,066 --> 00:54:29,966 and you'd say add to Chrome and then-- 570 00:54:30,516 --> 00:54:36,106 [ Background Sounds ] 571 00:54:36,606 --> 00:54:36,976 I have all these-- 572 00:54:37,516 --> 00:54:52,706 [ Background Sounds ] 573 00:54:53,206 --> 00:54:53,976 Oh yeah, I messed with the source. 574 00:54:54,516 --> 00:55:04,126 [ Background Sounds ] 575 00:55:04,626 --> 00:55:10,986 Okay, so what scraper is good for is that if you come 576 00:55:10,986 --> 00:55:13,736 to a page like this which has the list 577 00:55:13,736 --> 00:55:16,696 of all the postal abbreviations and let's say you were working 578 00:55:16,696 --> 00:55:20,766 on a project where you needed a dropdown list that had all 579 00:55:20,766 --> 00:55:23,546 of the postal codes in it and you wanted your users 580 00:55:23,546 --> 00:55:26,496 to select the postal codes, 581 00:55:26,496 --> 00:55:31,026 then if you have the scraper extension installed you can 582 00:55:31,026 --> 00:55:33,546 right click on an element and say scrape similar 583 00:55:34,586 --> 00:55:39,056 and you can say it gives you a good guess of the XPath 584 00:55:39,626 --> 00:55:46,216 that lets you scrape all of those postal abbreviations. 585 00:55:46,516 --> 00:55:47,956 Here you can see kind of what it's doing. 586 00:55:47,956 --> 00:55:51,526 Alabama AL, ALA dot ALA dot oh one. 587 00:55:52,196 --> 00:55:54,486 That's just reading this very first row, 588 00:55:55,056 --> 00:55:57,076 but if you press control shift c 589 00:55:57,076 --> 00:56:01,926 and examine the element you can guess that it's always going 590 00:56:01,926 --> 00:56:05,976 to be the second table data element in this table 591 00:56:06,126 --> 00:56:08,366 that contains this postal abbreviations. 592 00:56:09,106 --> 00:56:13,556 So maybe you could say you want just the second one 593 00:56:13,666 --> 00:56:17,956 and then you realize that it already has a predicate limiting 594 00:56:17,956 --> 00:56:23,046 you to the very first table row so now when you remove 595 00:56:23,046 --> 00:56:28,746 that predicate, you get all of the states and you can copy 596 00:56:28,816 --> 00:56:33,856 from there into a tool like notepad plus plus 597 00:56:34,866 --> 00:56:39,196 and here you can use regular expressions 598 00:56:39,966 --> 00:56:44,306 to clean up the text. 599 00:56:44,996 --> 00:56:49,726 If you select regular expression in notepad plus plus, 600 00:56:49,886 --> 00:56:54,686 you're able to use regular expression keywords 601 00:56:55,206 --> 00:57:01,456 like backslash w is a nonword character, 602 00:57:01,456 --> 00:57:03,556 you can see there are a couple of those, 603 00:57:04,106 --> 00:57:07,506 and then I could do a digit character followed 604 00:57:07,506 --> 00:57:11,216 by a digit character that may or may not be there followed 605 00:57:11,216 --> 00:57:14,316 by another nonword character and if I replace all of those 606 00:57:14,316 --> 00:57:23,346 by nothing now I have all of my abbreviations and a few extras 607 00:57:23,436 --> 00:57:27,336 because it includes like minor outlying islands 608 00:57:27,336 --> 00:57:28,376 and stuff like that as well. 609 00:57:28,586 --> 00:57:32,736 So at this point you could paste it into your PHP code 610 00:57:33,106 --> 00:57:36,646 and make a select where each of these is an option 611 00:57:36,646 --> 00:57:38,996 that you could drop down. 612 00:57:39,256 --> 00:57:45,046 Another example of using scraper, you can, 613 00:57:45,196 --> 00:57:56,016 if you are on a rating site and here they make it pretty hard 614 00:57:56,566 --> 00:58:03,346 to just get a list of all the people, they have it here 615 00:58:03,346 --> 00:58:07,866 on the page but if you wanted to actually make a list of each 616 00:58:07,866 --> 00:58:11,256 of this people, you'd have to type it out one by one 617 00:58:11,256 --> 00:58:18,446 or copy it out one by one, and if you select here 618 00:58:18,866 --> 00:58:25,856 and do scrape similar, it gives you a guess but if you look 619 00:58:25,856 --> 00:58:28,616 at the search code, you can see that they've obfuscated it. 620 00:58:28,616 --> 00:58:32,216 They've put tables within tables within tables. 621 00:58:33,596 --> 00:58:42,626 And so if you go down and you notice that the TR here, 622 00:58:42,986 --> 00:58:45,776 the table row, has a height 623 00:58:46,066 --> 00:59:02,076 of thirty then now you could search for, 624 00:59:02,616 --> 00:59:07,056 and if you do two forward slashes that means all elements 625 00:59:07,056 --> 00:59:11,256 where this matches, so I'm going to look for the TRs, 626 00:59:12,206 --> 00:59:16,366 all of the TRs in the document would return tons and tons 627 00:59:16,366 --> 00:59:19,426 of TRs, and you can see some of them are in there. 628 00:59:19,816 --> 00:59:21,016 We want a subset of that. 629 00:59:21,576 --> 00:59:28,606 We want the TRs where there's an attribute height equal to thirty 630 00:59:29,996 --> 00:59:32,606 and now you have the same list. 631 00:59:32,996 --> 00:59:36,756 You can copy it and paste it 632 00:59:36,756 --> 00:59:39,656 in the notepad plus plus and clean it. 633 00:59:39,656 --> 00:59:42,066 Up here I'll do another [inaudible] example. 634 00:59:42,066 --> 00:59:46,516 We'll do a nonword character followed by a digit followed 635 00:59:46,516 --> 00:59:50,716 by another possible digit followed by a nonword character. 636 00:59:50,716 --> 00:59:51,776 Let's see how far that gets us. 637 00:59:52,866 --> 00:59:55,996 Now we have another digit followed 638 00:59:56,226 --> 01:00:00,936 by a literal period followed by another nonword character 639 01:00:01,496 --> 01:00:03,796 and I believe there is another digit 640 01:00:03,796 --> 01:00:06,576 and the question mark means zero or one of these 641 01:00:07,646 --> 01:00:09,886 so now we've got that. 642 01:00:12,096 --> 01:00:19,546 So now you have your list if you wanted to do a quick blog post 643 01:00:19,546 --> 01:00:23,866 about that or whatever or do a Google search on each of those. 644 01:00:24,506 --> 01:00:28,386 So scraper is a great way to practice your XPath skills. 645 01:00:28,456 --> 01:00:34,716 In fact, you can even open up the XML 646 01:00:34,856 --> 01:00:39,296 for your menu in your browser. 647 01:00:39,366 --> 01:00:45,906 You'll have to make sure that it has the right permissions. 648 01:00:47,256 --> 01:00:52,566 So if you do l s dash l you can it is not world readable 649 01:00:52,866 --> 01:01:03,626 so we chmod six forty four menu dot XML and now we'll go back 650 01:01:03,626 --> 01:01:09,746 to the sections and menu dot XML is here and you can see 651 01:01:09,746 --> 01:01:13,866 that it doesn't have any style information associated with it. 652 01:01:14,406 --> 01:01:17,936 Here if you press control shift c-- 653 01:01:18,516 --> 01:01:24,856 [ Background Sounds ] 654 01:01:25,356 --> 01:01:31,026 Well, this is not the raw XML by any means. 655 01:01:31,586 --> 01:01:36,456 I was thinking that you'd be able to actually use XPath right 656 01:01:36,456 --> 01:01:39,166 on the thing but it doesn't look like you'll be able to. 657 01:01:39,166 --> 01:01:43,526 But I did want to point out that the XPath that you're able 658 01:01:43,656 --> 01:01:50,166 to get in scraper you're also able to get 659 01:01:50,166 --> 01:01:53,686 at using this search elements dialogue in Chrome 660 01:01:54,126 --> 01:01:57,586 so if you click here and right click, 661 01:01:58,386 --> 01:02:02,376 like let's say we right click on this a, this anchor element 662 01:02:02,376 --> 01:02:05,226 that is for the PHP manual and you do copy XPath 663 01:02:05,716 --> 01:02:08,376 and then do search elements and paste it in 664 01:02:09,036 --> 01:02:15,476 and maybe remove some of the predicates then you can flip 665 01:02:15,576 --> 01:02:16,946 through the different matches. 666 01:02:16,946 --> 01:02:23,876 Here's the introduction match and it gives you a good guess. 667 01:02:23,876 --> 01:02:30,696 Here we have the star operator which matches any element 668 01:02:30,696 --> 01:02:35,616 and then we're putting a predicate on id equals left bar 669 01:02:35,886 --> 01:02:41,576 and then whatever element has an id attribute equal to left bar, 670 01:02:41,656 --> 01:02:45,926 we're looking at the elements that have a ul child 671 01:02:45,926 --> 01:02:48,626 and an li child and then finally an a child. 672 01:02:49,116 --> 01:02:53,386 So you'll get pretty comfortable with XPath 673 01:02:53,676 --> 01:02:57,826 in this assignment, hopefully you will. 674 01:02:57,826 --> 01:03:03,826 If you don't do something terribly work-aroundy you will. 675 01:03:04,126 --> 01:03:06,996 And so do you guys have any questions 676 01:03:06,996 --> 01:03:11,826 about XPath or XML in PHP? 677 01:03:11,826 --> 01:03:15,766 I think we've covered everything that you basically need to know. 678 01:03:15,766 --> 01:03:18,616 We're going to be online answering questions 679 01:03:18,616 --> 01:03:18,976 and stuff as well. 680 01:03:19,516 --> 01:03:23,516 [ Background Sounds ] 681 01:03:24,016 --> 01:03:27,000 [ Inaudible Comment ] 682 01:03:27,326 --> 01:03:27,686 Yeah. 683 01:03:28,516 --> 01:03:49,906 [ Inaudible Comment ] 684 01:03:50,406 --> 01:03:55,426 Yes. So the question was, does the spec include the requirement 685 01:03:55,756 --> 01:03:57,196 that you have an ability 686 01:03:57,276 --> 01:04:00,096 to see your entire cart before you check out 687 01:04:00,606 --> 01:04:04,366 and I haven't read the latest version of the spec in detail 688 01:04:04,726 --> 01:04:06,466 but I believe it does. 689 01:04:06,536 --> 01:04:11,226 Previous years have had that requirement and so you'll want 690 01:04:11,226 --> 01:04:15,836 to make a page that enables you to see the contents of your cart 691 01:04:16,196 --> 01:04:18,986 and that enables you to add things to you cart 692 01:04:18,986 --> 01:04:22,676 and subtract things from your cart before checking out. 693 01:04:23,216 --> 01:04:26,006 That's a good question. 694 01:04:26,006 --> 01:04:30,146 And let's just take a look at that file. 695 01:04:31,516 --> 01:04:54,356 [ Inaudible Comment ] 696 01:04:54,856 --> 01:05:01,826 So the question was, so the general format of the project is 697 01:05:01,856 --> 01:05:07,076 to create a categorization of the menu in XML and then 698 01:05:07,246 --> 01:05:11,856 to use PHP to pull the information from the XML 699 01:05:11,856 --> 01:05:14,596 and then display it out to the page 700 01:05:15,056 --> 01:05:19,536 and the use PHP's section functionality in order 701 01:05:19,536 --> 01:05:21,736 to store the information about the cart 702 01:05:21,736 --> 01:05:25,866 that the user is interacting 703 01:05:25,866 --> 01:05:28,116 with through separate page requests 704 01:05:28,116 --> 01:05:31,506 and then finally providing them with the ability to check 705 01:05:31,506 --> 01:05:33,146 out and clear their cart. 706 01:05:33,146 --> 01:05:34,926 Is that kind of your-- you were just trying 707 01:05:34,926 --> 01:05:35,966 to clarify the process? 708 01:05:36,666 --> 01:05:37,776 Yeah, that's generally it. 709 01:05:38,516 --> 01:05:49,546 [ Inaudible Comment ] 710 01:05:50,046 --> 01:05:51,976 Can you say that last part, whatever you selected what? 711 01:05:52,516 --> 01:06:03,736 [ Inaudible Comment ] 712 01:06:04,236 --> 01:06:07,446 So the question is, should I make 713 01:06:07,526 --> 01:06:11,356 so that you can select several items and then log out 714 01:06:11,356 --> 01:06:14,756 and then log back in and then still have those items selected 715 01:06:15,216 --> 01:06:18,666 and the answer to that is that you don't have any logging in 716 01:06:18,666 --> 01:06:20,786 and logging out functionality in this application. 717 01:06:20,786 --> 01:06:22,236 If you want to do that, that's above 718 01:06:22,236 --> 01:06:27,256 and beyond this spec. This spec is only to implement the cart. 719 01:06:27,256 --> 01:06:31,076 So in this case, this application is kind 720 01:06:31,076 --> 01:06:33,496 of a trivial ecommerce site 721 01:06:33,496 --> 01:06:36,186 because in a real ecommerce site we would be gathering credit 722 01:06:36,186 --> 01:06:38,136 card information and you wouldn't want 723 01:06:38,136 --> 01:06:39,566 to gather credit card information 724 01:06:39,566 --> 01:06:43,126 without confirming a user's e-mail address and stuff 725 01:06:43,126 --> 01:06:46,456 like that and you probably won't want to go that far 726 01:06:46,456 --> 01:06:51,106 in this assignment because the details of sending mail 727 01:06:51,186 --> 01:06:56,206 through a server that's running on your own computer 728 01:06:56,506 --> 01:06:59,476 and getting it to actually arrive in a real e-mail inbox, 729 01:06:59,476 --> 01:07:00,696 that's pretty complicated 730 01:07:00,696 --> 01:07:02,566 and that's beyond the scope of this project. 731 01:07:02,666 --> 01:07:07,676 It can be one but it's a more complicated development 732 01:07:07,726 --> 01:07:16,296 situation than we really have the time to deal with. 733 01:07:16,296 --> 01:07:19,466 Does that pretty much-- yeah. 734 01:07:19,466 --> 01:07:23,266 So there is so much to work with here. 735 01:07:23,266 --> 01:07:30,486 If I was going to sit down tonight with a student 736 01:07:30,486 --> 01:07:32,006 who didn't know where to start, 737 01:07:32,006 --> 01:07:38,046 I would say first develop your menu XML, develop a menu XML, 738 01:07:38,046 --> 01:07:42,266 don't develop the entire menu, just develop a menu XML, 739 01:07:42,266 --> 01:07:45,566 if it has like ten items in it or something. 740 01:07:45,896 --> 01:07:45,976 So-- 741 01:07:46,516 --> 01:07:54,566 [ Writing on Board ] 742 01:07:55,066 --> 01:07:59,956 And then render menu and then render way to select items 743 01:08:00,376 --> 01:08:10,236 and then add ability to put in cart and then add the ability 744 01:08:10,696 --> 01:08:15,136 to check out and what check out means in the case 745 01:08:15,136 --> 01:08:18,706 of this assignment is telling the user, 746 01:08:18,706 --> 01:08:23,546 you have purchased this amount, it will be billed 747 01:08:24,326 --> 01:08:30,976 to your e-mail account or to your credit card or whatever 748 01:08:31,306 --> 01:08:38,186 and then you should call session destroy and clear the session 749 01:08:38,286 --> 01:08:43,556 so that if they go through another purchase they'll be able 750 01:08:43,556 --> 01:08:44,726 to fill up their cart again. 751 01:08:44,926 --> 01:08:49,816 And once you get to this point where you'll actually able 752 01:08:49,816 --> 01:08:54,136 to render ten items and render a way to select them, 753 01:08:54,136 --> 01:08:57,656 add an ability to put in the cart and then check it out 754 01:08:57,656 --> 01:09:06,106 and call session destroy, then you can add a few more items 755 01:09:06,306 --> 01:09:08,876 for edge cases and, you know, so step six would be iterate 756 01:09:08,876 --> 01:09:15,266 and inflate the menu and change the rendering for the bugs 757 01:09:15,966 --> 01:09:18,196 that you get when you inflate the rendering. 758 01:09:18,196 --> 01:09:21,196 And if you can close this circle at least once before you get 759 01:09:21,196 --> 01:09:23,696 to the point where you're trying 760 01:09:24,466 --> 01:09:29,316 to render all the different categories and dealing 761 01:09:29,316 --> 01:09:35,136 with all the subtle things, you will get a lot farther 762 01:09:35,136 --> 01:09:38,016 and you will understand the scope 763 01:09:38,016 --> 01:09:40,956 of the project before because, you know, you can get really, 764 01:09:41,656 --> 01:09:47,906 really involved with the menu if you want to and it's best not 765 01:09:48,026 --> 01:09:53,006 to get hung up in any one of the steps. 766 01:09:53,006 --> 01:09:54,856 So it's seven twenty-five. 767 01:09:54,856 --> 01:09:59,186 I think that's probably as much as have time for tonight. 768 01:09:59,186 --> 01:10:02,416 Is there any more questions? 769 01:10:02,416 --> 01:10:07,836 If not, we can take them offline. 770 01:10:07,836 --> 01:10:10,206 So good luck on the project. 771 01:10:10,206 --> 01:10:12,566 Get started tonight, tomorrow. 772 01:10:12,566 --> 01:10:16,976 The 18th is just a week, a little over a week away 773 01:10:16,976 --> 01:10:19,946 so that means that, you know, if you can close this loop 774 01:10:20,066 --> 01:10:24,786 by Friday and get the questions to us 775 01:10:24,786 --> 01:10:28,046 on Saturday then you can spend the next three days kind 776 01:10:28,046 --> 01:10:32,006 of trying to figure out the submission process and trying 777 01:10:32,036 --> 01:10:38,186 to figure out the permissions on the server and all of this 778 01:10:38,186 --> 01:10:39,946 like kind of tricky things. 779 01:10:39,946 --> 01:10:44,966 You should allocate, if you've never worked with Linux before, 780 01:10:44,966 --> 01:10:52,516 you should probably allocate like at least 15 percent of all 781 01:10:52,546 --> 01:10:54,136 of your time to deployment. 782 01:10:54,136 --> 01:10:55,116 If not more. 783 01:10:55,116 --> 01:10:58,046 Maybe 20 or 25 percent. 784 01:10:58,386 --> 01:11:01,486 The very first time you deploy to the assignments 785 01:11:01,696 --> 01:11:03,666 in this class, you'll find that that is really hard 786 01:11:03,726 --> 01:11:06,746 and that is not unlike real life. 787 01:11:06,746 --> 01:11:08,836 When you actually deploy a website, 788 01:11:08,836 --> 01:11:10,536 it is usually not painless. 789 01:11:10,536 --> 01:11:12,326 It's usually a tricky process. 790 01:11:12,326 --> 01:11:14,926 So in general with web development projects, 791 01:11:15,366 --> 01:11:21,596 you should allocate at least 15 percent of your time 792 01:11:21,796 --> 01:11:28,456 to deployment, I mean, unless it's a huge project 793 01:11:28,766 --> 01:11:34,406 in which case 15 percent, you know, it's only going 794 01:11:34,496 --> 01:11:40,616 to take a fixed amount of time probably so. 795 01:11:40,616 --> 01:11:43,336 Alright, that's about everything. 796 01:11:43,476 --> 01:11:49,996 Thank you for your attention and thank you for your patience 797 01:11:49,996 --> 01:11:54,166 with our technical difficulties. 798 01:11:54,166 --> 01:12:10,456 We'll attempt to get them resolved before next week. 799 01:12:10,976 --> 01:12:13,776 Thanks so much.