RamdaSearch.user.js

// ==UserScript==
// @name         Ramda filter
// @namespace    http://jethrolarson.github.io
// @version      0.1
// @description  Alternative search for ramda docs
// @author       Jethro Larson
// @match        http://ramdajs.com/*/docs/
// @grant        none
// ==/UserScript==

var bar = document.querySelector('.navbar-nav');

var methods = document.querySelectorAll('.card');
var container = document.querySelector('main');

var matches = R.curry(function(search, str){
    return str.indexOf(search) >= 0;
});

var cssQuery = R.curry(function(selector, el){
    return el.querySelectorAll(selector);
});

var setStyle = R.curry(function(key, val, el){
    el.style[key] = val;
    return el;
});

//return closest parent element that has the classname
//:: Element, str -> Element
var closest = R.curry(function(className, el){
    var p = el;
    while ( (p = p.parentNode) ) {
        if (p.classList && p.classList.contains(className)) {
            return p;
        }
    }
    return undefined;
});

//Rough copy from underscore.js
var debounce = R.curry(function(wait, func) {
    var timeout, args, context, timestamp, result;
    var later = function() {
      var last = Date.now() - timestamp;

      if (last < wait && last >= 0) {
        timeout = setTimeout(later, wait - last);
      } else {
        timeout = null;
        result = func.apply(context, args);
        if (!timeout) context = args = null;
      }
    };
    return function() {
      context = this;
      args = arguments;
      timestamp = Date.now();
      if (!timeout) timeout = setTimeout(later, wait);
      return result;
    };
});

//Ramda aint gonna change while the page is loaded so we can cache.
var searchIndex = R.pipe(
    cssQuery('.card'),
    R.map(function(card){
        return {
            kw: R.pipe(
                cssQuery('.sig, a.name, .label-category'),
                R.map(R.pipe(
                    R.prop('innerText'),
                    R.replace(/\u2192/, '->'),
                    R.toLower
                ))
            )(card), 
            el: card
        };
    })
)(container);

//:: str -> [Element]
var getMatchingCards = function(query){
    return R.pipe(
        R.filter(R.pipe(R.prop('kw'), R.any(matches(query)))),
        R.map(R.prop('el'))
    )(searchIndex);
};

//search input change event handler
//:: Event -> undefined
var change = debounce(200, function(e){
    //hide all cards
    R.forEach(setStyle('display', 'none'), methods);
    //show matching cards
    R.forEach(setStyle('display', 'block'), getMatchingCards(R.toLower(this.value)));
    container.scrollTop = 0;
});


var searchInput = document.createElement('input');
searchInput.type = 'text';
searchInput.placeholder = 'filter';
searchInput.className = "form-control";
var li = document.createElement('li');
li.appendChild(searchInput);
li.style.margin = '8px';
bar.appendChild(li);
searchInput.addEventListener('change', change);
searchInput.addEventListener('input', change);//support copy/paste/autocomplete