Question

my first question, hopefully I’m asking it right. I searched all over and can’t find anything on it.

Basically, I have the following code, what it does is when on a youtube.com/watch page it shows an icon in the address bar, if you click that icon, it put’s the high quality thumb it reconstructed into localstorage and then opens thumb.html which just grabs that localstorage value and displays the image on the page. I noticed if I hit enter in the address bar to load the page, and click the icon, it works fine, but if I navigate to another video via the page and click it, it opens 2 pages, if I go to a 3rd page, it opens 3 pages, so on, and so forth. I just don’t know what’s going on.

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab)
{
    updatedTab = tab;
    updatedTabId = tabId;
    if(changeInfo.status == 'complete')
    {
            if(updatedTab.url.indexOf('youtube.com/watch') != -1) 
            {
                chrome.pageAction.show(tabId);
                chrome.pageAction.onClicked.addListener(function(tab)
                {
                    if(window === top)
                    {
                        var yt = tab.url.split('v=');
                        var yt = yt[1].split('&');
                        var yURL = 'http://www.youtube.com/watch?v='+yt[0];
                        var yThumb = 'http://i2.ytimg.com/vi/'+yt[0]+'/hqdefault.jpg';
                        localStorage.setItem('ytHQthumb', yThumb); 
                        chrome.tabs.create({'url': 'thumb.html'});
                    }
                });
            }
    }
});

Answer 1

Found the problem. I needed to move the chrome.pageAction.onClicked.addListener outside of the chrome.tabs.onUpdated.addListener.