Developing Extensions for Google Chrome

Well now if we are all part of the 'backend' already finished and polished. On the other hand we had before the part of the Pop-up completed. We left the 'frontend' to communicate with the 'backend', so in this video we will see how communication is established between the two developments, we have been doing during the course Ahead!

Okay, we continue ... Let's do the 'getVideos.js' script Voucher? How you remember, some time in the Pop-up we add this script: 'getVideos.js' This is going to run to open the pop-up and then ... We catch 'getVideos.js' Okay? Here and I have written and basically I'll do. I I'll explain well; what it does is this, we make a Videoloader function,

we have to pass ... the variable 'name' and the variable 'url' and type in the file a 'iframe' with the class 'link' and the 'source' is the variable 'url' Eh ... 'frameborder' 0, you put 0, because otherwise I think leaving edges ehm .. and 'allowfullscreen' to .. well, that .. The truth is, how the 'iframe' I could not remember how to write, I looked on the internet and I went well. I guess, well .. to enable full screen

I do not know, well ... 'background', well ... 'bg' but we will use as 'background', basically this is the object, you must ... the this script, bone, is script that ran ... oops, this is what we are doing is taking as it were references to this script, because remember that now all the while running, then the 'background url'. We catch 'bg' which is the object of the 'background' and put the embedLink variable.

If you remember ... there okay? He had not kept what he had written, nothing happens that is arranged at a time; Why put it here ... well, now I write again, but for now .. mmm ... well anyway, I will continue well, if you remember; this variable is the, bone, he was parsing the web , Bone, making it the 'index' and all that, we got to know what was the link to put it in the 'iframe' and then the video

Is a new 'Videoloader' We use it as if it were a class and pass the 'background' videoname, which is also a variable that is stored in the background, has opened to me not wanting the Sony Vegas, and pass the background url we saved here. Voucher? Voucher? Then it will run and will make document.write and will to write. Then Jquery function, a tuple right? An anonymous function.

Eh .. when we click, the link, you see, if you remember is the class 'link' and we have put the 'iframe' when we click, eh .. do not know if you have seen how it is exactly one 'iframe' YouTube, but when Clicking it plays the video but we do not want us to play the video because it It would be very upset because when leaving lose the video and what we want is to open a window, we can see freely.

So we do a 'preventDefault' not to run the click on that object and then make a 'window.open' the background url, as you remember that we have saved here in Pop-up mode and give these dimensions, and then the settings.Img in the Pop-up.html file, if you remember this little button here in this animation and what we do is, well eh what the preventDefault copied before this

and make a 'window.open' too, of a file that we do now, that will be later an settings.html will be to set which will be to set which channel you want the extension, which want this checking channel videos and tell us when they get new video and all. Pop-up and then we make witdh 800 and 500 okay? Yes? All good? I'm going to copy, to good and this here but remember correctly was to run a notification

which then alerts you when you have new video, but for now it's just a point that we will not use OK? We do this, this is, we do not need right now and we already have this. So now, let's see ... Okay, our first mistake, It is how the joke that you go crazy if you compile the first, but no, never happens. Mmm .. I think an extension, undefined ... could be ...

There are! Of course, how we have not put before the background, see, see ... programming, but the variable does not exist then, luckily I have everything finished, although it seems that inadvertently removed it wrong and you see, that that alert you when new video I ended up not doing well but ... in the first video itself that was well done but I think unintentionally modified the code and what I did wrong, I deleted something

but hey, now I'll do here ... eh, okay? Let's copy all of this and we will put our background variables that exist right? Because otherwise we will have a problem .. pa, pa, pam, see ... that's what happens ... let's reload again. Voucher? Mother! What is the video? Voucher? This, then .. now you will say to me, but only good if your channel is not yet made the settings; See, does not exist but ...

uh ... I think, I think ... I did not want to risk me back .. but we see if dais click here you can inspect the Pop-up and you can access, for example, the background object, which is this variable that we have here .. Okay? Now for example, I could do this, okay? If we look at the background, is 'localStorage.youtubechannel' So if we do this ... mmm, u ... eh ..

I do not know if we will just access but to see, let's try, esperate will copy this and I will close for now, okay? For example, to ensure that it works, but now we'll do the settings.html, see ... Voucher? Here we have all these videos, right? Well, we could do .. pam .. YouTubeChannel and try to do this, see ... What you say? There are clear! Must be

a string obviously wepa ... fuck, to see what happens now? This, I had been inadvertently okay? LocarStorage and now, if we run this, hmm, mmm, okay? I think that each application has its own localStorage So, to see. I think that we will have to wait to make the settings to modify the video, but I wanted you to see right now

Voucher? You see, now. Eh changed and we have jotajoravm channel, so you could try it with any channel, it sure works ... okay? How I say again, if you still always be the same; This is very useful because using this technique you can parse anything, bone, any website Think that is quite vulnerable in this regard, that any information you can get, if you know how to do it and the best way I can think to me is that

That of the two indices: The beginning of what you want to catch and end and in the middle is between you information, see? It is also a class, do not know that, do not know how It is always the same, and then if you want to have all, as well, that would already be a little more ... a lot more work would, especially the problem of load more, because as we see not loaded, bone is not it is loaded and concealed it at the time that click

It does so to speak, will surely make an xml http request asynchronous and load, then see all the videos of the channel; Well, that would be more complicated but the last video is super easy to see, it is just easier to find.