...
 
Commits (5)
/* Copyright (C) 2020 by Mattia Monga <[email protected]> */
body {
text-align: center;
font-size: 200%;
font-size: 150%;
background-color: seashell;
}
.content {
......@@ -13,7 +14,7 @@ body {
}
#operazione {
font-size: 200%;
font-size: 300%;
grid-column: 1 / 2;
grid-row: 1 / 4;
}
......
......@@ -2,15 +2,16 @@
// Basic idea from https://gist.github.com/peshoicov/ab3286875d980948ad3f5f434fec37a9
// and http://bencentra.com/code/2014/12/05/html5-canvas-touch-events.html
(function () {
Conticini.reset_canvases = function () {
var drawing = null;
var mousePos = {x:0, y:0};
var lastPos = mousePos;
var isMobile = ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch;
const canvasDim = 0.45*Conticini.CONTICINO.clientWidth;
const canvasDim = 0.9*(Conticini.CONTICINO.clientWidth / 2);
setupCanvas(Conticini.CIFRA_D);
setupCanvas(Conticini.CIFRA_U);
Conticini.check_msg();
function setupCanvas(canvas){
// Setup canvas ..
......@@ -75,4 +76,4 @@
}
}
}());
};
......@@ -12,17 +12,19 @@ var Conticini = {
PULSANTE: document.getElementById('pulsante'),
// Feel free to configure these
MIN_OPERANDO: 0,
MAX_OPERANDO: 9,
MIN_EXPECTED: 0,
MAX_EXPECTED: 20,
OPS: ['+', '-'],
cfg: {
MIN_OPERANDO: 0,
MAX_OPERANDO: 9,
MIN_EXPECTED: 0,
MAX_EXPECTED: 20,
OPS: ['+', '-'],
OK_TIMEOUT: 5000,
KO_TIMEOUT: 3000,
MSG_CHECK: "CONTROLLA",
MSG_OK: "BENISSIMO!",
MSG_KO: "HAI SCRITTO MALE, RIPROVA!",
OK_TIMEOUT: 5000, // milliseconds
KO_TIMEOUT: 3000, // milliseconds
MSG_CHECK: "CONTROLLA",
MSG_OK: "BENISSIMO!",
MSG_KO: "HAI SCRITTO MALE, RIPROVA!",
},
// expected result
expected: null,
......
......@@ -3,7 +3,7 @@
Conticini.nn = {
getNumber: async function(canvas, tmp) {
const myOnnxSession = new onnx.InferenceSession({ backendHint: "webgl" });
const myOnnxSession = new onnx.InferenceSession();
// load the ONNX model file
await myOnnxSession.loadModel("./model.onnx");
// Preprocess the image data to match input dimension requirement, which is 1*1*28*28.
......
......@@ -3,13 +3,13 @@
Conticini.randomize = function() {
var op_sx, op, op_dx;
do {
op_sx = Math.floor(Conticini.MIN_OPERANDO
+ Math.random()*(Conticini.MAX_OPERANDO - Conticini.MIN_OPERANDO + 1));
op_dx = Math.floor(Conticini.MIN_OPERANDO
+ Math.random()*(Conticini.MAX_OPERANDO - Conticini.MIN_OPERANDO + 1));
op = Conticini.OPS[Math.floor(Math.random()*Conticini.OPS.length)];
op_sx = Math.floor(Conticini.cfg.MIN_OPERANDO
+ Math.random()*(Conticini.cfg.MAX_OPERANDO - Conticini.cfg.MIN_OPERANDO + 1));
op_dx = Math.floor(Conticini.cfg.MIN_OPERANDO
+ Math.random()*(Conticini.cfg.MAX_OPERANDO - Conticini.cfg.MIN_OPERANDO + 1));
op = Conticini.cfg.OPS[Math.floor(Math.random()*Conticini.cfg.OPS.length)];
Conticini.expected = eval(op_sx + op + op_dx);
} while (Conticini.expected < Conticini.MIN_EXPECTED || Conticini.expected > Conticini.MAX_EXPECTED);
} while (Conticini.expected < Conticini.cfg.MIN_EXPECTED || Conticini.expected > Conticini.cfg.MAX_EXPECTED);
Conticini.OPERANDO_SX.innerHTML = "" + op_sx;
Conticini.OPERANDO_DX.innerHTML = "" + op_dx;
......@@ -17,30 +17,20 @@ Conticini.randomize = function() {
Conticini.reset_canvases();
};
Conticini.reset_canvases = function() {
const ctx_u = Conticini.CIFRA_U.getContext('2d');
const ctx_d = Conticini.CIFRA_D.getContext('2d');
ctx_u.clearRect(0, 0, ctx_u.canvas.width, ctx_u.canvas.height);
ctx_u.beginPath();
ctx_d.clearRect(0, 0, ctx_d.canvas.width, ctx_d.canvas.height);
ctx_d.beginPath();
Conticini.check_msg();
};
Conticini.check_msg = function() {
Conticini.PULSANTE.value = Conticini.MSG_CHECK;
Conticini.PULSANTE.value = Conticini.cfg.MSG_CHECK;
Conticini.PULSANTE.className = 'check';
Conticini.PULSANTE.onclick = Conticini.check_result;
};
Conticini.ko_msg = function(timeout) {
Conticini.PULSANTE.value = Conticini.MSG_KO;
Conticini.PULSANTE.value = Conticini.cfg.MSG_KO;
Conticini.PULSANTE.className = 'ko';
window.setTimeout(Conticini.reset_canvases, timeout);
};
Conticini.ok_msg = function(timeout) {
Conticini.PULSANTE.value = Conticini.MSG_OK;
Conticini.PULSANTE.value = Conticini.cfg.MSG_OK;
Conticini.PULSANTE.className = 'ok';
window.setTimeout(Conticini.randomize, timeout);
};
......@@ -49,13 +39,13 @@ Conticini.ok_msg = function(timeout) {
Conticini.check_result = async function() {
const u = await Conticini.nn.getNumber(Conticini.CIFRA_U, Conticini.CANVAS_TMP);
if (u === -1) {
Conticini.ko_msg(Conticini.KO_TIMEOUT);
Conticini.ko_msg(Conticini.cfg.KO_TIMEOUT);
return;
}
const d = await Conticini.nn.getNumber(Conticini.CIFRA_D, Conticini.CANVAS_TMP);
if ((d === -1 && u === Conticini.expected) || (d > -1 && 10*d + u === Conticini.expected)) {
Conticini.ok_msg(Conticini.OK_TIMEOUT);
Conticini.ok_msg(Conticini.cfg.OK_TIMEOUT);
return;
}
Conticini.ko_msg(Conticini.KO_TIMEOUT);
Conticini.ko_msg(Conticini.cfg.KO_TIMEOUT);
};