"Test touchtype": efforts of minimisation from a newbies perspective Options Rating

[xcislav]

I wouldn't tell you how lanotherTK (a ~5k program, btw not mine) became a tiny-cut ~450 symbol easy-to-understand script lanother.tk/ccc.php - because lots of time and evolution (including naming).

To treasure our precious "brevity is the soul of wit" I'd like to introduce to you the next stumbling block on the way to a clean "speedcheck [module]".

CODE

<textarea id="tb"></textarea>
<p id="pr" />
<input onclick="clc();" />
<script>
    function initpr() {
        bx = document.getElementById('tb');
        bx.onkeypress = function () {
            ts = te = new Date();
            bx.onkeypress = function (en) {
                te = new Date();
            }
        }
    }
    function clc() {
        deltams = te.getTime() - ts.getTime();
        chars = bx.value.length;
        document.getElementById('pr').innerHTML = chars + " chars (in " + deltams + " ms): " + chars / deltams + " cpms";
        initpr();
    }
    initpr();
</script>

Where initpr() is used after a page load and secondly when the second function clc() is invoked. Thus we've got a suprlus. Why do we have to repeat the whole amount of code?
And I decided just to insert the whole text instead of initpr functions:

CODE

<textarea id="tb"></textarea>
<p id="pr" />
<input onclick="clc();" />
<script>
function clc() {
deltams = te.getTime() - ts.getTime();
chars = bx.value.length;
document.getElementById('pr').innerHTML = chars+" chars (in "+deltams+" ms): "+chars/deltams+" cpms";
bx = document.getElementById('tb');
bx.onkeypress = function () {
ts = te = new Date();
bx.onkeypress = function (en) {
te = new Date();
}
bx = document.getElementById('tb');
bx.onkeypress = function () {
ts = te = new Date();
bx.onkeypress = function (en) {
te = new Date();
}
</script>

As you might have guessed it doesn't work. I'm lost in conjectures. The silent transfer of parameters (though there're none) that's common to function() is the uttermost rationale to me.

I inserted codeblock in the end of clc() and after it (in the end of program).

I do understand how the clc() work. The whole logic of the program is very dark to me. That's why I wish I could rewrite this small piece with if or with cycles.

At this point I can't squeeze/divide my program anymore nor recompose it as I cut out the same come after decomposition of larger parts. And I need your professional help in explanation, variants and I beg you less code (as I ate this elephant during a week).

-------
Additional thoughts.
1). initpr(): 2 function, 2 onkeypress, 2 new Date() - and, basically, inner cycles (structures).
2). When I press a mouse inside a <input onclick="clc();" /> - clc() triggers <p id="pr" /> -to-bottom-substitution (which by itself is very nice).

CODE

<textarea id="tb"></textarea>
<p id="pr" />
<input onclick="clc();" />

Though I'd wish to eliminate 1 or 2 lines. Is it possible to write results inside <input > after mouse click or even more to write to the bottom of <textarea>'s block thos "chars,ms,cpms".. with the same id?

I'm thinking its within possibility because how nice it substitutes <input> with <p>'s results!

This post has been edited by xcislav: Apr 3 2014, 11:56 AM

[Christian J]

I beg you less code

Not sure I understood correctly, but this is the shortest I can do:

CODE

<textarea cols="30" rows="5" id="bx"></textarea>
<input type="button" onclick="clc();" value="clc">
<script>
var state=0;
var bx=document.getElementById('bx');
bx.onkeypress=function()
{
    state==0 ? ts=new Date() : te=new Date();
    state=1;
}
function clc()
{
    deltams = te.getTime() - ts.getTime();
    chars = bx.value.length;
    bx.value += '\n\n'+chars+" chars (in "+deltams+" ms): "+chars/deltams+" cpms";
}
</script>

Even if I combine the two functions into one it still doesn't get any shorter:

CODE

<textarea cols="30" rows="5" id="bx" onkeypress="clc(this);"></textarea>
<input type="button" onclick="clc(0);" value="Run">
<script>
var state=0;
var bx=document.getElementById('bx');
function clc(elem)
{
    state==0 ? ts=new Date() : te=new Date();
    state=1;
    if(elem.id!=="bx")
    {
        deltams = te.getTime() - ts.getTime();
        chars = bx.value.length;
        bx.value += '\n\n'+chars+" chars (in "+deltams+" ms): "+chars/deltams+" cpms";
    }
}
</script>

[xcislav]

THIS works / THIS. doesnt :

CODE

<input onkeypress="t==0?s=new Date():e=new Date();t=1" id="b" onblur="l()"><script>t=0;
function l(){d=e.getTime()-s.getTime();c=b.value.length;b.value+=" c"+c+"ms"+d+" cpms"+c/d}</script>

<input onkeypress="t==0?s=new Date():e=new Date();t=1" onblur="d=e.getTime()-s.getTime();c=this.value.length;this.value+=' c'+c+'ms'+d+' cpms'+c/d';"><script>t=0;</script>

188 ↛ 171

this.value.length;this.value+=' c'+c+'ms'+d+' cpms'+c/d';