JSFiddle - React, Tailwind, and code Playground

by Seokjun Hong

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.4/require.min.js"></script>
<body>
  <div id="test">
    eeeeeee
  </div>
</body>

JavaScript

requirejs.config({
  paths: {
    'd3': 'https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.12/d3.min'
  },
  shim: {
    'd3': {
      exports: 'd3'
    }
  }
});

var a = require(['d3'], function() {
  "use strict";

  var REG_MARKER_END = 'url(#triangle)',
    MERGE_MARKER_END = 'url(#brown-triangle)',
    FADED_MARKER_END = 'url(#faded-triangle)',

    preventOverlap,
    applyBranchlessClass,
    cx, cy, fixCirclePosition,
    px1, py1, fixPointerStartPosition,
    px2, py2, fixPointerEndPosition,
    fixIdPosition, tagY;

  /**
   * @class HistoryView
   * @constructor
   */
  function HistoryView(config) {
    var commitData = config.commitData || [],
      commit;

    for (var i = 0; i < commitData.length; i++) {
      commit = commitData[i];
      !commit.parent && (commit.parent = 'initial');
      !commit.tags && (commit.tags = []);
    }

    this.name = config.name || 'UnnamedHistoryView';
    this.commitData = commitData;

    this.branches = [];
    this.currentBranch = config.currentBranch || 'master';

    this.width = config.width;
    this.height = config.height || 400;
    this.orginalBaseLine = config.baseLine;
    this.baseLine = this.height * (config.baseLine || 0.6);

    this.commitRadius = config.commitRadius || 20;
    this.pointerMargin = this.commitRadius * 1.3;

    this.isRemote = typeof config.remoteName === 'string';
    this.remoteName = config.remoteName;

    this.initialCommit = {
      id: 'initial',
      parent: null,
      cx: -(this.commitRadius * 2),
      cy: this.baseLine
    };
  }

  HistoryView.generateId = function() {
    return Math.floor((1 + Math.random()) * 0x10000000).toString(16).substring(1);
  };

  HistoryView.prototype = {
    /**
     * @method getCommit
     * @param ref {String} the id or a tag name that refers to the commit
     * @return {Object} the commit datum object
     */
    getCommit: function getCommit(ref) {
      var commitData = this.commitData,
        headMatcher = /HEAD(\^+)/.exec(ref),
 ...