JSFiddle - React, Tailwind, and code Playground

by arooaroo

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>

CSS

svg {background: #d5d5d5}

JavaScript

// Copyright 2016  Jellybooks

// Some useful unicode.
var ballot_box = '☐';
var ballot_box_with_check = '☑';
var ballot_box_with_x = '☒';
var white_circle = '◎'
var radio_button = '◉'
var male = '&#x2642;'
var female = '&#x2640;';

var monthNames = ["January", "February", "March", "April", "May",
		  "June", "July", "August", "September", "October",
		  "November", "December"];
var monthShortNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
		       "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

var kDaysInWeek = 7;
var kSecondsInDay = 60 * 60 * 24;
var kMillisecondsInDay = kSecondsInDay * 1000;

// Set up an svg element for us.  Return it.
//
// Selector is a css name or class, such as "body" or ".plot_goes_here".
var setup_svg = function(data, selector, width, height, margin) {
    canvas = d3.select(selector)
	.append("svg")
	.attr({"width": width,
	       "height": height,
	       "class": "d3-canvas",
	      });
    inside = canvas.append("g")
	.attr({"transform": "translate(" + margin.left + "," + margin.top + ")"
	      })
    return inside;
}

// Debug logging function.
var log_it = function(label, the_value) {
    console.log(label, the_value);
    return the_value;
}

// Return an array of weekend dates in the range from date1 to date2
// inclusive.  If third argument as_string is true, then return the
// array as a set of strings in YYYY-MM-DD format.  Otherwise, return
// an array of dates.
var compute_weekends_in_range = function (date1, date2, as_string) {
    as_string = typeof as_string !== 'undefined' ? as_string : false;
    if (date1 > date2)
	return [];
    var date  = new Date(date1.getTime());
    var dates = [];

    var end_date = new Date(date2);
    end_date.setHours(12);	// Use mid-day so that daylight
				// savings time shifts don't throw the
				// count.
    while (date < end_date) {
        if (date.getDay() === 0 || date.getDay() === 6)
	    dates.push(new Date(date));
        date.setDate( date.getDate() + 1 );
    }
    if...