JSFiddle - React, Tailwind, and code Playground

by badge2033

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.js"></script>
<p>Start Typing!</p>
<input type="text" id="textInput"></input>
<ul id="results"></ul>

JavaScript

var searchWikipedia = function (term) {
    return $.ajaxAsObservable({
        url: 'http://en.wikipedia.org/w/api.php',
        data: { action: 'opensearch',
                search: term,
                format: 'json' },
        dataType: 'jsonp'
    }).select( function (results) { return results.data; });
};

var input = $('#textInput')
, keyup = input.keyupAsObservable().select(function(ev) {
        return input.val();
});

var searcher = keyup.select(function (text) {
        return searchWikipedia(text);
    }).switchLatest()
    .where(function (data) {
        return data.length === 2; 
    });

searcher.subscribe(function (data) {                    
    var ul = $('#results')
    , results = data[1];

    ul.empty();
    $.each(results, function (index, value) {
        $('<li>' + value + '</li>').appendTo(ul); 
    });
});