分享程序员开发的那些事...
更新时间：2022-10-15 23:29:59
Here's a toggle function that presents a dialog that has a button that turns a light on and off:
function launchLightToggleDialog() {
let html='';
html += '<html><head></head><body>';
html += '<br /><img id="light" src="" />';
html += '<br /><input type="button" id="btn" value="Toggle" onclick="toggle()" /> <label id="lbl" for="btn"></label>';
html += '<script>';
html += 'var light="on";'
html += 'var lighton = <?= getMyDataURI(gobj.globals.lightonid) ?>;\n';
html += 'var lightoff = <?= getMyDataURI(gobj.globals.lightoffid) ?>;\n';
html += 'window.onload=function(){document.getElementById("light").src=(light=="on")?lighton:lightoff;document.getElementById("lbl").innerHTML=light;}\n';
html += 'function toggle(){light = (light=="on")?"off":"on";document.getElementById("light").src=(light=="on")?lighton:lightoff;document.getElementById("lbl").innerHTML=light;}\n';
html += 'console.log("mycode");\n'
html += '</script>';
html += '</body></html>';
let t=HtmlService.createTemplate(html);
let o=t.evaluate();//The dataURI's get loaded here
SpreadsheetApp.getUi().showModelessDialog(o,"Light Toggle");
}
The below function just opens up the files where I store the dataURI's of the lighton and lightoff images and it returns the dataURI's as strings for use in the webapp. Making it possible for me to serve the images off of my Google Drive.
function getMyDataURI(fileId) {
const file=DriveApp.getFileById(fileId);
return file.getBlob().getDataAsString();
}
Demo:
Both functions are Google Apps Script and all JavaScript functions are imbedded in the html string.
If you wish to convert an image to a dataURI:
function convImageUrl(url){
var url=url || "default url";
var blob=UrlFetchApp.fetch(url).getBlob();
var b64Url='data:' + blob.getContentType() + ';base64,' + Utilities.base64Encode(blob.getBytes());
return b64Url;
}
function saveDataURIInFile(filename,datauri,type) {
Logger.log('filename: %s\ndatauri: %s\ntype: %s\n',filename,datauri,type);
if(filename && datauri && type) {
var folder=DriveApp.getFolderById(getGlobal('MediaFolderId'));
var files=folder.getFilesByName(filename);
while(files.hasNext()) {
files.next().setTrashed(true);
}
var f=folder.createFile(filename,datauri,MimeType.PLAIN_TEXT);
return {name:f.getName(),id:f.getId(),type:type,uri:DriveApp.getFileById(f.getId()).getBlob().getDataAsString()};
}else{
throw('Invalid input in saveDataURIInFile.');
}
}