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

Support Drag & Drop of images from other browser windows into RoomView #3015

Open
enko opened this Issue Jan 21, 2017 · 21 comments

Comments

Projects
None yet
10 participants
@enko
Copy link

enko commented Jan 21, 2017

It would be nice if you can drag an Image from a website and drop it into the chat view and have it uploaded.

I do not know if this is possible, but it would make the channel with my wife sooo mich nicer, because I could upload the images/gifs directly via d'n'd and would not need to safe them localy.

@ara4n

This comment has been minimized.

Copy link
Member

ara4n commented Feb 18, 2017

This should be doable - Google Image Search already supports it. It's probably a very easy modification to the DND code to accept images from browsers as well as boring old files.

@ara4n

This comment has been minimized.

@ara4n ara4n changed the title Support Droping Images into the Chat Support Drag & Drop of images from other browser windows into RoomView Feb 21, 2017

@ara4n ara4n added the bounty? label Oct 29, 2017

@lampholder lampholder added the bounty label Nov 27, 2017

@status-open-bounty

This comment has been minimized.

Copy link

status-open-bounty commented Nov 27, 2017

Current balance: 0.0 ETH
Tokens: SNT: 6000.00
Contract address: 0x936dfd4edefa099b88eb8e6c94a18df7d00bb95b
QR Code
Network: Mainnet
To claim this bounty sign up at https://openbounty.status.im and make sure to update your Ethereum address in My Payment Details so that the bounty is correctly allocated.
To fund it, send ETH or ERC20/ERC223 tokens to the contract address.

@monokh

This comment has been minimized.

Copy link

monokh commented Dec 3, 2017

I started to have a look at this but hit a roadblock.
On drag and drop of an image, the only thing that is available is the URL for that image. My initial plan of action was to fetch this or pull the data from a canvas and construct a File object to pass through however this is not possible. Due to cors, an image cannot be loaded cross origin.

I had a look at how google does this. They forward the url of the image to their server to be uploaded. Does riot have such an upload endpoint as well?

@lampholder

This comment has been minimized.

Copy link
Member

lampholder commented Dec 13, 2017

We don't have such an endpoint today.

This could be implemented by adding a method to the media repository to support ingesting a piece of content from a provided URL rather than the request body.

We would need to think very carefully about what we were doing to make sure nobody could do anything nasty (e.g. have us DOS services on their behalf, or gain privilidged access to our systems by initiating HTTP requests from within our network). That said, we've already considered these issues for our implementation of the URL preview feature, so it shouldn't be too hard to apply to this feature, too.

@monokh

This comment has been minimized.

Copy link

monokh commented Dec 13, 2017

@lampholder Ok that makes sense. So where/what actually is the media repository and how can I make changes to it? Some guidance would be helpful. I could probably get this issue and #1953 done together.

@GlulkAlex

This comment has been minimized.

Copy link

GlulkAlex commented Dec 18, 2017

@oivoodoo

This comment has been minimized.

Copy link
Contributor

oivoodoo commented Dec 18, 2017

@GlulkAlex it has already implemented in matrix-react-sdk. it's possible to upload files by dragging to RoomView.

@GlulkAlex

This comment has been minimized.

Copy link

GlulkAlex commented Dec 18, 2017

Thanks, @oivoodoo .
It is a bit confusing that issues #3015 and #1953 are still open .
My bad, I must have done proper subject research beforehand .

@monokh

This comment has been minimized.

Copy link

monokh commented Dec 18, 2017

@GlulkAlex The issue is that files are possible but dragging and dropping images from a web page is not. react-dropzone only works for files.

@GlulkAlex

This comment has been minimized.

Copy link

GlulkAlex commented Dec 19, 2017

@BloodyIron

This comment has been minimized.

Copy link

BloodyIron commented Jan 18, 2018

This would be really cool! Also, if we could have Drag & Drop for URLs too (that aren't images) being pasted into chat?

@gotmyname2018

This comment has been minimized.

Copy link

gotmyname2018 commented Jan 18, 2018

I tried to fix this issue, and found most required works seems have been done by oivoodoo (#2751, #1689) and he is targeting this issue, if this is the case, I will not continue to work on this, is my understanding right?

@oivoodoo

This comment has been minimized.

Copy link
Contributor

oivoodoo commented Jan 18, 2018

@gotmyname2018 yeah. I am working on it in free time, a bit stuck in synapse part, but it's really close to be published :)

@georgiemathews

This comment has been minimized.

Copy link

georgiemathews commented May 11, 2018

@oivoodoo is this still being worked on?

@BloodyIron

This comment has been minimized.

Copy link

BloodyIron commented May 11, 2018

Still interested in this!

@georgiemathews

This comment has been minimized.

Copy link

georgiemathews commented May 11, 2018

@BloodyIron I'm not sure how much progress has been made but I'm more than happy to give it a shot.

@oivoodoo

This comment has been minimized.

Copy link
Contributor

oivoodoo commented May 12, 2018

@georgiemathews

This comment has been minimized.

Copy link

georgiemathews commented May 13, 2018

Implemented! You can check the status here: matrix-org/matrix-react-sdk#1893

@BloodyIron

This comment has been minimized.

Copy link

BloodyIron commented May 14, 2018

@georgiemathews awesome! :D

@georgiemathews

This comment has been minimized.

Copy link

georgiemathews commented May 14, 2018

@BloodyIron , you're better of tracking the progress already made here: matrix-org/matrix-react-sdk#1689 by @oivoodoo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment