Javascript framework for File Picker - javascript

I have a location on server hosted by node.js /public/imagedepot which contains subfolders and image files. I want to create an admin page which can select the selective images or complete subfolder from the imagedepot from the filebrowser on the html page and then on submit the array with the location of the images selected can be posted to the server.
For this purpose, is there any library or extension in the javascript present which can provide me with the gui of the folder and file picker in the tree format and can have multi select which then returns the array with the selected images and their paths.
This would be easy if an open source framework is available.
I am using expressjs node.js and javascript
I dont want to upload the file to the server only the user can select the name of images from the browser and then it provides a array with the selected filename and path.

I think most file pickers are going to want to select from files on the client machine. To allow the client to select a file on the server I would populate a list of file choices on the server side. This should get you started: How do you get a list of the names of all files present in a directory in Node.js?
Next I would display the choices to the user like this example:
Expandable Tree Menu List

I would recommend CKFinder. Whether you already have the images on the server or they should be uploaded, that would be the best fit. http://cksource.com/ckfinder
Moreover, you can integrate their HTML WYSWYG editor (CKEditor) with it.

Related

How to get all files from a directory using ReactJs

I have a create-react-app application that has a page where it allows the user to select a .csv file to upload, this file has many columns, one of these columns is a path to a folder with a bunch of pictures.
I want to be able to access this folder and upload all this pictures using js on the client side, apparently all solutions involving the fs library do not work anymore as it's been removed from webpack.
Since the files are hosted in the client side, I need to be able to grab those files programmatically using the js running on the cliente browser, it needs to happen without the user interaction because that CSV file has thousands of lines (there will be thousands of paths to grabs the images from), so the user can't be manually opening the file browser and selecting a directory for each line of that csv file.
To be clear, the only user interaction allowed is the csv file upload, the rest needs to be handled automatically.
How can this be done? And if it can't be done, what would be a work around this issue?
Thank you.

Getting full page source information using PowerShell

So my ultimate problem is that I have a SharePoint list where each list item may have multiple image attachments. I am looking to scrape the list using PowerShell so that I can backup all the images.
I am able to access each item's page in the list because of similarities in the URL, but I am unable to extract the attachments. This is because the filename is non-determinant. Unfortunately, I don't seem to be able to parse the info with Invoke-WebRequest because it brings back the HTML of the page, which does not list the file attachments.
Instead, the file attachments can be viewed when you use the 'Inspect page source' button, and which I believe is because they are inside a JavaScript function.
So, my question is - Can I get each file in a page's attachment from the JavaScript function so that I can scrape the page? Also - am I interpreting this problem correctly, and are there any other ways to solve this problem?
Please note: I don't have access to SharePoint server dlls including Microsoft.Sharepoint.dll, so I can't use Classes from that dll (unless they might be easily imported without having to install the whole library).
Here is a photo of where the source changes. I believe this is where HTML ends and Javascript begins:
And the highlighted lines in this file shows the information that I am looking to parse from the page's source information so that I can form the URL to download the image attachments:

How to get array of files from a folder using Javascript

Scenario: I am creating a personal home page that i plan for using in safari/chrome/Firefox and I have a folder with images. I want to display a random image as the background of the page.
My solution to this was to create an array with all the images as separate links as the objects of the array. My JS works with a pre-made array of links but I have no clue on how to create an array from a directory.
I don't mind using jquery if required but i cant have server side php (or anything else) since i am linking the local html file to the new tab page.\
The html file is in the directory / and the images in /img .
This can't be done. You're going to need something on the server side to read the directory that is on your server. Javascript (including jQuery) running on the user's browser doesn't have access to list directories on your server.

File upload with AWS and javascript

Is there a file select library, similar to drop zone, that just manages the file selection process and lets me control how the files are uploaded? It seems to me, unless I have missed something - most of these libraries require you to identify a server side file that will handle the upload. Currently, my set up is such that files are sent to my server and then to S3 - which is far less efficient than sending them directly to AWS via the javascript API.
I like how dropzone lets me select files from multiple directories - adding to the list of files to upload on the fly.

How can I upload files, given their paths, using Javascript?

So I want to be able to upload a file, parse the file, and then upload some more files that are listed in the first file. Is this possible?
Say I upload 'animals.csv' which contains a list of animals and some information about them, including the paths to their images. Can I parse this file and get the images listed?
I know how to upload a file using an but is it possible to automatically upload some more files given their paths?
I'm afraid not. Here's a similar question:
upload file from client to server without openFile dialog
The main issue is security. The browsers don't want to be a vector for viruses that would steal files from people's machines.
Your choices are limited to having users drag and drop files or select them from a dialog. Chrome also has a feature which will let users drag and drop folders not just files (upload file from client to server without openFile dialog), but i think still only Chrome supports that and the user still has to at least choose or drag the folder.

Categories

Resources