Hello everyone,
I am working on an app using Electron and MaterializeCss to give some neat style to the app.
My app is about reducing an image weight, however, I have the output destination fixed.
I thought about incorporating a button where the user selects a folder and that folder would work as the destination instead of having it fixed from the get-go. Take a look at my code:
My “select folder” button
<input
type="file"
id="input-folder"
class="validate"
webkitdirectory
directory
onchange="javascript:updateOutput()"
/>
My code to remove the file name from the path:
function updateOutput() {
var folder_path = folder.files[0].path;
//Replace single backslash for dual
folder_path.replace(/\/g, "\\");
//Look for the last dual backslash
folder_path = folder_path.slice(0, folder_path.lastIndexOf("\"));
document.getElementById("output-path").innerText = folder_path;
}
Here is how it looks when included in the app:
As you can see, it doesn’t have a style according to Materialize CSS, maybe I am doing something wrong (well not maybe, for sure I am). Also if the folder has too many folders/files inside of it (not only first level but all the levels inside), it crashes the app.
Is there a way around it? I simply want a button to let the user select a folder and get the absolute path to that folder.
I appreciate all the help I can get.
Thanks in advance.