](https://youtu.be/O3K88f4sRaA)
5 |
6 |
7 |
8 | ## Recommended IDE Setup
9 |
10 | [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
11 |
12 | ## Customize configuration
13 |
14 | See [Vite Configuration Reference](https://vitejs.dev/config/).
15 |
16 | ## Project Setup
17 |
18 | ```sh
19 | npm install
20 | ```
21 |
22 | ### Compile and Hot-Reload for Development
23 |
24 | ```sh
25 | npm run dev
26 | ```
27 |
28 | ### Compile and Minify for Production
29 |
30 | ```sh
31 | npm run build
32 | ```
33 |
34 | ### Build for Google Apps Script
35 |
36 | ```sh
37 | npm run build-gas
38 | ```
39 |
40 |
41 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_A/api.js:
--------------------------------------------------------------------------------
1 | class API{
2 | constructor(){
3 | this.name = APP_NAME
4 | this.app = SpreadsheetApp
5 | this.database = this.app.openById(DATABSE_ID)
6 | }
7 |
8 | createKeys(headers){
9 | return headers.map(header => header.toString().trim())
10 | }
11 |
12 | creaetItemObject(keys, values){
13 | const item = {}
14 | keys.forEach((key, index) => item[key] = values[index])
15 | return item
16 | }
17 |
18 | getItems(sheetName, pageSize=15, page=1){
19 | const ws = this.database.getSheetByName(sheetName)
20 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
21 | const [headers, ...records] = ws.getDataRange().getValues()
22 | const keys = this.createKeys(headers)
23 |
24 | const startIndex = (page - 1) * pageSize
25 | const items = records.slice(startIndex, startIndex + pageSize).map(values => this.creaetItemObject(keys, values))
26 | return {
27 | items,
28 | pages: Math.ceil(records.length/pageSize),
29 | pageSize,
30 | page,
31 | }
32 | }
33 | }
34 |
35 | const api = new API()
36 | const getItems = (jsonData) => {
37 | const {sheetName, pageSize, page} = JSON.parse(jsonData)
38 | const data = api.getItems(sheetName, pageSize, page)
39 | return JSON.stringify(data)
40 | }
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "live-coding",
3 | "version": "1.0.0",
4 | "description": "All my live coding projects published on my YouTube channel https://youtube.com/ashtonfei/",
5 | "main": "index.js",
6 | "scripts": {
7 | "push": "cd ./src/projects/$node_config_i; clasp push",
8 | "pull": "cd ./src/projects/$node_config_i; clasp push",
9 | "open": "cd ./src/projects/$node_config_i; clasp push",
10 | "doc": "jsdoc2md ./src/projects/$node_config_i/*.js > ./src/projects/$node_config_i/DOCUMENT.md"
11 | },
12 | "repository": {
13 | "type": "git",
14 | "url": "git+https://github.com/ashtonfei/live-coding.git"
15 | },
16 | "keywords": [
17 | "gas",
18 | "apps script",
19 | "google apps script",
20 | "live coding'",
21 | "google sheet'",
22 | "google doc",
23 | "google form",
24 | "google slide",
25 | "gmail",
26 | "automation",
27 | "macro",
28 | "javascript"
29 | ],
30 | "author": "Ashton Fei",
31 | "license": "MIT",
32 | "bugs": {
33 | "url": "https://github.com/ashtonfei/live-coding/issues"
34 | },
35 | "homepage": "https://github.com/ashtonfei/live-coding#readme",
36 | "devDependencies": {
37 | "@google/clasp": "^2.4.1",
38 | "@types/google-apps-script": "^1.0.37",
39 | "jsdoc-to-markdown": "^7.0.1",
40 | "npm": "^8.0.0",
41 | "typescript": "^4.4.4"
42 | }
43 | }
44 |
--------------------------------------------------------------------------------
/src/projects/LC004/PART_A/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Demo Form
8 | 9 | 40 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /src/projects/LC011/PART_B/backend.js: -------------------------------------------------------------------------------- 1 | const CONFIG = { 2 | INDEX: "index.html", 3 | NAME: "LC011 PART B", 4 | DB_ID: "1dvMm-bYIaFWgvhOVFAJJ4YIHhZNE-A2jvwNuVcTcLeg", 5 | } 6 | 7 | class App{ 8 | constructor(){ 9 | this.db = SpreadsheetApp.openById(CONFIG.DB_ID) 10 | } 11 | 12 | login({email, password}) { 13 | if (password !== "password") { 14 | return { 15 | success: false, 16 | message: "Invalid credentials", 17 | } 18 | } 19 | return { 20 | user: {name: "Ashton Fei", token: "password"}, 21 | success: true, 22 | message: "Welcome!", 23 | } 24 | } 25 | 26 | logout({token}){ 27 | return { 28 | success: true, 29 | message: "You've been logged out!", 30 | } 31 | } 32 | } 33 | 34 | const app = new App() 35 | 36 | const login = (params) => { 37 | params = JSON.parse(params) 38 | const data = app.login(params) 39 | return JSON.stringify(data) 40 | } 41 | 42 | const logout = (params) => { 43 | params = JSON.parse(params) 44 | const data = app.logout(params) 45 | return JSON.stringify(data) 46 | } 47 | 48 | function doGet() { 49 | return HtmlService.createTemplateFromFile(CONFIG.INDEX) 50 | .evaluate() 51 | .setTitle(CONFIG.NAME) 52 | .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) 53 | } 54 | 55 | 56 | function include_(filename){ 57 | return HtmlService.createTemplateFromFile(filename).evaluate().getContent() 58 | } 59 | 60 | 61 | -------------------------------------------------------------------------------- /src/projects/LC018/src/components/CounterApp.vue: -------------------------------------------------------------------------------- 1 | 2 |Your email has been sent successfully
43 |You can check it by click on this link.
44 | `; 45 | ui.dialog(html); 46 | } 47 | 48 | function onOpen() { 49 | SpreadsheetApp.getUi() 50 | .createMenu(APP_NAME) 51 | .addItem("Sent email", "sendEmail") 52 | .addToUi(); 53 | } 54 | -------------------------------------------------------------------------------- /src/projects/LC022/main.js: -------------------------------------------------------------------------------- 1 | const createMenu_ = 2 | (ui = SpreadsheetApp.getUi()) => (items, caption = null) => { 3 | const menu = caption ? ui.createMenu(caption) : ui.createAddonMenu(); 4 | const createMenuItem = ({ title, items, caption, fn, sep }) => { 5 | if (title && items) { 6 | return menu.addSubMenu(createMenu_(ui)(items, title)); 7 | } 8 | if (caption && fn) return menu.addItem(caption, fn); 9 | 10 | if (sep) return menu.addSeparator(); 11 | }; 12 | items.forEach(createMenuItem); 13 | return menu; 14 | }; 15 | 16 | const fnToBeDone = () => { 17 | SpreadsheetApp.getUi().alert("FN to be done."); 18 | }; 19 | 20 | const MENU_ITEMS = [ 21 | // menu item object with caption and fn 22 | { caption: "Func A", fn: "fnToBeDone" }, 23 | // menu separator object with sep = true 24 | { sep: true }, 25 | // Sub menu object with title and items 26 | { 27 | title: "Sub Menu", 28 | items: [ 29 | { caption: "Func A", fn: "fnToBeDone" }, 30 | { sep: true }, 31 | { 32 | title: "Sub Menu", 33 | items: [ 34 | { caption: "Func A ", fn: "fnToBeDone" }, 35 | { caption: "Func B ", fn: "fnToBeDone" }, 36 | { caption: "Func C", fn: "fnToBeDone" }, 37 | ], 38 | }, 39 | ], 40 | }, 41 | { caption: "Func B", fn: "fnToBeDone" }, 42 | ]; 43 | 44 | const onOpen = () => { 45 | const ui = SpreadsheetApp.getUi(); 46 | const buildMenu = createMenu_(ui); 47 | // create a custom menu 48 | const menu = buildMenu(MENU_ITEMS, "LC022"); 49 | // create an addon menu 50 | const addonMenu = buildMenu(MENU_ITEMS); 51 | menu.addToUi(); 52 | addonMenu.addToUi(); 53 | }; 54 | -------------------------------------------------------------------------------- /src/projects/LC004/PART_A/Code.js: -------------------------------------------------------------------------------- 1 | const APP_NAME = "LC004 Form with Multiple Dependent Dropdowns" 2 | const FILES_FOLDER_NAME = "Images" 3 | 4 | /** 5 | * Link the html file to another one 6 | */ 7 | function link(filename){ 8 | return HtmlService.createHtmlOutputFromFile(filename).getContent() 9 | } 10 | 11 | /** 12 | * Create a file on google drive 13 | */ 14 | function createFile(data, name){ 15 | const id = SpreadsheetApp.getActive().getId() 16 | const currentFolder = DriveApp.getFileById(id).getParents().next() 17 | const folders = currentFolder.getFoldersByName(FILES_FOLDER_NAME) 18 | let folder = null 19 | if (folders.hasNext()) { 20 | folder = folders.next() 21 | }else{ 22 | folder = currentFolder.createFolder(FILES_FOLDER_NAME) 23 | } 24 | const [fileType, fileData] = data.slice(5).split(";base64,") 25 | const decodedFileData = Utilities.base64Decode(fileData) 26 | const blob = Utilities.newBlob(decodedFileData, fileType).setName(name) 27 | const file = folder.createFile(blob) 28 | return file 29 | } 30 | 31 | /** 32 | * Handle get request 33 | */ 34 | function doGet() { 35 | return HtmlService.createTemplateFromFile("index.html").evaluate().setTitle(APP_NAME) 36 | } 37 | 38 | /** 39 | * Handle post request 40 | */ 41 | function doPost(e){ 42 | const postData = e.parameter 43 | const uuid = Utilities.getUuid() 44 | const image = createFile(postData.data, postData.profile) 45 | //save to spreadsheet 46 | const ws = SpreadsheetApp.getActive().getSheetByName("Responses") 47 | ws.appendRow([uuid, postData.college, postData.department, postData.teacher, postData.profile, image.getUrl()]) 48 | const html = `Thanks for your submission! \n${uuid}` 49 | return HtmlService.createHtmlOutput(html).setTitle("Success!") 50 | } 51 | 52 | -------------------------------------------------------------------------------- /src/projects/LC004/PART_B/Code.js: -------------------------------------------------------------------------------- 1 | const APP_NAME = "LC004 Form with Multiple Dependent Dropdowns" 2 | const FILES_FOLDER_NAME = "Images" 3 | 4 | /** 5 | * Link the html file to another one 6 | */ 7 | function link(filename){ 8 | return HtmlService.createHtmlOutputFromFile(filename).getContent() 9 | } 10 | 11 | /** 12 | * Create a file on google drive 13 | */ 14 | function createFile(data, name){ 15 | const id = SpreadsheetApp.getActive().getId() 16 | const currentFolder = DriveApp.getFileById(id).getParents().next() 17 | const folders = currentFolder.getFoldersByName(FILES_FOLDER_NAME) 18 | let folder = null 19 | if (folders.hasNext()) { 20 | folder = folders.next() 21 | }else{ 22 | folder = currentFolder.createFolder(FILES_FOLDER_NAME) 23 | } 24 | const [fileType, fileData] = data.slice(5).split(";base64,") 25 | const decodedFileData = Utilities.base64Decode(fileData) 26 | const blob = Utilities.newBlob(decodedFileData, fileType).setName(name) 27 | const file = folder.createFile(blob) 28 | return file 29 | } 30 | 31 | /** 32 | * Handle get request 33 | */ 34 | function doGet() { 35 | return HtmlService 36 | .createTemplateFromFile("index.html") 37 | .evaluate() 38 | .setTitle(APP_NAME) 39 | .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) 40 | .addMetaTag("viewport", "width=device-width, initial-scale=1.0") 41 | } 42 | 43 | /** 44 | * Handle post request 45 | */ 46 | function doPost(e){ 47 | const postData = e.parameter 48 | const uuid = Utilities.getUuid() 49 | const image = createFile(postData.data, postData.profile) 50 | //save to spreadsheet 51 | const ws = SpreadsheetApp.getActive().getSheetByName("Responses") 52 | ws.appendRow([uuid, postData.college, postData.department, postData.teacher, postData.profile, image.getUrl()]) 53 | const html = `Thanks for your submission! \n${uuid}` 54 | return HtmlService.createHtmlOutput(html).setTitle("Success!") 55 | } 56 | 57 | -------------------------------------------------------------------------------- /src/projects/LC010/PART_A/vue/js/index.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/projects/LC010/PART_A/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |
11 |
36 |
37 |
38 |
39 |
40 |
--------------------------------------------------------------------------------
/src/projects/LC017/form.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | {{name}}
12 |
13 |
24 |
14 |
15 |
22 |
23 | | {{ header.text }} | 17 |
|---|
| {{ item[header.value] }} | 20 |
25 |
35 |
26 |
33 |
34 |
16 |
17 |
18 |
31 |
32 |
64 |
65 |
66 |
--------------------------------------------------------------------------------
/src/projects/LC017/app.js:
--------------------------------------------------------------------------------
1 | this.CONFIG = {
2 | NAME: "LC017",
3 | API: "https://script.google.com/macros/s/AKfycby0xdOzEo8igw5cGNGk89vaS6a55JVrEgYdHxjgNKYrZieybrSZHphOC9lBTIaf94fa/exec",
4 | SN: {
5 | RESPONSES: "Responses",
6 | },
7 | HEADER: {
8 | FORM: ["Timestamp", "Email", "Comments", "Created By"]
9 | }
10 | }
11 |
12 | class App{
13 | constructor(){
14 | this.ss = SpreadsheetApp.getActive()
15 | this.user = Session.getActiveUser().getEmail()
16 | }
17 |
18 | request(action, names=[]){
19 | const url = `${CONFIG.API}?action=${action}&names=${names.join(".")}`
20 | UrlFetchApp.fetch(url, {
21 | method: "post"
22 | })
23 | }
24 |
25 | protectSheets(){
26 | const action = "protect"
27 | this.request(action)
28 | }
29 |
30 | unprotectSheets(names){
31 | const action = "unprotect"
32 | this.request(action, names)
33 | }
34 |
35 | showForm(){
36 | const template = HtmlService.createTemplateFromFile("form.html")
37 | const ui = SpreadsheetApp.getUi()
38 | const title = `${CONFIG.NAME} - Demo Form`
39 | const html = template.evaluate().setTitle(title)
40 | ui.showSidebar(html)
41 | }
42 |
43 | submit(payload){
44 | payload = JSON.parse(payload)
45 | const values = [
46 | new Date(),
47 | payload.email,
48 | payload.comments,
49 | this.user,
50 | ]
51 | const ws = this.ss.getSheetByName(CONFIG.SN.RESPONSES) || this.ss.insertSheet(CONFIG.SN.RESPONSES)
52 | this.unprotectSheets([CONFIG.SN.RESPONSES])
53 | SpreadsheetApp.flush()
54 | ws.getRange(1,1, 1, CONFIG.HEADER.FORM.length).setValues([CONFIG.HEADER.FORM])
55 | const lastRow = ws.getLastRow()
56 | ws.getRange(lastRow + 1, 1, 1, values.length).setValues([values])
57 | SpreadsheetApp.flush()
58 | this.protectSheets()
59 | }
60 |
61 | onOpen(e){
62 | const ui = SpreadsheetApp.getUi()
63 | const menu = ui.createMenu(CONFIG.NAME)
64 | menu.addItem("Open Form", "showForm")
65 | menu.addToUi()
66 | }
67 | }
68 |
69 | this._app = new App()
70 |
71 | const showForm = () => _app.showForm()
72 | const onOpen = (e) => _app.onOpen(e)
73 | const submit = (payload) => _app.submit(payload)
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | youtube
2 | .DS_Store
3 |
4 | # Logs
5 | logs
6 | *.log
7 | npm-debug.log*
8 | yarn-debug.log*
9 | yarn-error.log*
10 | lerna-debug.log*
11 |
12 | # Diagnostic reports (https://nodejs.org/api/report.html)
13 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
14 |
15 | # Runtime data
16 | pids
17 | *.pid
18 | *.seed
19 | *.pid.lock
20 |
21 | # Directory for instrumented libs generated by jscoverage/JSCover
22 | lib-cov
23 |
24 | # Coverage directory used by tools like istanbul
25 | coverage
26 | *.lcov
27 |
28 | # nyc test coverage
29 | .nyc_output
30 |
31 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
32 | .grunt
33 |
34 | # Bower dependency directory (https://bower.io/)
35 | bower_components
36 |
37 | # node-waf configuration
38 | .lock-wscript
39 |
40 | # Compiled binary addons (https://nodejs.org/api/addons.html)
41 | build/Release
42 |
43 | # Dependency directories
44 | node_modules/
45 | jspm_packages/
46 |
47 | # TypeScript v1 declaration files
48 | typings/
49 |
50 | # TypeScript cache
51 | *.tsbuildinfo
52 |
53 | # Optional npm cache directory
54 | .npm
55 |
56 | # Optional eslint cache
57 | .eslintcache
58 |
59 | # Microbundle cache
60 | .rpt2_cache/
61 | .rts2_cache_cjs/
62 | .rts2_cache_es/
63 | .rts2_cache_umd/
64 |
65 | # Optional REPL history
66 | .node_repl_history
67 |
68 | # Output of 'npm pack'
69 | *.tgz
70 |
71 | # Yarn Integrity file
72 | .yarn-integrity
73 |
74 | # dotenv environment variables file
75 | .env
76 | .env.test
77 |
78 | # parcel-bundler cache (https://parceljs.org/)
79 | .cache
80 |
81 | # Next.js build output
82 | .next
83 |
84 | # Nuxt.js build / generate output
85 | .nuxt
86 | dist
87 |
88 | # Gatsby files
89 | .cache/
90 | # Comment in the public line in if your project uses Gatsby and *not* Next.js
91 | # https://nextjs.org/blog/next-9-1#public-directory-support
92 | # public
93 |
94 | # vuepress build output
95 | .vuepress/dist
96 |
97 | # Serverless directories
98 | .serverless/
99 |
100 | # FuseBox cache
101 | .fusebox/
102 |
103 | # DynamoDB Local files
104 | .dynamodb/
105 |
106 | # TernJS port file
107 | .tern-port
108 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_C/vue/store.html:
--------------------------------------------------------------------------------
1 |
2 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
--------------------------------------------------------------------------------
/src/projects/LC004/PART_B/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
13 |
52 |
53 |
54 |
57 |
58 |
59 |
60 |
61 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_A/vue/components.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_B/vue/store.html:
--------------------------------------------------------------------------------
1 |
2 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
--------------------------------------------------------------------------------
/src/projects/LC004/PART_A/js.html:
--------------------------------------------------------------------------------
1 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
--------------------------------------------------------------------------------
/src/projects/LC004/PART_B/js.html:
--------------------------------------------------------------------------------
1 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_B/api.js:
--------------------------------------------------------------------------------
1 | class API{
2 | constructor(){
3 | this.name = APP_NAME
4 | this.app = SpreadsheetApp
5 | this.database = this.app.openById(DATABSE_ID)
6 | }
7 |
8 | createKeys(headers){
9 | return headers.map(header => header.toString().trim())
10 | }
11 |
12 | creaetItemObject(keys, values){
13 | const item = {}
14 | keys.forEach((key, index) => item[key] = values[index])
15 | return item
16 | }
17 |
18 | getItems(sheetName, pageSize=15, page=1){
19 | const ws = this.database.getSheetByName(sheetName)
20 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
21 | const [headers, ...records] = ws.getDataRange().getValues()
22 | const keys = this.createKeys(headers)
23 |
24 | const startIndex = (page - 1) * pageSize
25 | const items = records.slice(startIndex, startIndex + pageSize).map(values => this.creaetItemObject(keys, values))
26 | return {
27 | items,
28 | pages: Math.ceil(records.length/pageSize),
29 | pageSize,
30 | page,
31 | }
32 | }
33 |
34 | generateNewId(keys, records){
35 | if (records.length === 0) return 1
36 | const lastRecord = records[records.length - 1]
37 | const indexOfId = keys.indexOf("id")
38 | const lastId = lastRecord[indexOfId]
39 | return lastId + 1
40 | }
41 |
42 | createItem(sheetName, jsonData){
43 | const ws = this.database.getSheetByName(sheetName)
44 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
45 | const data = JSON.parse(jsonData)
46 | const [headers, ...records] = ws.getDataRange().getValues()
47 | const keys = this.createKeys(headers)
48 | const id = this.generateNewId(keys, records)
49 | const newRecord = keys.map((key) => {
50 | if (key === "id") return id
51 | return data.hasOwnProperty(key) ? data[key] : null
52 | })
53 | ws.appendRow(newRecord)
54 | const item = this.creaetItemObject(keys, newRecord)
55 | return JSON.stringify(item)
56 | }
57 | }
58 |
59 | const api = new API()
60 | const getItems = (jsonData) => {
61 | const {sheetName, pageSize, page} = JSON.parse(jsonData)
62 | const data = api.getItems(sheetName, pageSize, page)
63 | return JSON.stringify(data)
64 | }
65 | const createItem = (sheetName, jsonData) => api.createItem(sheetName, jsonData)
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_C/api.js:
--------------------------------------------------------------------------------
1 | class API{
2 | constructor(){
3 | this.name = APP_NAME
4 | this.app = SpreadsheetApp
5 | this.database = this.app.openById(DATABSE_ID)
6 | }
7 |
8 | createKeys(headers){
9 | return headers.map(header => header.toString().trim())
10 | }
11 |
12 | creaetItemObject(keys, values){
13 | const item = {}
14 | keys.forEach((key, index) => item[key] = values[index])
15 | return item
16 | }
17 |
18 | getItems(sheetName, pageSize=15, page=1){
19 | const ws = this.database.getSheetByName(sheetName)
20 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
21 | const [headers, ...records] = ws.getDataRange().getValues()
22 | records.reverse()
23 | const keys = this.createKeys(headers)
24 | const startIndex = (page - 1) * pageSize
25 | const items = records.slice(startIndex, startIndex + pageSize).map(values => this.creaetItemObject(keys, values))
26 | return {
27 | items,
28 | pages: Math.ceil(records.length/pageSize),
29 | pageSize,
30 | page,
31 | }
32 | }
33 |
34 | generateNewId(keys, records){
35 | if (records.length === 0) return 1
36 | const lastRecord = records[records.length - 1]
37 | const indexOfId = keys.indexOf("id")
38 | const lastId = lastRecord[indexOfId]
39 | return lastId + 1
40 | }
41 |
42 | createItem(sheetName, jsonData){
43 | const ws = this.database.getSheetByName(sheetName)
44 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
45 | const data = JSON.parse(jsonData)
46 | const [headers, ...records] = ws.getDataRange().getValues()
47 | const keys = this.createKeys(headers)
48 | const id = this.generateNewId(keys, records)
49 | const newRecord = keys.map((key) => {
50 | if (key === "id") return id
51 | return data.hasOwnProperty(key) ? data[key] : null
52 | })
53 | ws.appendRow(newRecord)
54 | const item = this.creaetItemObject(keys, newRecord)
55 | return JSON.stringify(item)
56 | }
57 | }
58 |
59 | const api = new API()
60 | const getItems = (jsonData) => {
61 | const {sheetName, pageSize, page} = JSON.parse(jsonData)
62 | const data = api.getItems(sheetName, pageSize, page)
63 | return JSON.stringify(data)
64 | }
65 | const createItem = (sheetName, jsonData) => api.createItem(sheetName, jsonData)
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_B/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
14 |
51 |
15 |
50 | Demo Form
16 | 17 | 49 |
18 |
57 |
58 |
59 |
60 |
61 |
--------------------------------------------------------------------------------
/src/projects/LC015/Code.js:
--------------------------------------------------------------------------------
1 | const SETTINGS = {
2 | APP_NAME: "RichText Formatter",
3 | SHEET_NAME: {
4 | STYLES: "Styles"
5 | }
6 | }
7 |
8 | function test(){
9 | const styles = getStyle_()
10 | // console.log(styles)
11 | // const indexes = findAllIndexes_("apple", "google")
12 | // console.log(indexes)
13 | const activeCell = SpreadsheetApp.getActive().getActiveCell()
14 | const value = activeCell.getRichTextValue()
15 | const newValue = updateRichTextValue_(value, styles)
16 | activeCell.setRichTextValue(newValue)
17 | }
18 |
19 | function getStyle_() {
20 | const ss = SpreadsheetApp.getActive()
21 | const sheet = ss.getSheetByName(SETTINGS.SHEET_NAME.STYLES)
22 | const styles = {}
23 | const [, ...values] = sheet.getDataRange().getRichTextValues()
24 | values.forEach(rowValues => {
25 | const key = rowValues[0].getText()
26 | const runs = rowValues[0].getRuns()
27 | styles[key] = runs.map(run => {
28 | const length = run.getEndIndex() - run.getStartIndex()
29 | run["length"] = length
30 | return run
31 | }).filter(run => run.length > 0)
32 | })
33 | return styles
34 | }
35 |
36 | /**
37 | * @param {string} text
38 | * @param {string} keyword
39 | * @returns {number[]}
40 | */
41 | function findAllIndexes_(text, keyword){
42 | const re = new RegExp(keyword, "g") // add "i" flag for case insensitive
43 | return [...text.matchAll(re)].map(item => item.index)
44 | }
45 |
46 | /**
47 | * @param {SpreadsheetApp.RichTextValue} value
48 | * @param {Object} styles
49 | */
50 | function updateRichTextValue_(value, styles){
51 | const text = value.getText()
52 | const copyValue = value.copy()
53 | Object.entries(styles).forEach(([keyword, runs]) => {
54 | const indexes = findAllIndexes_(text, keyword)
55 | indexes.forEach(index => {
56 | let startIndex = index
57 | runs.forEach(run => {
58 | const endIndex = startIndex + run.length
59 | copyValue.setTextStyle(startIndex, endIndex, run.getTextStyle())
60 | startIndex += run.length
61 | })
62 | })
63 | })
64 | return copyValue.build()
65 | }
66 |
67 |
68 | function applyStyles(){
69 | const ss = SpreadsheetApp.getActive()
70 | const styles = getStyle_()
71 | const activeRange = ss.getActiveRange()
72 | const values = activeRange.getRichTextValues()
73 | const newValues = values.map(rowValues => {
74 | return rowValues.map(value => updateRichTextValue_(value, styles))
75 | })
76 | activeRange.setRichTextValues(newValues)
77 | }
78 |
79 |
80 | function onOpen(){
81 | SpreadsheetApp.getUi()
82 | .createMenu(SETTINGS.APP_NAME)
83 | .addItem("Format", "applyStyles")
84 | .addToUi()
85 | }
--------------------------------------------------------------------------------
/src/projects/LC010/PART_B/vue/js/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/src/projects/LC007/Code.js:
--------------------------------------------------------------------------------
1 | const FOLDER_NAME_PDFS = "PDFs" // The source folder name of your PDF files
2 |
3 | // 1. PDF -> Google Doc
4 | /**
5 | * Convert a PDF file into a Google Doc
6 | * @param {string} id The id of the PDF
7 | * @returns {DocumentApp.Document} The Google Doc object
8 | */
9 | function convertPdfToDoc(id, ocrLanguage="en"){
10 | const pdf = DriveApp.getFileById(id)
11 | const resource = {
12 | title: pdf.getName(),
13 | mimeType: pdf.getMimeType()
14 | }
15 | const mediaData = pdf.getBlob()
16 | const options = {
17 | convert: true,
18 | orc: true,
19 | ocrLanguage
20 | }
21 | const newFile = Drive.Files.insert(resource, mediaData, options)
22 | return DocumentApp.openById(newFile.id)
23 | }
24 | // 2. Read text from Google Doc
25 | /**
26 | * Read text content form the PDF file
27 | * @param {string} id The id of the PDF file
28 | * @param {boolean} trashDocFile Delete or keep the Google Doc
29 | * @returns {string} The text content on the PDF file
30 | */
31 | function readTextFromPdf(id, trashDocFile=true){
32 | const doc = convertPdfToDoc(id)
33 | const text = doc.getBody().getText()
34 | DriveApp.getFileById(doc.getId()).setTrashed(trashDocFile)
35 | return text
36 | }
37 |
38 | function getPdfFiles(folderName=FOLDER_NAME_PDFS){
39 | const ss = SpreadsheetApp.getActive()
40 | const currentFolder = DriveApp.getFileById(ss.getId()).getParents().next()
41 | const folders = currentFolder.getFoldersByName(folderName)
42 | if (!folders.hasNext()) return []
43 | const folder = folders.next()
44 | const files = folder.getFilesByType(MimeType.PDF)
45 | const ids = []
46 | while(files.hasNext()){
47 | ids.push(files.next().getId())
48 | }
49 | return ids
50 | }
51 |
52 | function getInvoiceDataFromText(text){
53 | const lines = text.split("\n")
54 | return {
55 | invoice: lines[3],
56 | balance: lines[lines.length -1].slice("Balance Due $ ".length)
57 | }
58 | }
59 |
60 | // 3. Scrap the info from the text and output to Google Sheet
61 | function exportToSheet(){
62 | const values = [
63 | ["Invoice #", "Balance"]
64 | ]
65 | const ids = getPdfFiles()
66 | ids.forEach(id => {
67 | const text = readTextFromPdf(id)
68 | const {invoice, balance} = getInvoiceDataFromText(text)
69 | values.push([
70 | invoice,
71 | balance
72 | ])
73 | })
74 |
75 | const outputSheet = SpreadsheetApp.getActive().getActiveSheet()
76 | outputSheet.clear()
77 | outputSheet.getRange(1,1,values.length, values[0].length).setValues(values)
78 | }
79 |
80 | function onOpen(){
81 | SpreadsheetApp.getUi()
82 | .createMenu("LC007")
83 | .addItem("Import data", "exportToSheet")
84 | .addToUi()
85 | }
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
--------------------------------------------------------------------------------
/src/projects/LC020/main.js:
--------------------------------------------------------------------------------
1 | const KEY_TRIGGER_INSTALLED = "triggerInstalled";
2 |
3 | function toast_(msg, title = "Toast", timeoutInSeconds = 5) {
4 | return SpreadsheetApp.getActive().toast(msg, title, timeoutInSeconds);
5 | }
6 |
7 | /**
8 | * @param {Function} fn - The function to be debounced
9 | * @param {number} ms - The delay time in milliseconds
10 | * @returns {Function} A debounced version of the passed function
11 | */
12 | function debounce_(fn, ms) {
13 | return function (...args) {
14 | // 1. save state of the function call
15 | const storage = PropertiesService.getUserProperties();
16 | const state = Date.now().toString();
17 | const key = fn.name;
18 | storage.setProperty(key, state);
19 |
20 | // 2. delay the process
21 | Utilities.sleep(ms);
22 |
23 | // 3. Check state
24 | if (storage.getProperty(key) != state) {
25 | return console.log("Ignored");
26 | }
27 | fn(...args);
28 | console.log("Invokded");
29 | };
30 | }
31 |
32 | /**
33 | * @param {GoogleAppsScript.Events.SheetsOnEdit} e
34 | */
35 | function onEdit_(e) {
36 | const data = {
37 | old: e.oldValue ?? "No old value",
38 | new: e.value ?? "No new value",
39 | range: e.range.getA1Notation(),
40 | };
41 | const msg = JSON.stringify(data, null, 2);
42 | toast_(msg, "OnEdit");
43 | }
44 |
45 | function onEditDebounced(e) {
46 | debounce_(onEdit_, 3000)(e);
47 | }
48 |
49 | function onEdit(e) {
50 | onEditDebounced(e);
51 | }
52 |
53 | function uninstallOnEditTrigger() {
54 | const triggerFunctionName = "onEditDebounced";
55 | ScriptApp.getProjectTriggers().forEach((trigger) => {
56 | if (trigger.getHandlerFunction() != triggerFunctionName) return;
57 | if (trigger.getEventType() != ScriptApp.EventType.ON_EDIT) return;
58 | ScriptApp.deleteTrigger(trigger);
59 | });
60 | PropertiesService.getScriptProperties().deleteProperty(KEY_TRIGGER_INSTALLED);
61 | onOpen();
62 | }
63 |
64 | function installOnEditTrigger() {
65 | const triggerFunctionName = "onEditDebounced";
66 | uninstallOnEditTrigger();
67 | ScriptApp.newTrigger(triggerFunctionName)
68 | .forSpreadsheet(SpreadsheetApp.getActive())
69 | .onEdit()
70 | .create();
71 | PropertiesService.getScriptProperties().setProperty(
72 | KEY_TRIGGER_INSTALLED,
73 | true,
74 | );
75 | onOpen();
76 | }
77 |
78 | function onOpen() {
79 | const ui = SpreadsheetApp.getUi();
80 | const menu = ui.createMenu("Script");
81 | const triggerInstalled = PropertiesService.getScriptProperties().getProperty(
82 | KEY_TRIGGER_INSTALLED,
83 | );
84 | if (triggerInstalled) {
85 | menu.addItem("Uninstall onEdit trigger", "uninstallOnEditTrigger");
86 | } else {
87 | menu.addItem("Install onEdit trigger", "installOnEditTrigger");
88 | }
89 | menu.addToUi();
90 | }
91 |
--------------------------------------------------------------------------------
/src/projects/LC023/main.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @param {string} value The value to be checked
3 | * @returns {boolean} true if it's valid formula
4 | */
5 | const isFormula_ = (value) => /^=.*[)}"a-z0-9]+$/i.test(value);
6 |
7 | /**
8 | * @pram {string[]} headers The headers of the row values in the sheet
9 | * @pram {objec} item The item object with headers as keys
10 | * @pram {any[]} values The current values of the row
11 | * @pram {string[]} formulas The current formulas of the row
12 | * @returns {any[]} A list of values for the row
13 | */
14 | const createRowValues_ = (headers) => (values, formulas) => (item) =>
15 | headers.map((header, index) => {
16 | const value = header in item ? item[header] : values?.[index];
17 | const formula = formulas?.[index];
18 | if (!formula) return value;
19 | return isFormula_(value) ? value : formula;
20 | });
21 |
22 | /**
23 | * @pram {string[]} headers The headers of the row values in the sheet
24 | * @pram {objec[]} items The item objects with headers as keys
25 | * @pram {any[][]} values The current values of the range
26 | * @pram {string[][]} formulas The current formulas of the range
27 | * @returns {any[][]} A list of values for the range
28 | */
29 | const createRangeValues_ = (headers) => (values, formulas) => (items) =>
30 | items.map((item, i) =>
31 | createRowValues_(headers)(values?.[i], formulas?.[i])(item)
32 | );
33 |
34 | const test = () => {
35 | const headers = ["name", "email", "age", "gender"];
36 | const values = [
37 | ["Ashton", "", "", ""],
38 | ["Ella Zheng", "Link", "", ""],
39 | ];
40 | const formulas = [
41 | ["", "=TODAY()", "", ""],
42 | ["", `=HYPERLINK(RC[-1];"Link")`, "", ""],
43 | ];
44 | const createRangeValues = createRangeValues_(headers)(values, formulas);
45 | const ashton = {
46 | name: "Ashton Fei",
47 | email: "=NOW()",
48 | age: 30,
49 | gender: "Male",
50 | };
51 | const ella = {
52 | name: "Ella Fei",
53 | email: "ella@gmail.com",
54 | age: 38,
55 | gender: "Female",
56 | };
57 | const users = [ashton, ella];
58 | const userValues = createRangeValues(users);
59 | console.log(userValues);
60 | };
61 |
62 | const updateActiveRange = () => {
63 | const title = "Update active range";
64 | const ss = SpreadsheetApp.getActive();
65 | const rangeList = ss.getActiveRangeList();
66 | if (rangeList === null) return ss.toast("No selected ranges.", title);
67 | const range = rangeList.getRanges()[0];
68 | const [headers, ...values] = range.getValues();
69 | const formulas = range.getFormulas().slice(0);
70 | console.log(headers);
71 | console.log(values);
72 | console.log(formulas);
73 | };
74 |
75 | const onOpen = () => {
76 | const menu = SpreadsheetApp.getUi().createMenu("LC022");
77 | menu.addItem("Update active range", "updateActiveRange");
78 | menu.addToUi();
79 | };
80 |
--------------------------------------------------------------------------------
/src/projects/LC016/Code.js:
--------------------------------------------------------------------------------
1 | const CONFIG = {
2 | APP_NAME: "Twilio",
3 | SHEET_NAME: {
4 | APP: "App",
5 | MESSAGE: "Message",
6 | }
7 | }
8 |
9 | function getAppData_(){
10 | const sheetApp = SpreadsheetApp.getActive().getSheetByName(CONFIG.SHEET_NAME.APP)
11 | const values = sheetApp.getDataRange().getDisplayValues()
12 | return {
13 | SID: values[0][1].trim(), // B1
14 | TOKEN: values[1][1].trim(), // B2
15 | FROM: values[2][1].trim(), // B3
16 | }
17 | }
18 |
19 | function sendMessage_({to, body}, {SID, TOKEN, FROM}){
20 | const url = `https://api.twilio.com/2010-04-01/Accounts/${SID}/Messages.json`
21 | const token = Utilities.base64Encode(`${SID}:${TOKEN}`)
22 | const payload = {
23 | Body: body,
24 | To: to,
25 | From: FROM
26 | }
27 | const options = {
28 | method: "POST", // by default is "GET"
29 | headers: {
30 | "Authorization": "Basic " + token
31 | },
32 | payload,
33 | muteHttpExceptions: true, // it's false by default
34 | }
35 | try{
36 | const response = UrlFetchApp.fetch(url, options)
37 | return JSON.parse(response.getContentText())
38 | }catch(error){
39 | return error.message
40 | }
41 | }
42 |
43 | function sendMessages(){
44 | const ui = SpreadsheetApp.getUi()
45 | const ss = SpreadsheetApp.getActive()
46 | try{
47 | const confirm = ui.alert(`${CONFIG.APP_NAME} [Confirm]`, 'Are you sure to send these messages?', ui.ButtonSet.YES_NO)
48 | if (confirm !== ui.Button.YES) return ss.toast(CONFIG.APP_NAME, "Cancelled!")
49 | ss.toast(CONFIG.APP_NAME, "Sending messages ...")
50 | const appData = getAppData_()
51 | const sheetMessage = ss.getSheetByName(CONFIG.SHEET_NAME.MESSAGE)
52 | const [headers, ...rows] = sheetMessage.getDataRange().getDisplayValues()
53 | const results = []
54 | let successCount = 0
55 | let errorCount = 0
56 | rows.forEach(([to, body]) => {
57 | const message = {to, body}
58 | const result = sendMessage_(message, appData)
59 | if (result.message) {
60 | results.push([`Error: ${result.message} => ${result.more_info}`, new Date()])
61 | errorCount ++
62 | } else if (typeof result === "string") {
63 | results.push([`Error: ${result}`, new Date()])
64 | errorCount ++
65 | } else {
66 | results.push([`Success: ${message.body}`, new Date()])
67 | successCount ++
68 | }
69 | })
70 | if (results.length) sheetMessage.getRange(2, 3, results.length, results[0].length).setValues(results)
71 | const message = `Done!\nSuccess: ${successCount}\nError: ${errorCount}`
72 | ui.alert(`${CONFIG.APP_NAME} [Message]`, message, ui.ButtonSet.OK)
73 | }catch(error){
74 | ui.alert(`${CONFIG.APP_NAME} [Error]`, error.message, ui.ButtonSet.OK)
75 | }
76 | }
77 |
78 | function onOpen(){
79 | SpreadsheetApp.getUi()
80 | .createMenu(CONFIG.APP_NAME)
81 | .addItem("Send messages", "sendMessages")
82 | .addToUi()
83 | }
--------------------------------------------------------------------------------
/src/projects/LC002/Code.js:
--------------------------------------------------------------------------------
1 | const APP_NAME = "LC002"
2 | const SN_EMAIL = "Email"
3 | const SN_Tracking = "Tracking"
4 |
5 | const App = class {
6 | constructor(name=APP_NAME){
7 | this.name = name
8 | this.ss = SpreadsheetApp.getActive()
9 | this.sheetEmail = null
10 | this.setSheetEmail()
11 | this.sheetTracking = null
12 | this.setSheetTracking()
13 | }
14 |
15 | setSheetEmail(name=SN_EMAIL){
16 | const sheet = this.ss.getSheetByName(name)
17 | if (!sheet) throw new Error(`Sheet with name "${name}" was not found.`)
18 | this.sheetEmail = sheet
19 | return this
20 | }
21 |
22 | setSheetTracking(name=SN_Tracking){
23 | const sheet = this.ss.getSheetByName(name)
24 | if (sheet) {
25 | this.sheetTracking = sheet
26 | }else{
27 | this.sheetTracking = this.ss.insertSheet(name)
28 | }
29 | return this
30 | }
31 |
32 | getEmailData(){
33 | const values = this.sheetEmail.getDataRange().getValues().slice(1)
34 | const emailData = {}
35 | values.forEach(([key, value]) =>{
36 | key = key.toString().trim()
37 | emailData[key] = value
38 | })
39 | return emailData
40 | }
41 |
42 | getSentEmail(subject){
43 | const query = `in:sent subject:${subject}`
44 | const threads = GmailApp.search(query, 0, 1)
45 | if (threads.length === 0) return
46 | return threads[0]
47 | }
48 |
49 |
50 | sendEmail({to, cc, bcc, subject, body}){
51 | const options = {
52 | cc,
53 | bcc,
54 | htmlBody: body.includes(" v.id != ss.getId());
49 | }
50 |
51 | function sendMutipleSpreadsheetsAsPdfs() {
52 | const spreadsheets = getSpreadsheetsInCurrentFolder();
53 | const options = {
54 | size: "A4",
55 | top_margin: 0,
56 | right_margin: 0,
57 | bottom_margin: 0,
58 | left_margin: 0,
59 | };
60 | const token = ScriptApp.getOAuthToken();
61 | const requests = spreadsheets.map(({ id }) => {
62 | return createPdfExportRequest(id, token, options);
63 | });
64 |
65 | const responses = UrlFetchApp.fetchAll(requests);
66 |
67 | const attachments = [];
68 | responses.forEach((response, index) => {
69 | const name = spreadsheets[index].name;
70 | if (response.getResponseCode() != 200) return;
71 | attachments.push(response.getBlob().setName(`${name}.pdf`));
72 | });
73 |
74 | if (attachments.length === 0) {
75 | throw new Error("There is PDF exported.");
76 | }
77 |
78 | const email = Session.getActiveUser().getEmail();
79 | const subject = "Multiple Spreadsheets to PDFs";
80 | const body = "This is a test message";
81 | GmailApp.sendEmail(email, subject, body, { attachments });
82 | }
83 |
84 | function mergeSpreadsheetsAsPdf() {
85 | // spreadsheets
86 | // merge into one spreadsheet
87 | // export the merged spreadsheets as pdf
88 | // you do the rest
89 | }
90 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_C/vue/js/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_B/vue/router.html:
--------------------------------------------------------------------------------
1 |
2 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_C/backend.js:
--------------------------------------------------------------------------------
1 | const CONFIG = {
2 | INDEX: "index.html",
3 | NAME: "LC011 PART C",
4 | DB_ID: "1dvMm-bYIaFWgvhOVFAJJ4YIHhZNE-A2jvwNuVcTcLeg",
5 | SHEET_NAME: {
6 | USERS: "users"
7 | },
8 | CACHE_EXPIRED_IN_SECONDS: 21600, // 6 hours
9 | }
10 |
11 | class App {
12 | constructor() {
13 | this.db = SpreadsheetApp.openById(CONFIG.DB_ID)
14 | this.cache = CacheService.getScriptCache()
15 | }
16 |
17 | createToken(user) {
18 | const token = Utilities.getUuid()
19 | this.cache.put(token, user.email, CONFIG.CACHE_EXPIRED_IN_SECONDS)
20 | return token
21 | }
22 |
23 | createItemObject(keys, values) {
24 | const item = {}
25 | keys.forEach((key, index) => item[key] = values[index])
26 | return item
27 | }
28 |
29 | validateToken(token) {
30 | const email = this.cache.get(token)
31 | if (!email) return false
32 | this.cache.put(token, email, CONFIG.CACHE_EXPIRED_IN_SECONDS)
33 | return email
34 | }
35 |
36 |
37 |
38 | getUserByEmail(email) {
39 | email = email.trim().toLowerCase()
40 | const ws = this.db.getSheetByName(CONFIG.SHEET_NAME.USERS)
41 | if (!ws) throw new Error(`${CONFIG.SHEET_NAME.USERS} was not found in the database.`)
42 | const [keys, ...records] = ws.getDataRange().getValues()
43 | const indexOfEmail = keys.indexOf("email")
44 | if (indexOfEmail === -1) throw new Error(`Header 'email' was not found in the table.`)
45 | const record = records.find(v => v[indexOfEmail].toString().trim().toLocaleLowerCase() == email)
46 | if (!record) return
47 | return this.createItemObject(keys, record)
48 | }
49 |
50 | login({ email, password, token }) {
51 | if (token) {
52 | const isValidToken = this.validateToken(token)
53 | if (!isValidToken) throw new Error(`The token is invalid, please login again.`)
54 | return {
55 | user: this.getUserByEmail(isValidToken),
56 | token,
57 | }
58 | }
59 | const user = this.getUserByEmail(email)
60 | if (!user) throw new Error(`${email} is not valid.`)
61 | if (password !== user.password) throw new Error(`Invalid Credentials!`)
62 | token = this.createToken(user)
63 | user.token = token
64 | return {
65 | user,
66 | token,
67 | }
68 | }
69 |
70 | logout({ token }) {
71 | this.cache.remove(token)
72 | return {
73 | success: true,
74 | message: "You've been logged out!"
75 | }
76 | }
77 | }
78 |
79 | const app = new App()
80 |
81 | const login = (params) => {
82 | params = JSON.parse(params)
83 | const data = app.login(params)
84 | return JSON.stringify(data)
85 | }
86 |
87 | const logout = (params) => {
88 | params = JSON.parse(params)
89 | const data = app.logout(params)
90 | return JSON.stringify(data)
91 | }
92 |
93 | function doGet() {
94 | return HtmlService.createTemplateFromFile(CONFIG.INDEX)
95 | .evaluate()
96 | .setTitle(CONFIG.NAME)
97 | .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
98 | }
99 |
100 |
101 | function include_(filename) {
102 | return HtmlService.createTemplateFromFile(filename).evaluate().getContent()
103 | }
104 |
105 |
106 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_C/vue/router.html:
--------------------------------------------------------------------------------
1 |
2 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
--------------------------------------------------------------------------------
/src/projects/LC009/Code.js:
--------------------------------------------------------------------------------
1 | const REGION = {
2 | "EMEA": ["France", "Filand", "Denmark"],
3 | "AP": ["Japan", "China", "Thailand"],
4 | }
5 |
6 | const REGION_DEMO = {
7 | "EMEA": ["France", "Filand", "Denmark"],
8 | "AP": ["Japan", "China", "Thailand"],
9 | "NA": ["Canada", "US"]
10 | }
11 |
12 | const CITY_DEMO = {
13 | "France": ['France 1'],
14 | "Filand": ['Filand 1'],
15 | "Denmark": ['Denmark 1'],
16 | "Japan": ['Japan 1'],
17 | "China": ['China 1'],
18 | "Thailand": ['Thailand 1'],
19 | "Canada": ['Canada 1'],
20 | "US": ['US 1'],
21 | }
22 |
23 |
24 |
25 | /**
26 | * This is the trigger function when a cell is editted
27 | * @param {object} e
28 | * @param {SpreadsheetApp.Range} e.range
29 | * @param {string} e.value
30 | * @param {string} e.oldValue
31 | * @returns {void}
32 | */
33 | function onEdit(e) {
34 | const range = e.range
35 | const {rowStart, rowEnd, columnStart, columnEnd} = range
36 | const value = e.value
37 | if (rowStart !== rowEnd) return
38 | if (columnStart !== columnEnd) return
39 |
40 | const currentCell = {
41 | value,
42 | rowStart,
43 | columnStart,
44 | sheet: range.getSheet()
45 | }
46 |
47 | const targetCell = {
48 | name: "Data",
49 | editColumn: 4,
50 | editRowStart: 2,
51 | rowOffset: 0,
52 | columnOffset: 1
53 | }
54 | updateCellValidation(currentCell, targetCell, REGION)
55 |
56 | const targetCellDemo = {
57 | name: "Demo",
58 | editColumn: 1,
59 | editRowStart: 2,
60 | rowOffset: 0,
61 | columnOffset: 1
62 | }
63 | updateCellValidation(currentCell, targetCellDemo, REGION_DEMO)
64 |
65 | const targetCellCityDemo = {
66 | name: "Demo",
67 | editColumn: 2,
68 | editRowStart: 2,
69 | rowOffset: 0,
70 | columnOffset: 1
71 | }
72 | updateCellValidation(currentCell, targetCellCityDemo, CITY_DEMO)
73 | }
74 |
75 | /**
76 | * @param {object} currentCell
77 | * @param {string} currentCell.value
78 | * @param {number} currentCell.rowStart
79 | * @param {number} currentCell.columnStart
80 | * @param {SpreadsheetApp.Sheet} currentCell.sheet
81 | *
82 | * @param {object} targetCell
83 | * @param {string} targetCell.name
84 | * @param {number} targetCell.editColumn
85 | * @param {number} targetCell.editRowStart
86 | * @param {number} targetCell.rowOffset
87 | * @param {number} targetCell.columnOffset
88 | *
89 | * @param {object} data
90 | * @returns {void}
91 | */
92 | function updateCellValidation(currentCell, targetCell, data){
93 | if (currentCell.sheet.getName() !== targetCell.name) return
94 | if (currentCell.rowStart < targetCell.editRowStart) return
95 | if (currentCell.columnStart !== targetCell.editColumn) return
96 | const row = currentCell.rowStart + targetCell.rowOffset
97 | const column = currentCell.columnStart + targetCell.columnOffset
98 | const targetRange = currentCell.sheet.getRange(row, column)
99 | const items = data[currentCell.value]
100 | if (!items) return
101 | const dataValidation = SpreadsheetApp.newDataValidation().requireValueInList(items).build()
102 | targetRange.setDataValidation(dataValidation)
103 | targetRange.setValue(null)
104 | }
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
120 |
121 |
122 |
123 |
124 |
125 |
126 |
--------------------------------------------------------------------------------
/src/projects/LC021/main.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @param {Function[]} rules - A list of functions which return true or an error message
3 | * @param {any} value - The value to be checked
4 | * @returns {string[]} A list of error messages
5 | */
6 | const createValidator_ = (rules) => (value) =>
7 | rules
8 | .map((rule) => rule(value))
9 | .filter((v) => v !== true)
10 | .map((v) => `${v}\nYour input: ${value}`);
11 |
12 | /**
13 | * @param {string} title - The title of the prompt
14 | * @param {string} msg - The message body of the prompt
15 | * @param {Function[]|undefined} rules - A list of validator functions
16 | * @returns {string|null} return null if cancelled else return the value entered
17 | */
18 | const createInput_ = (title) => (msg) => (rules) => {
19 | const ui = SpreadsheetApp.getUi();
20 | const input = ui.prompt(title, msg, ui.ButtonSet.OK_CANCEL);
21 | if (input.getSelectedButton() !== ui.Button.OK) return null;
22 | const value = input.getResponseText();
23 | if (!rules) return value;
24 | const validator = createValidator_(rules);
25 | const firstErrorMessage = validator(value)[0];
26 | if (!firstErrorMessage) return value;
27 | return createInput_(title)(firstErrorMessage)(rules);
28 | };
29 |
30 | const createAlert_ =
31 | (buttons = SpreadsheetApp.getUi().ButtonSet.OK) => (title) => (msg) =>
32 | SpreadsheetApp.getUi().alert(title, msg, buttons);
33 |
34 | const success_ = createAlert_()("✅ SUCCESS");
35 | const warning_ = createAlert_()("⚠️ WARNING");
36 | const error_ = createAlert_()("❗️ERROR");
37 |
38 | const nameCheck = (name) => {
39 | const ss = SpreadsheetApp.getActive();
40 | const sheet = ss.getSheets().find((v) => v.getSheetId() == 0);
41 | const values = sheet.getDataRange().getValues();
42 | const foundName = values.find((v) => v[0] == name);
43 | if (!foundName) return true;
44 | return `❗️ "${name}" was already used, try another one please.`;
45 | };
46 |
47 | const nameInput_ = createInput_("👉 Name")("Enter your name here:");
48 | const nameRules = [
49 | (name) => name.length >= 3 || "❗️ Name should have 3 letters at least.",
50 | (name) => name.length <= 10 || "❗️ Name should have 10 letters at most.",
51 | (name) => /^[a-zA-Z]+$/.test(name) || "❗️ Only letters are allowed.",
52 | (name) =>
53 | /^[A-Z][a-z]+$/.test(name) ||
54 | "❗️Only and the first letter must be upper case.",
55 | nameCheck,
56 | // (name) =>
57 | // ["Alice", "Bob", "Chris", "Doris", "Ella"].includes(name) === false ||
58 | // `❗️ "${name}" was already used, try another one please.`,
59 | ];
60 |
61 | const getName = () => {
62 | const name = nameInput_(nameRules);
63 | if (name === null) {
64 | return warning_("Action was cancelled.");
65 | }
66 | const ss = SpreadsheetApp.getActive();
67 | const sheet = ss.getSheets().find((v) => v.getSheetId() == 0);
68 | sheet && sheet.appendRow([name]);
69 | success_(`The name entered was ${name}.`);
70 | };
71 |
72 | const getEmail = () => {
73 | const rules = [(v) => /@/.test(v) || "Email should have @ sign."];
74 | const email = createInput_("Email")("Enter your email:")(rules);
75 | if (!email) {
76 | return warning_("Action was cancelled.");
77 | }
78 | success_(`The email entered was ${email}.`);
79 | console.log({ email });
80 | };
81 |
82 | const onOpen = () => {
83 | SpreadsheetApp.getUi()
84 | .createMenu("LC021")
85 | .addItem("Get name", "getName")
86 | .addItem("Get email", "getEmail")
87 | .addToUi();
88 | };
89 |
--------------------------------------------------------------------------------
/src/projects/LC014/Code.js:
--------------------------------------------------------------------------------
1 | const SETTINGS = {
2 | API_KEY: "f03405ee-fe4c-4f61-93b5-2a82b875fadb",
3 | API_ENDPOINT: "https://www.worldtides.info/api/v3",
4 | DAYS: 7,
5 | STEP: 3600,
6 | ADDRESS: "Bangkok, Thailand",
7 | CACHE_KEY: "tides",
8 | SHEET_NAME: "Tides",
9 | EVENT_TIME: 60, // in mins
10 | HIGH_COLOR: CalendarApp.EventColor.PALE_RED,
11 | LOW_COLOR: CalendarApp.EventColor.YELLOW,
12 | }
13 |
14 | function test(){
15 | getLocation_()
16 | }
17 |
18 | function buildApi_({date, days, step, lat, lon}){
19 | return `${SETTINGS.API_ENDPOINT}?key=${SETTINGS.API_KEY}&date=${date}&days=${days}&step=${step}&lat=${lat}&lon=${lon}&extremes`
20 | }
21 |
22 | function getLocation_(address=SETTINGS.ADDRESS){
23 | const {status, results} = Maps.newGeocoder().geocode(address)
24 | if (status === "OK") {
25 | const location = results[0].geometry.location
26 | const coordinates = {
27 | lat: location.lat,
28 | lon: location.lng
29 | }
30 | return coordinates
31 | }
32 | }
33 |
34 | function cacheTides_(tides){
35 | const cache = CacheService.getScriptCache()
36 | cache.put(SETTINGS.CACHE_KEY, JSON.stringify(tides), 21600)
37 | }
38 |
39 | function saveTidesToSheet_(tides){
40 | const ss = SpreadsheetApp.getActive()
41 | const ws = ss.getSheetByName(SETTINGS.SHEET_NAME) || ss.insertSheet(SETTINGS.SHEET_NAME)
42 | const values = tides.map(({date, type, height}) => [new Date(date), type, height])
43 | values.unshift(["Date", "Type", "Height"])
44 | ws.clear()
45 | ws.getRange(1,1,values.length, values[0].length).setValues(values)
46 | }
47 |
48 |
49 | function getTides_(useCache=true){
50 | const cache = CacheService.getScriptCache()
51 | let tides = cache.get(SETTINGS.CACHE_KEY)
52 | if (tides && useCache){
53 | tides = JSON.parse(tides)
54 | saveTidesToSheet_(tides)
55 | return tides
56 | }
57 |
58 | const {lat, lon} = getLocation_()
59 |
60 | const params = {
61 | date: new Date().toISOString().slice(0,10),
62 | days: SETTINGS.DAYS,
63 | step: SETTINGS.STEP,
64 | lat,
65 | lon,
66 | }
67 | const api = buildApi_(params)
68 |
69 | const response = UrlFetchApp.fetch(api)
70 | const data = JSON.parse(response.getContentText())
71 | tides = data.extremes
72 | cacheTides_(tides)
73 | saveTidesToSheet_(tides)
74 | return tides
75 | }
76 |
77 | function createTideEvent_({date, type, height}){
78 | const startTime = new Date(date)
79 | const endTime = new Date(startTime.getTime() + SETTINGS.EVENT_TIME * 60 * 1000)
80 | const title = `${type} Tide [${height}]`
81 | const events = CalendarApp.getEvents(startTime, endTime)
82 | const findEvent = events.find(e => e.getTitle() === title)
83 | if (findEvent) return
84 | CalendarApp.createEvent(title, startTime, endTime).setColor(type === "High" ? SETTINGS.HIGH_COLOR : SETTINGS.LOW_COLOR )
85 | }
86 |
87 | function createTideEvents(){
88 | const tides = getTides_()
89 | tides.forEach(tide => createTideEvent_(tide))
90 | }
91 |
92 |
93 | function deleteTideEvents(){
94 | const startTime = new Date("2022-02-23")
95 | const endTime = new Date("2022-03-10")
96 | const events = CalendarApp.getEvents(startTime, endTime)
97 | events.forEach(event => {
98 | const title = event.getTitle()
99 | if (title.startsWith("High Tide") || title.startsWith("Low Tide")) event.deleteEvent()
100 | })
101 | }
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_C/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
19 |
26 | {{name}}
20 |
21 |
24 |
25 |
27 |
38 |
28 |
29 |
36 |
37 | | {{ header.text }} | 31 |
|---|
| {{ item[header.value] }} | 34 |
39 |
52 |
53 |
40 |
50 |
51 |
54 |
56 |
18 |
79 |
80 |
81 |
82 |
83 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_D/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
19 |
20 |
21 |
22 |
78 |
23 |
30 | {{name}}
24 |
25 |
28 |
29 |
31 |
54 |
32 |
33 |
52 |
53 | | {{ header.text }} | 35 |
|---|
|
38 |
39 |
42 |
45 |
46 |
47 | {{ item[header.value] }}
48 |
49 | |
50 |
55 |
73 |
74 |
56 |
71 |
72 |
75 |
77 |
18 |
79 |
80 |
81 |
82 |
83 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_D/api.js:
--------------------------------------------------------------------------------
1 | class API{
2 | constructor(){
3 | this.name = APP_NAME
4 | this.app = SpreadsheetApp
5 | this.database = this.app.openById(DATABSE_ID)
6 | }
7 |
8 | createKeys(headers){
9 | return headers.map(header => header.toString().trim())
10 | }
11 |
12 | creaetItemObject(keys, values){
13 | const item = {}
14 | keys.forEach((key, index) => item[key] = values[index])
15 | return item
16 | }
17 |
18 | getItems(sheetName, pageSize=15, page=1){
19 | const ws = this.database.getSheetByName(sheetName)
20 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
21 | const [headers, ...records] = ws.getDataRange().getValues()
22 | records.reverse()
23 | const keys = this.createKeys(headers)
24 | const startIndex = (page - 1) * pageSize
25 | const items = records.slice(startIndex, startIndex + pageSize).map(values => this.creaetItemObject(keys, values))
26 | return {
27 | items,
28 | pages: Math.ceil(records.length/pageSize),
29 | pageSize,
30 | page,
31 | }
32 | }
33 |
34 | generateNewId(keys, records){
35 | if (records.length === 0) return 1
36 | const lastRecord = records[records.length - 1]
37 | const indexOfId = keys.indexOf("id")
38 | const lastId = lastRecord[indexOfId]
39 | return lastId + 1
40 | }
41 |
42 | createItem(sheetName, jsonData){
43 | const ws = this.database.getSheetByName(sheetName)
44 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
45 | const data = JSON.parse(jsonData)
46 | const [headers, ...records] = ws.getDataRange().getValues()
47 | const keys = this.createKeys(headers)
48 | const id = this.generateNewId(keys, records)
49 | const newRecord = keys.map((key) => {
50 | if (key === "id") return id
51 | return data.hasOwnProperty(key) ? data[key] : null
52 | })
53 | ws.appendRow(newRecord)
54 | const item = this.creaetItemObject(keys, newRecord)
55 | return JSON.stringify(item)
56 | }
57 |
58 | updateItem(sheetName, jsonData){
59 | const ws = this.database.getSheetByName(sheetName)
60 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
61 | const data = JSON.parse(jsonData)
62 | const [headers, ...records] = ws.getDataRange().getValues()
63 | const keys = this.createKeys(headers)
64 | const indexOfId = keys.indexOf("id")
65 | const recordIndex = records.findIndex(record => record[indexOfId] == data.id)
66 | if (recordIndex === -1) throw new Error(`Record ${data.id} was not found in the database!`)
67 | const values = keys.map((key) => {
68 | return data.hasOwnProperty(key) ? data[key] : null
69 | })
70 | ws.getRange(recordIndex + 2, 1, 1, values.length).setValues([values])
71 | const item = this.creaetItemObject(keys, values)
72 | return JSON.stringify(item)
73 | }
74 |
75 | deleteItem(sheetName, jsonData){
76 | const ws = this.database.getSheetByName(sheetName)
77 | if (!ws) throw new Error(`${sheetName} was not found in the database!`)
78 | const {id} = JSON.parse(jsonData)
79 | const [headers, ...records] = ws.getDataRange().getValues()
80 | const keys = this.createKeys(headers)
81 | const indexOfId = keys.indexOf("id")
82 | const recordIndex = records.findIndex(record => record[indexOfId] == id)
83 | if (recordIndex === -1) throw new Error(`Record ${data.id} was not found in the database!`)
84 | ws.deleteRow(recordIndex + 2)
85 | return JSON.stringify({message: `Record with id ${id} has been deleted successfully.`})
86 | }
87 | }
88 |
89 | const api = new API()
90 | const getItems = (jsonData) => {
91 | const {sheetName, pageSize, page} = JSON.parse(jsonData)
92 | const data = api.getItems(sheetName, pageSize, page)
93 | return JSON.stringify(data)
94 | }
95 |
96 | const createItem = (sheetName, jsonData) => api.createItem(sheetName, jsonData)
97 | const updateItem = (sheetName, jsonData) => api.updateItem(sheetName, jsonData)
98 | const deleteItem = (sheetName, jsonData) => api.deleteItem(sheetName, jsonData)
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
--------------------------------------------------------------------------------
/src/projects/LC008/Code.js:
--------------------------------------------------------------------------------
1 | // UrlFetchApp API https://www.imdb.com/search/title/?companies=co0001799 DONE
2 |
3 | // RegExp scrap data form the HTML Done
4 |
5 | // Save data to Spreatsheet
6 |
7 | const APP_NAME = "LC008"
8 | const TEST_URL = "https://www.imdb.com/search/title/?companies=co0001799"
9 | const RE = {
10 | LISTER_ITEM: /
19 |
20 |
21 |
22 |
78 |
23 |
30 | {{name}}
24 |
25 |
28 |
29 |
31 |
54 |
32 |
33 |
52 |
53 | | {{ header.text }} | 35 |
|---|
|
38 |
39 |
42 |
45 |
46 |
47 | {{ item[header.value] }}
48 |
49 | |
50 |
55 |
73 |
74 |
56 |
71 |
72 |
75 |
77 | (.|\n)*?<\/p>\s+<\/div>\s*<\/div>/gmi,
11 | LISTER_ITEM_IMAGE: /
(.|\n)*?<\/div>/gmi,
12 | LISTER_ITEM_CONTENT: /
(.|\n)*?<\/div>/gmi,
13 | TITLE: /adv_li_tt"\n*>(.|\n)*?<\/a>/gmi,
14 | YEAR: /(.|\n)*?<\/span>/gmi,
15 | }
16 | const SHEET_NAME = {
17 | COMPANYES: "Companies"
18 | }
19 |
20 | class App{
21 | constructor(){
22 | this.name = APP_NAME
23 | this.ss = SpreadsheetApp.getActive()
24 | }
25 |
26 | /**
27 | * Get the html content form URL
28 | * @param {string} url The URL of the web site
29 | * @returns {string} The HTML content in string
30 | */
31 | getHtmlContent(url=TEST_URL){
32 | const response = UrlFetchApp.fetch(url)
33 | const content = response.getContentText()
34 | return content
35 | }
36 |
37 | /**
38 | * Get the lister item image URL form the HTML content
39 | * @param {string} htmlContent The HTML content
40 | * @returns {strin} The URL of image
41 | */
42 | getListerItemImageUrl(htmlContent){
43 | const matches = htmlContent.match(RE.LISTER_ITEM_IMAGE)
44 | return matches[0].split('loadlate="')[1].split('"')[0]
45 | }
46 |
47 | getInnerHtmlContent(htmlContent){
48 | const startIndex = htmlContent.indexOf(">")
49 | const endIndex = htmlContent.lastIndexOf(" {
87 | const image = this.getListerItemImageUrl(listerItemContent)
88 | const {title, year} = this.getListerItemContent(listerItemContent)
89 | movies.push({
90 | title,
91 | year,
92 | image
93 | })
94 | })
95 |
96 | const values = movies.map(movie => {
97 | return [
98 | movie.title,
99 | movie.year,
100 | `=IMAGE("${movie.image}")`,
101 | movie.image
102 | ]
103 | })
104 | values.unshift(["Title", "Year", "Image", "Image URL"])
105 | this.valuesToSheet(values, companyName)
106 | }
107 |
108 | updateAllCompanies(){
109 | const ws = this.ss.getSheetByName(SHEET_NAME.COMPANYES)
110 | const values = ws.getDataRange().getDisplayValues().slice(1)
111 | values.forEach(([companyName, url]) => {
112 | this.getMoviesForCompany(url, companyName)
113 | })
114 | }
115 | }
116 |
117 | const updateAllCompanies = () => new App().updateAllCompanies()
118 | const onOpen = () => {
119 | SpreadsheetApp.getUi().createMenu(APP_NAME).addItem("Update movies", "updateAllCompanies").addToUi()
120 | }
121 |
122 |
123 |
124 |
125 |
126 |
127 |
128 |
129 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_B/vue/view/components.html:
--------------------------------------------------------------------------------
1 |
151 |
152 |
153 |
154 |
155 |
156 |
157 |
158 |
159 |
160 |
161 |
162 |
163 |
164 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_B/vue/components.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/projects/LC011/PART_C/vue/components.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/projects/LC010/PART_C/vue/view/components.html:
--------------------------------------------------------------------------------
1 |
157 |
158 |
159 |
160 |
161 |
162 |
163 |
164 |
165 |
166 |
167 |
168 |
169 |
170 |
--------------------------------------------------------------------------------
/src/projects/LC013/Code.js:
--------------------------------------------------------------------------------
1 | const DOC_TEMPLATE_ID = "12DWJ3F5PSzlPI2H2E80DfKm9F8o1lyy0ab1tBgJR4-g"
2 | const PDF_FOLDER_NAME = "PDFs"
3 | const FILE_NAME_PREFIX = "LC013 Document Signing with Google Form"
4 | const SUBJECT_PREFIX = "LC013"
5 | const IMAGE_WIDTH = 400
6 |
7 | // GmailApp
8 | /**
9 | * @param {Object} e
10 | * @param {FormApp.FormResponse} e.response
11 | */
12 | function _onFormSubmit(e) {
13 | e.response.getResponseForItem
14 | const values = getResponses_(e.response)
15 | const docCopy = createDocCopy_(values)
16 | updateDocCopy_(docCopy, values)
17 | sendDocument_(docCopy, values)
18 | }
19 |
20 |
21 | /**
22 | * @param {FormApp.FormResponse} response
23 | */
24 | function getResponses_(response){
25 | const items = response.getItemResponses()
26 | const values = {}
27 | items.forEach(item => {
28 | const title = item.getItem().getTitle()
29 | let value = item.getResponse()
30 | let type = "Text"
31 | if (item.getItem().getType() === FormApp.ItemType.FILE_UPLOAD) {
32 | type = "Image"
33 | value = value[0]
34 | }
35 | values[title] = {type, value}
36 | })
37 |
38 | const email = response.getRespondentEmail()
39 | values["_email"] = email
40 | return values
41 | }
42 |
43 | /**
44 | * @param {DriveApp.Folder} parentFolder
45 | * @param {string} name
46 | * @returns {DriveApp.Folder}
47 | */
48 | function getFolderByName_(parentFolder, name){
49 | const folders = parentFolder.getFoldersByName(name)
50 | if (folders.hasNext()) return folders.next()
51 | return parentFolder.createFolder(name)
52 | }
53 |
54 | function getPDFFolder_(){
55 | const template = DriveApp.getFileById(DOC_TEMPLATE_ID)
56 | const currentFolder = template.getParents().next()
57 | const folder = getFolderByName_(currentFolder, PDF_FOLDER_NAME)
58 | return folder
59 | }
60 |
61 | function createFileName_(values){
62 | const name = values["Name"] ? values["Name"].value : ""
63 | const company = values["Company"] ? values["Company"].value : ""
64 | return `${FILE_NAME_PREFIX} ${name} ${company} ${new Date().toLocaleString()}`
65 | }
66 |
67 | function createDocCopy_(values){
68 | const template = DriveApp.getFileById(DOC_TEMPLATE_ID)
69 | const folder = getPDFFolder_()
70 | const fileName = createFileName_(values)
71 | const docCopy = template.makeCopy(folder).setName(fileName)
72 | return docCopy
73 | }
74 |
75 | /**
76 | * @param {DocumentApp.Body} body
77 | */
78 | function updateImage_(body, placeholder, imageId){
79 | const findOne = body.getParagraphs().find(p => p.findText(placeholder))
80 | if (!findOne) return
81 | const imageBlob = DriveApp.getFileById(imageId).getBlob()
82 | const indexOfTheFindOne = body.getChildIndex(findOne)
83 |
84 | const image = body.insertImage(indexOfTheFindOne + 1, imageBlob)
85 | const width = image.getWidth()
86 | const height = image.getHeight()
87 | const ratio = IMAGE_WIDTH / width
88 | image.setWidth(IMAGE_WIDTH).setHeight(height * ratio)
89 |
90 | findOne.removeFromParent()
91 | }
92 |
93 | /**
94 | * @param {DriveApp.File} docCopy
95 | */
96 | function updateDocCopy_(docCopy, values){
97 | const doc = DocumentApp.openById(docCopy.getId())
98 | const body = doc.getBody()
99 |
100 | // replace the placeholders
101 | Object.entries(values).forEach(([key, item]) => {
102 | const placeholder = `{{${key}}}`
103 | const {type, value} = item
104 | if (type === "Text") {
105 | body.replaceText(placeholder, value)
106 | }else if (type === "Image") {
107 | updateImage_(body, placeholder, value)
108 | }
109 | })
110 | doc.saveAndClose()
111 | }
112 |
113 | function createSubject_(values){
114 | const name = values["Name"] ? values["Name"].value : ""
115 | const company = values["Company"] ? values["Company"].value : ""
116 | return `${SUBJECT_PREFIX} [${name}] [${company}] ${new Date().toLocaleString()}`
117 | }
118 |
119 | /**
120 | * @param {DriveApp.File} docCopy
121 | */
122 | function sendDocument_(docCopy, values){
123 | const recipient = values["_email"]
124 | if (!recipient) return
125 |
126 | const folder = getPDFFolder_()
127 | const pdf = folder.createFile(docCopy.getAs("application/pdf"))
128 | .setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.VIEW)
129 |
130 | const subject = createSubject_(values)
131 | const name = values["Name"] ? values["Name"].value : ""
132 | // const company = values["Company"] ? values["Company"].value : ""
133 |
134 | const options = {
135 | bcc: "",
136 | cc: "",
137 | htmlBody: `
138 |
Hello ${name},
139 |Here is your signed document PDF.
140 |Thanks,
Ashton Fei