- What’s Google Apps Script? - Case study - Orgtree chrome extension - Google Apps Script for Mobile developers - Tips & Study information

1. Google
Apps Script
Introduction

2. https://www.facebook.com/groups/GCPUG.TW/
https://plus.google.com/u/0/communities/116100913832589966421
Google Cloud Platform User Group Taiwan
我們是Google Cloud Platform Taiwan User Group。在Google雲端服務在台灣地區展露頭角之後，
有許多新的服務、新的知識、新的創意，歡迎大家一起分享，一起了解 Google雲端服務...
GCPUG透過網際網路串聯喜好 Google Cloud的使用者，分享與交流使用 GCP的點滴鑑驗。如果您
是Google Cloud Platform的初學者，您應該來聽聽前輩們的使用經驗；如果您是 Google Cloud
Platform的Expert，您應該來分享一下寶貴的經驗，並與更多高手互相交流；如果您還沒開始用
Google Cloud Platform，那麼您應該馬上來聽聽我們是怎麼使用 Google Cloud的！

3. Hello!
I am Cage Chung
I am here because I like
to share my
experiences.
You can find me at:
http://kaichu.io

4. Outline
◎ What’s Google Apps Script?
◎ Case study - Orgtree chrome extension
◎ Google Apps Script for Mobile developers
◎ Tips & Study information

5. 1.
What’s Google App
Scripts
Let’s start with the first set of slides

6. “
Google Apps Script is a scripting
language based on JavaScript
that lets you do new and cool
things with Google Apps

7. Where
Google apps, 1 platform in the cloud

8. Add-ons for Google Apps
Google Sheets, Docs, and Forms
Add-ons run inside Google Sheets, Docs, and Forms

9. Add-ons for Google Apps - continue

10. Google Service
◎ Calendar
◎ Contacts
◎ Documents
◎ Domain Deprecated
◎ Drive
◎ Forms
◎ Gmail
◎ Groups
◎ Language
◎ Maps
◎ Sites
◎ Spreadsheet

11. Advances Google Service
◎ Admin SDK
◎ AdSense
◎ Analytics
◎ App Activity
◎ BigQuery
◎ Calendar
◎ Classroom
◎ Drive
◎ DoubleClick
Campaigns
◎ Fusion Table
◎ Gmail
◎ Google+
◎ Google+ Domains
◎ Mirror
◎ Prediction
◎ Shopping Content
◎ Tasks
◎ URL Shortener
◎ YouTube

12. Type of Scripts - Standalone
Standalone
is any script that is not bound to a Google Sheets, Docs, or Forms file
or Google Sites.
// Log the name of every file in the user's Drive that modified after February 28,
// 2013 whose name contains "untitled".
function doAction(){
var files = DriveApp.searchFiles(
'modifiedDate > "2015-01-01" and title contains "untitled"');
while (files.hasNext()) {
var file = files.next();
Logger.log(file.getName());
}
}
[iOS Taipei - Apps Script - Type of Scripts - Standalone](https://goo.gl/oj8WVO)

13. Bound to Google Apps
A script is bound to a Google Sheets, Docs, or Forms file.
Type of Scripts - Bound to Google Apps
function doAction(range) {
// Get the active spreadsheet and the active sheet
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getActiveSheet();
// Get the range of cells that store employee data.
var libraryDataRange = sheet.getRange(range);
var libraryObjects = getRowsData(sheet, libraryDataRange, 1);
libraryObjects.forEach(function (row, index) {
var latlng = getLatitudeLongitude(row.address)
if (latlng) {
sheet.getRange(index + 2, 5, 1, 1).setValue(latlng.lat);
sheet.getRange(index + 2, 6, 1, 1).setValue(latlng.lng);
}
});
}

14. Type of Scripts - Bound to Google Apps. continue
[coffeemap-testing-form - Google Sheets](https://goo.gl/ZAIOtT)
[coffeemap](https://goo.gl/Wb91tW) quick setup form
[Coffee Stores Map](https://goo.gl/Wg6mWu)
Trigger and Events
Triggers let Apps Script run a function automatically when a certain
event, like opening a document, occurs.

15. Web Apps and Site Gadgets
If you build a user interface for a script, you can publish the script as a
web app.
◎ It contains a doGet(e) and doPost(e) function.
◎ The function returns an HTML service HtmlOutput object or
a Content service TextOutput object.
Type of Scripts - Web Apps and Site Gadgets

16. Type of Scripts - Web Apps and Site Gadgets. continue
function doGet() {
var ss = SpreadsheetApp.openById('1QgsaX4Vn_lIwLFRC_iHs6gmJYIP4y-35nVqQOpz4B0s');
var sheet = ss.getSheets()[0];
// Get the range of cells that store employee data.
var employeeDataRange = ss.getRangeByName("employeeData");
// For every row of employee data, generate an employee object.
var employeeObjects = getRowsData(sheet, employeeDataRange);
return ContentService.createTextOutput(JSON.stringify(employeeObjects)).setMimeType(ContentService.
MimeType.JSON);
}
...
[iOS Taipei - employee Data](https://goo.gl/NpdIrQ)
$ curl -L https://script.google.com/macros/s/AKfycbz4Z2dm-MUidB98H5XbekL0LZnvPVRM3ekpG-NSrScc9tvI87A/exec
[{"level":1,"id":"A00","parent":"root","type":"D","title":"資訊研發處","email":"A00@aa.bb.cc"},{"level":2,"
id":"A10","parent":"A00","type":"D","title":"資訊研發部","email":"A10@aa.bb.cc"},{"level":3,"id":"SunnyHu","
parent":"A10","type":"U","title":"胡適 ...

17. 2.
Case Study -
Orgtree Chrome
extension
Let’s start with the second set of
slides

18. Big
concept
Insert your own
organization contacts
to Gmail and Drive with
ease

19. Place your screenshot here
Orgtree chrome extension - Gmail

20. Place your screenshot here
Orgtree chrome extension - Drive

21. Place your screenshot here
Orgtree chrome extension - Pick
Spreadsheet

22. Orgtree architecture
Google Apps Script Execution API
Orgtree Chrome extension
Spreadsheet

23. orgtree-example-data
Level ID Parent Type * Title Email
1 A00 root D 資訊研發處 A00@aa.bb.cc
2 A10 A00 D 資訊研發部 A10@aa.bb.cc
3 SunnyHu A10 U 胡適 hushi@aa.bb.cc
3 SimonSu A10 U 蘇武 suwu@aa.bb.cc
2 EthanChang A00 U 張三 zhangshang@aa.bb.cc
1 B00 root D 技術支援處 B00@aa.bb.cc
2 BensonChen B00 U 陳班森 bensonchen@aa.bb.cc
[orgtree - sheet 2 json](https://goo.gl/WmaHmG)

24. Apps Script
function getSheetJSON(sheetId) {
var ss = SpreadsheetApp.openById(sheetId);
var sheets = ss.getSheets();
var json = sheets.map(function(sheet) {
return convertSheet2JsonText(sheet);
});
return JSON.stringify(json);
}
function convertSheet2JsonText(sheet) {
// read spreadsheet value to array
...
return jsonArray;
}

25. Apps Script - continue
◎ Files/Project properties/scopes - https://www.
googleapis.com/auth/spreadsheets
◎ Resources/Developers Console Project -
Link Google Console Project
○ Google Apps Script Execution API - Register OAuth
2.0 client IDs required.

26. Google Apps Script Execution API
/**
* Google apps script ID
*/
const SCRIPTID = 'M6_REvtEnxTdstkFPTpMBrkRmolM6jgKW';
/**
* Google apps script function name
*/
const EXECUTE_FUNCTION = 'getSheetJSON';
fetch(`https://script.googleapis.com/v1/scripts/${CONSTANTS.SCRIPTID}:run`, {
method: 'post',
headers: {
Authorization: 'Bearer ' + oauth.token,
},
body: JSON.stringify({
function: CONSTANTS.EXECUTE_FUNCTION,
parameters: [sheet.id],
devMode: true,
}),
})
.then(response => response.json())
.then(json => dispatch(receiveSheet(sheet, json)));

27. benefit
◎ No database management
◎ Each user can have their own orgree data in
private spreadsheet (grant oauth)

28. Demo
fetch specific spreadsheet data via
Google Apps Script Execution API

29. 3.
Google Apps Script
for Mobile
developers
Let’s start with the third set of
slides

30. employee App
Architecture
Data in spreadsheet
Content Service (JSON)

31. employee App - outline
◎ Data in Spreadsheet setup
◎ Content Service (JSON) - App Script
◎ iOS - calling restful API (react native)

32. employee spreadsheet Data
Level ID Parent Type * Title Email
1 A00 root D 資訊研發處 A00@aa.bb.cc
2 A10 A00 D 資訊研發部 A10@aa.bb.cc
3 SunnyHu A10 U 胡適 hushi@aa.bb.cc
3 SimonSu A10 U 蘇武 suwu@aa.bb.cc
2 EthanChang A00 U 張三 zhangshang@aa.bb.cc
1 B00 root D 技術支援處 B00@aa.bb.cc
2 BensonChen B00 U 陳班森 bensonchen@gov.tw
[iOS Taipei - employee Data - Google Sheets](https://goo.
gl/A1Hdqd)

33. Content Service (JSON) App Script
function doGet() {
var ss = SpreadsheetApp.openById('1QgsaX4Vn_lIwLFRC_iHs6gmJYIP4y-35nVqQOpz4B0s');
var sheet = ss.getSheets()[0];
// Get the range of cells that store employee data.
var employeeDataRange = ss.getRangeByName("employeeData");
// For every row of employee data, generate an employee object.
var employeeObjects = getRowsData(sheet, employeeDataRange);
return ContentService.createTextOutput(JSON.stringify(employeeObjects)).setMimeType(ContentService.
MimeType.JSON);
}
...
Read specific spreadsheet content
and return JSON string
[iOS Taipei - employee Data](https://goo.gl/NpdIrQ)

34. Content Service (JSON) App Script - continue
Publish/Deploy as web app

35. Content Service (JSON) App Script - continue
$ curl -L https://script.google.com/macros/s/AKfycbz4Z2dm-MUidB98H5XbekL0LZnvPVRM3ekpG-NSrScc9tvI87A/exec
[{"level":1,"id":"A00","parent":"root","type":"D","title":"資訊研發處","email":"A00@aa.bb.cc"},{"level":
2,"id":"A10","parent":"A00","type":"D","title":"資訊研發部","email":"A10@aa.bb.cc"},{"level":3,"id":"
SunnyHu","parent":"A10","type":"U","title":"胡適","email":"hushi@aa.bb.cc"},{"level":3,"id":"SimonSu","
parent":"A10","type":"U","title":"蘇武","email":"suwu@aa.bb.cc"},{"level":2,"id":"EthanChang","parent":"
A00","type":"U","title":"張三","email":"zhangshang@aa.bb.cc"},{"level":1,"id":"B00","parent":"root","
type":"D","title":"技術支援處","email":"B00@aa.bb.cc"},{"level":2,"id":"BensonChen","parent":"B00","
type":"U","title":"陳班森","email":"bensonchen@aa.bb.cc"}]

36. iOS employee App - react native
var React = require('react-native');
var {AppRegistry, StyleSheet, Text, View, ListView, TouchableOpacity, AlertIndicatorIOS,
ActivityIndicatorIOS, AlertIOS} = React;
var SPREADSHEET_WEB_API_URL = 'https://script.google.com/macros/s/AKfycbz4Z2dm-MUidB98H5XbekL0LZnvPVRM3ekpG-
NSrScc9tvI87A/exec';
class AwesomeProject extends React.Component {
...
fetchData () {
fetch(SPREADSHEET_WEB_API_URL).then((response) => response.json()).then((responseData)=>{
let dataBlob = [];
responseData.forEach(item=>{dataBlob.push(`${item.title} - ${item.email}`);});
this.setState({dataSource: this.state.dataSource.cloneWithRows(dataBlob), loaded: true});
}).done();
}
render () {
...
}
}
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);

37. Demo
calling restful service and get JSON
back

38. Let’s review some concepts
Content Service
Google Apps Script support
ContentService that allows for
data to be served from
Spreadsheet with your logic
Simple backend
store your data in Google
Spreadsheet without build another
database for small project

39. 4.
Tips & Study
information
Let’s start with the fourth set of
slides

40. “
Google Apps Script function not
found: doGet.
You need to save a new version and publish
the new version to make sure your app gets
updated properly
File -> Manage versions...
[javascript - Google Apps Script function not found: doGet - Stack Overflow](http://goo.gl/CXxAOT)

41. “
[Script It! with Android - YouTube](https://www.youtube.com/watch?v=RSgMEtRl0sw&list=PL68F511F6E3C122EB)

42. Study information
◎ [Google apps script - simon su](http://www.slideshare.
net/peihsinsu/google-apps-script-24469585)
◎ [entaq/GoogleAppsScript](https://github.com/entaq/GoogleAppsScript)
○ [Script It! with Android - YouTube](https://www.youtube.com/watch?
v=RSgMEtRl0sw&list=PL68F511F6E3C122EB)
○ [Apps Script Crash Course: ContentService - YouTube](https://www.
youtube.com/watch?v=JRGzVdliQOQ&list=PL68F511F6E3C122EB)
◎ [Apps Script | Google Developers](https://developers.google.com/apps-
script/)
◎ [Google Apps Script 入門與應用 - 資訊學科中心](http://icerc.tnssh.tn.edu.
tw/download/rs/1030429_3.pdf)

43. Study information - examples
◎ [Generate EPUB file with Google Apps Scripts | blog.softapalvelin.com](http:
//blog.softapalvelin.com/2013/02/generate-epub-file-with-google-app.html)
○ [RSSToEPUB](https://goo.gl/YCDDBo)
◎ [google/google-apps-script-samples](https://github.com/google/google-
apps-script-samples)
◎ [Tutorials | Apps Script | Google Developers](https://developers.google.
com/apps-script/articles)
◎ [Parsing HTML - Google Apps Script Examples](https://sites.google.
com/site/scriptsexamples/learn-by-example/parsing-html)

44. Thanks!
Any questions?
You can find me at:
http://kaichu.io
cage.chung@gmail.com