ONO::FW::Edu::Apps::Modules::MathMix

package ONO::FW::Edu::Apps::Modules::MathMix;
################################################################################
# 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 ONO::FW::Edu::Apps::ToolBox;

use ONO::Lib::PDF::Draw;
use ONO::Lib::PDF::ToolBox;
use ONO::Lib::Code::RandomID;
use ONO::Lib::Data::Convert;

use ONO::Lib::UI::Progress;
use ONO::Lib::UI::Check;

use ONO::FW::Apps::Core;
use ONO::FW::Apps::Core::Graphics;

use ONO::Lib::Parser;

use ONO::IO;

use ONO::FW::Apps::PDF;
use ONO::FW::Apps::ToolBox;

sub learn {

my (
$self,
$option,
$vars_ref,
$HTTP,
$BASE,
) = @_;

################################################################
# INIT - BEGIN
################################################################

my (
$db,
$community,
$action_url,
$form,
$format,
$canvas,
$pdfkey,
$sec,$min,$hour,
$mday,$mon,$year,
$wday,$yday,$timestamp,
$lang,
$BLK_ref,
$vars_ref,
) = ONO::FW::Apps::Core->init($vars_ref);

my %vars = %$vars_ref;
my %BLK = %$BLK_ref;

my $app = "math_mix";

my $TITLE = "Math Mix";

my @txt = (
"Select and configure apps:",
"precision",
"also mul/div numbers bigger than 10",
"areas",
"notes",
"Corrections not available for this element",

"multiplication & division",
"all apps",
"none",
"draw elements",
"intervals",

"liquids"
);

if ($vars{'app_lang'} eq "de") {

$TITLE = "$SITE's Mathe Mix";

@txt = (
"Apps wählen und konfigurieren:",
"Genauigkeit",
"auch Mul/Div Zahlen größer als 10",
"Flächen",
"Scheine",
"Verbesserungen für dieses Element nicht verfügbar",

"Multiplikation & Division",
"alle Apps",
"keine",
"Elemente zeichnen",
"Intervalle",

"Flüssigkeiten",
);

}

if ($vars{'app_lang'} eq "lu") {

$TITLE = "$SITE's Mathé Mix";

@txt = (
"Apps wielen a configuréieren:",
"Genauegkeet",
"och Mul/Div Zuele méi grouss wéi 10",
"Flächen",
"Schäiner",
"Verbesserunge fir dëst Element net disponibel",

"Multiplikatioun & Divisioun",
"all Apps",
"keng",
"Elementer zeechnen",
"Intervaller",

"Flëssegkeeten",
);

}

if ($vars{'app_lang'} eq "fr") {

$TITLE = "$SITE's Mix Maths";

@txt = (
"Choisir et configurer les applications:",
"précision",
"aussi nombres mul/div plus grands que 10",
"surfaces",
"notes",
"Corrections non disponibles pour cet élément",

"multiplication & division",
"toutes",
"aucune",
"dessiner éléments",
"intervals",

"liquides"
);

}

my $APP_LANG_FILE = "en";
if ($vars{'app_lang'} =~ /(de|lu|fr)/) {
$APP_LANG_FILE = $1;
}
if (ONO::IO->devstation) {
$APP_LANG_FILE = "dev";
}
my %APP_NAMES;

foreach my $line (ONO::IO->list("var/community/$community/apps/names/$APP_LANG_FILE.txt")) {
my @lp = split(/:/,$line);
$APP_NAMES{$lp[0]} = $lp[1];
}

if (!$vars{'app_input_print_options_title'}) {
$vars{'app_input_print_options_title'} = $TITLE;
}

$vars{'app_disable_storage_type'} = 1;

ONO::FW::Apps::Core->now("math_mix",$app,$vars{'app_lang'});

my $WEB;

$WEB .= ONO::FW::Apps::Core->output_paper_save($pdfkey,$BLK_ref,\%vars,$HTTP,$BASE,"$year$mon$mday");

my ($sel_app_num,$sel_app_names_ref) = ONO::FW::Apps::PDF->worksheet_maker_sel_apps(\%vars);

if (ONO::FW::Apps::Core->running(\%vars,$db) && ($sel_app_num || $vars{'output_paper_finalize'})) {

# back button blocker must be disabled in worksheet creation mode!
#
# $WEB .= ONO::FW::Apps::Core->blockbackbutton($BASE,$vars_ref);


#############################################################
# GENERATE PDF ELEMENTS
#############################################################

if ($vars{'app_input_app_math_houses'} && $vars{'app_input_class_level'} < 22) {
$vars{'app_input_app_math_houses_img'} = 1;
}

if ($vars{'app_input_app_count'} && $vars{'app_input_class_level'} < 30) {
$vars{'app_input_app_math_count_mc'} = 1;
}

#############################################################
# GENERATE PDF ELEMENTS
#############################################################

if ($vars{'output_paper_finalize'}) {

$WEB .= ONO::FW::Apps::PDF->worksheet_maker_finalizer(
$BASE,
$HTTP,
$canvas,
$format,
$pdfkey,
$year,$mon,$mday,
\%APP_NAMES,
\@txt,
$BLK_ref,
$vars_ref,
);

} else {

if (!$vars{'output_paper_id'}) {
$vars{'output_paper_id'} = "$year$mon$mday-".ONO::Lib::Code::RandomID->make(32);
}

$WEB .= ONO::FW::Apps::PDF->worksheet_maker_processor(\%vars);

}

} else {

#############################################################
# EXERCISE SETUP
#############################################################

if (!$vars{'app_input_class_level'}) {
$vars{'app_input_class_level'} = "31";
$vars{'app_input_settings_class'} = "31";
}

if (!$vars{'app_input_apps_level'}) {
$vars{'app_input_apps_level'} = 2;
}

if (!$vars{'app_input_settings_level'}) {
$vars{'app_input_settings_level'} = 2;
}

if (!$sel_app_num) {
$vars{'app_input_app_arithmetic'} = 1;
}

my (@APP_CONFS,%JS_SEL);

my @app1 = (
"arithmetic: : ,21,22,31,32,41,42,50:",
"written_calc: : ,31,32,41,42,50:",
"multiply: : ,31,32,41,42,50:",
"fractions: : ,31,32,41,42,50:",

"compare: : ,21,22,31,32,41,42,50:",
"convert: : ,31,32,41,42,50:",
"math_onestens: : ,21,22,31 :",

);

my @app2 = (

"write_numbers: :10,21,22, :",
"count: :10,21,22, :",
"regroup: :10,21,22, :",
"number_line: : ,21,22,31,32,41,42, :",
"image_calc: :10,21,22, :",
"math_abacus: : ,21,22, :",
"math_rods: :10,21,22,31, :",


);

my @app3 = (

"math_fillin: : ,21,22,31, :",
"math_walls: : ,21,22,31,32,41,42,50:",
"math_houses: : ,21,22,31,32,41,42, :",
"math_steps: : ,22,31,32,41,42, :",
"math_boxes: : ,21,22,31,32,41,42,50:",
"math_trains: : ,21,22,31,32,41,42, :",
"",

);

my @app4 = (

"measure: : ,22,31,32,41,42,50:",
"geometry: : ,31,32,41,42,50:",
"angles: : ,32,41,42,50:",
"patterns: :10,21,22,31,32,41,42,50:",

"clock: : ,21,22,31,32,41,42, :",
"money: : ,21,22,31,32,41,42, :",
"roman_numerals: : :",


);

$vars{'app_conf_check_show_icon'} = 1;

foreach my $selapp (@app1,@app2,@app3,@app4) {

my @sp = split(/:/,$selapp);

if ($sp[0]) {
my $show_selapp = $sp[0];
if ($APP_NAMES{$sp[0]}) {
$show_selapp = $APP_NAMES{$sp[0]};
}
if ($show_selapp =~ s~ ~ <span class="small col9">~) {
$show_selapp .= qq~</span>~;
}
if (ONO::IO->devstation) {
$show_selapp = qq~<a href="/cgi-bin/local/perl/$community/apps/$sp[0].pl" target="_blank" class="col3">$show_selapp</a>~;
} else {
$show_selapp = qq~<div class="cursorlink noselect" onclick="onojs_ui_switch_toggle('app_input_app_$sp[0]','1','0');">$show_selapp</div>~;
}
$vars{'app_conf_check_text_class'} = "";
$vars{'app_conf_check_icon_size'} = 28;
$vars{'app_conf_check_icon_js'} = "onojs_ui_switch_toggle('app_input_app_$sp[0]','1','0');";

@APP_CONFS = (@APP_CONFS,ONO::FW::Apps::ToolBox->conf_input("check",$BLK_ref,\%vars,"","","app_$sp[0]",$vars{"app_input_app_$sp[0]"},$show_selapp));
$JS_SEL{'apps_all'} .= qq~onojs_ui_switch_on('app_input_app_$sp[0]','1');~;
$JS_SEL{'apps_none'} .= qq~onojs_ui_switch_off('app_input_app_$sp[0]','0');~;

foreach my $cy (split(/,/,$sp[2])) {
if ($cy =~ /[0-9]/) {
$JS_SEL{"sel_apps_$cy"} .= qq~onojs_ui_switch_on('app_input_app_$sp[0]','1');~;
}
}

} else {
@APP_CONFS = (@APP_CONFS,"");
}

}

$vars{'app_conf_check_show_icon'} = 0;

my $APP_OPEN = ONO::FW::Apps::ToolBox->conf_input_splitrow_open("w25","default_table ml10");
my $APP_COL = ONO::FW::Apps::ToolBox->conf_input_splitrow_col("w25","default_table ml10");
my $APP_CLOSE = ONO::FW::Apps::ToolBox->conf_input_splitrow_close();

my ($CONF,$BUTS1,$BUTS2,$BUTS3,$BUTS4,@LEVELS);

my $BCLASS = "left";

my @opts = (
"10:Grade 0: :1:20: :1:0:0:0:",
"21:1: :1:40: :1:1:0:0:",
"22:2: :1:200: :1:1:0:0:",
"31:3: :1:1000: :1:1:1:0:",
"32:4: :1:2000: :1:1:1:1:",
"41:5: :50:5000: :1:1:1:1:",
"42:6: :100:10000: :1:1:1:1:",
"50:High School: :200:20000: :1:1:1:1:",
);

if ($ENV{'SERVER_NAME'} =~ /education/) {

@opts = (
"10:C 1: :1:20: :1:0:0:0:",
"21:C 2.1: :1:40: :1:1:0:0:",
"22:C 2.2: :1:200: :1:1:0:0:",
"31:C 3.1: :1:1000: :1:1:1:0:",
"32:C 3.2: :1:2000: :1:1:1:1:",
"41:C 4.1: :50:5000: :1:1:1:1:",
"42:C 4.2: :100:10000: :1:1:1:1:",
"50:Lycée: :200:20000: :1:1:1:1:",
);

}

foreach my $opt (@opts) {
my @op = split(/:/,$opt);

@LEVELS = (@LEVELS,$op[0]);

if ($op[0] eq "50") {
$BCLASS = "right";
}

my $SEL;

if ($op[0] eq $vars{'app_input_class_level'}) {
$SEL = " button_blue";
$vars{'app_input_range_default_from'} = $op[3];
$vars{'app_input_range_default_to'} = $op[4];
if (!$vars{'app_input_range_from'}) {
$vars{'app_input_range_from'} = $op[3];
}
if (!$vars{'app_input_range_to'}) {
$vars{'app_input_range_to'} = $op[4];
}
$JS_SEL{'default'} = qq~math_mix_select_buts1('$op[0]','$BCLASS','$op[3]','$op[4]','$op[6]','$op[7]','$op[8]','$op[9]');~;
}
$BUTS1 .= qq~<a id="buts1_$op[0]" href="javascript:void(0);" class="button button_$BCLASS$SEL" onclick="math_mix_select_buts1('$op[0]','$BCLASS','$op[3]','$op[4]','$op[6]','$op[7]','$op[8]','$op[9]');">$op[1]</a>~;

$JS_SEL{'b1_clear'} .= qq~onojs_class('buts1_$op[0]','button button_$BCLASS');~;
$JS_SEL{'sel_apps'} .= qq~function math_mix_apps_$op[0]() {$JS_SEL{"sel_apps_$op[0]"}}\n~;

$BCLASS = "middle";
}

my %BUTSEL;
$BUTSEL{"BUTS2_$vars{'app_input_apps_level'}"} = " button_yellow";
$BUTSEL{"BUTS4_$vars{'app_input_settings_level'}"} = " button_yellow";

$BUTS1 .= qq~<input type="hidden" id="app_input_class_level_id" name="app_input_class_level" value="$vars{'app_input_class_level'}">
<input type="hidden" id="app_input_range_default_from_id" name="app_input_range_default_from" value="$vars{'app_input_range_default_from'}">
<input type="hidden" id="app_input_range_default_to_id" name="app_input_range_default_to" value="$vars{'app_input_range_default_to'}">
~;

$BUTS2 = qq~<a id="buts2_1" href="javascript:void(0);" onclick="math_mix_sel_buts2('1');" class="button button_left$BUTSEL{"BUTS2_1"}">$BLK{'easy'}</a>
<a id="buts2_2" href="javascript:void(0);" onclick="math_mix_sel_buts2('2');" class="button button_middle$BUTSEL{"BUTS2_2"}">$BLK{'normal'}</a>
<a id="buts2_3" href="javascript:void(0);" onclick="math_mix_sel_buts2('3');" class="button button_right$BUTSEL{"BUTS2_3"}">$BLK{'hard'}</a>
<input type="hidden" id="app_input_apps_level_id" name="app_input_apps_level" value="$vars{'app_input_apps_level'}">
~;

$BUTS4 = qq~<a id="buts4_1" href="javascript:void(0);" onclick="math_mix_sel_buts4('1');" class="button button_left$BUTSEL{"BUTS4_1"}">$BLK{'easy'}</a>
<a id="buts4_2" href="javascript:void(0);" onclick="math_mix_sel_buts4('2');" class="button button_middle$BUTSEL{"BUTS4_2"}">$BLK{'normal'}</a>
<a id="buts4_3" href="javascript:void(0);" onclick="math_mix_sel_buts4('3');" class="button button_right$BUTSEL{"BUTS4_3"}">$BLK{'hard'}</a>
<input type="hidden" id="app_input_settings_level_id" name="app_input_settings_level" value="$vars{'app_input_settings_level'}">
~;

$CONF .= qq~<tr>
<td class="pad10_2" colspan="2">
<div class="box_fabric p5"><div class="inline w100"><div class="fr rel"><div class="rel" style="left:2px">$BUTS2</div></div>$BUTS1</div></div>
<input type="hidden" name="output_paper_mix_source" value="math_mix">
</td>
</tr>
~;

$CONF .= ONO::FW::Apps::ToolBox->conf_input("spacer", $BLK_ref,\%vars,"");

for (my $n = 0; $n < 7; $n++) {

$CONF .= $APP_OPEN;
$CONF .= $APP_CONFS[$n];
$CONF .= $APP_COL;
$CONF .= $APP_CONFS[$n+7];
$CONF .= $APP_COL;
$CONF .= $APP_CONFS[$n+14];
$CONF .= $APP_COL;
$CONF .= $APP_CONFS[$n+21];
$CONF .= $APP_CLOSE;

}

my $SELECT = qq~<div class="rel" style="left:-6px">
<a href="javascript:void(0);" onclick="$JS_SEL{'apps_all'}" class="button_green button_left">$txt[7]</a>
<a href="javascript:void(0);" onclick="$JS_SEL{'apps_none'}" class="button_red button_right">$txt[8]</a>
</div>
~;

$CONF .= ONO::FW::Apps::ToolBox->conf_input("spacer", $BLK_ref,\%vars,"");

$CONF .= ONO::FW::Apps::ToolBox->conf_input_box_open("bg_fabric bo radius10 pad10_2 mr5","wide_table");
$CONF .= ONO::FW::Apps::ToolBox->conf_input_splitrow_open("");
$CONF .= ONO::FW::Apps::ToolBox->conf_input("custom", $BLK_ref,\%vars,"",$SELECT);
$CONF .= ONO::FW::Apps::ToolBox->conf_input_splitrow_col("");
$CONF .= ONO::FW::Apps::ToolBox->conf_input("range", $BLK_ref,\%vars,"O",1,100,9999999);
$CONF .= ONO::FW::Apps::ToolBox->conf_input_splitrow_col("");
$CONF .= ONO::FW::Apps::ToolBox->conf_input("ops", $BLK_ref,\%vars,"","asmd-AS-jJ");
$CONF .= ONO::FW::Apps::ToolBox->conf_input_splitrow_col("","wide_table");

$CONF .= qq~<td>
<div class="rel">
<div class="rel" style="left:10px">
<a href="javascript:void(0);" onclick="onojs_block('conf_box_overlay');onojs_trans('math_mix_conf_box',30);" class="button_blue fr">$BLK{'more_settings'}</a>
</div>
</div>
</td>
~;

$CONF .= ONO::FW::Apps::ToolBox->conf_input_splitrow_close();
$CONF .= ONO::FW::Apps::ToolBox->conf_input_box_close();

# $vars{'output_paper_button_save_pdf'} = 1;
if (!$vars{'output_paper_num_of_pages'}) {
$vars{'output_paper_num_of_pages'} = 4;
}

my @TABLE;

foreach my $opt (
"0:app_input_math_mix_tens_barrier:$BLK{'tens_barrier'}: : ,21,22,31,32,41,42,50:",
"0:app_input_math_mix_draw:$txt[9]: :10,21,22,31 :",
"0:app_input_math_mix_roundup:$BLK{'round_up'}:0=$BLK{'no'},10=10,100=100: : :",
"0:app_input_math_mix_comma:$BLK{'comma'}:0=$BLK{'no'},1=1,2=2,3=3,rand=$BLK{'random'}: : ,41,42,50:",
"0:app_input_math_mix_negative:$BLK{'negative_numbers'}: : ,50:",

"1:app_input_math_mix_midcalc:a + ? = c: : ,31,32,41,42,50:",
"1:app_input_math_mix_tricalc:a + b + c = ?: : ,41,42,50:",
"1:app_input_math_mix_parentheses:(a + b) • c = ?: : ,50:",

"2:app_input_math_mix_geometry:$BLK{'geometry'}:01=1 mm $txt[1],05=0.5 cm $txt[1],10=1 cm $txt[1]: : :",
"2:_geo_opts_::: : :",

"21:app_input_math_mix_lengths:$BLK{'lengths'}: : ,22,31,32,41,42,50:",
"21:app_input_math_mix_perimeter:$BLK{'perimeters'}: : ,41,42,50:",
"21:app_input_math_mix_areas:$txt[3]: : ,41,42,50:",
"21:app_input_math_mix_volumes:$BLK{'volumes'}: : ,42,50:",
"22:app_input_math_mix_weights:$BLK{'weights'}: : ,32,41,42,50:",
"22:app_input_math_mix_liquids:$txt[11]: : ,41,42,50:",
"23:app_input_math_mix_geometry_triangles:$BLK{'also'} $BLK{'triangles'}: : ,50:",
"23:app_input_math_mix_geometry_circles:$BLK{'also'} $BLK{'circles'}: : ,50:",

"2:app_input_math_mix_angles:$BLK{'angles'}:90=0-90°,180=0-180°,360=0-360°: : :",
"2:app_input_math_mix_clock:$BLK{'clock'}:60=60 $BLK{'minutes'},30=30 $BLK{'minutes'},15=15 $BLK{'minutes'},5=5 $BLK{'minutes'},1=1 $BLK{'minute'}:: :",
"2:app_input_math_mix_money:$BLK{'money'}:eur=EUR,chf=CHF,usd=USD,gbp=GBP: : :",

"3:app_input_math_mix_op_muldiv_bigger_10:$txt[2]: : ,31,32,41,42,50:",

) {
my @op = split(/:/,$opt);

if ($op[3] =~ /=/) {

my ($SEL,$SEL2);
foreach my $selopt (split(/\,/,$op[3])) {
my @sp = split(/=/,$selopt);
my $sel;
if ($sp[0] eq $vars{$op[1]}) {
$sel = " selected";
}
$SEL .= qq~<option value="$sp[0]"$sel>$sp[1]</option>~;
}

my $MAX_WIDTH = 120;

if ($op[0] == 2 && $op[1] =~ /mix_angles/) {

my %sel;
$sel{$vars{"$op[1]_precision"}} = " selected";

$SEL2 .= qq~<div class="select_small fl ml5" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_precision_id" name="$op[1]_precision">
<option value="1"$sel{'1'}>1° $txt[1]</option>
<option value="5"$sel{'5'}>5° $txt[1]</option>
<option value="10"$sel{'10'}>10° $txt[1]</option>
</select></div>
~;

}

if ($op[0] == 2 && $op[1] =~ /mix_money/) {

my %sel;
$sel{$vars{"$op[1]_types"}} = " selected";

$SEL2 .= qq~<div class="select_small fl ml5" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_types_id" name="$op[1]_types">
<option value="all"$sel{'all'}>$txt[4], $BLK{'coins'}, $BLK{'cents'}</option>
<option value="no_cents"$sel{'no_cents'}>$BLK{'no3'} $BLK{'cents'}</option>
<option value="only_coins_no_cents"$sel{'only_coins_no_cents'}>$BLK{'no3'} $BLK{'cents'}, $BLK{'only'} $BLK{'coins'}</option>
<option value="only_notes"$sel{'only_notes'}>$BLK{'only'} $txt[4]</option>
</select></div>
~;

}

if ($op[0] == 2 && $op[1] =~ /mix_(geometry|angles|clock)/) {

my %sel;
$sel{$vars{"$op[1]_measuredraw"}} = " selected";

$SEL2 .= qq~<div class="select_small fl ml5" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_measuredraw_id" name="$op[1]_measuredraw">
<option value="md"$sel{'md'}>$BLK{'measure'} & $BLK{'draw'}</option>
<option value="m"$sel{'m'}>$BLK{'only'} $BLK{'measure'}</option>
<option value="d"$sel{'d'}>$BLK{'only'} $BLK{'draw'}</option>
</select></div>
~;

}

if ($op[0] == 2 && $op[1] =~ /mix_clock/) {

my %sel;
if ($vars{"$op[1]_exclock"} eq "") {
$vars{"$op[1]_exclock"} = "t";
}
$sel{$vars{"$op[1]_exclock"}} = " selected";

$SEL2 .= qq~<div class="select_small fl ml5" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_exclock_id" name="$op[1]_exclock">
<option value="ti"$sel{'ti'}>$BLK{'time'} & $txt[10]</option>
<option value="t"$sel{'t'}>$BLK{'only'} $BLK{'time'}</option>
<option value="d"$sel{'i'}>$BLK{'only'} $txt[10]</option>
</select></div>
~;

}

if ($op[0] == 2 && $op[1] =~ /mix_money/) {

my %sel;
$sel{$vars{"$op[1]_calcdraw"}} = " selected";

$SEL2 .= qq~<div class="select_small fl ml5" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_calcdraw_id" name="$op[1]_calcdraw">
<option value="c"$sel{'c'}>$BLK{'only'} $BLK{'calculate'}</option>
<option value="cd"$sel{'cd'}>$BLK{'calculate'} & $BLK{'draw'}</option>
</select></div>
~;

}

$TABLE[$op[0]] .= qq~<table class="default_table mb5 rel" style="top:-3px">
<tr>
<td>$op[2]: </td>
<td class="p0">
<div class="select_small fl" style="max-width:${MAX_WIDTH}px"><select id="$op[1]_id" name="$op[1]">$SEL</select></div>
$SEL2
</td>
</tr>
</table>
~;

} else {

$JS_SEL{'settings_none'} .= qq~onojs_ui_switch_off('$op[1]','0');\n~;

foreach my $level (split(/,/,",$op[4],")) {
if ($level =~ /[0-9]/) {
$JS_SEL{"sel_settings_$level"} .= "onojs_ui_switch_on('$op[1]','1');\n";
}
}

my $SWITCH = ONO::Lib::UI::Check->switch($op[1],$vars{$op[1]},"mT");

if ($op[0] == 2 && $op[1] eq "_geo_opts_") {

$TABLE[$op[0]] .= qq~<div class="inline w100 mb2">
###_GEO_OPTS_###
</div>
~;

} else {

$TABLE[$op[0]] .= qq~<div class="inline w100 mb2">
<table class="default_table mb10">
<tr class="vtop">
<td class="p0">$SWITCH</td>
<td></td>
<td class="p0 lh125">$op[2]</td>
</tr>
</table>
</div>
~;

}

}

}

$JS_SEL{'settings_none'} .= qq~onojs_setvalue('app_input_math_mix_comma_id','0');
onojs_setvalue('app_input_roundup_id','0');

onojs_setvalue('app_input_math_mix_geometry_id','10');
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','m');

onojs_setvalue('app_input_math_mix_angles_id','90');
onojs_setvalue('app_input_math_mix_angles_precision_id','10');
onojs_setvalue('app_input_math_mix_angles_measuredraw_id','m');

onojs_setvalue('app_input_math_mix_clock_id','60');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','m');
onojs_setvalue('app_input_math_mix_clock_exclock_id','t');

onojs_setvalue('app_input_math_mix_money_id','eur');
onojs_setvalue('app_input_math_mix_money_types_id','only_coins_no_cents');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','c');
~;

$JS_SEL{"sel_settings_21"} .= qq~~;
$JS_SEL{"sel_settings_22"} .= qq~onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','30');
onojs_setvalue('app_input_math_mix_money_types_id','no_cents');
~;
$JS_SEL{"sel_settings_31"} .= qq~onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','15');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','cd');
onojs_setvalue('app_input_math_mix_money_types_id','all');
~;
$JS_SEL{"sel_settings_32"} .= qq~onojs_setvalue('app_input_math_mix_geometry_id','05');
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','5');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_exclock_id','ti');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','cd');
onojs_setvalue('app_input_math_mix_money_types_id','all');
~;
$JS_SEL{"sel_settings_41"} .= qq~onojs_setvalue('app_input_math_mix_comma_id','1');
onojs_setvalue('app_input_math_mix_geometry_id','01');
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_angles_id','180');
onojs_setvalue('app_input_math_mix_angles_precision_id','5');
onojs_setvalue('app_input_math_mix_angles_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','1');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_exclock_id','ti');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','cd');
onojs_setvalue('app_input_math_mix_money_types_id','all');
~;
$JS_SEL{"sel_settings_42"} .= qq~onojs_setvalue('app_input_math_mix_comma_id','rand');
onojs_setvalue('app_input_math_mix_geometry_id','01');
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_angles_id','360');
onojs_setvalue('app_input_math_mix_angles_precision_id','1');
onojs_setvalue('app_input_math_mix_angles_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','1');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_exclock_id','ti');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','cd');
onojs_setvalue('app_input_math_mix_money_types_id','all');
~;
$JS_SEL{"sel_settings_50"} .= qq~onojs_setvalue('app_input_math_mix_comma_id','rand');
onojs_setvalue('app_input_math_mix_geometry_id','01');
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_angles_id','360');
onojs_setvalue('app_input_math_mix_angles_precision_id','1');
onojs_setvalue('app_input_math_mix_angles_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','1');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_exclock_id','ti');
onojs_setvalue('app_input_math_mix_money_calcdraw_id','cd');
onojs_setvalue('app_input_math_mix_money_types_id','all');
~;


foreach my $level (@LEVELS) {

$JS_SEL{'sel_settings'} .= qq~function math_mix_settings_$level() {$JS_SEL{"sel_settings_$level"}}\n~;

}

my $SCRIPT = qq~function math_mix_clear_buts1() {$JS_SEL{'b1_clear'}}
function math_mix_clear_buts2() {onojs_class('buts2_1','button button_left');onojs_class('buts2_2','button button_middle');onojs_class('buts2_3','button button_right');}
function math_mix_clear_buts3() {$JS_SEL{'b3_clear'}}
function math_mix_clear_buts4() {onojs_class('buts4_1','button button_left');onojs_class('buts4_2','button button_middle');onojs_class('buts4_3','button button_right');}
$JS_SEL{'sel_apps'}
$JS_SEL{'sel_settings'}
function math_mix_sel_buts2(opt) {

math_mix_clear_buts2();
onojs_setvalue('app_input_apps_level_id',opt);

var min = onojs_getvalue('app_input_range_default_from_id');
var max = onojs_getvalue('app_input_range_default_to_id');

if (opt == 1) {
onojs_class('buts2_1','button button_left button_green');
min = min / 4;
max = max / 4;
}
if (opt == 2) {
onojs_class('buts2_2','button button_middle button_yellow');
min = min / 2;
max = max / 2;
}
if (opt == 3) {
onojs_class('buts2_3','button button_right button_red');
}
if (min < 1) {
min = 1;
}
onojs_setvalue('app_input_range_from_id',min);
onojs_setvalue('app_input_range_to_id',max);

onojs_ui_switch_on('app_input_op_add','1');
onojs_ui_switch_off('app_input_op_sub','0');
onojs_ui_switch_off('app_input_op_mul','0');
onojs_ui_switch_off('app_input_op_div','0');

var level = onojs_getvalue('app_input_class_level_id');

if (level == 10 && opt > 2) {
onojs_ui_switch_on('app_input_op_sub','1');
}
if (level == 21 && opt > 1) {
onojs_ui_switch_on('app_input_op_sub','1');
}
if (level == 22) {
onojs_ui_switch_on('app_input_op_sub','1');
if (opt > 2) {
onojs_ui_switch_on('app_input_op_mul','1');
onojs_ui_switch_on('app_input_app_multiply','1');
onojs_ui_switch_on('app_input_app_written_calc','1');
} else {
onojs_ui_switch_off('app_input_app_multiply','0');
onojs_ui_switch_off('app_input_app_written_calc','0');
}
}
if (level == 31) {
onojs_ui_switch_on('app_input_op_sub','1');
onojs_ui_switch_on('app_input_op_mul','1');
}
if (level == 32) {
onojs_ui_switch_on('app_input_op_sub','1');
onojs_ui_switch_on('app_input_op_mul','1');
if (opt > 2) {
onojs_ui_switch_on('app_input_op_div','1');
}
}
if (level > 40) {
onojs_ui_switch_on('app_input_op_sub','1');
onojs_ui_switch_on('app_input_op_mul','1');
onojs_ui_switch_on('app_input_op_div','1');
}

math_mix_sel_buts4(opt);

}
function math_mix_sel_buts4(opt) {

math_mix_clear_buts4();
onojs_setvalue('app_input_settings_level_id',opt);

var level = onojs_getvalue('app_input_class_level_id');

if (opt == 1) {
onojs_class('buts4_1','button button_left button_green');
}
if (opt == 2) {
onojs_class('buts4_2','button button_middle button_yellow');
}
if (opt == 3) {
onojs_class('buts4_3','button button_right button_red');
}

if (level == 10) {
if (opt == 3) {
onojs_ui_switch_on('app_input_tens_barrier','1');
} else {
onojs_ui_switch_off('app_input_tens_barrier','0');
}
}
if (level == 21) {
if (opt > 1) {
onojs_ui_switch_on('app_input_tens_barrier','1');
} else {
onojs_ui_switch_off('app_input_tens_barrier','0');
}
if (opt > 2) {
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
onojs_setvalue('app_input_math_mix_clock_id','30');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','md');
onojs_ui_switch_on('app_input_math_mix_mulrow_5','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_10','1');

} else {
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','m');
onojs_setvalue('app_input_math_mix_clock_id','60');
onojs_setvalue('app_input_math_mix_clock_measuredraw_id','m');
}
}
if (level == 22) {
if (opt > 2) {
onojs_setvalue('app_input_math_mix_geometry_id','05');
onojs_setvalue('app_input_math_mix_clock_id','15');
onojs_ui_switch_on('app_input_math_mix_mulrow_3','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_4','1');
} else {
onojs_setvalue('app_input_math_mix_geometry_id','10');
onojs_setvalue('app_input_math_mix_clock_id','30');
}
if (opt < 2) {
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','m');
onojs_setvalue('app_input_math_mix_clock_id','60');
} else {
onojs_setvalue('app_input_math_mix_geometry_measuredraw_id','md');
}
}
if (level == 31) {
if (opt > 2) {
onojs_setvalue('app_input_math_mix_geometry_id','05');
onojs_setvalue('app_input_math_mix_clock_id','5');
onojs_ui_switch_on('app_input_math_mix_mulrow_6','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_7','1');
} else {
onojs_setvalue('app_input_math_mix_geometry_id','10');
onojs_setvalue('app_input_math_mix_clock_id','15');
}
}
if (level == 32) {
if (opt > 2) {
onojs_setvalue('app_input_math_mix_geometry_id','01');
onojs_setvalue('app_input_math_mix_clock_id','1');
onojs_setvalue('app_input_math_mix_comma_id','1');
} else {
onojs_setvalue('app_input_math_mix_geometry_id','05');
onojs_setvalue('app_input_math_mix_clock_id','5');
onojs_setvalue('app_input_math_mix_comma_id','0');
}
}
if (level == 41) {
if (opt < 2) {
onojs_setvalue('app_input_math_mix_angles_id','90');
onojs_setvalue('app_input_math_mix_angles_precision_id','10');
onojs_setvalue('app_input_math_mix_comma_id','0');
} else {
onojs_setvalue('app_input_math_mix_angles_id','180');
onojs_setvalue('app_input_math_mix_angles_precision_id','5');
onojs_setvalue('app_input_math_mix_comma_id','1');
}
if (opt > 2) {
onojs_setvalue('app_input_math_mix_angles_id','360');
onojs_setvalue('app_input_math_mix_angles_precision_id','1');
onojs_setvalue('app_input_math_mix_comma_id','2');
}
}
if (level == 42) {
if (opt < 2) {
onojs_setvalue('app_input_math_mix_angles_id','180');
onojs_setvalue('app_input_math_mix_angles_precision_id','10');
onojs_setvalue('app_input_math_mix_comma_id','0');
} else {
onojs_setvalue('app_input_math_mix_angles_id','360');
onojs_setvalue('app_input_math_mix_angles_precision_id','5');
onojs_setvalue('app_input_math_mix_comma_id','rand');
}
// if (opt > 2) {
// onojs_setvalue('app_input_math_mix_comma_id','3');
// }
}
if (level == 50) {
if (opt < 2) {
onojs_setvalue('app_input_math_mix_comma_id','1');
} else {
onojs_setvalue('app_input_math_mix_comma_id','rand');
}
if (opt > 2) {
onojs_ui_switch_on('app_input_math_mix_geometry_circles','1');
} else {
onojs_ui_switch_off('app_input_math_mix_geometry_circles','0');
}
}

}

function math_mix_mulrow(level) {
onojs_ui_switch_off('app_input_op_muldiv_bigger_10','0');
onojs_setvalue('app_input_math_mix_mulrow_main_id','2:5:10');
for (i = 1; i < 11; i++) {
onojs_ui_switch_off('app_input_math_mix_mulrow_'+i,'0');
}
onojs_ui_switch_on('app_input_math_mix_mulrow_1','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_2','1');
if (level > 20) {
onojs_ui_switch_on('app_input_math_mix_mulrow_2','1');
if (level > 21) {
onojs_ui_switch_on('app_input_math_mix_mulrow_5','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_10','1');
onojs_setvalue('app_input_math_mix_mulrow_main_id','0-5');
if (level > 30) {
onojs_ui_switch_on('app_input_math_mix_mulrow_3','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_4','1');
onojs_setvalue('app_input_math_mix_mulrow_main_id','0-10');
if (level > 31) {
onojs_ui_switch_on('app_input_math_mix_mulrow_6','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_7','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_8','1');
onojs_ui_switch_on('app_input_math_mix_mulrow_9','1');
if (level > 32) {
onojs_ui_switch_on('app_input_op_muldiv_bigger_10','1');
}
}
}
}
}
}

function math_mix_num_ops(min,max,add,sub,mul,div) {

onojs_setvalue('app_input_range_default_from_id',min);
onojs_setvalue('app_input_range_default_to_id',max);
var ratio = 1;
if (onojs_getvalue('app_input_apps_level_id') == 1) {ratio = 0.25}
if (onojs_getvalue('app_input_apps_level_id') == 2) {ratio = 0.5}
min = min*ratio;
max = max*ratio;
if (min < 1) {
min = 1;
}
onojs_setvalue('app_input_range_from_id',min);
onojs_setvalue('app_input_range_to_id',max);
if (add == 1) {onojs_ui_switch_on('app_input_op_add','1')} else {onojs_ui_switch_off('app_input_op_add','0')}
if (sub == 1) {onojs_ui_switch_on('app_input_op_sub','1')} else {onojs_ui_switch_off('app_input_op_sub','0')}
if (mul == 1) {onojs_ui_switch_on('app_input_op_mul','1')} else {onojs_ui_switch_off('app_input_op_mul','0')}
if (div == 1) {onojs_ui_switch_on('app_input_op_div','1')} else {onojs_ui_switch_off('app_input_op_div','0')}

}

function math_mix_apps(level) {

$JS_SEL{'apps_none'};

if (level == 10) {math_mix_apps_10()}
if (level == 21) {math_mix_apps_21()}
if (level == 22) {math_mix_apps_22()}
if (level == 31) {math_mix_apps_31()}
if (level == 32) {math_mix_apps_32()}
if (level == 41) {math_mix_apps_41()}
if (level == 42) {math_mix_apps_42()}
if (level == 50) {math_mix_apps_50()}

}

function math_mix_settings(level) {

$JS_SEL{'settings_none'};

if (level == 10) {math_mix_settings_10();math_mix_mulrow(10)}
if (level == 21) {math_mix_settings_21();math_mix_mulrow(21)}
if (level == 22) {math_mix_settings_22();math_mix_mulrow(22)}
if (level == 31) {math_mix_settings_31();math_mix_mulrow(31)}
if (level == 32) {math_mix_settings_32();math_mix_mulrow(32)}
if (level == 41) {math_mix_settings_41();math_mix_mulrow(41)}
if (level == 42) {math_mix_settings_42();math_mix_mulrow(42)}
if (level == 50) {math_mix_settings_50();math_mix_mulrow(50)}

}

function math_mix_select_buts1(level,bclass,min,max,add,sub,mul,div) {

onojs_setvalue('app_input_class_level_id',level);
math_mix_clear_buts1();
onojs_class('buts1_'+level,'button button_blue button_'+bclass);
math_mix_apps(level);
math_mix_settings(level);
math_mix_num_ops(min,max,add,sub,mul,div);
math_mix_sel_buts2('2');

}
~;

if (!$vars{'output_paper'}) {

$SCRIPT .= $JS_SEL{'default'};

}

my $HIDE = "hide";
my $TOP = 20;
my $LEFT = 20;

my $dev_setup_displace;

$dev_setup_displace++;

if (ONO::IO->devstation && $dev_setup_displace) {
$HIDE = "";
$TOP = 480;
$LEFT = 360;
}

my $MUL = ONO::FW::Apps::ToolBox->conf_input("mulrows", $BLK_ref,\%vars,"","",1,10,10,"Bm","","app_input_math_mix_mulrow");

my $OVERLAY = qq~<div id="conf_box_overlay" class="abs $HIDE" style="top:${TOP}px;left:${LEFT}px;width:880px;z-index:999">
<div class="box_black">
<div class="fr"><div class="rel" style="top:-2px">$BUTS4</div></div>
<h3 class="cole">$BLK{'Settings'}</h3>
<div class="box_paper rel" style="min-height:360px">
<table class="wide_table mt10">
<tr class="vtop">
<td class="w40 p0">
<table class="wide_table">
<tr class="vtop">
<td class="w50">
<div class="ml5">
<div class="large bold col6">$BLK{'Calculate'}</div>
<div class="mt10 ml5">$TABLE[0]</div>
</div>
</td>
<td class="w50">
<div class="ml5">
<div class="large bold col6"> </div>
<div class="mt10 ml5">$TABLE[1]</div>
</div>
</td>
</tr>
</table>
<table class="default_table">
<tr class="vtop">
<td class="p0">
<div class="ml10">$txt[6]:</div>
<table class="default_table ml20">
$MUL
</table>
</td>
<td class="p5"></td>
<td class="p0">
<div class="hide">
<div class="large bold col6 ml10 mt10 mb10">Unused / Future extension</div>
</div>
</td>
</tr>
</table>
</td>
<td class="w60">
<div class="ml20">
<div class="large bold col6">$BLK{'Geometry'}, $BLK{'units'}, $txt[1] & $BLK{'options'}</div>
<div class="mt10 ml5">$TABLE[2]</div>
</div>
</td>
</tr>
</table>
<div class="abs" style="right:20px;bottom:10px">
<a href="javascript:void(0);" onclick="onojs_hide('conf_box_overlay');onojs_trans('math_mix_conf_box',100);" class="button_green button_big"> $BLK{'ok'} </a>
</div>
</div>
</div>
</div>
~;

my $GEO_OPTS = qq~<table class="default_table ml20">
<tr class="vtop">
<td>$TABLE[21]</td>
<td class="p5"></td>
<td>$TABLE[22]</td>
<td class="p5"></td>
<td>$TABLE[23]</td>
</tr>
</table>
~;

$OVERLAY =~ s~###_GEO_OPTS_###~$GEO_OPTS~;

$vars{'conf_box_title'} = $txt[0];
$vars{'app_conf_box_maxwidth'} = 900;
$vars{'app_conf_box_color'} = "black";
$vars{'app_conf_box_id'} = "math_mix_conf_box";
$vars{'app_conf_box_inner_style'} = "padding:10px 5px 0px 5px";

$WEB .= ONO::FW::Apps::Core->conf_box(
$db,
$community,
$app,
$form,
"",
$action_url,
$CONF,
$lang,
$BLK_ref,
\%vars,
"p-cdi-CDI-W-t-U-K",
$OVERLAY,
);

$WEB .= qq~\n<script>\n$SCRIPT\n</script>\n~;

}

# $WEB =~ s~method="post"~method="get"~;

my ($status,$WEB) = ONO::Lib::Parser->parse($WEB,$vars_ref);

$WEB .= ONO::FW::Apps::Core->vardump($vars_ref);

$WEB = ONO::FW::Edu::Apps::ToolBox->apps_gate($WEB,$vars_ref);

return $WEB;

}

###################################################################
# SUBS
###################################################################

###################################################################
#### THAT'S IT :-D
###################################################################

1;

__END__