all.js

var DATASTORES = [
    "PostgreSQL",
    "MySQL",
    "MariaDB",
    "MongoDB",
    "RethinkDB",
    "Elasticsearch",
    "Redis",
    "Cassandra",
    "CouchDB"
];

var LANGUAGES = [
    "Python",
    "Ruby",
    "Java",
    "Javascript",
    "Clojure",
    "Scala",
    "Go",
    "Rust",
    "Erlang",
    "Elixir",
    "Groovy",
    "Haskell",
    "PHP",
    "Lua",
    "Perl",
    "Racket"
];

var URLS = {
    // Datastores
    "PostgreSQL": "http://www.postgresql.org/",
    "MySQL": "https://www.mysql.com/",
    "MariaDB": "https://mariadb.org/",
    "MongoDB": "https://www.mongodb.org/",
    "RethinkDB": "http://rethinkdb.com/",
    "Elasticsearch": "https://www.elastic.co/products/elasticsearch",
    "Redis": "http://redis.io/",
    "Cassandra": "https://cassandra.apache.org/",
    "CouchDB": "https://couchdb.apache.org/",

    // Languages
    "Python": "https://www.python.org/",
    "Ruby": "https://www.ruby-lang.org/en/",
    "Java": "https://www.java.com/en/",
    "Javascript": "https://developer.mozilla.org/en-US/docs/Web/JavaScript",
    "Clojure": "http://clojure.org/",
    "Scala": "http://www.scala-lang.org/",
    "Go": "https://golang.org/",
    "Rust": "https://www.rust-lang.org/",
    "Erlang": "http://www.erlang.org/",
    "Elixir": "http://elixir-lang.org/",
    "Groovy": "http://www.groovy-lang.org/",
    "Haskell": "https://www.haskell.org/",
    "PHP": "http://php.net/",
    "Lua": "http://www.lua.org/",
    "Perl": "https://www.perl.org/",
    "Racket": "http://racket-lang.org/",

    // Frameworks
    "Mangoo": "https://mangoo.io/",

    "Rails": "http://rubyonrails.org/",
    "Grape": "http://www.ruby-grape.org/",
    "Padrino": "http://padrinorb.com/",
    "Rack": "http://rack.github.io/",
    "Sinatra": "http://www.sinatrarb.com/",

    "Bottle": "http://bottlepy.org/docs/dev/index.html",
    "CherryPy": "http://cherrypy.org/",
    "Django": "https://www.djangoproject.com/",
    "Flask": "http://flask.pocoo.org/",
    "Pyramid": "http://www.pylonsproject.org/",
    "Tornado": "http://www.tornadoweb.org/en/stable/",
    "TurboGears": "http://turbogears.org/",
    "Klein": "https://github.com/twisted/klein",
    "Web2Py": "http://web2py.com/",
    "Falcon": "http://falconframework.org/",

    "Activeweb": "http://javalite.io/activeweb",
    "BeyondJ": "http://beyondj.com/dist/docs/index.html",
    "Comsat": "http://docs.paralleluniverse.co/comsat/",
    "Dropwizard": "http://www.dropwizard.io/0.9.2/docs/",
    "Gemini": "http://www.eclipse.org/gemini/",
    "Grizzly": "https://grizzly.java.net/",
    "Jooby": "http://jooby.org/",
    "Mangoo": "https://mangoo.io/",
    "Ninja": "http://www.ninjaframework.org/",
    "OfficeFloor": "http://officefloor.net/",
    "Play": "https://playframework.com/",
    "Rapidoid": "http://www.rapidoid.org/",
    "RestExpress": "https://github.com/RestExpress/RestExpress",
    "Sabina": "http://there4.co/sabina/",
    "Spark": "http://sparkjava.com/",
    "Spring": "https://spring.io/",
    "Tapestry": "https://tapestry.apache.org/",
    "Undertow": "http://undertow.io/",
    "VertX": "http://vertx.io/",
    "Wicket": "https://wicket.apache.org/",

    "Jooby": "http://jooby.org/",
    "Express": "http://expressjs.com/",
    "Hapi": "http://hapijs.com/",
    "Koa": "http://koajs.com/",
    "Node": "https://nodejs.org/en/",
    "Sails": "http://sailsjs.org/",

    "Ring": "https://github.com/ring-clojure/ring",
    "Compojure": "https://github.com/weavejester/compojure",
    "Aleph": "https://github.com/ztellman/aleph",
    "Pedestal": "https://github.com/pedestal/pedestal",
    "Luminus": "http://www.luminusweb.net/",

    "Duda": "http://duda.io/",
    "Haywire": "https://github.com/haywire/haywire",
    "LWAN": "https://lwan.ws/",
    "Onion": "http://www.coralbits.com/libonion/",

    "Play": "https://playframework.com/",
    "Akka": "http://doc.akka.io/docs/akka/2.4.2/scala/http/introduction.html",
    "Colossus": "http://tumblr.github.io/colossus/",
    "Finch": "https://gitter.im/finagle/finch",
    "Finagle": "https://github.com/twitter/finagle",
    "Scalatra": "http://scalatra.org/",
    "Scruffy": "https://github.com/sksamuel/scruffy",
    "Spray": "http://spray.io/",
    "Unfiltered": "http://unfiltered.databinder.net/Unfiltered.html",

    "Beego": "http://beego.me/docs/intro/",
    "Echo": "https://github.com/labstack/echo",
    "FastHTTP": "https://github.com/valyala/fasthttp",
    "Falcore": "http://fitstar.github.io/falcore/",
    "Gin": "https://gin-gonic.github.io/gin/",
    "Goji": "https://github.com/zenazn/goji",
    "Revel": "https://revel.github.io/",
    "Web.Go": "http://webgo.io/",

    "Hyper": "http://hyper.rs/hyper/hyper/index.html",
    "Iron": "http://ironframework.io/",
    "Nickel": "http://nickel.rs/",

    "Chicago Boss": "http://chicagoboss.org/",
    "Elli": "https://github.com/knutin/elli",
    "MochiWeb": "https://github.com/mochi/mochiweb",
    "Misultin": "https://github.com/ostinelli/misultin",

    "Cowboy": "https://github.com/ninenines/cowboy",
    "Phoenix": "http://www.phoenixframework.org/",

    "Grails": "https://grails.org/",

    "Snap": "http://snapframework.com/",
    "Yesod": "http://www.yesodweb.com/",
    "Wai": "https://github.com/yesodweb/wai",

    "Laravel": "https://laravel.com/",
    "Slim": "http://www.slimframework.com/",
    "Symfony": "https://symfony.com/",
    "Cake": "http://cakephp.org/",
    "Fuel": "http://fuelphp.com/",
    "Cygnite": "http://www.cygniteframework.com/",
    "Kohana": "http://kohanaframework.org/",
    "Limonade": "https://limonade-php.github.io/",
    "Lithium": "http://li3.me/",
    "Phalcon": "https://phalconphp.com/en/",
    "PHPixie": "https://phpixie.com/",
    "Phreeze": "http://www.phreeze.com/",
    "Pimf": "http://gjerokrsteski.github.io/pimf-framework/",
    "Silex": "http://silex.sensiolabs.org/",
    "Lumen": "https://lumen.laravel.com/",
    "Yaf": "http://php.net/manual/en/book.yaf.php",
    "Zend Framework": "http://framework.zend.com/",

    "Lapis": "http://leafo.net/lapis/",
    "OpenResty": "http://openresty.org/",

    "Racket-WS": "https://docs.racket-lang.org/web-server/"
};

var FRAMEWORKS_BY_LANGUAGE = {
    "Ruby": [
        "Rails",
        "Sinatra",
        "Rack",
        "Padrino",
        "Grape"
    ],

    "Python": [
        "Bottle",
        "CherryPy",
        "Django",
        "Flask",
        "Pyramid",
        "Tornado",
        "TurboGears",
        "Klein",
        "Web2Py",
        "Falcon"
    ],

    "Java": [
        "Activeweb",
        "BeyondJ",
        "Comsat",
        "Dropwizard",
        "Gemini",
        "Grizzly",
        "Jooby",
        "Mangoo",
        "Ninja",
        "OfficeFloor",
        "Play",
        "Rapidoid",
        "RestExpress",
        "Sabina",
        "Spark",
        "Spring",
        "Tapestry",
        "Undertow",
        "VertX",
        "Wicket"
    ],

    "Javascript": [
        "Jooby",
        "Express",
        "Hapi",
        "Koa",
        "Node",
        "Sails"
    ],

    "Clojure": [
        "Ring",
        "Compojure",
        "Aleph",
        "Pedestal",
        "Luminus"
    ],

    "C": [
        "Duda",
        "Haywire",
        "LWAN",
        "Onion"
    ],

    "Scala": [
        "Play",
        "Akka",
        "Colossus",
        "Finch",
        "Finagle",
        "Scalatra",
        "Scruffy",
        "Spray",
        "Unfiltered"
    ],
    "Go": [
        "Beego",
        "Echo",
        "FastHTTP",
        "Falcore",
        "Gin",
        "Goji",
        "Revel",
        "Web.Go"

    ],

    "Rust": [
        "Hyper",
        "Iron",
        "Nickel"
    ],

    "Erlang": [
        "Chicago Boss",
        "Elli",
        "MochiWeb",
        "Misultin",
    ],

    "Elixir": [
        "Cowboy",
        "Phoenix"
    ],

    "Groovy": [
        "Grails"
    ],

    "Haskell": [
        "Snap",
        "Yesod",
        "Wai"
    ],

    "PHP": [
        "Laravel",
        "Slim",
        "Symfony",
        "Cake",
        "Fuel",
        "Cygnite",
        "Kohana",
        "Limonade",
        "Lithium",
        "Phalcon",
        "PHPixie",
        "Phreeze",
        "Pimf",
        "Silex",
        "Lumen",
        "Yaf",
        "Zend Framework"
    ],

    "Lua": [
        "Lapis",
        "OpenResty"
    ],

    "Racket": [
        "Racket-WS"
    ]
}

var Select = React.createClass({
  updateValue: function(e){
    this.props.onChange(e);
  },
  render: function(){
    var opts = [];
    for(var ii=0; ii<this.props.options.length; ii++){
      opts[ii] = React.createElement(
        "option",
        {value: this.props.options[ii]},
        this.props.options[ii]
      );
    }
    return React.createElement(
      "select",
      {
          value: this.props.value,
          onChange: this.props.onChange
      },
      opts
    );
  }
});

var VOWELS = "aeiouyAEIOUY";

var isVowel = function(s){
    return VOWELS.indexOf(s) > -1;
};

var pickRandom = function(coll){
    return coll[Math.floor(Math.random() * coll.length)];
};

var generateRandomState = function(){
    language = pickRandom(LANGUAGES);
    return {
        datastore: pickRandom(DATASTORES),
        language: language,
        framework: pickRandom(FRAMEWORKS_BY_LANGUAGE[language])
    }

}


var Links = React.createClass({
    render: function(){
        var links = [];
        for(var ii=0; ii<this.props.components.length; ii++){
            links[ii] = React.DOM.li({},
                React.DOM.a({href: URLS[this.props.components[ii]]},
                    this.props.components[ii]));
        }
        return React.DOM.ul({className: "links"}, links);
    }
});

var InitialDisplay = React.createClass({
    render: function(){
        var d = this.props.datastore[0],
            l = this.props.language[0],
            f = this.props.framework[0],
            comps = [this.props.datastore, this.props.language, this.props.framework],
            initials = [d, l, f];
            spans = [];

        if(isVowel(d)){
            comps = [this.props.language, this.props.datastore, this.props.framework];
            initials = [l, d, f];
        }else if(isVowel(f)){
            comps = [this.props.datastore, this.props.framework, this.props.language];
            initials = [d, f, l];
        }

        for(var ii=0; ii<initials.length; ii++){
            spans[ii] = React.createElement("span", {key: ii}, initials[ii]);
        }

        return React.DOM.div({},
            React.DOM.h2({},
                "Try the ",
                React.DOM.span({className: "initials"}, spans),
                " stack"
            ),
            React.DOM.section({className: "featuring"},
                "Featuring: ",
                React.createElement(Links, {components: comps}),
                React.DOM.p({}, "Get on the trolley and start writing web applications like it's " + (new Date().getYear() + 1900).toString() + " already!")
            )
        );
    }
});

var App = React.createClass({
    getInitialState: function(){
        return generateRandomState();
    },
    setLanguage: function(e){
        this.setState({
            language: e.target.value,
            framework: pickRandom(FRAMEWORKS_BY_LANGUAGE[e.target.value])
        })
    },
    setDatastore: function(e){ this.setState({datastore: e.target.value}); },
    setFramework: function(e){ this.setState({framework: e.target.value}); },
    randomize: function(){
        this.setState(generateRandomState());
    },
    render: function(){
        var frameworkOptions = FRAMEWORKS_BY_LANGUAGE[this.state.language];
        var langSelect = React.createElement(
            Select,
            {
                options: LANGUAGES,
                value: this.state.language,
                onChange: this.setLanguage
            }
        );
        return React.DOM.div({},
            React.createElement(InitialDisplay, {
                datastore: this.state.datastore,
                language: this.state.language,
                framework: this.state.framework
            }),
            React.DOM.hr(),
            React.DOM.div({className: "selects"},
                React.createElement(Select, {
                    options: DATASTORES,
                    value: this.state.datastore,
                    onChange: this.setDatastore
                }),
                langSelect,
                React.createElement(Select, {
                    value: this.state.framework,
                    options: frameworkOptions,
                    onChange: this.setFramework
                }),
                " or, ",
                React.DOM.a({onClick: this.randomize, href: "#"},
                    "generate a new random stack"
                )
            )
        );
    }
});

ReactDOM.render(
  React.createElement(App),
  document.getElementById("app")
);