Aligning google aps script gadget on google page - google-apps-script

I've create a google apps script chart which looks fine when I run publish > deploy > Test web app for your latest code.
However, once it's inserted as script gadget on a page of a google site, I can't modify its horizontal alignment:
clicking the left/center/right icon to modify alignment of the script gadget while editing the page in google site does nothing
I've tried deploying the app as UiApp.createApplication() as-is and then within a horizontal panel with various settings of HorizontalAlignment: nothing changes.
Creating charts with google apps script is easy enough, but aligning the results on a google page is frustrating.
uiApp = UiApp.createApplication().setTitle('TheTitle').add( chart );
var hpanel = uiApp.createHorizontalPanel()
hpanel.add(chart).setHorizontalAlignment(UiApp.HorizontalAlignment.LEFT)
uiApp.add(hpanel);
return uiApp;

Try changing the width of the hpanel to like var hpanel = uiApp.createHorizontalPanel().setWidth(800) and you may notice the alignment change then.

Related

Hide Menu Bar in Google Sheets using App Script

I wanted to hide the menu bar in the Google Sheet I created (I am the owner of the file) to the specified editors using App Script. Would that be possible?
I did the "?rm=minimal" trick in the URL but the app script I created for some parts aren't working.
Thanks for your help!
I am expecting it to hide the menu/tool bars placed in the top view of sheets.

google apps script & picker in iframe

The problem with displaying google picker in apps script when placing the script in a iframe of another web site. When you call the picker, a white square is displayed.
Not in the frame of another web site, the picker works fine.
HtmlService google apps script
function doGet() {
return HtmlService.createTemplateFromFile('form.html')
.evaluate()
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);}
https://stackoverflow.com/questions/40842627/embedding-google-apps-script-in-an-iframe#answer-40843413
The picker is based on this documentation -
https://developers.google.com/apps-script/guides/dialogs#file-open_dialogs
I decided to try a demo premium script File Upload Form.
https://ctrlq.org/code/19747-google-forms-upload-files
Will insert the script into the frame, but the result was similar - an empty white square.
https://script.google.com/macros/s/AKfycbxlX3r_dt_ZLZC9TqloaqtdextROJoIH9mUDu3MWOiXtI6ADhqb/exec
Example
http://jsfiddle.net/qqq7df51/
Whether it is possible to solve this problem.
I know that this is an old post, but it was the closest that met the search for the white-blank picker issue when the Google Picker is called from a Google Apps Script web app with the error.
Incorrect origin value. Please set it to - (window.location.protocol + '//' + window.location.host) of the top-most page
The suggestion in the error log didn't work for me, but I found a clue here.
My solution was to set the Picker site origin to the site that my iFrame was in.
For example, if I embedded my web app in 'https://www.example.com' then my picker method would be:
.setOrigin("https://www.example.com")
An example of the full constructor might look like this:
//Builds the picker
const picker = new google.picker.PickerBuilder()
.enableFeature(google.picker.Feature.SUPPORT_TEAM_DRIVES)
.setOAuthToken(config.oauthToken)
.addView(view)
.setDeveloperKey(config.developerKey)
// .setOrigin(google.script.host.origin) // Don't use this.
.setOrigin("https://www.example.com") // Add your base URL here.
.setSize(DIALOG_DIMENSIONS.width,
DIALOG_DIMENSIONS.height)
.setCallback(pickerCallback)
.build()
If you intend to use Web App project as standalone and as embedded version at the same time, the same file picker will require different origin urls. To avoid hard-coding and chaning urls, I just get the right one from ancestorOrigins. It's the last one in array.
var url = window.location.ancestorOrigins[window.location.ancestorOrigins.length-1];
new google.picker.PickerBuilder().setOrigin(url);
As mentioned in Enum XFrameOptionsMode,
Setting XFrameOptionsMode.ALLOWALL will let any site iframe the page, so the developer should implement their own protection against clickjacking.
With this, you may want to check implementation of protection against clickjacking. Try to add the X-Frame-Options HTTP Response header to any page that you want to protect from being clickjacked via framebusting.
For more information, visit Clickjacking Defense Cheat Sheet.

image click on mobile inside the sheets app

I have a custom script that runs when i click an image i insert in a google spreadsheet ... everything is working on non-touch devices ... but on mobile, inside the sheets app, it does no trigger the function ... it just selects the image
am i doing anything wrong here?
are google script supposed to work inside the sheets app? if not i really do no see the point of using them
link is not the solution, custom menus also do not appear on the sheets app ... i am literally left without any idea to try out
thanks
As far as I know Google Apps Script runs only on Desktop computer and that too only when Script is allowed to run on your browser. For most part Google Apps Script is same as JavaScript. I have tried to run them on Android phones but without any success.

Pop out Google Picker from IFRAME in Google Sites Apps Script Gadget?

So I made this google apps script to use the google picker on my google sites webpage. The apps script is inserted into the webpage via the google apps script gadget. This all functions as I intended, however, it does not behave the way I'd like it to or expected. Everything is rendered inside the requisite IFRAME. And from what I can find and tried, this has to be the case (please correct me if I'm wrong). This requires me to provide the screen real estate to show the picker even when it's not visible - which is pretty poor design. Does anyone know a way around this? That is, to make the picker modal to or pop out of the IFRAME instead stuck inside it?

HtmlService Sites gadget dynamic height

I'm inserting an Apps Script Html Service gadget into a google site. Is there some way to make the site page height and script container height dynamic to avoid scroll bars on the inserted gadget?
If it was possible, it would be in the:
Apps Script Sites Service
But I don't see any method for adding or editing a Gadget.
The only way I'm guessing that this might be possible, is if you got the HTML out of the current page:
var site = SitesApp.getSite("example.com", "mysite");
var page = site.getChildren()[0];
Logger.log(page.getHtmlContent());
var pageHTML = page.getHtmlContent();
edited the HTML to change in code with string functions,
var stringPageHTML = page.getHtmlContent();
//Find the HTML string you want to change, and change
//it with JavaScript string functions
var newHTML = "New HTML";
Delete the page:
page.deletePage();
Add a new page:
page.createWebPage(title, name, newHTML)
Last I checked, the gadget iframe height / width had to be about 50 pixels larger than the web app for no scroll bars to appear. When inserting the web app into the gadget it asks you for height in fixed pixels not a percentage. So I think getting the Sites page to be fully responsive is out the question.