photonix icon indicating copy to clipboard operation
photonix copied to clipboard

Allow photos to be uploaded via web browser

Open damianmoore opened this issue 3 years ago • 6 comments

An obvious way for people to import photos would be to allow them to drag-and-drop files from their file manager onto their browser. Also adding an option to upload from the menu would make it more discoverable to other users. See mockup designs in comments below.

AC:

  • [x] Upload mechanism that integrates well with existing GraphQL API - this API should be useable by native desktop and mobile apps too
  • [x] Would be good if uploads are possible via a simple cURL command (POST data)
  • [x] Uploaded files are uploaded with library ID so destination can be determined
  • [x] Authentication is checked so user uploading has permission to alter the referenced library
  • [x] Multiple files can be uploaded at once
  • [ ] UI changes to a large drop zone when user is hanging a file over the page to indicate it will upload
  • [ ] Once upload has started, let user get back to what they were doing but show progress bar in similar to how classification progress is shown. May need to merge in branch for this if not merged into master yet. Uploading should be top item in list if there is more than one progress item. When uploading first starts show the notification for 5 seconds then fade out so that the user knows where to check on progress.
  • [ ] In user menu (top-right) add option for "Upload" which opens browser file picker (allow multi-select)

damianmoore avatar Nov 22 '20 15:11 damianmoore

User menu upload option Screenshot from 2021-05-25 21-48-21

damianmoore avatar May 25 '21 20:05 damianmoore

Drop zone view when user is dragging files and about to drop to upload. "Demo Library" should be replaces with name of currently active library. Screenshot from 2021-05-25 21-56-04

damianmoore avatar May 25 '21 21:05 damianmoore

There is now a branch for this development work - 137-uploading. It has an endpoint that allows files to be uploaded to a library. library_id get parameter must be supplied as well as JWT token as cookie. For testing this you can get the JWT token by being logged into Photonix and copying cookies then using this cURL command with a test image file path.

curl -F 'testimage.png=@/home/user/testimage.jpg' -H 'Cookie: JWT=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VybmFtZSI6ImRlbW8iLCJleHAiOjE2MjIwNDYwMzAsIm9yaWdJYXQiOjE2MjIwNDUxMzB9.zI0n2j201PD15hVfi-Bcy3dPwEnwKcqn1Sj3hCOXLQs' http://localhost:8888/upload/?library_id=f70c344e-c94e-4395-a4ca-66f9e1b1b040

damianmoore avatar May 26 '21 16:05 damianmoore

Icon for upload: https://fonts.google.com/icons?selected=Material%20Icons%3Afile_upload

damianmoore avatar May 26 '21 16:05 damianmoore

Task Done and changes pushed on branch 137-uploading . Branch 192-progress-notifications merged in 137-uploading

GyanP avatar Jun 08 '21 15:06 GyanP

Hey Damien, was this ever pushed live?

kneithamer-rh avatar Oct 03 '23 18:10 kneithamer-rh