Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement Paste UI for selecting recipient peer and other paste related stuff #488

Closed
wants to merge 16 commits into from

Conversation

schlagmichdoch
Copy link
Contributor

@schlagmichdoch schlagmichdoch commented Aug 24, 2022

This pull request enhances the paste clipboard functionality introduced with #108 .

Main changes:

  1. adds text support to clipboard _onPaste() functionality and fixes issue where pasting into message dialog modal sends item directly
  2. adds clipboard ui / paste mode: When something is pasted user can simply select the recipient to send item
  3. adds paste area below to enable pasting of items from clipboard on mobile devices as well
  4. introduces url argument "paste=true" to directly enter paste mode on page load
  5. adds support to send base64 encoded items from clipboard on page load

About 1-3:

Overall this pull request extends the possiblities to share items with peers via snapdrop without conflicting with the standard ux at all. As @sonicblis suggested, a paste UI is added to let user select the recipient directly.

The new paste mode adds a workflow which resembles apples airdrop even further:

  1. copy file / text you want to share
  2. open snapdrop.net
  3. paste elements via CMD+V or into paste-area
  4. select recipient

About 4:

This flag simplifies the workflow even further by entering paste mode directly:

  1. copy file / text you want to share
  2. open snapdrop.net?paste=true
  3. select recipient
    (url is replaced with snapdrop.net)

In order to get clipboard data on user action (selecting the recipient), we use the Asynchronous Clipboard API, which is supported by all browsers but firefox. If it's not supported users will get notified and can use CMD+V or paste into paste-area

iOS Shortcut

My overall goal was to implement a way to send photos, text or urls on ios via snapdrop directly from the ios share menu:

  1. open share menu on photo/url/file and tap "share via snapdrop"
  2. select recipient

To do this we can use the built-in app Shortcuts

Shortcut Link:

https://routinehub.co/shortcut/12867/

It works perfectly for URLs and texts and images copied from other pages:

  1. user taps "share via snapdrop"
  2. input is copied to clipboard
  3. url is opened: https://snapdrop.net/?paste=true
  4. User selects recipient
  5. clipboard content is send to recipient
  6. url is replaced with snapdrop.net

About 5:

Somehow images and files copied to clipboard from gallery and files app can not be inserted into websites so I came up with the idea of base64 encoding them with shortcuts

  1. user taps "share via snapdrop"
  2. if photo/video/file: input gets base64 encoded and a proper data-uri is formed which is copied to clipboard
  3. filename is read (data-uri does not contain metadata)
  4. url is opened: https://snapdrop.net?paste=true&base64file=true&filename=filename
  5. User selects recipient
  6. clipboard content is decoded by snapdrop and together with filename a File is created
  7. File is send to recipient
  8. url is replaced with snapdrop.net

This feature could be used by iOS users by adding the shorcut to their device. The current UX implementation is not conflicited.

Shortcut Link (could than be added to the list of Third-Party Apps):

https://routinehub.co/shortcut/12868/

@schlagmichdoch
Copy link
Contributor Author

About 4:

I fiddled around with shortcuts some more and made sharing of images directly from gallery possible. Somehow images copied to clipboard via shortcuts have an empty type array. This updated shortcut now detects images and reconverts them to their format and only copies them afterwords which solves the issue:
https://routinehub.co/shortcut/12867/

Sharing of images from the gallery works perfectly now👌

  1. open share menu on photo(s) and tap "share via snapdrop"
  2. select recipient

I have not found a workaround for videos, files or folders, so for that base64 encoding would still be the way to go.

@schlagmichdoch
Copy link
Contributor Author

This PR is superseeded by #534 and #533

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant