Skip to content

Commit

Permalink
Add revised version post re-review and refresh
Browse files Browse the repository at this point in the history
addyosmani committed May 23, 2014
1 parent 1698c6b commit f1fb826
Showing 7 changed files with 93 additions and 86 deletions.
13 changes: 13 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -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.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -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.
1 change: 0 additions & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
{
"name": "google-drive",
"private": true,
"dependencies": {
"polymer": "Polymer/polymer#master",
"google-signin": "GoogleWebComponents/google-signin#~0.0.6",
123 changes: 59 additions & 64 deletions demo.html
Original file line number Diff line number Diff line change
@@ -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>

1 change: 1 addition & 0 deletions google-drive-upload.html
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<script src="../cors-upload-sample/upload.js"></script>
2 changes: 1 addition & 1 deletion google-drive.css
Original file line number Diff line number Diff line change
@@ -4,5 +4,5 @@
}

:host google-signin, #files, #upload {
float: left;
float: left;
}
37 changes: 18 additions & 19 deletions google-drive.html
Original file line number Diff line number Diff line change
@@ -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();

0 comments on commit f1fb826

Please sign in to comment.