falsefalsetrue-1AIRES interactives30Trace une figure d'aire égale à 4 ua.

{width:400,height:400,cols:5,rows:5,ua:[1,1]}

this.onload = function() {
    var me = this;
    var wait = function() {
        if ((me.reponse.find("#input-1") === null)||(me.reponse.find("#input-2") === null)) {
            setTimeout(wait, 100);
        } else {
            var G = me.question.find("#grid");
            var P = me.question.find("params").innerText;
            var ALL = [];
            var REPS = (me.reponse.find("#input-2").value) ? JSON.parse(me.reponse.find("#input-2").value) : null;
            var d;
            P = P.replace(/(\w*):/g, "\"$1\":");
            P = JSON.parse(P);
            var W = P.width;
            var H = P.height;
            G.inner("").stl(`width:${P.width}px;height:${P.height}px`);
            G.mdown = false;
            G.selected = false;
            G.paint = function(_elt) {
                if (_elt.selected) {
                    _elt.stl("background-color:orange");
                } else {
                    _elt.stl("background-color:unset");
                };
            };
            G.store = function() {
                var reps = [];
                var count = 0;
                var line;
                for (var i = 0; i < ALL.length; i++) {
                    line = [];
                    for (var j = 0; j < ALL[i].length; j++) {
                        line.push(ALL[i][j].selected);
                        if (ALL[i][j].selected) count++;
                    }
                    reps.push(line);
                };
                me.reponse.find("#input-2").val(JSON.stringify(reps));
                me.reponse.find("#input-2").dispatchEvent(new KeyboardEvent('keyup', {}));
                me.reponse.find("#input-1").val(count);
                me.reponse.find("#input-1").dispatchEvent(new KeyboardEvent('keyup', {}));
            };
            var line;
            for (var i = 0; i < P.rows; i++) {
                line = [];
                for (var j = 0; j < P.cols; j++) {
                    d = $.create("div").stl(`position:absolute;left:${j*W/P.cols}px;top:${i*H/P.rows}px;width:${W/P.cols}px;height:${H/P.rows}px;border:1px solid gray;`);
                    if ((j < P.cols - P.ua[0]) || (i >= P.ua[1])) {
                        d.rank = [i, j];
                        d.selected = REPS ? REPS[i][j] : false;
                        d.mousedown(function(e) {
                            var elt = e.target;
                            G.mdown = true;
                            G.selected = elt.selected = !elt.selected;
                            G.paint(elt);
                        });
                        d.mouseup(function() {
                            G.selected = G.mdown = false;
                            G.store();
                        });
                        d.mouseover(function(e) {
                            if (G.mdown) {
                                var elt = e.target;
                                elt.selected = G.selected;
                                G.paint(elt);
                            }
                        });
                        G.paint(d);
                    }
                    line.push(d);
                    G.add(d);
                };
                ALL.push(line);
            };
            var UA = $.create("div").stl(`position:absolute;left:${W-P.ua[0]*W/P.cols}px;top:0px;width:${P.ua[0]*W/P.cols}px;height:${P.ua[1]*H/P.rows}px;border:3px solid black;background-color:rgba(200,200,200,0.5);font-size:24px;text-align:center;line-height:${P.ua[1]*H/P.rows}px;pointer-events: none;`);
            UA.inner("1 ua");
            G.add(UA);
        };
    };
    wait();
    me.reponse.hide();
};

[["4","int"],["[[false,false,false,false,null],[false,true,true,false,false],[false,true,true,false,false],[false,false,false,false,false],[false,false,false,false,false]]","empty"]]custom-line{"inps":[["","int"],["","empty"]],"sfx":""}Trace une figure d'aire égale à 3,5 ua.

{width:400,height:400,cols:5,rows:5,ua:[1,2]}

this.onload = function() {
    var me = this;
    var wait = function() {
        if ((me.reponse.find("#input-1") === null)||(me.reponse.find("#input-2") === null)) {
            setTimeout(wait, 100);
        } else {
            var G = me.question.find("#grid");
            var P = me.question.find("params").innerText;
            var ALL = [];
            var REPS = (me.reponse.find("#input-2").value) ? JSON.parse(me.reponse.find("#input-2").value) : null;
            var d;
            P = P.replace(/(\w*):/g, "\"$1\":");
            P = JSON.parse(P);
            var W = P.width;
            var H = P.height;
            G.inner("").stl(`width:${P.width}px;height:${P.height}px`);
            G.mdown = false;
            G.selected = false;
            G.paint = function(_elt) {
                if (_elt.selected) {
                    _elt.stl("background-color:orange");
                } else {
                    _elt.stl("background-color:unset");
                };
            };
            G.store = function() {
                var reps = [];
                var count = 0;
                var line;
                for (var i = 0; i < ALL.length; i++) {
                    line = [];
                    for (var j = 0; j < ALL[i].length; j++) {
                        line.push(ALL[i][j].selected);
                        if (ALL[i][j].selected) count++;
                    }
                    reps.push(line);
                };
                me.reponse.find("#input-2").val(JSON.stringify(reps));
                me.reponse.find("#input-2").dispatchEvent(new KeyboardEvent('keyup', {}));
                me.reponse.find("#input-1").val(count);
                me.reponse.find("#input-1").dispatchEvent(new KeyboardEvent('keyup', {}));
            };
            var line;
            for (var i = 0; i < P.rows; i++) {
                line = [];
                for (var j = 0; j < P.cols; j++) {
                    d = $.create("div").stl(`position:absolute;left:${j*W/P.cols}px;top:${i*H/P.rows}px;width:${W/P.cols}px;height:${H/P.rows}px;border:1px solid gray;`);
                    if ((j < P.cols - P.ua[0]) || (i >= P.ua[1])) {
                        d.rank = [i, j];
                        d.selected = REPS ? REPS[i][j] : false;
                        d.mousedown(function(e) {
                            var elt = e.target;
                            G.mdown = true;
                            G.selected = elt.selected = !elt.selected;
                            G.paint(elt);
                        });
                        d.mouseup(function() {
                            G.selected = G.mdown = false;
                            G.store();
                        });
                        d.mouseover(function(e) {
                            if (G.mdown) {
                                var elt = e.target;
                                elt.selected = G.selected;
                                G.paint(elt);
                            }
                        });
                        G.paint(d);
                    }
                    line.push(d);
                    G.add(d);
                };
                ALL.push(line);
            };
            var UA = $.create("div").stl(`position:absolute;left:${W-P.ua[0]*W/P.cols}px;top:0px;width:${P.ua[0]*W/P.cols}px;height:${P.ua[1]*H/P.rows}px;border:3px solid black;background-color:rgba(200,200,200,0.5);font-size:24px;text-align:center;line-height:${P.ua[1]*H/P.rows}px;pointer-events: none;`);
            UA.inner("1 ua");
            G.add(UA);
        };
    };
    wait();
    me.reponse.hide();
};

[["7","int"],["[[true,true,true,false,null],[true,true,true,false,null],[true,false,false,false,false],[false,false,false,false,false],[false,false,false,false,false]]","empty"]]custom-line{"inps":[["","int"],["","empty"]],"sfx":""}Trace une figure d'aire égale à 3,1 ua.

{width:400,height:400,cols:10,rows:10,ua:[2,5]}

this.onload = function() {
    var me = this;
    var wait = function() {
        if ((me.reponse.find("#input-1") === null)||(me.reponse.find("#input-2") === null)) {
            setTimeout(wait, 100);
        } else {
            var G = me.question.find("#grid");
            var P = me.question.find("params").innerText;
            var ALL = [];
            var REPS = (me.reponse.find("#input-2").value) ? JSON.parse(me.reponse.find("#input-2").value) : null;
            var d;
            P = P.replace(/(\w*):/g, "\"$1\":");
            P = JSON.parse(P);
            var W = P.width;
            var H = P.height;
            G.inner("").stl(`width:${P.width}px;height:${P.height}px`);
            G.mdown = false;
            G.selected = false;
            G.paint = function(_elt) {
                if (_elt.selected) {
                    _elt.stl("background-color:orange");
                } else {
                    _elt.stl("background-color:unset");
                };
            };
            G.store = function() {
                var reps = [];
                var count = 0;
                var line;
                for (var i = 0; i < ALL.length; i++) {
                    line = [];
                    for (var j = 0; j < ALL[i].length; j++) {
                        line.push(ALL[i][j].selected);
                        if (ALL[i][j].selected) count++;
                    }
                    reps.push(line);
                };
                me.reponse.find("#input-2").val(JSON.stringify(reps));
                me.reponse.find("#input-2").dispatchEvent(new KeyboardEvent('keyup', {}));
                me.reponse.find("#input-1").val(count);
                me.reponse.find("#input-1").dispatchEvent(new KeyboardEvent('keyup', {}));
            };
            var line;
            for (var i = 0; i < P.rows; i++) {
                line = [];
                for (var j = 0; j < P.cols; j++) {
                    d = $.create("div").stl(`position:absolute;left:${j*W/P.cols}px;top:${i*H/P.rows}px;width:${W/P.cols}px;height:${H/P.rows}px;border:1px solid gray;`);
                    if ((j < P.cols - P.ua[0]) || (i >= P.ua[1])) {
                        d.rank = [i, j];
                        d.selected = REPS ? REPS[i][j] : false;
                        d.mousedown(function(e) {
                            var elt = e.target;
                            G.mdown = true;
                            G.selected = elt.selected = !elt.selected;
                            G.paint(elt);
                        });
                        d.mouseup(function() {
                            G.selected = G.mdown = false;
                            G.store();
                        });
                        d.mouseover(function(e) {
                            if (G.mdown) {
                                var elt = e.target;
                                elt.selected = G.selected;
                                G.paint(elt);
                            }
                        });
                        G.paint(d);
                    }
                    line.push(d);
                    G.add(d);
                };
                ALL.push(line);
            };
            var UA = $.create("div").stl(`position:absolute;left:${W-P.ua[0]*W/P.cols}px;top:0px;width:${P.ua[0]*W/P.cols}px;height:${P.ua[1]*H/P.rows}px;border:3px solid black;background-color:rgba(200,200,200,0.5);font-size:24px;text-align:center;line-height:${P.ua[1]*H/P.rows}px;pointer-events: none;`);
            UA.inner("1 ua");
            G.add(UA);
        };
    };
    wait();
    me.reponse.hide();
};

[["31","int"],["[[true,true,true,true,true,true,false,false,null,null],[true,true,true,true,true,true,false,false,null,null],[true,true,true,true,true,true,false,false,null,null],[true,true,true,true,true,true,false,false,null,null],[true,true,true,true,true,true,false,false,null,null],[true,false,false,false,false,false,false,false,false,false],[false,false,false,false,false,false,false,false,false,false],[false,false,false,false,false,false,false,false,false,false],[false,false,false,false,false,false,false,false,false,false],[false,false,false,false,false,false,false,false,false,false]]","empty"]]custom-line{"inps":[["","int"],["","empty"]],"sfx":""}