Using Bacon.js to disable submit button while deferreds are “pending”

[pdohe...@gmail.com]

This question is cross-posted from StackOverflow[0] since I haven't gotten any traction there and I'm itching to come up with a solution.

I have a form, which has many image urls - the back-end persists url strings and the images are uploaded directly to S3. I'd like to use Bacon.js streams to handle disabling/enabling the form's submit button while uploads are in-progress.

I've tried various approaches (using a stream of streams of Bacon.fromPromises, using a stream of fromPromise-d deferreds and a bus of raw deferreds and trying to manually diff the two) but haven't found a solution that a) works as intended and b) feels like I'm not fighting the library.

This is where things stand, but as noted, the submit button is prematurely re-enabled.

```
function toResultStream(promise) {
return Bacon.fromPromise(promise)
}

var deferreds = $('a').asEventStream('click', function (event) {
event.preventDefault();
var deferred = $.Deferred();

// simulate upload
setTimeout(function () {
deferred.resolve(true);
}, _.random(200, 1600))

setTimeout(function () {
deferred.rejectWith(false);
}, _.random(200, 1600))

return deferred;
});

deferreds.onValue(function () {
$('#submit').attr('disabled', true);
})

// I'd like to be able to scan the deferred stream and assert that all states are not equal to pending, but it appears that stream values are frozen (for good reason...) so that isn't possible.

var ongoingSearch = deferreds
.flatMap(toResultStream)
.mapError(true)
.onValue(function () {
$('#submit').attr('disabled', false);
});
```

Any suggestions would be greatly appreciated.

0: https://stackoverflow.com/questions/31393823/using-bacon-js-to-disable-submit-button-while-deferreds-are-pending