先に書いた以下の続きです
Googleドライブのフォルダ構成
親フォルダ
└TEST3
└TEST2
└TEST1
└サンプル2
└サンプル1
└テキスト（ドキュメントのbody）
└説明（ファイルの説明）
サンプル1の中身
HtmlServiceでこのように表示したい
コード.gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile("index");
}
/************************************
getFoldersInFolder
************************************/
function getFoldersInFolder() {
const folderId = "親フォルダID";
const parentFolder = DriveApp.getFolderById(folderId);
const folders = parentFolder.getFolders();
let objs = [];
while(folders.hasNext()) {
const folder = folders.next();
const obj = {};
obj["name"] = folder.getName();
obj["id"] = folder.getId();
objs.push(obj);
}
return objs;
}
/************************************
getFilesInFolder
************************************/
function getFilesInFolder(folderId) {
const parentFolder = DriveApp.getFolderById(folderId);
const files = parentFolder.getFiles();
let objs = [];
while(files.hasNext()) {
const file = files.next();
const obj = {};
obj["name"] = file.getName();
obj["id"] = file.getId();
objs.push(obj);
}
return objs;
}
/************************************
getDataInFile
************************************/
function getDataInFile(fileId) {
const file = DriveApp.getFileById(fileId);
const obj = {};
obj["name"] = file.getName();
obj["id"] = file.getId();
obj["description"] = file.getDescription();
obj["text"] = getDocText(fileId)
return obj;
}
/************************************
getDocText
************************************/
function getDocText(fileId) {
const doc = DocumentApp.openById(fileId);
const body = doc.getBody().getText();
return body;
}
|
index.html
<!DOCTYPE html>
<html>
<body>
<div id="main">
<select id="folders_select"></select>
<br>
<select id="files_select"></select>
<br>
<textarea id="text"></textarea>
<textarea id="description"></textarea>
</div>
<script>
elem("folders_select").onchange = selectFolderChanged;
elem("files_select").onchange = selectFileChanged;
get_data();
/************************************
get_data()
************************************/
function get_data() {
google.script.run
.withFailureHandler(onFailure)
.withSuccessHandler(onSuccess)
.getFoldersInFolder();
}
/************************************
onSuccess(result)
************************************/
function onSuccess(folders) {
const select = elem("folders_select");
for(let i = 0; i < folders.length; i++) {
const name = folders[i]["name"];
const id = folders[i]["id"];
console.log(name, id)
createSelectOptions(select, name, id);
}
}
/************************************
createSelectOptions
************************************/
function createSelectOptions(select, name, id) {
const option = document.createElement("option");
option.textContent = name;
option.setAttribute("id", id);
select.appendChild(option);
}
/************************************
selectFolderChanged
************************************/
function selectFolderChanged() {
const select = elem("folders_select");
const index = select.selectedIndex;
const id = select[index].id;
google.script.run
.withFailureHandler(onFailure)
.withSuccessHandler(onSuccessFolderChanged)
.getFilesInFolder(id);
}
/************************************
selectFolderChanged
************************************/
function selectFileChanged() {
const select = elem("files_select");
const index = select.selectedIndex;
const id = select[index].id;
google.script.run
.withFailureHandler(onFailure)
.withSuccessHandler(onSuccessFileChanged)
.getDataInFile(id);
}
/************************************
onSuccessFolderChanged
************************************/
function onSuccessFolderChanged(files) {
const select = elem("files_select");
for(let i = 0; i < files.length; i++) {
const name = files[i]["name"];
const id = files[i]["id"];
console.log(name, id)
createSelectOptions(select, name, id);
}
}
/************************************
onSuccessFileChanged
************************************/
function onSuccessFileChanged(data) {
console.log(data);
elem("text").value = data["text"];
elem("description").value = data["description"];
}
/************************************
onFailure(e)
************************************/
function onFailure(e) {
alert([e.message, e.stack]);
}
/************************************
elem(id)
************************************/
function elem(id) {
return document.getElementById(id);
}
</script>
</body>
</html>
|
