JSFiddle - React, Tailwind, and code Playground

by damyanpetev

HTML

<script src="http://igniteui.com/js/modernizr.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>

<h3>Register your ultimate</h3>
	<div id="maskEditor"></div>
	<div id="log" style="height:400px; background-color:#e3e3e3; overflow-y: scroll;"></div>

CSS

h3 {
            font-size:20px;
            margin-bottom:20px;
        }
        .group-fields {
            margin-bottom: 10px;
        }
        .group-fields label {
            display: block;
            line-height:18px;
        }
        .group-fields .inline {
            display:inline;
        }
        .group-fields .ui-igcheckbox-normal {
            margin-right: 5px;
            float: left;
        }
        .group-fields .ui-igedit-container {
            width: 250px;
        }
        @media screen and (min-width:360px) {
            .group-fields .ui-igedit-container {
                width: 300px;
            }
        }

JavaScript

$(function () {
$(document).ready(function () {
 var errorCounter = 0;
		window.onerror = function (errorMsg, url, lineNumber, column, errorObj) {
			$("#log").prepend('<p>' + ++errorCounter + '. Error: ' + errorMsg + ' Script: ' + url + ' Line: ' + lineNumber
			+ ' Column: ' + column + ' StackTrace: ' +  errorObj);
		}
		$(document).ready(function () {
			$('#maskEditor').igTextEditor({
				listItems: [1, 2, 3, 4],
			}).bind("igtexteditortextchanged", function (event, args) {
				log("igtexteditortextchanged " + args.text);
			});
		});
		function log(msg) {
			$("#log").prepend("<p>" + msg + "</p>");
		}
        });
});