JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="calendar" style="margin: 10px">
    <calendar compile></calendar>
</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Open+Sans' rel='stylesheet' type='text/css'><link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script><script src="//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script> <style> .html, body {
    background-color: #000;
    font-family:"Open Sans", sans-serif;
}
.calendar-table {
    display: table;
    position: relative;
    width: 100%;
}
.calendar-table-row {
    display: table-row;
}
.calendar-table-cell {
    display: table-cell;
}
.calendar-transition-container-table {
    overflow: hidden;
}
.calendar-transition-table {
    width: 200% !important;
}
.calendar-transition-table-cell {
    width: 50% !important;
}
.calendar-caption {
    font-size: 48px;
    color: #fff;
    cursor: hand;
    cursor: pointer;
}
.calendar-button {
    opacity: 0.25;
    -webkit-transition: opacity .25s ease-in;
    -moz-transition: opacity .25s ease-in;
    -o-transition: opacity .25s ease-in;
    -ms-transition: opacity .25s ease-in;
    transition: opacity .25s ease-in;
    border: 0px;
    width: 48px;
    height: 48px;
    background-repeat:no-repeat;
    background-color: transparent;
    margin: 10px;
}
.calendar-button:hover {
    opacity: 1;
}
.calendar-button-swapleft {
    background-image:url("http://www.upload.ee/image/3367179/Swap_Left.png");
}
.calendar-button-swapright {
    background-image:url("http://www.upload.ee/image/3367197/Swap_Right.png");
}
.calendar-ruler-caption {
    font-size: 18px;
    color: rgb(151, 151, 151);
}
.calendar-tile {
    background-color: rgb(0, 0, 0);
    -webkit-transition: background-color .25s linear;
    -moz-transition: background-color .25s linear;
    -o-transition: background-color .25s linear;
    -ms-transition: background-color .25s linear;
 ...

JavaScript

if (typeof (Sdk) === "undefined") {
    var Sdk = {};
}

angular.module("calendarServices", ["ng"]).
factory("Calendar", function ($rootScope) {
    $rootScope.$calendarScope = {};
    var factory = function () {
        var _pane = 0;
        var _today = new Date();
        var _date = new Date();
        var _getMonth = function (target, date) {
            target.empty();
            var daysOfPreviousMonth = [];
            var daysOfMonth = [];
            var daysOfNextMonth = [];
            var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
            var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
            var diffMs = lastDay - firstDay;
            var diffDays = Math.round(diffMs / 86400000);
            daysOfMonth[firstDay.getDay()] = firstDay;
            var lastDayOfPreviousMonth = new Date(date.getFullYear(), date.getMonth(), 0);
            var cnt = firstDay.getDay();
            if (firstDay.getDay() > 0) {
                for (var i = 0; i < firstDay.getDay(); i++) {
                    var dayBefore = new Date(lastDayOfPreviousMonth);
                    dayBefore.setDate(dayBefore.getDate() - (--cnt));
                    daysOfMonth[i] = dayBefore;
                    daysOfPreviousMonth.push(dayBefore);
                }
            }
            cnt = 0;
            for (var i = firstDay.getDay(); i < (lastDay.getDate() + firstDay.getDay()); i++) {
                var dayAfter = new Date(lastDayOfPreviousMonth);
                dayAfter.setDate(dayAfter.getDate() + (++cnt));
                daysOfMonth[i] = dayAfter;
            }
            cnt = 0;
            for (var i = (lastDay.getDate() + firstDay.getDay()); i < 42; i++) {
                var firstDayOfNextMonth = new Date(date.getFullYear(), date.getMonth() + 1, 1);
                firstDayOfNextMonth.setDate(firstDayOfNextMonth.getDate() + (cnt++));
                daysOfMonth[i] = firstDayOfNextMonth;
               ...