forked from arn1313/pi-spy
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathpicker.html
168 lines (162 loc) · 5.91 KB
/
picker.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Pi-Spy-Vault</title>
<style>
body {
display: flex
}
#views {
border-collapse: collapse;
margin: 10px;
}
#views tr {
border: 0;
border-top: 1px solid #e0e0e0;
}
#views td {
border-bottom:1px solid #e0e0e0;
border-spacing: 0;
padding: 5px
}
</style>
<script type="text/javascript">
// The Browser API key obtained from the Google Developers Console.
var developerKey = 'AIzaSyBXUxX74XNe1SWbtRmjGZ1IzfC-X2y4i8g';
// The Client ID obtained from the Google Developers Console. Replace with your own Client ID.
var clientId = "446008585935-l31ud1veknjcsclpe4lhla577plsnbb0.apps.googleusercontent.com";
// Scope to use to access user's photos.
var scope = [
'https://www.googleapis.com/auth/drive',
'https://www.googleapis.com/auth/photos',
'https://www.googleapis.com/auth/youtube'
];
var authApiLoaded = false;
var pickerApiLoaded = false;
var oauthToken;
var viewIdForhandleAuthResult;
// Use the API Loader script to load google.picker and gapi.auth.
function onApiLoad() {
gapi.load('auth', {'callback': onAuthApiLoad});
gapi.load('picker', {'callback': onPickerApiLoad});
}
function onAuthApiLoad() {
authApiLoaded = true;
}
function onPickerApiLoad() {
pickerApiLoaded = true;
}
function handleAuthResult(authResult) {
if (authResult && !authResult.error) {
oauthToken = authResult.access_token;
createPicker(viewIdForhandleAuthResult, true);
}
}
// Create and render a Picker object for picking user Photos.
function createPicker(viewId, setOAuthToken) {
if (authApiLoaded && pickerApiLoaded) {
var picker;
if(authApiLoaded && oauthToken && setOAuthToken) {
picker = new google.picker.PickerBuilder().
addView(viewId).
setOAuthToken(oauthToken).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
} else {
picker = new google.picker.PickerBuilder().
addView(viewId).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
}
picker.setVisible(true);
}
}
// A simple callback implementation.
function pickerCallback(data) {
var url = 'nothing';
if (data[google.picker.Response.ACTION] == google.picker.Action.PICKED) {
var doc = JSON.stringify(data[google.picker.Response.DOCUMENTS][0], null, " ");
}
document.getElementById('result').innerHTML = message;
}
</script>
</head>
<body>
<img class="logo" src="img/pi_spy.png" alt="logo">
<table id="views">
<tr>
<td rowspan="11">PiSPy Surveillance Videos</td>
</tr>
<tr>
<td img class="logo" src="img/pi_spy.png" alt="logo"></td>
</tr>
<td><a href="#DOCS" id="DOCS">All Google Drive items.</a></td>
</tr>
<tr>
<td><a href="#DOCS_IMAGES" id="DOCS_IMAGES"</a>Surveillance Screenshots.</a></td>
</tr>
<tr>
<td><a href="#DOCS_IMAGES_AND_VIDEOS" id="DOCS_IMAGES_AND_VIDEOS"</a>All Surveillance Items</a></td>
</tr>
<tr>
<td><a href="#DOCS_VIDEOS" id="DOCS_VIDEOS"</a>Surveillance Videos.</a></td>
</tr>
</table>
<pre id="result"></pre>
<!-- The Google API Loader script. -->
<script type="text/javascript" src="https://apis.google.com/js/api.js?onload=onApiLoad"></script>
<script type="text/javascript">
Array.prototype.forEach.call(document.querySelectorAll('#views a'), function (ele) {
ele.onclick = function () {
var viewIds = {
"DOCS": google.picker.ViewId.DOCS,
"DOCS_IMAGES": google.picker.ViewId.DOCS_IMAGES,
"DOCUMENTS": google.picker.ViewId.DOCUMENTS,
"PRESENTATIONS": google.picker.ViewId.PRESENTATIONS,
"SPREADSHEETS": google.picker.ViewId.SPREADSHEETS,
"FORMS": google.picker.ViewId.FORMS,
"DOCS_IMAGES_AND_VIDEOS": google.picker.ViewId.DOCS_IMAGES_AND_VIDEOS,
"DOCS_VIDEOS": google.picker.ViewId.DOCS_VIDEOS,
"FOLDERS": google.picker.ViewId.FOLDERS,
"PDFS": google.picker.ViewId.PDFS,
"DOCS_UPLOAD": new google.picker.DocsUploadView(),
"PHOTO_ALBUMS": google.picker.ViewId.PHOTO_ALBUMS,
"PHOTOS": google.picker.ViewId.PHOTOS,
"PHOTO_UPLOAD": google.picker.ViewId.PHOTO_UPLOAD,
"IMAGE_SEARCH": google.picker.ViewId.IMAGE_SEARCH,
"MAPS": google.picker.ViewId.MAPS,
"VIDEO_SEARCH": google.picker.ViewId.VIDEO_SEARCH,
"WEBCAM": google.picker.ViewId.WEBCAM,
"YOUTUBE": google.picker.ViewId.YOUTUBE,
"RECENTLY_PICKED": google.picker.ViewId.RECENTLY_PICKED
}
var id = this.id;
var viewId = viewIds[id];
var setOAuthToken = true;
if (id === 'IMAGE_SEARCH' || id === 'MAPS' || id === 'VIDEO_SEARCH') {
setOAuthToken = false;
createPicker(viewId, setOAuthToken);
} else {
if(authApiLoaded && !oauthToken) {
viewIdForhandleAuthResult = viewId;
window.gapi.auth.authorize(
{
'client_id': clientId,
'scope': scope,
'immediate': false
},
handleAuthResult
);
} else {
createPicker(viewId, setOAuthToken);
}
}
return false;
}
});
</script>
</body>
</html>