Using google calender inside greasemonkey script

[Dennis Garske]

I am trying to use the google calender api inside a greasemonkey script. This is my code inspired from the google calender api tutorial:

// ==UserScript==
// @name        Google Calender
// @namespace   xyz
// @include     *
// @version     1
// ==/UserScript==

var $ = unsafeWindow.jQuery;

API_js_callback = "https://apis.google.com/js/api.js";

var script = document.createElement('script');
script.src = API_js_callback;
var head = document.getElementsByTagName("head")[0];
(head || document.body).appendChild(script);

//this is not working
var gapi = unsafeWindow.gapi;


$(document).ready(function()
                  {
    // Client ID and API key from the Developer Console
    var CLIENT_ID = 'XXX';

    // Array of API discovery doc URLs for APIs used by the quickstart
    var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"];

    // Authorization scopes required by the API; multiple scopes can be
    // included, separated by spaces.
    var SCOPES = "https://www.googleapis.com/auth/calendar.readonly";

    handleClientLoad();

    /**
       *  On load, called to load the auth2 library and API client library.
       */
    function handleClientLoad() {
        gapi.load('client:auth2', initClient);
    }

    /**
       *  Initializes the API client library and sets up sign-in state
       *  listeners.
       */
    function initClient() {
     .........
    }
});

Inside the handleClientLoad method, I got the following exception:

Cannot read property 'load' of undefined

Any idea?