angular-gapi's Introduction

Angular-GAPI

Angular-GAPI is an AngularJS module for accessing different Google APIs.

The code is based on ngGAPI

Load

To use the module, include the main Angular-GAPI javascript file in your web page, as well as the scripts for all the API's that will be used:

<!DOCTYPE HTML>
<html>
<body ng-app="app">
  //.....
  <script src="bower_components/angular-GAPI/lib/angular-GAPI.js"></script> 
  <script src="bower_components/angular-GAPI/lib/plugin/gapi.calendar.factory.js"></script> 
  <script src="bower_components/angular-GAPI/lib/plugin/gapi.user.factory.js"></script>
</body>
</html>

ngGAPI requires Google API JavaScript client library

<script src="https://apis.google.com/js/client.js"></script>

Installation

Bower

$ bower install quivr/angular-GAPI --save

Npm

$ npm install quivr/angular-GAPI --save

then load it in your html

Add module dependency

angular.module('myApp', [
  'angularGAPI'
]);

Usage

After you register your app in the Google APIs Console, configure angular-GAPI with credentials and whatever scopes you need for your app.

angular.module('myApp')
  .value('GoogleApp', {
    apiKey: 'YOUR_API_KEY',
    clientId: 'YOUR_CLIENT_ID',
    scopes: [
      // whatever scopes you need for your app, for example:
      'https://www.googleapis.com/auth/drive',
      'https://www.googleapis.com/auth/youtube',
      'https://www.googleapis.com/auth/userinfo.profile'
      // ...
    ]
  })

To use a specific service, inject it into your controllers by name. All GAPI methods return a promise.

angular.module('myApp')
  .controller('VideosCtrl', function ($scope, Youtube) {
    $scope.videos = Youtube.search({ part: 'snippet', q: 'Search terms' })
  });

Services

GAPI authorization

GAPI.init()
GAPI.disconnect()

Note: If pop-ups are being blocked, make sure to have gapi loaded before calling GAPI.init().

gapi.load('auth', function() { GAPI.init() });

For a full documentation of the available functions, consult the wiki

angular-gapi's People

Contributors

Stargazers

Watchers

angular-gapi's Issues

Check for gapi to be loaded

Unknown provider: DriveProvider <- Drive

Unknown provider: DriveProvider <- Drive <- VideoController

Following the boilerplate installation, got this output:

angular.js:14110 Error: [$injector:unpr] Unknown provider: DriveProvider <- Drive <- VideoController
http://errors.angularjs.org/1.5.9/$injector/unpr?p0=DriveProvider%20%3C-%20Drive%20%3C-%20VideoController
at angular.js:68
at angular.js:4554
at Object.getService [as get] (angular.js:4707)
at angular.js:4559
at getService (angular.js:4707)
at injectionArgs (angular.js:4732)
at Object.invoke (angular.js:4754)
at $controllerInit (angular.js:10518)
at nodeLinkFn (angular.js:9416)
at compositeLinkFn (angular.js:8757)

app.js

var app = angular.module('MyApp',['MyApp.services']);
angular.module('app', [
'angularGAPI'
]);