/* Load javascript libraries hosted by Google. */
//google.load('search', '1');
//google.load('jquery', '1');

/* Execute onload() when ready */


/* The Id of my Google search engine */
gseid = '007402988565520542697:pe1deebsoda';

/* Actions to be carried out as soon as page has been loaded .. */
$(document).ready(function () {

    $("#page.mysearch #navigation input.text").keypress(input_text_keypress);
    $("#navigation input.text").keyup(input_text_keyup);

    // Trigger a search - this only happens if a specifc element exists and 
    // contains some text.
    google_search();
});


/* Javascript does not have a trim() method. Now it has. */
String.prototype.trim = function() {
    /* TODO: better way? */
    var a = this.replace(/^\s+/, '');
    return a.replace(/\s+$/, '');
};

function input_text_keypress(e) {
    // 13: RETURN
    if (e.which == 13) {
        google_search();
        return;
    }
}

function input_text_keyup(e) {
    // Change elements class depending on whether text field contains
    // characters or not.
    var text = $(this).val().trim();
    if (text == "")
        $(this).removeClass("nonempty").toggleClass("empty",true);
    else {
        $(this).removeClass("empty").toggleClass("nonempty",true);
    }
}

function google_search() {

    var el = $("#result");
    // Must have a div to fill up results, otherwise bail out.
    if (!el) {
        return;
    }
    if (el.length<=0) {
        return;
    }

    el.html("<p><i>Searching, please stand by ..</i></p>");

    var url = "http://ajax.googleapis.com/ajax/services/search/web?rsz=large&v=1.0&callback=?";
    url=url + "&cx=" + gseid;
    
    // Search input field.
    var text = $("#navigation input.text").val();
    text = jQuery.trim(text);

    if (text == "") {
        el.html("<p>Please enter something you want me to search for ..</p>");
        return;
    }
    // TODO: escape URL ??
    url = url + "&q=" + text;

    
    $.getJSON(url,function (data) {
        var results  = data.responseData.results;
        var cursor   = data.responseData.cursor;
        var havedata = results && results.length > 0;
        var el = $("#result");
        if (!el) return;
        if (!havedata) {
            el.html("<p>No document mach your search criteria "+ "??" + "</p>");
            return;
        }
        
        el.html("<p>Estmated hits:"+cursor.estimatedResultCount+", showing most relevant matches.</p>");
        for (var i=0; i < results.length; i++) {
            // Display each result however you wish
            var r = results[i];
            el.append("<div>");
            el.append("<h5 style='margin: 1em 0em;'><a href='"+r.url+"'>"+r.titleNoFormatting+"</a></h5>");
            el.append("<p style='margin-left: 2em;'>");
            el.append(r.content);
            el.append("</p>");
            el.append("<p style='background: green !important;margin-top: 1em;'>");
            el.append("<a style='text-decoration: none;color:green;' href='"+r.url+"'>"+r.url+"</a>");
            el.append(" - <a style='' href='"+r.cacheUrl+"'>Cached</a>");
            el.append("</p>");
            el.append("</div>");
        }    
    }); // end: getJSON
}