How to use Google Picker with Google Drive using flutter - google-picker

I can't find any resource to embed google Picker in a flutter to upload a doc to Google drive. Can any provide me with an example of how to integrate Google Picker to Flutter?

Same issue here, you can use file_picker:
final result = await FilePicker.platform.pickFiles();
It will navigate user to an UI for selecting files including other app's files, i.e. google drive.
BTW, you should request permissions before picking the file:
final googleSignIn = GoogleSignIn(scopes: []);
await googleSignIn.signIn()
// request when you need it!
await googleSignIn.requestScopes([SheetsApi.spreadsheetsScope])
Found similar question here: File Picker for Google Drive Rest API for Android

Related

Flutter - how to map a network drive using smb in a MacOS app?

My macOS app needs to tell the Finder to open a shared drive on smb:// protocol
I've tried using the html package, but that did not work:
var url = "smb://myserver.com"
if (await canLaunch(url)) {
await launch(url);
}
I've also tried url_launcher, but the documentation already says it does not support mapping a network drive, only http, https, mailto, tel, and sms
My guess is that the MacOS api is still not mature enough so this does not exist?
Searched everywhere... thank you in advance!

How do I detect when embedded Youtube video is playing?

UPDATE (July 2020): I was able to get a mostly working version of this. See my answer to the related question here.
In my angular Nativescript iOS app, I have a webview set up to play youtube videos. Following a method similar to this question here, I can get the youtube video to load and play automatically, using the Youtube Iframe API. But how do I detect when the video actually starts playing (after it is loaded)?
The Iframe API has events for this purpose, like "onStateChange". But, because my youtube code is "stuck" inside the webview, I am currently not able to read when events are fired from that webview.
In Nativescript, there is a nativescript-webview-interface plugin for this purpose, but I can't get it to work. I have put my code below. If that is the way to go, what is the correct code to get it working?
(I don't want to use the nativescript-youtube plugin because that brings in youtube's quotas, which are regularly shrinking. )
Code I Have Tried:
To get the youtube player to activate, I have put all of the relevant youtube code inside the webview. That works to play the video, but not yet to get the event of when the player starts playing. To do what I want to do, I need to have some way of inserting that code into my app WITHOUT trapping it in the webview. Or, have some way of communicating inside the webview.
To try to communicate with the webview, I have tried the nativescript-webview-plugin:
$ tns plugin add nativescript-webview-interface
html:
<web-view src="{{youtubeCode}}" #webView ></web-view>
ts:
import {WebView, LoadEventData} from "tns-core-modules/ui/web-view";
let webViewInterfaceModule = require('nativescript-webview-interface');
...
export class ...{
#ViewChild('webView') webView: ElementRef;
public youtubeCode = [code that youtube provides in its IFrame API]
ngOnInit(): void {
this.setupWebViewInterface();
}
setupWebViewInterface() {
let webView: WebView = this.webView.nativeElement;
this.oWebViewInterface = new webViewInterfaceModule.WebViewInterface(webView, '~/www/index.html');
this.youtubeListen()
}..
youtubeListen(){
this.oWebViewInterface.on('onStateChange', (eventData)=>{ //'onStateChange' is the event provided in the Youtube Iframe API
console.log('event data = ' + eventData) //***this is the key part I want to work.
});
}
RESULT: ERROR TypeError: undefined is not an object (evaluating 'this.webView.ios.constructor')
This is a problem in the plugin's index.ios.js file. If I comment out the offending line, then the errors go away, but then nothing happens
..

Open an image in Google Docs

Just a little background: As you might know, if you have an image in Google drive and you try to open it with Google Docs, Google tries to extract the text within your image (OCR) and show the text alongside the image in a newly created Google Docs file.
I am writing a script and within that script I would like to open an image (with some text) with Google Docs.
When I try to do it through the following code, I just an Error message with no explanation on why it fails.
var file_url = file.getUrl();
try
{
var doc = DocumentApp.openByUrl(file_url);
}catch (e) {
Logger.log("Error Occurred: " + e.toString());
}
Any help would be appreciated.
Edit 1: Here is an actual scenario. I have the following .png image and I can open it with Google Docs.
When I open with Google Docs, I get the following document:
Document generated after opening the .png image with Google Doc.
Having the url of this .png file, I would like to do all this through my script so I can have the OCR generated text.
You want to convert a PNG file to Google Document by OCR using Google Apps Script.
If my understanding is correct, how about this modification? In this modification, Drive API is used.
When you use this script, please enable Drive API at Advanced Google Services and API console. You can see about this at here.
Modified script:
var fileId = "### file ID of PNG file ###";
var file = DriveApp.getFileById(fileId);
Drive.Files.insert(
{title: file.getName(), mimeType: MimeType.GOOGLE_DOCS},
file.getBlob(),
{ocr: true}
);
Note:
When the URL of PNG file is like https://drive.google.com/file/d/#####/view?usp=sharing, ##### is the file ID.
In this modified script, the filename of created Document uses the filename of file retrieved by fileId. If you want to use other filename, please modify title: file.getName().
References:
Advanced Google Services
Drive API

Google Sheets API: How to "publish to web" for embeddable sheet?

If I wanted to publish a Google Sheets spreadsheet so I could embed it on a page within an iframe, I would manually do the following:
Navigate to Google Drive
Open a spreadsheet
File > Publish To Web > Embed > Copy the generated iframe link into an html file
How would I programmatically achieve the above through the Google Sheets API using JavaScript on the front end? I'm generating spreadsheets on the fly in my application and want to immediately embed them on the page once created.
Once the sheet is created, I can dynamically create an iframe element with the necessary attributes (the sheets ID, among others). That throws an error. From this question, it looks like a sheet needs to have a published: true attribute or something, but that requires using the Drive API - I'm trying to avoid that. Is this possible to handle only through the Sheets API?
After searching through the entire Sheets API, googling, and just general soul-searching, I had no choice but to include the Drive API and use it to do my bidding. Here's the solution I came up with. Hope this helps someone else out there!
Used this script from Google for the client-side JS library in the index.html file:
<body>
...
<script type="text/javascript" src="https://apis.google.com/js/client.js"></script>
</body>
Then for the JS stuff:
// Cache the api's into variables.
var sheets = gapi.client.sheets;
var drive = gapi.client.drive;
// 1. CREATE NEW SPREADSHEET
sheets.spreadsheets.create({
properties: {
title: 'new-sheet'
}
}).then(function(newSpreadSheet) {
var id = newSpreadSheet.result.spreadsheetId;
// 2. PUBLISH SPREADSHEAT VIA DRIVE API
drive.revisions.update({
fileId: id,
revisionId: 1
}, {
published: true, // <-- This is where the magic happens!
publishAuto: true
}).then(function() {
// 3. DISPLAY SPREADSHEET ON PAGE VIA IFRAME
var iframe = [
'<iframe ',
'src="https://docs.google.com/spreadsheets/d/',
id,
'/pubhtml?widget=true&headers=false&embedded=true"></iframe>'
].join('');
// We're using jQuery on the page, but you get the idea.
$('#container').html($(iframe));
});
});
As you have concluded, it is not possible through the Sheets API today and is only possible through the Drive API (using the PATCH https://www.googleapis.com/drive/v3/files/fileId/revisions/revisionId request, documented at https://developers.google.com/drive/v3/reference/revisions/update).

How can I authenticate with google inside of a firefox plugin

I'd like to add a calendar entry from my Firefox plugin to the user's Google calendar (with their authorization, of course). Unfortunately, I can't seem to figure out how to authenticate with Gapi within the context of the Firefox SDK.
I tried including the client.js from gapi directly as a module in my source, but this isn't effective, since it can't access the window object. My next attempt was something akin to what I do with jQuery - load it in a content script:
googleClient.js
var tabs = require("sdk/tabs");
var self = require('sdk/self');
function initAuth() {
var worker = tabs.activeTab.attach({
url: 'about:blank',
contentScriptFile: [self.data.url('gapi.js'), self.data.url('authContentScript.js')]
});
}
exports.initAuth = initAuth;
main.js:
var googleClient = require('./googleClient');
I get the following problem:
console.error: foxplugin:
Error opening input stream (invalid filename?)
In the ideal situation, it would open a new window in the browser that allows the user to login to Google (similar to what happens when one requests access to the oauth2 endpoint from within a "real" content script).
I had the same problem so I've made an npm plugin for that. It's called addon-google-oauth2 and works for Google OAuth2 tested with AdSense API. It's really simple, it just calls REST APIs for OAuth2. Steps:
Create an OAuth2 client for native application. No web or Android, just native.
If your addon is using jpm ok, if it uses cfx, please migrate to jpm
Download and save the dependency with npm
npm install addon-google-oauth2 --save
Follow the tutorial on the README.md file. It's easy, just two API calls
refreshToken(options,callback);
getToken();
Insert the HTML and JS file on your data/ directory

Resources