Add revised version post re-review and refresh

GoogleWebComponents · May 23, 2014 · f1fb826 · f1fb826
1 parent 1698c6b
commit f1fb826
Show file tree

Hide file tree

Showing 7 changed files with 93 additions and 86 deletions.
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,13 @@
+Copyright 2014 Google Inc
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
 google-drive
 ================
 
-See the [component page](http://addyosmani.github.io/google-drive) for more information.
+See the [component page](http://googlewebcomponents.github.io/google-drive) for more information.
diff --git a/bower.json b/bower.json
@@ -1,6 +1,5 @@
 {
   "name": "google-drive",
-  "private": true,
   "dependencies": {
     "polymer": "Polymer/polymer#master",
     "google-signin": "GoogleWebComponents/google-signin#~0.0.6",

diff --git a/demo.html b/demo.html
@@ -7,35 +7,35 @@
   <script src="../platform/platform.js"></script>
   <link rel="import" href="google-drive.html">
   <style>
-  	body {
-  		font-family: Arial, sans-serif;
-  	}
-	h1 {
-		color: #E91E63;
-		font-size: 52px;
-	}
-
-	table {
-		width: 80%;
-		margin:20px 0 20px 0;
-		border-collapse: collapse;
-		border: 1px solid #4285f4;
-	}
-
-	td {
-		border: 1px solid #4285f4;
-		line-height: 40px;
-		padding-left: 24px;
-		padding-right: 24px;
-	}
-
-	th {
-		height: 60px;
-		padding-left: 24px;
-		background: #4285f4 !important;
-		color: #fff !important;
-		text-align: left;
-	}
+    body {
+      font-family: Arial, sans-serif;
+    }
+    h1 {
+      color: #E91E63;
+      font-size: 52px;
+    }
+
+    table {
+      width: 50%;
+      margin:20px 0 20px 0;
+      border-collapse: collapse;
+      border: 1px solid #4285f4;
+    }
+
+    td {
+      border: 1px solid #4285f4;
+      line-height: 40px;
+      padding-left: 24px;
+      padding-right: 24px;
+    }
+
+    th {
+      height: 60px;
+      padding-left: 24px;
+      background: #4285f4 !important;
+      color: #fff !important;
+      text-align: left;
+    }
   </style>
 
 </head>
@@ -47,26 +47,26 @@
 
   <p><h1>Uploads</h1></p>
 
-	<template id="status" bind="{{status}}">
-		 <strong>Status</strong>: {{message}}
-	</template>
-
-	<table class="google-drive-table">
-		<tr>
-		  <th>Upload queue</th>
-		</tr>
-		<template id="queue" repeat="{{uploadList}}">
-			<tr>
-			  <td>{{name}}</td>
-			</tr>
-		</template>
-	</table>
+  <template id="status" bind="{{status}}">
+     <strong>Status</strong>: {{message}}
+  </template>
+
+  <table class="google-drive-table">
+    <tr>
+      <th>Upload queue</th>
+    </tr>
+    <template id="queue" repeat="{{uploadList}}">
+      <tr>
+        <td>{{name}}</td>
+      </tr>
+    </template>
+  </table>
 
     <table>
-	<table class="google-drive-table">
-		<tr>
-		  <th>Successful uploads</th>
-		</tr>
+  <table class="google-drive-table">
+    <tr>
+      <th>Successful uploads</th>
+    </tr>
         <template id="uploaded" repeat="{{uploadedList}}">
             <tr>
             <td><img src="{{iconLink}}"/>&nbsp;<strong>{{title}}</strong></td> 
@@ -78,29 +78,24 @@
     </table>
 
   <script>
-  document.addEventListener('google-drive-upload-started', function(e){
-  	var t = document.querySelector("#queue");
-  	t.model = {};
-  	t.model.uploadList = e.detail.files;
+  document.addEventListener('google-drive-upload-started', function(e) {
+    var t = document.querySelector("#queue");
+    t.model = {uploadList: e.detail.files};
   });
 
-  document.addEventListener('google-drive-files-selected', function(e){
-  	var t = document.querySelector("#queue");
-  	t.model = {};
-  	t.model.uploadList = e.detail.files;
+  document.addEventListener('google-drive-files-selected', function(e) {
+    var t = document.querySelector("#queue");
+    t.model = {uploadList: e.detail.files};
   })
 
-  document.addEventListener('google-drive-upload-completed', function(e){
-  	var t = document.querySelector("#uploaded");
-  	t.model = {};
-  	t.model.uploadedList = e.detail.files;
-  	console.log(e.detail.files);
+  document.addEventListener('google-drive-upload-completed', function(e) {
+    var t = document.querySelector("#uploaded");
+    t.model = {uploadedList: e.detail.files};
   });
 
-  document.addEventListener('google-drive-upload-status', function(e){
-  	var t = document.querySelector("#status");
-  	t.model = {};
-  	t.model.status = { message: e.detail.status };
+  document.addEventListener('google-drive-upload-status', function(e) {
+    var t = document.querySelector("#status");
+    t.model.status = { status: { message: e.detail.status }};
   });
   </script>
 

diff --git a/google-drive-upload.html b/google-drive-upload.html
@@ -0,0 +1 @@
+<script src="../cors-upload-sample/upload.js"></script>
diff --git a/google-drive.css b/google-drive.css
@@ -4,5 +4,5 @@
 }
 
 :host google-signin, #files, #upload {
-	float: left;
+  float: left;
 }
diff --git a/google-drive.html b/google-drive.html
@@ -1,5 +1,6 @@
 <link rel="import" href="../polymer/polymer.html">
 <link rel="import" href="../google-signin/google-signin.html">
+<link rel="import" href="google-drive-upload.html">
 
 <!--
 Element enabling you to upload files to Google Drive.
@@ -17,15 +18,14 @@
 @element google-drive
 @blurb Element enabling you to upload files to Google Drive.
 @status alpha
-@homepage http://addyosmani.github.io/google-drive
+@homepage http://googlewebcomponents.github.io/google-drive
 -->
 <polymer-element name="google-drive" attributes="autoUpload clientId">
 
   <template>
-    <script src="../cors-upload-sample/upload.js"></script>
     <link href="google-drive.css" rel="stylesheet" />
 
-    <google-signin clientId="{{clientId}}" scopes="https://www.googleapis.com/auth/drive"></google-signin>
+    <google-signin clientId="{{clientId}}" scopes="https://www.googleapis.com/auth/drive" on-google-signin-success="{{signedIn}}" on-google-signed-out="{{signedOut}}"></google-signin>
 
     <span style="display:{{ authenticated ? 'inline-block' : 'none' }}">
       <input tabindex="0" type="file" id="files" class="custom-file-input" name="files[]" multiple on-change="{{handleFilePick}}"/>
@@ -78,20 +78,23 @@
              *
              * @attribute clientId
              * @type string
+             * @required
              */
             clientId: '',
             /**
              * The queue of files being uploaded
              *
-             * @attribute uploadList
+             * @property uploadList
              * @type array
+             * @default []
              */
             uploadList: [],
             /**
              * The queue of files that have been uploaded
              *
-             * @attribute uploadedList
+             * @property uploadedList
              * @type array
+             * @default []
              */
             uploadedList: [],
             /**
@@ -104,22 +107,21 @@
             /**
              * Whether the user has authenticated or not
              *
-             * @attribute authenticated
+             * @property authenticated
              * @type boolean
              */
             authenticated: false,
             ready: function () {
               this.fire('google-drive-upload-status', { status: 'Authentication required' });
-              document.addEventListener('google-signin-success', function (e) {
-                  this.accessToken = e.detail.result.access_token;
-                  this.authenticated = true;
-                  this.fire('google-drive-upload-status', { status: 'Ready' });
-              }.bind(this));
-
-              document.addEventListener('google-signed-out', function (e) {
-                  this.authenticated = false;
-                  this.fire('google-drive-upload-status', { status: 'Please sign-in to continue.' });
-              }.bind(this));
+            },
+            signedIn: function(e) {
+                this.accessToken = e.detail.result.access_token;
+                this.authenticated = true;
+                this.fire('google-drive-upload-status', { status: 'Ready' });
+            },
+            signedOut: function(e) {
+                this.authenticated = false;
+                this.fire('google-drive-upload-status', { status: 'Please sign-in to continue.' });
             },
             selectFiles: function (files) {
                 this.queue = files;
@@ -161,9 +163,6 @@
                 }
 
             },
-            tapSelect: function (evt) {
-                this.$.files.click();
-            },
             handleFilePick: function (evt) {
                 evt.stopPropagation();
                 evt.preventDefault();
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<script src="../cors-upload-sample/upload.js"></script>