JSFiddle - React, Tailwind, and code Playground

by ifandelse

HTML

<script src="http://underscorejs.org/underscore.js"></script>
<script src="https://raw.github.com/postaljs/postal.js/master/lib/postal.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<script src="https://raw.github.com/a2labs/riveter/master/lib/riveter.js"></script>

JavaScript

/*
  backbrace
  © 2012 - Copyright appendTo, LLC
  Author(s): Jim Cowart, Doug Neiner
  License: Dual licensed MIT (http://opensource.org/licenses/MIT) & GPL (http://opensource.org/licenses/GPL-2.0)
  Version 0.0.1
 */
(function ( root, factory ) {
  if ( typeof module === "object" && module.exports ) {
    // Node, or CommonJS-Like environments
    module.exports = function(_, Backbone, riveter, postal) {
      return factory( _, Backbone, riveter, postal );
    }
  } else if ( typeof define === "function" && define.amd ) {
    // AMD. Register as an anonymous module.
    define( ["underscore", "backbone", "riveter", "postal"], function ( _, backbone, riveter, postal ) {
      return factory( _, backbone, riveter, postal, root );
    } );
  } else {
    // Browser globals
    root.backbrace = factory( root._, root.Backbone, root.riveter, root.postal, root );
  }
}( this, function ( _, Backbone, riveter, postal, root, undefined ) {

  var backbrace = root.backbrace || {};

  var TAG_REGEX = /^<([a-z][a-z0-9]*)[^>]*>(.*?)<\/\1>$/i;
  backbrace.View = Backbone.View.extend( {
    // DOM manipulation should be limited to the scope of the view
    // So let's remove the need for global jQuery/$ access
    $ : function ( selector ) {
      if ( _.isObject( selector ) || TAG_REGEX.test( selector ) ) {
        return $( selector );
      }
      return this.$el.find( selector );
    },
  
    // Similar idea to what backbone.marionette does, but tweaked.
    // This provides base "toJSON()" behavior for any view to call
    // for default-approach binding of model data to template, etc.
    dataToJSON : function () {
      var data = {};
      if ( this.model ) {
        data = this.model.toJSON();
      }
      if ( this.collection ) {
        _.extend(data, { items : this.collection.toJSON() });
      }
      return data;
    }
  });
  // currently just assigning as placeholder for later extensions
  backbrace.Model = Backbone.Model;
  var messagingMixin =...