JSFiddle - React, Tailwind, and code Playground

by ifandelse

HTML

<script src="https://rawgithub.com/postaljs/postal.js/master/lib/postal.js"></script>
<script src="https://rawgithub.com/postaljs/postal.js/master/ext/jquery.js"></script>

JavaScript

var jonathan = (function() {
    var xboxChannel = postal.channel("xbox");
    var reactions = {
        newgame: function(data, env) {
            return "I hope this goes better than the last one did!";
        },
        newmedal: function(data, env) {
            return "Nice, a new medal - about time!";
        },
        lostgame: function(data, env) {
            return "Ouch, you got pwned!";  
        },
        wongame: function(data, env) {
            return "Stroke of luck, perhaps?";
        }
    }
    var module = {
        handleMessage: function(data, env) {
            if(reactions[env.topic]) {
                this.makeComment(reactions[env.topic](data, env));    
            }
        },
        makeComment: function(msg) {
            $('body').append("<div>" + msg + "</div>");
        }
    };
    
    xboxChannel
        .subscribe("#", module.handleMessage)
        .withContext(module);
    
    return module;
}());

var chan = postal.channel("xbox");
chan.publish("newgame");
chan.publish("lostgame");
chan.publish("newgame");
chan.publish("newmedal");
chan.publish("wongame");