从fullcalendar获取事件以显示在Google日历上

时间:2016-04-25 03:19:20

标签: javascript jquery calendar fullcalendar google-calendar-api

目前,我正在使用fullcalendar在我的网络应用程序中添加事件。然后我想让fullcalendar中的所有事件显示在我的谷歌日历中。

但我尝试搜索,我也尝试使用 this

我收到错误ReferenceError: uiCalendarConfig is not defined。我不知道如何解决这个问题。我试图找到另一个解决方案,但似乎很难。

我的完整日历看起来像这样:

$('#calendar').fullCalendar({
    //..........
}); 

这是我尝试过的代码:

<script type="text/javascript">

var clientId = '######',
     scopes = 'https://www.googleapis.com/auth/calendar',
     calendarId = '#####';


    var apikey = '#####';

    function handleClientLoad() {
        // Step 2: Reference the API key
        gapi.client.setApiKey(apikey);
        window.setTimeout(checkAuth,1);
    }


  //authorization in google
  function checkAuth() {
     gapi.auth.authorize(
        {
           'client_id': clientId,
           'scope': scopes,
           'immediate': true
        }, handleAuthResult);
  }

  //checks if authorized
  function handleAuthResult(authResult) {

     if (authResult && !authResult.error) {
        loadCalendarApi();
     } else {
        handleAuthClick();
     }
  }

  //request credentials
  function handleAuthClick() {
     gapi.auth.authorize(
        {
           client_id: clientId,
           scope: scopes,
           immediate: false
        }, handleAuthResult);
     return false;
  }

function loadCalendarApi() {

     gapi.client.load('calendar', 'v3', makeApiCall);

}

// Load the API and make an API call.  Display the results on the screen.


function makeApiCall() {

     requestList = gapi.client.calendar.events.list({
        'calendarId': calendarId
     });

     console.log('--- eventsList ---');
     console.log(eventsList);
     //uiCalendarConfig.calendars['myCalendar'].fullCalendar('removeEventSource', eventsList);
     $("#calendar").fullCalendar('removeEventSource', eventsList);

     eventsList = [];

     // Step 6: Execute the API request
     requestList
        .then(function (resp) {

           if (resp.result.error) {

              reportError('Google Calendar API: ' + data.error.message, data.error.errors);

           } else if (resp.result.items) {

              resp.result.items.forEach(function (entry, index) {
                 eventsList.push({
                    id: entry.id,
                    title: entry.summary,
                    start: entry.start.dateTime || entry.start.date, // try timed. will fall back to all-day
                    end: entry.end.dateTime || entry.end.date, // same
                    //url: url,
                    location: entry.location,
                    description: entry.description
                 });
              });

           }

           if (eventsList.length > 0) {
              //uiCalendarConfig.calendars['myCalendar'].fullCalendar('addEventSource', eventsList, true);
                $("#calendar").fullCalendar('addEventSource', eventsList, true);


           }

        }, function (reason) {
           console.log('Error: ' + reason.result.error.message);
        });
  }

在我尝试此代码时,它与我从谷歌日历中显示的事件相同,以便在我的完整日历中显示它与我想要的不一样。 如果有人知道或有这方面的经验,请帮助我。

谢谢,

0 个答案:

没有答案