Muiltple Google Blog Searches on Load - Pure Javascript Issue

Discussion in 'JavaScript' started by GAdsense, Apr 10, 2010.

  1. #1
    I am referring to the blog search using Google API, exactly as shown here
    http://code.google.com/apis/ajax/playground/?exp=maps#add_results_pagination

    It works well, but I'd like to have six different queries over the same page. So I'd definitely have to call six different onLoad events.

    For that, I use

        function addLoadEvent(func) {
            var oldonload = window.onload;
            if (typeof window.onload != 'function') {
                window.onload = func;
            } else {
                window.onload = function() {
                    if (oldonload) {
                        oldonload();
                    }
                    func();
                }
            }
        }
    
        addLoadEvent(content);
        addLoadEvent(beauty);
        addLoadEvent(problems);
        addLoadEvent(views);
        addLoadEvent(development);
    Code (markup):
    the following script above, works fine for loading multiple onload events.

    For our understanding, let's take two searches for now and their correspond javascript code - hope you understand the issue by now.


      // Set a callback to call your code when the page loads
        google.setOnLoadCallback(onLoad);
    
        function addPaginationLinksContent() {
            // Add pagination
            var cursor = blogSearch.cursor;
            var curPage = cursor.currentPageIndex; // check what page the app is on
            var pagesDiv = document.createElement('div');
            for (var i = 0; i < cursor.pages.length; i++) {
                var page = cursor.pages[i];
                if (curPage == i) { // if we are on the curPage, then don't make a link
                    var label = document.createTextNode(' ' + page.label + ' ');
                    pagesDiv.appendChild(label);
                } else {
    
                    // If we aren't on the current page, then we want a link to this page.
                    // So we create a link that calls the gotoPage() method on the searcher.
                    var link = document.createElement('a');
                    link.href = 'javascript:blogSearch.gotoPage(' + i + ');';
                    link.innerHTML = page.label;
                    link.style.marginRight = '2px';
                    pagesDiv.appendChild(link);
                }
            }
            var contentDiv = document.getElementById('content');
            contentDiv.appendChild(pagesDiv);
        }
    
        function searchCompleteContent() {
            // Check that we got results
            document.getElementById('content').innerHTML = '';
            if (blogSearch.results && blogSearch.results.length > 0) {
                for (var i = 0; i < blogSearch.results.length; i++) {
    
                    // Create HTML elements for search results
                    var p = document.createElement('p');
                    var a = document.createElement('a');
                    a.href = blogSearch.results[i].postUrl;
                    a.innerHTML = blogSearch.results[i].title;
    
                    // Append search results to the HTML nodes
                    p.appendChild(a);
                    document.getElementById('content').appendChild(p);
                }
            }
            addPaginationLinksContent(blogSearch);
        }
        
        
        function content() {
    
            // Create a BlogSearch instance.
            blogSearch = new google.search.BlogSearch();
    
            // Set searchComplete as the callback function when a search is complete.  The
            // blogSearch object will have results in it.
            blogSearch.setSearchCompleteCallback(this, searchCompleteContent, null);
    
    
            // Return up to eight results
            blogSearch.setResultSetSize(google.search.Search.LARGE_RESULTSET);
    
    
    
            // Execute search query
            blogSearch.execute('MA Jinnah Road intitle:beauty');
    
    
    
    
            // Include the required Google branding
            google.search.Search.getBranding('branding');
        }
    
        function addPaginationLinksBeauty() {
            // Add pagination
            var cursor = blogSearch.cursor;
            var curPage = cursor.currentPageIndex; // check what page the app is on
            var pagesDiv = document.createElement('div');
            for (var i = 0; i < cursor.pages.length; i++) {
                var page = cursor.pages[i];
                if (curPage == i) { // if we are on the curPage, then don't make a link
                    var label = document.createTextNode(' ' + page.label + ' ');
                    pagesDiv.appendChild(label);
                } else {
    
                    // If we aren't on the current page, then we want a link to this page.
                    // So we create a link that calls the gotoPage() method on the searcher.
                    var link = document.createElement('a');
                    link.href = 'javascript:blogSearch.gotoPage(' + i + ');';
                    link.innerHTML = page.label;
                    link.style.marginRight = '2px';
                    pagesDiv.appendChild(link);
                }
            }
            var contentDiv = document.getElementById('beauty');
            contentDiv.appendChild(pagesDiv);
        }
    
        function searchCompleteBeauty() {
            // Check that we got results
            document.getElementById('beauty').innerHTML = '';
            if (blogSearch.results && blogSearch.results.length > 0) {
                for (var i = 0; i < blogSearch.results.length; i++) {
    
                    // Create HTML elements for search results
                    var p = document.createElement('p');
                    var a = document.createElement('a');
                    a.href = blogSearch.results[i].postUrl;
                    a.innerHTML = blogSearch.results[i].title;
    
                    // Append search results to the HTML nodes
                    p.appendChild(a);
                    document.getElementById('beauty').appendChild(p);
                }
            }
            addPaginationLinksBeauty(blogSearch);
        }
    
        function beauty() {
    
            // Create a BlogSearch instance.
            blogSearch = new google.search.BlogSearch();
    
            // Set searchComplete as the callback function when a search is complete.  The
            // blogSearch object will have results in it.
            blogSearch.setSearchCompleteCallback(this, searchCompleteBeauty, null);
    
    
            // Return up to eight results
            blogSearch.setResultSetSize(google.search.Search.LARGE_RESULTSET);
    
    
    
            // Execute search query
            blogSearch.execute('MA Jinnah Road intitle:beauty');
    
    
    
    
            // Include the required Google branding
            google.search.Search.getBranding('branding');
        }
    
    Code (markup):
    Please guide.
     
    GAdsense, Apr 10, 2010 IP