
We continue to explore Google Drive, in the
last part it was automated simple creation of reports on the data from the table. In this part we will consider the creation of a
GUI.Suppose that a company has got a secretary who would send acts, but you will not train her to go into the scripts, click to run the script, then send it, etc. need to make a graphical interface for it.
The entire Google Script Api (GAS) graphical interface is based on the
Google Web Toolkit (GWT) , only a very simplified version (there are not many methods of objects that are in GWT).
')
There are two ways to create a user interface: using GUI Builder, using code. Using the latter is preferable, because GUI Builder does not provide access to all GUI widgets.
GUI Builder EXPERIMENTAL FUNCTIONThe left side contains widgets available for the GUI Builder, and the properties on the right of the selected widget (the number of properties is also limited). Elements are easily dragged onto the form without any problems, allowing you to quickly create a visual interface.
More details can be read on
Google Developers . It describes the process of creating the interface in the builder and calling the created form from the code.
Interface from codeThe interface of our database requires a calendar widget that is not available in the GUI Builder, but such a widget is in the
documentation , which means you can create it with code.
Creating a widget can be viewed visually in the
documentation for the widget DatePicker , I will not give the listing.
Client & Server HandlersA little bit about the events. Event handlers are of 2 types:
client and
server .
Client allow you to work only with the user interface without accessing the data on the server side (checking the filling of the fields, changing the styles of the widgets). About checking fields, as well as about ClientHandlers, you can read
here .
Server provides more functionality, such as working with data (receiving and / or recording).
When a ServerHandler is invoked, it is a "fresh" script. This will be the case for the app. There are global variables in the global variable. If you need to save state on the server, you can try using ScriptProperties or UserProperties.
This phrase states that when processing an event a new copy of the script is called, and to transfer global data, you must use UserProperies or ScriptProperties. This is very important because there may be difficulties in debugging (there is a form, access to the widget is, the user shows the data, but from the script this data is not visible). Another feature of events, the debugger stopping points do not work inside the event-handling function.
TrigersTriggers allow you to run a script on some event, or on time. So far there are not many triggers, namely 3 for the table + temporary triggers.
What is the resultThe window for managing acts opens automatically when the Table is opened, the launch of the main function in the triggers is configured.
At the top there is a menu with actions, below it is a status bar (displays the status of the action). Below them:
On the left - the calendar (when selecting the date, the fields on the right are updated), on the right-above - a list of all uncommitted acts, below it is a list of works for the day selected in the calendar.

Data is entered using the
created form (not a form from the code, namely Google Drive Forms)
LinksDemo project with codeGoogle Apps Script DocumentationThere is something to work on, but for a simple desk (as well as my needs) this will be enough. I repeat that all this was done with the aim of “probing” Google Drive, in capable hands it is capable of much. But who will do all this when there are ready-made products?