Created
May 19, 2021 11:28
-
-
Save Max-Makhrov/97d9f57e2787334c8593d8e3ba58652c to your computer and use it in GitHub Desktop.
Google Script. HTML-form to select image from computer and save it to Google Drive and to Sheet cell as image.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // sample file: | |
| // https://docs.google.com/spreadsheets/d/1_rk4xFsMrxiuXqo5-HQWfvOjBU6nGDw1rlJFU0sci9U/copy | |
| function onOpen() { | |
| var ui = SpreadsheetApp.getUi(); | |
| // Or DocumentApp or FormApp. | |
| ui.createMenu('🙂 Click me') | |
| .addItem('Image 🖼️ to Drive', 'showFormImages') | |
| .addToUi(); | |
| } | |
| // Classic Sample: | |
| // https://developers.google.com/apps-script/guides/html/communication#forms | |
| function processForm(base64blob, name) { | |
| try { | |
| var re = new RegExp('^data:(image/.{3,4});base64,(.*)$'); | |
| var match = base64blob.match(re); | |
| var test = Utilities.base64Decode(match[2]); | |
| var contentType = match[1]; | |
| var blob = Utilities.newBlob(test, contentType, name); | |
| var driveFile = DriveApp.createFile(blob); | |
| // --------------------------------------->>>>>>> | |
| // change to | |
| // DriveApp.getFolderById(<your_folder_id>).createFile(formBlob); | |
| console.log(driveFile.getUrl()); | |
| // put image in a cell | |
| var r = SpreadsheetApp.getActiveRange().offset(0,0,1,1); | |
| // ---------------------------------------------------->>>>>>> | |
| // change to | |
| // your cell | |
| var id = driveFile.getId(); | |
| driveFile.setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.VIEW); | |
| r.setFormula('=IMAGE("https://docs.google.com/uc?export=view&id=' + id + '")'); | |
| return driveFile.getUrl(); | |
| } catch (err) { | |
| Browser.msgBox(err); | |
| } | |
| } | |
| function showFormImages() | |
| { | |
| var html = HtmlService.createHtmlOutputFromFile('Image2Drive'); | |
| SpreadsheetApp.getUi().showModalDialog(html, 'Select Image 👀'); | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <base target="_top"> | |
| <script> | |
| function previewFile(input) { | |
| const preview = document.querySelector('img'); | |
| const file = input.files[0]; | |
| const reader = new FileReader(); | |
| reader.addEventListener("load", function () { | |
| // convert image file to base64 string | |
| preview.src = reader.result; | |
| preview.style.visibility = "visible"; | |
| google.script.run.withSuccessHandler(exitForm).processForm(reader.result, file.name); | |
| }, false); | |
| if (file) { | |
| reader.readAsDataURL(file); | |
| } | |
| } | |
| function exitForm() { | |
| google.script.host.close(); | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <input type="file" onchange="previewFile(this)" accept="image/*"><br> | |
| <img src="" height="200" alt="Image preview..." style="visibility: hidden;"> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment