Untitled

<html>
    <head>
        <title>Time Check</title>


        <link rel="stylesheet" type="text/css" href="./css/default.css"/>

        <script src='./js/mootools-1.2.4-core.js' type='text/javascript'></script>
        <script src='./js/mootools-1.2.4.2-more.js' type='text/javascript'></script>

        <script type='text/javascript'>

            var TimeCheckUi = {
                init: function() {
                    this.interval_ms = 500;
                    this.count = 0;
                    this.start_time = new Date().getTime();

                    $('tc-start').innerHTML = new Date().format('db');
                    $('tc-interval').innerHTML = this.interval_ms + ' ms interval';

                    setInterval("TimeCheckUi.updateTimes();", this.interval_ms);
                },

                updateTimes: function() {
                    this.count++;
                    var cur_time = new Date().getTime();

                    var real_ms = cur_time - this.start_time;
                    var count_ms = this.count * this.interval_ms;
                    var error_pct = this.getError(cur_time - this.start_time, this.count * this.interval_ms) * 100;

                    $('tc-t-error').innerHTML = error_pct.toFixed(3) + ' %';
                },

                getError: function(real_ms, count_ms) {
                    return error = Math.abs(count_ms - real_ms) / real_ms;
                }
            }

        </script>
    </head>

    <body onload='TimeCheckUi.init();'>

        <div style='width: 256px; margin: 128px auto;'>
            <div id='tc-t-error' style='font-size: 32pt; text-align: left;'>.</div>

            <div style='font-size: 9pt; color: gray'>
                <div id='tc-start' >-</div>
                <div id='tc-interval'>-</div>
            </div>
        </div>

    </body>
</html>