Bacon buffer with interval

by puneetsiet

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/bacon.js/0.7.38/Bacon.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bacon.js/0.7.88/Bacon.min.js"></script>
<button id="flush">Flush</button>
<button id="clickme">Click me</button>
<button id="enable" class="enable">enable</button>
<button id="disable" class="disable">disable</button>
<div id="log">
  <input type="text">
</div>

CSS

.disable {
  color:grey
}
.enable {
  color:blue
}

JavaScript

Bacon.fromEvent(document.querySelector('#flush'), 'click')
  .bufferWithTime(5000).log();

/*var blur = $(window).asEventStream('blur').map(function() { return false; }); 
var focus = $(window).asEventStream('focus').map(function() { return true; }); 
var focused = focus.merge(blur).toProperty(true);
focused.onValue(function(x){
console.log('focus:', x)
})*/

var clicked = $("#clickme").asEventStream('click')
clicked.map(function(event){return event.target})
clicked.onValue(function(element){ //console.log(element)
});

clicked.skip(1).take(4).onValue(function(event) { console.log("1: ",event.target) })

clicked
  .filter(function(event) { return event.type == 'click' })
  .onValue(function(event) { console.log("2: ",event.target)});
  
  
var enable = $('#enable').asEventStream('click').map(true)
var disable = $('#disable').asEventStream('click').map(false)
buttonState = enable.merge(disable).toProperty(false);
buttonState.onValue(function(state) {
  $('#button').toggleClass('enable', state)
})