1 00:00:07,760 --> 00:00:12,820 Hey guys this is Kaleigh with slopes and in this video we're going to access the flicker API. 2 00:00:12,860 --> 00:00:15,230 That's what we're going to use to download photos by the way. 3 00:00:15,230 --> 00:00:18,620 If you didn't know already you probably did because I've said it like 100 times. 4 00:00:18,720 --> 00:00:21,260 Anyway we're going to access the flicker API. 5 00:00:21,410 --> 00:00:25,860 We're going to get ourselves an API key and then I'm going to show you how the Flickr API is you Arel 6 00:00:25,880 --> 00:00:31,060 scheme works so that you know how you can download photos exactly the way you want to. 7 00:00:31,070 --> 00:00:36,380 So go ahead and pull open your Safari browser and we're actually going to go ahead and go to Flickr 8 00:00:36,380 --> 00:00:40,110 dot com slash services slash developer. 9 00:00:40,160 --> 00:00:42,440 And this is the Flickr developer guide. 10 00:00:42,440 --> 00:00:43,870 There's all kinds of information. 11 00:00:43,870 --> 00:00:47,180 They have a pretty good community business attributes. 12 00:00:47,210 --> 00:00:49,030 They have all this stuff. 13 00:00:49,070 --> 00:00:53,240 The only thing you need to know is that actually you need to log into a Yahoo account because Flickr 14 00:00:53,240 --> 00:00:54,630 is owned by Yahoo. 15 00:00:54,980 --> 00:01:00,350 So once you log into your Yahoo account you can go here and click on API. 16 00:01:00,350 --> 00:01:07,830 Once that load you can click on request an API key OK and we're gonna go to get your API. 17 00:01:07,930 --> 00:01:09,570 The number one option. 18 00:01:09,640 --> 00:01:11,110 Now there are two options here. 19 00:01:11,120 --> 00:01:14,720 Commercial commercial or noncommercial. 20 00:01:14,740 --> 00:01:17,750 Now that's for us our app does not make money. 21 00:01:17,800 --> 00:01:22,150 You could also use this though if your app does make money but you're a family run smaller independent 22 00:01:22,150 --> 00:01:22,870 business. 23 00:01:23,050 --> 00:01:27,550 You're developing a product which is not currently commercial but might be in the future or you're building 24 00:01:27,550 --> 00:01:30,300 a personal web site or blog where you're only using your own images. 25 00:01:30,310 --> 00:01:31,900 But our app doesn't make money. 26 00:01:31,900 --> 00:01:35,500 That's us so let's apply for a noncommercial key. 27 00:01:35,740 --> 00:01:36,000 OK. 28 00:01:36,000 --> 00:01:42,220 Now of course this shows you're the owner of the account the name of our app is pixel city and we're 29 00:01:42,220 --> 00:01:51,890 building an app that downloads photos from the internet and displays them for a location. 30 00:01:52,600 --> 00:01:55,850 Pretty simple little description. 31 00:01:56,020 --> 00:01:57,850 And let's go ahead and let's check this. 32 00:01:57,840 --> 00:02:02,800 I acknowledge that flicker members own all rights to their content and it's my responsibility to make 33 00:02:02,800 --> 00:02:06,340 sure that my project does not contravene those rights. 34 00:02:06,340 --> 00:02:10,500 That's where that's what we're doing we're not using the photos for anything other than displaying them. 35 00:02:10,630 --> 00:02:15,840 And we also agree to comply with the flicker terms of use press submit. 36 00:02:16,080 --> 00:02:22,920 And as soon as it loads boom there's our API key there is our secret and all we're going to actually 37 00:02:22,920 --> 00:02:25,350 mean is the API key. 38 00:02:25,410 --> 00:02:32,610 So we are now at a point where we can create a Constans file on our project and we can use that to basically 39 00:02:32,610 --> 00:02:34,590 store our API key for use. 40 00:02:34,590 --> 00:02:38,260 So let's go ahead and pull open our tax code project really quickly. 41 00:02:38,400 --> 00:02:41,880 We'll go back to the API and we'll look at how the work in just a second. 42 00:02:42,000 --> 00:02:48,630 But for now we're going to go into the utilities folder and create a new file click swift file and we're 43 00:02:48,630 --> 00:02:55,080 going to call this Constance and these are going to be used for things that maybe we use a lot and you 44 00:02:55,080 --> 00:02:59,970 know when we go back we can actually use this photocell identifier as a constant. 45 00:03:00,000 --> 00:03:03,130 We use it more than one time drop a pin. 46 00:03:03,180 --> 00:03:04,430 We use that more than one time. 47 00:03:04,440 --> 00:03:09,940 We can create a constant that basically makes our app a little less strongly. 48 00:03:09,990 --> 00:03:15,330 When you read type strings it can cause problems if you mistype it here or mis type it here it's better 49 00:03:15,330 --> 00:03:20,010 to create one constant variable and then call that variable because you can't mistype the variable things 50 00:03:20,010 --> 00:03:22,270 to auto complete. 51 00:03:22,530 --> 00:03:24,920 But anyway let's go create one for our API. 52 00:03:25,320 --> 00:03:26,060 So in here. 53 00:03:26,130 --> 00:03:29,460 Go ahead and just type let API key. 54 00:03:29,700 --> 00:03:34,810 And of course we're going to need to paste it from here so selector API key. 55 00:03:34,860 --> 00:03:36,510 Copy it and paste it. 56 00:03:36,870 --> 00:03:37,580 And that's that. 57 00:03:37,620 --> 00:03:38,720 There's your API key. 58 00:03:38,940 --> 00:03:39,840 Awesome. 59 00:03:39,900 --> 00:03:45,900 So that's saved in our app Let's go ahead and head back to flicker and we're going to go to what's called 60 00:03:45,900 --> 00:03:52,230 the flicker API Explorer which you can access by going to this very long you are l flicker dot com slash 61 00:03:52,230 --> 00:03:59,730 services slash API slash explore slash flicker dot photos that search flicker stuff flicker photos that 62 00:03:59,730 --> 00:04:03,780 search is actually the part of the API that we're going to use. 63 00:04:03,780 --> 00:04:12,540 The reason for that being is that you can pass in a latitude and longitude and a radius and it will 64 00:04:12,540 --> 00:04:18,410 allow you to find all photos within that latitudinal radius really really cool. 65 00:04:18,420 --> 00:04:27,240 Now the API Explorer here allows you to choose which parts of the potential options you want to add 66 00:04:27,240 --> 00:04:32,250 in the API call which is very cool you can see there's a lot of different options here. 67 00:04:32,490 --> 00:04:35,270 You can sort photos by the minimum upload date. 68 00:04:35,280 --> 00:04:40,980 Maybe you only want photos that are from this month or you can sort them by content type. 69 00:04:40,980 --> 00:04:42,470 Maybe you actually only want video. 70 00:04:42,480 --> 00:04:43,760 You can download those too. 71 00:04:44,070 --> 00:04:51,270 But for us we just want a Latitude Longitude a radius and we have to give the radius in a certain unit. 72 00:04:51,300 --> 00:04:58,410 So for example I'm just going to put in random coordinates here maybe 40 2.8 by one hundred twenty two 73 00:04:58,410 --> 00:05:05,820 point three and the radius we're going to make it a one mile radius whoops a 1 mile radius and let's 74 00:05:05,820 --> 00:05:08,800 just say that the unit will be Miles am I. 75 00:05:09,000 --> 00:05:13,380 If you want to use kilometers you can K.M. meters just and it's up to you. 76 00:05:13,380 --> 00:05:16,250 You can set it up to be whatever radius you want. 77 00:05:16,250 --> 00:05:18,090 That's the cool thing about the API. 78 00:05:18,390 --> 00:05:23,130 So we have now given it all of the properties we want and we want to see the output. 79 00:05:23,130 --> 00:05:29,460 Now in this app we're going to be working with Jay sunkissed that's just really easy to use with with 80 00:05:29,520 --> 00:05:33,690 iOS and so with Jaison we can get that output. 81 00:05:33,840 --> 00:05:37,540 Now something that you can see here that's very very cool. 82 00:05:37,590 --> 00:05:43,590 We can call this API we can make a call and download all the Jaison without even needing to sign it 83 00:05:43,620 --> 00:05:49,670 with my permissions or a user token or anything we can we can send it as anybody which is cool. 84 00:05:49,680 --> 00:05:53,320 So click do not sign call and then click call method. 85 00:05:54,680 --> 00:05:57,460 Now if we scroll down we'll see what happened. 86 00:05:57,620 --> 00:06:04,490 Looks like it's loading and it froze we're making too many API calls at once. 87 00:06:04,490 --> 00:06:05,750 No that's not true. 88 00:06:05,750 --> 00:06:07,550 I'm actually not sure why it's not loading. 89 00:06:07,550 --> 00:06:11,070 Let's go ahead and try reloading this bad boy. 90 00:06:15,570 --> 00:06:17,610 OK it really does not like me. 91 00:06:17,640 --> 00:06:18,530 This is weird. 92 00:06:24,330 --> 00:06:26,450 You can try one more time. 93 00:06:26,470 --> 00:06:28,430 So just try reloading it. 94 00:06:30,140 --> 00:06:31,680 And it's just going to keep getting stuck all right. 95 00:06:31,680 --> 00:06:37,320 Looks like I'm bringing in the big dogs and bringing in Chrome let's copy this URL Let's throw it in 96 00:06:37,320 --> 00:06:39,870 Chrome here and let's try it again. 97 00:06:39,870 --> 00:06:44,640 Sometimes when Safari does not work brick brick I have to go to Chrome. 98 00:06:44,700 --> 00:06:45,250 So sad. 99 00:06:45,270 --> 00:06:45,600 OK. 100 00:06:45,630 --> 00:06:46,650 Let's try it again. 101 00:06:46,660 --> 00:06:50,640 Latitude forty two point eight I think 122. 102 00:06:50,940 --> 00:06:54,810 We want that one twenty two point eight. 103 00:06:54,840 --> 00:06:56,280 The radius is one. 104 00:06:56,400 --> 00:06:58,210 The unit is Miles. 105 00:06:58,320 --> 00:07:02,330 We want this to output in Jaison and we're not going to sign the call. 106 00:07:02,370 --> 00:07:09,300 Go ahead and click call method and when you scroll down you'll see right here that you get a callback. 107 00:07:09,300 --> 00:07:12,740 Now of course the photo data is obscured for the moment. 108 00:07:12,870 --> 00:07:18,630 But when you actually call this in your app all of the photo information will be inside of this dictionary 109 00:07:18,690 --> 00:07:19,920 which is very cool. 110 00:07:20,130 --> 00:07:21,750 So you can see that this is working. 111 00:07:21,750 --> 00:07:24,290 We get a load of photos. 112 00:07:24,390 --> 00:07:27,320 We get all kinds of information. 113 00:07:27,420 --> 00:07:28,230 And you know what. 114 00:07:28,380 --> 00:07:33,480 The interesting thing is I actually want to set a certain number of results. 115 00:07:33,510 --> 00:07:37,970 So there is another one here that allows us to set the number of results that we get. 116 00:07:38,160 --> 00:07:43,020 And let's say per page let's say per page we want to download 40 photos. 117 00:07:43,020 --> 00:07:46,760 So if I call that method you'll see we get a successful return. 118 00:07:47,130 --> 00:07:48,000 And look at this. 119 00:07:48,000 --> 00:07:51,030 We get a U R L we can see how it works. 120 00:07:51,060 --> 00:07:55,370 See this better I'm actually going to copy it and I'm going to paste it into X code. 121 00:07:55,620 --> 00:08:00,150 So I'm just going to paste it here so we can take a look at what we're what we're dealing with here. 122 00:08:00,180 --> 00:08:07,250 So API at Flickr dot com slash services slash rest and the method here is Flickr photos like that search. 123 00:08:07,250 --> 00:08:11,430 Like I said our API key is here but does that match. 124 00:08:11,430 --> 00:08:11,970 No it doesn't. 125 00:08:11,970 --> 00:08:14,640 So that's just a generic API that they're showing. 126 00:08:14,640 --> 00:08:16,350 We'll fix that in just a second. 127 00:08:16,410 --> 00:08:19,010 Now the latitude has passed in the longitude. 128 00:08:19,010 --> 00:08:20,270 The radius is one. 129 00:08:20,340 --> 00:08:27,250 The unit is miles per page we return 40 items and the format is Jason. 130 00:08:27,340 --> 00:08:27,850 OK. 131 00:08:28,170 --> 00:08:34,290 Don't worry about no Jason callback but this is a you are all that we are going to use to download all 132 00:08:34,290 --> 00:08:39,840 the photos that we want but we need to write a function that allows us to pass in the relevant data 133 00:08:39,900 --> 00:08:45,710 like our API key the latitude and longitude the number of items that we want returned. 134 00:08:45,750 --> 00:08:46,980 So let's do that now. 135 00:08:47,220 --> 00:08:50,210 Let's go ahead and write a function called phunk flicker. 136 00:08:50,220 --> 00:08:57,000 You are L and I'm doing this in my Constans file because I want to be able to access this anywhere and 137 00:08:57,120 --> 00:08:59,030 Constans file allows me to do that. 138 00:08:59,190 --> 00:09:02,350 So we're going to pass in a couple things into this function. 139 00:09:02,640 --> 00:09:05,640 OK let's go in brackets so it stops yelling at us. 140 00:09:05,640 --> 00:09:08,030 We need to pass in our API key. 141 00:09:08,220 --> 00:09:10,780 We need to pass in an annotation. 142 00:09:10,830 --> 00:09:13,800 And that's the same same as the pin that gets dropped. 143 00:09:13,800 --> 00:09:18,240 We're going to pass in that annotation and pull out the latitude and longitude. 144 00:09:18,240 --> 00:09:21,800 We're also going to pass in a number of photos. 145 00:09:21,810 --> 00:09:22,340 OK. 146 00:09:22,590 --> 00:09:28,530 So we're going to say flicker yourself for API key and we're going to just create an internal parameter 147 00:09:28,530 --> 00:09:31,350 here called Key of type String. 148 00:09:31,350 --> 00:09:36,060 We're going to say with annotation with an internal parameter of annotation. 149 00:09:36,060 --> 00:09:39,370 Now we already have a custom subclass called drop a pin. 150 00:09:39,390 --> 00:09:46,820 We'll use that and number of photos for number. 151 00:09:46,860 --> 00:09:47,210 OK. 152 00:09:47,220 --> 00:09:49,150 And that's going to be of type int. 153 00:09:49,170 --> 00:09:56,200 Now at the end of this we want this to return to us a string of our finished and perfected you r l. 154 00:09:56,280 --> 00:10:00,210 So in order to return that we're going to actually just use return. 155 00:10:00,570 --> 00:10:03,480 And now we can pass in this you are l. 156 00:10:03,870 --> 00:10:07,630 So go ahead and cut this u r l and we're going to modify it to fit our needs. 157 00:10:07,770 --> 00:10:12,180 So return a string with this you are l. 158 00:10:12,210 --> 00:10:13,700 Now all of this is good. 159 00:10:13,740 --> 00:10:17,080 Let's go and minimize this we can see more of it. 160 00:10:17,190 --> 00:10:20,080 This is good right API to flicker services rest. 161 00:10:20,160 --> 00:10:21,030 Flickr photo search. 162 00:10:21,030 --> 00:10:27,330 Nothing changes but the first thing that changes is the API key we can pass that in using string encapsulation. 163 00:10:27,330 --> 00:10:31,570 So let's go ahead and use our little special string syntax here. 164 00:10:31,710 --> 00:10:37,980 And I know it's hard to see because of the length of the string but we're going to pass in API key and 165 00:10:37,980 --> 00:10:42,050 where the old key was now we're passing in our own key. 166 00:10:42,180 --> 00:10:44,980 Now for the latitude we can do the same thing. 167 00:10:45,260 --> 00:10:45,890 OK. 168 00:10:46,020 --> 00:10:55,220 We can pass in the annotation and then we can get the coordinate and we can pull out the latitude. 169 00:10:55,270 --> 00:10:56,370 Same with the longitude. 170 00:10:56,370 --> 00:11:04,010 We can do the same thing inside of those parentheses we can go to the annotation coordinate that longitude 171 00:11:04,020 --> 00:11:05,370 and we can pull that out. 172 00:11:05,380 --> 00:11:07,590 Now the radius the unit that never changes. 173 00:11:07,600 --> 00:11:10,720 But what if we want to change the number of results we get. 174 00:11:10,720 --> 00:11:16,590 So we're going to pass in using our concatenation we're going to pass in our sorry concatenation. 175 00:11:16,600 --> 00:11:21,200 The encapsulation we're going to pass in the number of results that we want. 176 00:11:21,220 --> 00:11:26,870 So now when we call this function it's going to return to us a perfect U r l. 177 00:11:26,870 --> 00:11:34,270 Now I'm actually going to go ahead and I'm going to make this a constant for now and I want to print 178 00:11:34,270 --> 00:11:36,820 it first just so we can see that it works. 179 00:11:36,940 --> 00:11:40,520 Print u r l and then return. 180 00:11:40,940 --> 00:11:46,880 OK let's go ahead and let's find a space to call this and let's see how we do. 181 00:11:46,880 --> 00:11:53,270 Let's see if we get a nice nice fancy u r l I think a good place to call it would be here. 182 00:11:53,290 --> 00:11:58,060 Now let's go ahead and call that WIPs. 183 00:11:58,330 --> 00:12:01,750 We're going to print it because it returns a string to us. 184 00:12:01,750 --> 00:12:07,930 And let's go ahead and try it now let's build and run a whoops of course we forgot to call all of our 185 00:12:07,930 --> 00:12:08,830 fancy stuff. 186 00:12:08,830 --> 00:12:09,970 What's wrong with us. 187 00:12:10,050 --> 00:12:16,990 K so we are going to go ahead and pass in the API key from our Constans file our annotation. 188 00:12:17,020 --> 00:12:17,920 We do not yet have. 189 00:12:17,920 --> 00:12:27,050 So let's actually move this down below because then we have our annotation pass in the annotation then 190 00:12:27,070 --> 00:12:31,060 number of photos let's say 40. 191 00:12:31,060 --> 00:12:33,250 So let's go ahead and build and run. 192 00:12:33,430 --> 00:12:40,540 When we tap to drop a pin the screen should slide up and we should see this print out a nice u r l and 193 00:12:40,540 --> 00:12:46,320 we can actually go ahead and check it to see if it properly is pulling from flicker. 194 00:12:46,510 --> 00:12:50,500 So pull open the simulator and we go. 195 00:12:50,800 --> 00:12:54,140 Let's drop a pin and let's see what prints out. 196 00:12:54,160 --> 00:12:55,000 All right look at that. 197 00:12:55,000 --> 00:12:56,400 Very cool. 198 00:12:56,510 --> 00:12:57,850 So yeah. 199 00:12:57,880 --> 00:12:58,770 Looks like it's working. 200 00:12:58,770 --> 00:13:05,760 There's a nice you Arel let's copy it and paste it over to Chrome and let's look at it. 201 00:13:05,800 --> 00:13:07,510 Yeah we have our API key. 202 00:13:07,540 --> 00:13:08,500 That's ours. 203 00:13:08,500 --> 00:13:14,250 That is the latitude that is the longitude and 40 results when we call it. 204 00:13:14,260 --> 00:13:22,420 Look at that we get an array of all the photos all the data from that exact GPS GPS coordinate. 205 00:13:22,420 --> 00:13:28,690 So so cool we're going to dive into this in much greater detail in the next video and we're going to 206 00:13:28,690 --> 00:13:34,030 actually start retrieving the you or else for each image and then downloading the images using Alamo 207 00:13:34,030 --> 00:13:35,020 fire image. 208 00:13:35,110 --> 00:13:37,580 Very very awesome work guys. 209 00:13:37,930 --> 00:13:38,370 So yeah. 210 00:13:38,380 --> 00:13:44,260 Get ready for the next video you can of course delete this print function and we can of course fix this 211 00:13:44,260 --> 00:13:49,540 back to where it was before we were printing it and it's going to undo that we're just returning that 212 00:13:49,540 --> 00:13:50,210 value. 213 00:13:50,560 --> 00:13:54,160 And yeah let's move on to the next video let's start downloading some images. 214 00:13:54,220 --> 00:13:55,530 I'll see in the next video.