Adapt GAS script functions from a Spreadsheet to a Web Application - javascript

I'm new to GAS and JavaScript in general, so I'd like some help adapting a script from a spreadsheet to a Web App.
Based on some scripts I found, I developed a code to work the way I need in a Google Spreadsheet, but after making it work exactly the way I need it, I realized that a Web App could be a better alternative, mainly because of how it works on Mobile .
The point is that I didn't have a very linear JavaScript learning curve, my learning was solving specific needs, so I have difficulty with some basic concepts... and to be quite honest, deeply understanding JavaScript is not my main focus, but this knowledge is missing me now...
Let's get straight to the point
My current spreadsheet is this one:
Google Sheet - Stack Demonstration
In the GAS linked to this worksheet there are 2 .gs files and one HTML.
GAS files
1 - CSV.gs | Contains 2 scripts
CheckForFiles - Checks the amount of files in a given Google Drive folder before releasing the execution of other scripts.
SheetToCSV - Creates a .csv file of the sheet in the parent folder of that sheet.
This script is applied to the spreadsheet's Submit button.
2 - Upload.gs | Contains some functions responsible for uploading files through the spreadsheet.
ShowDialog0101 - Basically it's a script to call the upload page through an HTML alert in the spreadsheet.
GetParent - Basically it's a script that discovers the ID of the spreadsheet's parent folder and passes this information to the HTML file. I created this function because that way I can use this worksheet's folder as a model folder, simply duplicating the entire content without having to edit the code to update the worksheet's folder ID.
CreateOrGetFolder - This is the main function of the upload script, it checks if there is a child folder that has the name "Video" inside the parent folder, if it exists, it takes the ID of that folder so that the file is uploaded in that folder, if it does not exist, it creates a folder called "Video" and takes the ID of the created folder.
This is the Web App that launches when the Video File button is clicked:
Web App - Stack Demonstration
HTML file
Basically contains the client-side upload functions, I adapted this script based on this one.
What i would like to do
As I commented initially, I would like to adapt these scripts to work in a Web App.
My idea is that instead of the person filling out the worksheet, they fill out a form.
For this I need to adapt mainly the SheetToCSV script to link with a Submit button in the Web App, the idea is that as soon as the form is completed and the file upload is completed, this button is released and then when clicking on it the SheetToCSV script be triggered by creating a .csv file in the spreadsheet's parent folder with all the form responses.
My main difficulty is in linking the .csv generation script with the Submit button, I've been racking my brains over this for days.
I'm already having nightmares with this programming, literally... if anyone can help me with this, I'd be very grateful!
EDIT
I'll try to explain in a little more detail here.
Currently, I have this google spreadsheet here:
This worksheet contains modified versions of 2 scripts created by Tanaike.
Script 1 - Generates a .csv file with the worksheet fields in the same folder as the worksheet.
Script 2 - It is a modified version of Tanaike's Resumable Upload for Web Apps script, it is called in the spreadsheet via html alert.
Resumable Upload for Web Apps via HTML Alert
CSV file generated by the worksheet
Everything works as expected in this worksheet, but now I would like to convert it to a Web App, like this example:
The issue is that I don't know how to convert Tanaike's .csv generation script to generate the files through this html form, what I need is to integrate it with the Submit button of the Web App and collect the form fields in a .csv file.
The Spreadsheet and the Web App can be viewed at these links:
Google Sheet
Web App Form

Thank you for replying. Can I ask you about your expected values for the CSV data? In this case,
I confirmed your expected result in this question as follows.
You want to retrieve 2 text values of "name01", "description", and 2 values from dropdown lists of "Option1" and "Option2". The total values are 4 values.
When the HTML form is submitted, you want to create a new CSV file for every submission.
In this case, how about the following modification? Unfortunately, in your question, your script is not shown. So, in this answer, I would like to propose a simple modification.
When I saw your sample Spreadsheet including your script, when the submit button is clicked, it seems that the function submitForm() is run. In this answer, this is used.
Modified script:
Javascript side:
Please modify submitForm() as follows.
function submitForm() {
// Added the below script.
var name = $('#name01').val();
var description = $('#description').val();
var option1 = $('#Option1').val();
var option2 = $('#Option2').val();
var data = [name, description, option1, option2].join(",");
google.script.run.saveDataAsCSV(data, uploadParentFolderId);
if ($('#submit-btn.disabled')[0]) return; // short circuit
Google Apps Script side:
Please add the following function. Please modify the filename of "sample.csv" to your actual situation.
const saveDataAsCSV = (data, folderId) => DriveApp.getFolderById(folderId).createFile("sample.csv", data);
By this modification, 4 values in HTML form are retrieved and save it as a CSV file to the folder of uploadParentFolderId.
If you want to save the file to other folder, please modify uploadParentFolderId of google.script.run.saveDataAsCSV(data, uploadParentFolderId).

Related

Open HTML file from a separate spreadsheet

I am trying to make a spreadsheet capable of opening an HTML file as a sidebar, but the HTML file is located on a master spreadsheet. Here is the code that I have already for opening the sidebar using an HTML that is in the spreadsheet.
function sidebar1()
{
var b1 = SpreadsheetApp.getActiveSheet().getRange('C13').getValue();
html = HtmlService.createHtmlOutputFromFile(b1).setTitle(b1);
ui.showSidebar(html);
}
It's only possible if you are the current user of that spreadsheet and that spreadsheet is the container of the script because SpreadsheetApp.getUi() as described in the documentation Returns an instance of the spreadsheet's user-interface environment that allows the script to add features like menus, dialogs, and sidebars. if a spreadsheet is opened by id or url then there is no user interface
I just thought that if you have two spreadsheets already open it might be possible to call a server side function on one to run a server side function on the other using Apps Script API which might be able to launch a Sidebar on the second sheet. So maybe I'm wrong. Give it a try.
One solution would be to open the HTML file into a temporary workbook, and copy the sheet from there into the workbook containing all of them.

Bulk upload into Odoo (OpenERP)

I am having a small issue using Odoo,
I have more then 1000 file to upload into Odoo V11 (.pdf/.stp), each file in attached to a P/N, I managed to have the adresse link for every par number created in odoo, but still i dont know how to make a bulk upload,
Now i am trying to create a macro for upload file per file but i am stuck in the first part.
I never used JavaScript before :/
here is the the main page of the PN :11050-1-A
when i lunch chrome console to click automatically in "ajouter" (Add) with
var el = document.getElementsByClassName('input_file_XXXX');
el[0].click();
i got a files dialogbox
lets say that the file is stored in desktop and called "11050-1-A - Test.pdf"
How can I automatically select the file?
Do you have another idea to solve this problem ?
If you have let's say more than 100 of these that needs to be imported once, you will need to create a Python script that uses Odoo's XML-RPC to upload the files. The process will be:
Connect to the XML-RPC and authenticate
Search for a product with the name
Search for the file on your computer
Create a new ir.attachment that links to the product
XML-RPC link: https://www.odoo.com/documentation/12.0/webservices/odoo.html

give edit permission by script (google apps script)

I have google spreadsheet with script and sidebar (html input fields). I will share this spreadsheet with my colleagues. and my colleagues will make a copy of my spreadsheet for personal use.
this is problem
when I edit my script, I want to edit my colleagues's spreadsheet script that copies of my spreadsheet.
for this, Here is my idea.
when my colleague run specific button(scirpt) on sheet first of all before use sheet, automatically I get edit permission of that spreadsheet. and then I go to my colleagues's spreadsheet script and edit it. Is their any script for this?
one script file and run multiple spreadsheets. my script is for input some data specific sheet and cell by html input form on sidebar. There are several input forms and specific sheet names and cell addresses are specified to set values. Is their any way for 2? I've tried publish add-on. but didn't work well. plz give me some idea.
For the first part, you can just add the lines;
var ss = SpreadsheetApp.getActiveSpreadsheet();
ss.addEditor('----#-------');
To directly create / edit script files you'll have to use the App Script API
App Script API
For the second part, you can write the scripts in a stand-alone file and use the script library in the spreadsheet. Leaving the script in development mode will always use the current code in the script file.
Apps-script libraries

How to get data from properties file inside JavaScript in a maven dynamic web project

My project is a maven dynamic web project. I have a drop-down for usernames and a text box for password in JSP file. Based on the selection of the user name in the drop-down, I need to auto-fill corresponding password in the text box. The mapping of username and password is from properties file.
login.properties
username1=password1
username2=password2
username3=password3
The properties file is directly in src/main/resources folder.
The jsp file is directly in WebContent folder.
Attached image contains a snippet of form elements in JSP file and the JavaScript. The username drop down options are dynamically populated using another JavaScript which works fine.
Code snippet
Also, I tried using below code but unable to provide right path.
var props = new java.util.Properties();
props.load(new java.io.FileInputStream("login.properties"));
var password = props.getProperty(account);
Is it possible to access properties file inside this JavaScript code? Any help is appreciated.
I found a workaround. Since I am unable to format the code even after using {} button, I have provided the code as an image.
Code snippet

Check to see if a user has "edit rights" to a Google Drive URL

I'm trying to figure out how to check a Google Drive URL to see if a specific Gmail account has 'edit rights' to it. Is this possible in Apps Script? If yes, any help is greatly appreciated.
I'm currently researching File.getEditors(), but not sure how to test this code:
// Log the email address of all users who have edit access to a file.
//https://developers.google.com/apps-script/reference/drive/user
var file = DriveApp.getFileById('1mgw9xYO7X99brzrIk4Uel8YzndQa8dpGGQCnrFn4suU');
var editors = file.getEditors();
for (var i = 0; i < editors.length; i++) {
Logger.log(editors[i].getEmail());
}
To test this code, you need to place the code inside a a function inside the Script Editor on Google Drive, then execute the function.
You can access the Script Editor in two ways, either from within a spreadsheet (under Tools->Script Editor), in which case your script will be bound to the Spreadsheet. Binding to a spreadsheet can be useful if you want the script to work with data from sheet, for example you might want to store some configuration settings in the sheet, in which case keeping the sheet and the code together as one file is convenient.
You can also create a stand alone Script by connecting the Google Apps Script app to your Google Drive (+New -> More -> Connect more apps), then creating a stand alone Google Apps Script file directly on drive.
Regardless of how you create the script, the behaviour of this script and the script editor will be exactly the same.
Once you are in the script editor, paste that code into a function (by default you will be given an empty function named "myFunction()". Then run it using the "Run" menu.
Finally, under the "View" menu, go to "Logs" to see the results of Logger.log().

Categories