How bad do you type?

by dandoyon

HTML

<script src="http://code.angularjs.org/angular-0.9.19.js" ng:autobind></script>
<script>
    function TypingCtrl() {
        var scope = this;
        scope.stackedDivs = [ {'kls' : 'classB'}, {'kls' : 'classB'}, {'kls' : 'classB'} ];
        scope.lastSelectedDiv = -1;
        scope.setSelected = function(idx) {
            if(scope.lastSelectedDiv != -1) {
                scope.stackedDivs[scope.lastSelectedDiv].kls = 'classB';
            }
            scope.lastSelectedDiv = idx;
            scope.stackedDivs[idx].kls = 'classA';
        };
}
</script>
<div ng:controller="DivCtrl">
    <div>{{source}}</div>
    <textarea>{{input}}</textarea>
    <div>{{corrected}}</div>
    <div>{{uncorrected}}</div>
</div>

CSS

body { font-family: Arial,Helvetica,sans-serif; }
body, td, th { font-size: 14px; margin: 0; }
table { border-collapse: separate; border-spacing: 2px; display: table; margin-bottom: 0; margin-top: 0; -moz-box-sizing: border-box; text-indent: 0; }
a:link, a:visited, a:hover { color: #5D6DB6; text-decoration: none; }

div.stacked {
    text-align: center;
    border: 1px solid black;
    cursor:pointer;
    width:  50px;
    height: 50px;
    margin: auto;
}
div.classA {
     background-color: #063;   
}
div.classB {
    background-color: white;
}