My markup:
<section id="drop-target">
Drop file here...
</section>
My code:
var dropTarget = document.getElementById('drop-target');
Rx.Observable.fromEvent(dropTarget, 'dragover').subscribe(function(event) {
event.preventDefault();
});
var dropStream = Rx.Observable.fromEvent(dropTarget, 'drop');
dropStream.subscribe(function(event) {
console.log('This will be called.');
event.preventDefault();
});
dropStream.map(function(event) {
console.log('This will not be called.');
return event.dataTransfer.files[0].path;
});
Any ideas how my last map
callback can be called? I need both preventDefault
s for drop
and dragover
to prevent the browser from opening the file.
You just need to subscribe to your map
stream. All map
does is create a new observable that will run the map
operation on the stream. But you still need to subscribe to make it do something:
dropStream
.map(function (event) {
console.log("hello");
return event.dataTransfer.files[0].path;
})
.subscribe(function (path) {
console.log("path=" + path);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With