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

Upload from clipboard #414

Merged
merged 5 commits into from
Sep 29, 2024
Merged

Conversation

neobooru
Copy link
Collaborator

@neobooru neobooru commented Jun 4, 2021

A few small issues.

1. You can only paste an image in the text input

This could be fixed by changing this._urlInputNode.addEventListener("paste", ...) to window.onpaste = ...;, but it feels a bit dirty to touch the window. We can't use window.addEventListener because I don't think we have an 'unmounted' event where we can call removeEventListener. Though the same is true when using window.onpaste, but at least then it wouldn't add duplicate listeners when mounting the upload view multiple times (happens when navigating from upload -> another page -> upload again).

2. The "Change post content" upload field text is unchanged

Because it wouldn't fit. Any suggestions?

How it is now:
image

How it would be with the change:
image

3. No feedback when the clipboard can't be accessed

This doesn't work when the user has some privacy settings enabled (though at that point it also wouldn't work on imgur etc). I wouldn't know which specific setting. It doesn't work on my personal Chrome/Firefox setup, but it works in a 'clean' Edge (Chromium).

@neobooru neobooru self-assigned this Jun 4, 2021
@sgsunder
Copy link
Collaborator

I'm not really familiar with the clipboard browser API.

Could we maybe add a button next to "confirm" that pulls an image from the clipboard? To make it look neat on mobile, It could just have this icon (https://fontawesome.com/v5.15/icons/paste) and a tooltip could explain what it does.

@neobooru
Copy link
Collaborator Author

Could we maybe add a button next to "confirm" that pulls an image from the clipboard? To make it look neat on mobile, It could just have this icon (https://fontawesome.com/v5.15/icons/paste) and a tooltip could explain what it does.

I don't think this is possible. You aren't allowed to 'pull' data from the clipboard, you can only 'accept' data when the user pastes the content themself. The action has to be initiated by the user.

There is a new clipboard.read API, but I haven't tested it and it also looks like it isn't really supported.

@sgsunder
Copy link
Collaborator

Hmm, OK.

  1. I personally don't think is a major issue.

  2. Maybe we just replace the "Confirm" with a smaller icon so the textbar is more visible? I think we could also add a hook so that when a URL/URLs get pasted they get auto-confirmed? so:
    a) One text URL is pasted: The URL gets added to the list ready for upload
    b) Multiple text URLs are pasted (whitespace/newline delimited): All URLs get added to the list, duplicate URLs get ignored
    c) Image data is pasted: The image data gets added to the list

(a) and (b) function similar to how adding tags to posts work, it would also allow us to 'get away' with shrinking the confirm button because most people won't be using it as much anymore

  1. Again, I'm not sure how this works, does the API generate an exception we can maybe use?

@po5
Copy link
Contributor

po5 commented May 17, 2023

Images copy-pasted from Chrome will not work because there are two items, one of which gets resolved to null, and we end up feeding it to URL.createObjectURL.
Here's my take on it: po5@672a57d + po5@7a1c0d9

I don't think we have an 'unmounted' event

There is, with views.monitorNodeRemoval().
See how it's done in controls/post_content_control.js @ _install() and _uninstall().

@neobooru neobooru force-pushed the feature-upload-from-clipboard branch from 1eb3b83 to 6599023 Compare April 27, 2024 19:59
@neobooru
Copy link
Collaborator Author

Seems to work well enough in some basic tests.

@neobooru neobooru merged commit 46e3295 into rr-:master Sep 29, 2024
1 check passed
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.

3 participants