Developing Extensions for Google Chrome

Why, to see if you guess? ... It's back to debug; of course, is not that things are poorly done, programmers we spent more time debugging ... that writing code. So in this video we will see the whole process we have carried so far, because even in that connection 'FrontEnd' with 'BackEnd' we are polishing things that should be left more oriented to the final and operation; and we will see in this video.

We continue with the course of extensions for Chrome. Today we will do the 'HTML settings' and 'JS settings'; basically, we will serve the person can choose which channel you want him out here without having to write code. Usually people do not know how to program; then we go here and do first 'HTML settings' ... we open it and here we have it; I'll explain well, but that's it. We have a normal HTML

add JQuery and 'Style'. Then we have a 'script' that is 'JS settings' who is this 'script' that then we will end and the 'Body', you see It does not have much else, is just a 'Input' we will give the ID as 'youtubeLink'; for the 'title' places (eg.): 'Put the link channel or web video' whatever you want to say ... we put a 'placeholder' to let the person know how to spell and an 'input' type 'button', which is a 'submit' ...

as we see here in the 'value' will be the button we will serve to keep ... these are the visual styles that this is not important ... what is important is this what we have? ... An 'anonymous function' of JavaScript and the variable 'data'; a 'getSavedChannel 'function. We took the canal ... before we do a thing, Why you not see? ... I have not saved, but still should be ... is supposed to be good all, why we do not know why the open so ... this is very strange.

no source code or anything ... to see a moment, I'll do one thing, I'm going to have my last extension, because the changes have affected the code. Mine is already made. I already have this, with the button 'save' and 'placeholder' of what the channel; I'll explain better with this ... basically What's this? ... The 'getSavedChannel' looking at 'localStorage' What we have saved the channel and will change here in the 'placeholder' ...

This 'input' what will change for the saved channel; so here we get the link we have now added, and then make a 'setTimeout' a second because if the person changes the channel, you get the 'new channel'; then this function basically what you will do is check if the URL is well put. Here is less than 28, it's the least with the YouTube link for a channel; we make a 'return' of 'Invalid URL' that will show red'll see about that.

You will 'Invalid URL'; indeed, if I give the 's' ... you see? we get 'Invalid URL' and therefore we can not use it. Then data.indexOf ( 'videos') if at any time no videos, then we make clear 'featured' (to see a moment) and change it for anything, and add '/ videos.' So if the person has been given the boot menu instead of video; we will take this and put '/ videos,' basically to ensure

I always end up on this page. Then, if there is no link YouTube URL is invalid and if the last word (then after all that running) is not videos, it also invalidates the URL. Here we have a 'return true' .... Does this mean you will do exactly? You will do 'var correct = checkParameters (data)' do ( '#checkResponse'). remove () ... right now, I do not remember doing ... continue then find out in another tutorial ... then data = $ ( '# yotutubeLink'). val ()

and 'var correct = checkParameters (data)' ... as if he was explaining bad will return 'Invalid URL', if you are either going to return 'true' then do 'if (corrrect == true)', this is a little absurd because we could do so ... it would be the same now that I think about. We do to save The new address and the 'body' focused add a 'span' with 'checkResponse' ... this does is, for example, the 'checkRespond' what it does is delete

the 'Invalid URL'. We have two line changes; we saved correctly (in bold). We closed the 'span'. We 'fadeOut' It becomes transparent gradually disappears until disappearing in 3.5 seconds; but it is correct, it will do 'Invalid URL' or whatever, because we can add more values, what will do is add in the 'body' the same but in red, and also using the variable that has returned to us if it was okay was 'true'

but if it is wrong, we can make several mistakes but in this case will be 'Invalid URL'. And so basically, it is how we do this. If we now return to my channel ... if I put here, for example, we can put this to test, it does nothing ... you can not, 'we are very sorry Lord,' but no. But if I put even in the 'start' ... this. Says saved properly and gradually disappears; and now if I came here, well now because it did not run well

here yes, do you see? ... Back to my channel ... now I'm going to 'jostajotavm' that is mine is already finished. I do not know why this fails to open the 'settings' then I will solve. If we return to the 'jotajotavm' Do you see? ... We can also catch it. We place it in settings as 'reload' Already out of 'jotajotavm' and so with anyone. We could try anything ... 'HolaSoyGermán'. I do not want here copyright and if I put 'HolaSoyGermán'

It is also saved and now we see coming out 'HolaSoyGermán' his latest video. And that's basically what we have achieved with this 'script', but we lack Make them well show the 'settings' that I will explain in the next video; Now I will try to find out why. The most important do the 'background.js' We send a notification when there is a new video, it is fairly easy to do in the next video I explain how.

Bye.