RxJS Futurice Frontend Weeklies 2013-04-12

RxJS-freaklies_20130412.js

/*
 * Sample 1
 *
 * Fire up a content fetching request right away when still loading page,
 * to reduce total loading time. But only render after document.ready
 */

// Setup inputs

var dynamicContentStr = $.getAsObservable('/dynamic-content')
var documentReadyStr = $(document).readyAsObservable()


// Setup stateless streams, alternative 1: map into stream and switch

var dynamicContentAfterReadyStr = documentReadyStr
  .map(always(dynamicContentStr))
  .switchLatest() // Bacon.js equivalent: flatMapLatest


// Setup stateless streams, alternative 2: zip as a "barrier"

var dynamicContentAfterReadyStr = documentReadyStr
  .zip(dynamicContentStr)
  .select(pickNthElement(1)) // synonym: map


// Get Stateful!

dynamicContentAfterReadyStr.subscribe(populateContent)


// Functional helpers

function always(x) {
  return function() {
    return x
  }
}
function pickNthElement(n) {
  return function(value) {
    return value[n]
  }
}

// State manipulation helpers

function populateCountries(response) {
  $('.content').append(response.data.map(createContentItem))
}
function createContentItem(itemData) {
  return // something nice
}
function log(x) {
  console.log(x)
}