I saw the dashboard demo, and it looks amazing. Is it possible to embed a dashboard and even charts in a user interface created using HtmlService? Most of the demos are only using UI Services?
As far as I understand for now the only library you are able to use is JQuery and JQuery UI library but I believe the team are adding in more library to support it.
Related
Is it possible to use a support file from within the apps script project as a source for iframe in another HTML.
I need to do this as a part of a Web App project in Google Apps Script.
Specifically I need it to work as a menu system which is the same across multiple pages, so that I don't have to repeat the same HTML code over and over again.
Better explained in a picture
Left side menu(buttons) stays the same across pages
There are several ways to accomplish what you are looking (" I don't have to repeat the same HTML code over and over again") but using iframe is not the best way when working with Google Apps Script web applications.
First you have to decide if you want to handle your web application as a multipage or as simple page.
In any case you might find helpful to use templated HTML / scriptlets to pass the code from Google Apps Script .html files to your main html code. If you find yourself scripts hard to start with, then you might use other methods of the HTML Service
Resources
https://developers.google.com/apps-script/guides/html/
https://developers.google.com/apps-script/guides/html/templates
https://developers.google.com/apps-script/reference/html
Related
Use project Javascript and CSS files in a Google Apps Script web app?
Recent related question (no answers at this time, but with comments)
HTML Service: Templated HTML as sidebar
Is it possible to create navigation bar on Google Apps Script?
how to connect a navigation bar (<nav>) with HTML files in google appscript?
lately I am trying to figure out how to create an Google Workspace Add On that is able to show an iFrame. I started checking out the documentations of Google Apps Script and Google Add Ons.
So far I know, that I need to use the Card Service of Google to build Add ons. Here is the link: https://developers.google.com/apps-script/reference/card-service
Actually, I just tried to figure out if any class or function of the Card Service can handle HTML Output or HTML file but ...
And so far I could figure out that you can build a bound script (only for Editor Add ons that is not in my interest) that is able to build HTML interfaces but I need this for standalone scripts that I can publish later as Add ons.
Also don't understand: Building a standalone script, why can I create HTML files when I am not able to use or display them?
After looong searching I would be glad if someone could enlight me ...
You have to use CardService for Workspace Add-ons.
Only Editor add-ons (and Web Apps) allow for building custom interfaces with HTML/CSS and client-side javascript. Moreover, if User-Privacy and Anti-Trust laws/legislation keep gaining traction(GDPR, CCPA, etc.), there's a good chance we'll lose even that, but I digress.
If you're looking for official documentation on the matter, see Restrictions
You can try making a web app on the same GCP project then add your web app link to a Card button that opens it up as an overlay
var webAppOverlay = CardService.newOpenLink()
.setOpenAs(CardService.OpenAs.OVERLAY)
.setUrl("Your web app link")
var textButton = CardService.newTextButton()
.setText("Web App")
.setOpenLink(webAppOverlay);
var card = CardService.newCardBuilder()
.addSection(CardService.newCardSection()
.addWidget(textButton)
.build();
Is there a way to show a modal dialog in Gmail add-on, similar like in Spreadsheets add-on
SpreadsheetApp.getUi().showModalDialog(html, title);
Looks like no and the only way to display some UI to a user is to use Cards
However, I would like to be sure that it's correct. Couldn't find any article that it's not possible and working solution as well.
Thanks for any comments!
You are correct. If you want to add a UI to GMail using an Add-on you have to use their Cards feature. You can read the restriction here:
Use client-side scripting
You can't design a custom UI for your add-on using HTML, CSS and Javascript. Gmail add-ons use a widget-based approach to building user interfaces. This allows the add-on to work well on desktop and mobile platforms without requiring you to build an interface for each.
Currently have some code using this:
https://code.google.com/p/gwt-google-apis/
Since it hasn't been updated in years, and google code is going away...
I was wondering what the current approach/libraries are for accessing google apis from within GWT.
I think a good alternative would be to use the google map web component with JSInterop.
With the new Material Design released by Google and Polymer being one of the best, if not only, libraries to create such a design with ease, is there anyone to develop a Chrome Packaged App using the library to get the Material Design look it provides? Currently, it gets scripted block by Google's very strict CSP
Check out Vulcanize: http://www.polymer-project.org/articles/concatenating-web-components.html
It's a build tool for crushing HTML imports into a single file. It also has a --csp option that moves <script> into its own file. This will make CSP happy.
We're working on a template for Polymer Chrome App in the Chrome Dev Editor:
https://github.com/dart-lang/chromedeveditor
I'll update this thread once the template is available. This should make Polymer dev in a Chrome app a lot easier.
Here is another option.
If you're big fan of Dart language, you can use https://github.com/sunglim/csp_fixer package.
This package has a function to strip <script/> and create external js file.
Investigating ebidel response about vulcanize, I found that polybuild could be even more easy if you dont want so many extra options.
https://www.polymer-project.org/1.0/docs/tools/advanced#build
Also found this project on github that uses vulvanize with --csp option.
https://github.com/PolymerLabs/polymerchromeapp