ONO::FW::Edu::Apps::Modules::KeyboardTrainer
package ONO::FW::Edu::Apps::Modules::KeyboardTrainer;
################################################################################
# COPYRIGHT / LICENSE #
################################################################################
#
# This file is part of the ONO Software Project.
#
# Copyright (C) 2022-2026 Jos Kirps and The Joopita Project [ASBL]
# Copyright (C) 2011-2022 Jos Kirps and Joopita Research ASBL
# Copyright (C) 2006-2011 Jos Kirps and The Joopita Project
# Copyright (C) 2001-2006 Jos Kirps and The WobbleWolf Project
#
# This file, as well as many other parts of the ONO Software Project or
# related elements, are FREE SOFTWARE available under the ARTISTIC LICENSE 2.0.
#
# This program is distributed in the hope that it will be useful, but
# WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
#
# For the full license, see /ono/osr/license/LICENSE.txt, or write to
# jos_AT_kirps_DOT_com or contact_AT_joopita_DOT_com.
#
################################################################################
# END OF COPYRIGHT / LICENSE, HERE COMES THE CODE ... #
################################################################################
#: This module is a front end application module wrapper that has been
#: created for the Morzino Project (morzino.com) and that has been released
#: as Open Source software.
#:
#: Note that this is NOT a self-contained application, it is only a wrapper
#: that makes heavy use of the ONO Perl Framework application engine.
use strict;
use Encode;
use ONO::ToolBox::Auth;
use ONO::Lib::Lang::LangKitEdu;
use ONO::FW::Apps::Core;
use ONO::FW::Apps::Core::Graphics;
use ONO::FW::Edu::Apps::ToolBox;
use ONO::FW::User::Init;
sub train {
my (
$self,
$option,
$vars_ref,
$HTTP,
$BASE,
) = @_;
my %vars = %$vars_ref;
my $WEB;
my (
$vpath,
$lang,$domain,$community,
$sec,$min,$hour,$mday,$mon,$year,$wday,$yday,$timestamp,
$script_url,$action_url,$form
) = ONO::FW::User::Init->getvar(\%vars);
ONO::FW::Apps::Core->now("","keyboard_trainer",$vars{'app_lang'});
###################################################################
# TRAINER
###################################################################
my @rchars = (
'A','B','C','D','E', 'F','G','H','I','J',
'K','L','M','N','O', 'P','Q','R','S','T',
'U','V','W','X','Y', 'Z','1','2','3','4',
'A','B','C','D','E', 'F','G','H','I','J',
'K','L','M','N','O', 'P','Q','R','S','T',
'U','V','W','X','Y', 'Z','1','2','3','4',
'5','6','7','8','9', '0',
);
my $rand = int(rand(65));
my $rchar = $rchars[$rand];
my $whilecounter;
while ($whilecounter < 64 && $rchar == $vars{'question'}) {
$rand = int(rand(65));
$rchar = $rchars[$rand];
$whilecounter++;
}
my $color = "eeeeee";
my $dicol = "yellow";
my $correct;
if ($vars{'answer'} =~ /[A-Za-z0-9]/ && uc $vars{'answer'} eq uc $vars{'question'}) {
$correct = "Y";
}
if ($vars{'answer'} =~ /[A-Za-z0-9]/ && uc $vars{'answer'} ne uc $vars{'question'}) {
$correct = "N";
$color = "ee9999";
$dicol = "red";
$rchar = $vars{'question'};
}
if ($vars{'answer'} eq " ") {
$correct = "N";
$color = "ee9999";
$dicol = "red";
$rchar = $vars{'question'};
}
my $lcrchar = lc $rchar;
my $display = "$lcrchar $rchar";
if ($rchar =~ /[0-9]/) {
$display = $rchar;
}
$WEB .= qq~<div class="abs w100">
<div class="p10">
<div class="center auto box_fabric radius20" style="padding:30px;height:400px">
<div class="center auto box_yellow radius10" style="font-size:40px;padding:25px;width:100px;border:1px solid #333333">$display</div>
<img class="block" src="/ono/osr/images/spacer/trans.gif" style="width:100px;height:100px" alt="">
<form id="form">
<input type="hidden" name="question" value="$rchar">
<input id="input" type="text" name="answer" value="" style="width:1px;height:1px" maxlength="1" onkeyup="document.getElementById('form').submit()">
</form>
<onload:focus:form:input>
<onclick:focus:form:input>
</div>
</div>
</div>
~;
$WEB .= qq~<table class="wide_table rel" style="top:150px">~;
for (my $r = 1; $r < 6; $r++) {
$WEB .= qq~ <tr>
<td class="p0">
<table class="wide_table">
<tr>
<td style="width:5%"></td>
~;
my @chars = ('#','1','2','3','4','5','6','7','8','9','0','#','#','##');
if ($r == 2) {
@chars = ('##','q','w','e','r','t','z','u','i','o','p','#','#','#');
}
if ($r == 3) {
@chars = ('###','a','s','d','f','g','h','j','k','l','#','#','##');
}
if ($r == 4) {
@chars = ('##','#','y','x','c','v','b','n','m','#','#','#','###');
}
if ($r == 5) {
@chars = ('#','#','#','SPACE','##','##','##');
}
foreach my $char (@chars) {
my $width = 6;
if ($char =~ /^#/) {
if ($char eq "##") {
$width = 9;
}
if ($char eq "###") {
$width = 12;
}
$WEB .= qq~ <td style="height:50px;width:${width}%">
<div class="center w100 app88 app88_inset" style="background-color:#666666;border:1px solid #333333;height:50px">
</div>
</td>
~;
} else {
if ($char eq "SPACE") {
$char = "";
$width = 42;
}
$char = uc $char;
my $color = "ffffff";
if (uc $vars{'answer'} eq uc $char && $correct eq "Y") {
# $color = "ccffcc";
}
if (uc $vars{'answer'} eq uc $char && $correct eq "N") {
$color = "ffcccc";
}
if (uc $vars{'question'} eq uc $char && $correct eq "N") {
$color = "ccffcc";
}
if ($vars{'answer'} eq " " && $char eq "") {
$color = "ffcccc";
}
$WEB .= qq~ <td class="center" style="height:50px;width:${width}%" onclick="window.location='$ENV{'SCRIPT_NAME'}?question=$rchar&answer=$char';">
<div class="center w100 app88 app88_inset" style="border:1px solid #333333;height:50px;background-color:#$color">
<br><a href="$ENV{'SCRIPT_NAME'}?question=$rchar&answer=$char" style="color:#333333">$char</a>
</div>
</td>
~;
}
}
$WEB .= qq~ <td style="width:5%"></td>
</tr>
</table>
</td>
</tr>
~;
}
$WEB .= qq~</table>~;
return $WEB;
}
###################################################################
#### THAT'S IT :-D
###################################################################
1;
__END__
################################################################################
# COPYRIGHT / LICENSE #
################################################################################
#
# This file is part of the ONO Software Project.
#
# Copyright (C) 2022-2026 Jos Kirps and The Joopita Project [ASBL]
# Copyright (C) 2011-2022 Jos Kirps and Joopita Research ASBL
# Copyright (C) 2006-2011 Jos Kirps and The Joopita Project
# Copyright (C) 2001-2006 Jos Kirps and The WobbleWolf Project
#
# This file, as well as many other parts of the ONO Software Project or
# related elements, are FREE SOFTWARE available under the ARTISTIC LICENSE 2.0.
#
# This program is distributed in the hope that it will be useful, but
# WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
#
# For the full license, see /ono/osr/license/LICENSE.txt, or write to
# jos_AT_kirps_DOT_com or contact_AT_joopita_DOT_com.
#
################################################################################
# END OF COPYRIGHT / LICENSE, HERE COMES THE CODE ... #
################################################################################
#: This module is a front end application module wrapper that has been
#: created for the Morzino Project (morzino.com) and that has been released
#: as Open Source software.
#:
#: Note that this is NOT a self-contained application, it is only a wrapper
#: that makes heavy use of the ONO Perl Framework application engine.
use strict;
use Encode;
use ONO::ToolBox::Auth;
use ONO::Lib::Lang::LangKitEdu;
use ONO::FW::Apps::Core;
use ONO::FW::Apps::Core::Graphics;
use ONO::FW::Edu::Apps::ToolBox;
use ONO::FW::User::Init;
sub train {
my (
$self,
$option,
$vars_ref,
$HTTP,
$BASE,
) = @_;
my %vars = %$vars_ref;
my $WEB;
my (
$vpath,
$lang,$domain,$community,
$sec,$min,$hour,$mday,$mon,$year,$wday,$yday,$timestamp,
$script_url,$action_url,$form
) = ONO::FW::User::Init->getvar(\%vars);
ONO::FW::Apps::Core->now("","keyboard_trainer",$vars{'app_lang'});
###################################################################
# TRAINER
###################################################################
my @rchars = (
'A','B','C','D','E', 'F','G','H','I','J',
'K','L','M','N','O', 'P','Q','R','S','T',
'U','V','W','X','Y', 'Z','1','2','3','4',
'A','B','C','D','E', 'F','G','H','I','J',
'K','L','M','N','O', 'P','Q','R','S','T',
'U','V','W','X','Y', 'Z','1','2','3','4',
'5','6','7','8','9', '0',
);
my $rand = int(rand(65));
my $rchar = $rchars[$rand];
my $whilecounter;
while ($whilecounter < 64 && $rchar == $vars{'question'}) {
$rand = int(rand(65));
$rchar = $rchars[$rand];
$whilecounter++;
}
my $color = "eeeeee";
my $dicol = "yellow";
my $correct;
if ($vars{'answer'} =~ /[A-Za-z0-9]/ && uc $vars{'answer'} eq uc $vars{'question'}) {
$correct = "Y";
}
if ($vars{'answer'} =~ /[A-Za-z0-9]/ && uc $vars{'answer'} ne uc $vars{'question'}) {
$correct = "N";
$color = "ee9999";
$dicol = "red";
$rchar = $vars{'question'};
}
if ($vars{'answer'} eq " ") {
$correct = "N";
$color = "ee9999";
$dicol = "red";
$rchar = $vars{'question'};
}
my $lcrchar = lc $rchar;
my $display = "$lcrchar $rchar";
if ($rchar =~ /[0-9]/) {
$display = $rchar;
}
$WEB .= qq~<div class="abs w100">
<div class="p10">
<div class="center auto box_fabric radius20" style="padding:30px;height:400px">
<div class="center auto box_yellow radius10" style="font-size:40px;padding:25px;width:100px;border:1px solid #333333">$display</div>
<img class="block" src="/ono/osr/images/spacer/trans.gif" style="width:100px;height:100px" alt="">
<form id="form">
<input type="hidden" name="question" value="$rchar">
<input id="input" type="text" name="answer" value="" style="width:1px;height:1px" maxlength="1" onkeyup="document.getElementById('form').submit()">
</form>
<onload:focus:form:input>
<onclick:focus:form:input>
</div>
</div>
</div>
~;
$WEB .= qq~<table class="wide_table rel" style="top:150px">~;
for (my $r = 1; $r < 6; $r++) {
$WEB .= qq~ <tr>
<td class="p0">
<table class="wide_table">
<tr>
<td style="width:5%"></td>
~;
my @chars = ('#','1','2','3','4','5','6','7','8','9','0','#','#','##');
if ($r == 2) {
@chars = ('##','q','w','e','r','t','z','u','i','o','p','#','#','#');
}
if ($r == 3) {
@chars = ('###','a','s','d','f','g','h','j','k','l','#','#','##');
}
if ($r == 4) {
@chars = ('##','#','y','x','c','v','b','n','m','#','#','#','###');
}
if ($r == 5) {
@chars = ('#','#','#','SPACE','##','##','##');
}
foreach my $char (@chars) {
my $width = 6;
if ($char =~ /^#/) {
if ($char eq "##") {
$width = 9;
}
if ($char eq "###") {
$width = 12;
}
$WEB .= qq~ <td style="height:50px;width:${width}%">
<div class="center w100 app88 app88_inset" style="background-color:#666666;border:1px solid #333333;height:50px">
</div>
</td>
~;
} else {
if ($char eq "SPACE") {
$char = "";
$width = 42;
}
$char = uc $char;
my $color = "ffffff";
if (uc $vars{'answer'} eq uc $char && $correct eq "Y") {
# $color = "ccffcc";
}
if (uc $vars{'answer'} eq uc $char && $correct eq "N") {
$color = "ffcccc";
}
if (uc $vars{'question'} eq uc $char && $correct eq "N") {
$color = "ccffcc";
}
if ($vars{'answer'} eq " " && $char eq "") {
$color = "ffcccc";
}
$WEB .= qq~ <td class="center" style="height:50px;width:${width}%" onclick="window.location='$ENV{'SCRIPT_NAME'}?question=$rchar&answer=$char';">
<div class="center w100 app88 app88_inset" style="border:1px solid #333333;height:50px;background-color:#$color">
<br><a href="$ENV{'SCRIPT_NAME'}?question=$rchar&answer=$char" style="color:#333333">$char</a>
</div>
</td>
~;
}
}
$WEB .= qq~ <td style="width:5%"></td>
</tr>
</table>
</td>
</tr>
~;
}
$WEB .= qq~</table>~;
return $WEB;
}
###################################################################
#### THAT'S IT :-D
###################################################################
1;
__END__