Merge pull request #10 from erickoledadevrel/master

Fixed various issues, including prototype error on load. Closes #9.

README.md

@@ -30,29 +30,29 @@ Fetch the source for the app:
 
 First, you need to activate the Drive API for your app. You can do it by configuring your API project in the Google APIs Console.
 
-- Create an API project in the [Google APIs Console](https://developers.google.com/console).
-- Select the "Services" tab and enable the Drive API.
-- Select the "API Access" tab in your API project, and click "Create an OAuth 2.0 client ID".
-- In the Branding Information section, provide a name for your application (e.g. "Realtime Tasks"), and click Next. Providing a product logo is optional.
-- In the Client ID Settings section, do the following:
-  - Select Web application for the Application type
-  - Click the more options link next to the heading, Your site or hostname.
-  - List your hostname in the Authorized Redirect URIs and JavaScript Origins fields.
-  - Click Create Client ID.
-- In the **API Access** page, locate the section **Client ID for Web applications** and note the **Client ID** value.
-- List your hostname in JavaScript origins in the Client ID settings.
-- Go to the **Drive SDK** page and copy the **App ID**.
-
-To enable integration with the Drive UI, go the **Drive SDK** page.
-
-- Set the **Open URL** to `http://YOURHOST/#/todos/{ids}/?user={userId}` 
+- Create an API project in the [Google Developers Console](https://developers.google.com/console).
+- Select the tab "APIs & Auth > APIs" and enable the Drive API and Drive SDK.
+- Select the tab "APIs & Auth > Credentials" and click "Create new Client ID".
+- In the resulting dialog, do the following:
+  - Select "Web application" for the Application type
+  - List your hostname in the "Authorized JavaScript Origins" field.
+  - Click "Create Client ID".
+- Note the **Client ID** string created.
+- Select the tab "APIs & Auth > Consent screen" and ensure the Email Address and Product Name are set.
+
+To enable integration with the Drive UI, including the sharing dialog, perform the following steps.
+
+- Select the tab "APIs & Auth > APIs" and click the gear icon next to "Drive SDK".
+- Click the link to return to the original console.
+- Fill out the Application Name and upload at least one Application Icon.
+- Set the **Open URL** to `http://YOURHOST/#/todos/{ids}/?user={userId}`
 - Check the **Create With** option and set the **New URL** to `http://YOURHOST/#/create?user={userId}`
 
 Adjust the above URLs as needed for the correct hostname or path. Localhost is currently not allowed.
 
 ### Setup your App information
 
-You should now have your **Client ID** and your **App ID**.  Update the `CONFIG` object in `app.js` appropriately.
+Update the `CONFIG` object in `app.js` with the **Client ID** string you created.
 
 ### Deploy, run that's it!
 

app/scripts/app.js

@@ -16,7 +16,6 @@
 
 var CONFIG = {
   clientId: '502747173299.apps.googleusercontent.com',
-  apiKey: 'AIzaSyA8uaDCmQ1mvhjXQZvF55vW9ygO_fAYKRs',
   scopes: [
     'https://www.googleapis.com/auth/drive.file',
     'https://www.googleapis.com/auth/drive.install'
@@ -43,8 +42,19 @@ app.Todo.prototype.initialize = function (title) {
   var model = gapi.drive.realtime.custom.getModel(this);
   this.title = model.createString(title);
   this.completed = false;
+  this.setup();
 };
 
+/**
+ * Adds a "text" property to collaborative strings for ng-model compatibility
+ * after a model is created or loaded.
+ */
+app.Todo.prototype.setup = function() {
+  Object.defineProperty(this.title, 'text', {
+    set: this.title.setText,
+    get: this.title.getText
+  });
+};
 
 /**
  * Loads the document. Used to inject the collaborative document
@@ -118,17 +128,13 @@ app.module.run(['$rootScope', '$location', 'storage', function ($rootScope, $loc
 gapi.load('auth:client:drive-share:drive-realtime', function () {
   gapi.auth.init();
 
-  // Monkey patch collaborative string for ng-model compatibility
-  Object.defineProperty(gapi.drive.realtime.CollaborativeString.prototype, 'text', {
-    set: gapi.drive.realtime.CollaborativeString.prototype.setText,
-    get: gapi.drive.realtime.CollaborativeString.prototype.getText
-  });
-
   // Register our Todo class
   app.Todo.prototype.title = gapi.drive.realtime.custom.collaborativeField('title');
   app.Todo.prototype.completed = gapi.drive.realtime.custom.collaborativeField('completed');
+
   gapi.drive.realtime.custom.registerType(app.Todo, 'todo');
   gapi.drive.realtime.custom.setInitializer(app.Todo, app.Todo.prototype.initialize);
+  gapi.drive.realtime.custom.setOnLoaded(app.Todo, app.Todo.prototype.setup);
 
   $(document).ready(function () {
     angular.bootstrap(document, ['todos']);

app/scripts/controllers/todos.js

@@ -113,14 +113,14 @@ angular.module('todos').controller('MainCtrl', ['$scope', '$routeParams', 'realt
       { completed: false } : (filter === 'completed') ?
       { completed: true } : null;
     });
-    
+
     /**
     * Undo local changes
     */
     $scope.undo = function () {
       realtimeDocument.getModel().undo();
     };
-    
+
     /**
     * Check if there are undoable changes.
     * @returns {boolean}
@@ -135,7 +135,7 @@ angular.module('todos').controller('MainCtrl', ['$scope', '$routeParams', 'realt
     $scope.redo = function () {
       realtimeDocument.getModel().redo();
     };
-    
+
     /**
     * Check if there are redoable changes.
     * @returns {boolean}
@@ -156,7 +156,7 @@ angular.module('todos').controller('CollaboratorsCtrl', ['$scope', 'config',
    * @constructor
    */
   function ($scope, config) {
-    var appId = config.clientId.split('.').shift();
+    var appId = config.clientId.match(/^(\d+)/)[0];
 
     var collaboratorListener = function () {
       $scope.$apply(function () {

package.json

@@ -16,7 +16,6 @@
     "grunt-contrib-htmlmin": "0.1.1rc7",
     "grunt-contrib-imagemin": "0.1.1rc8",
     "grunt-contrib-livereload": "0.1.0rc8",
-    "grunt-bower-hooks": "~0.2.0",
     "grunt-usemin": "~0.1.7",
     "grunt-regarde": "~0.1.1",
     "gruntacular": "~0.1.1",