Cartes de nombres: A-binaire

Description

Bonjour,

Ce jeu est souvent présenté comme un "tour de magie".
Pour un informaticien (même débutant), il n'y a pourtant rien de prodigieux !
En effet, pour chaque carte présentée, on demande (indirectement) si le i-ième chiffre binaire du nombre à deviner est 0 ou 1 (absent ou présent sur la carte).
Il suffit donc de faire la sommes des premiers nombres des cartes sur lesquelles figure l'entier à deviner.

Voici un code qui permet de dessiner une carte:
  function DrawCarte(K,X,Y) { // K=1,2,4,8,16,...; X,Y=position
    var x=X-24,y=Y-30,dx=16+nCol*wCol,dy=hCrt+24,xx=x+dx,yy=y+dy,w=X,s;
    var g=ctx.createLinearGradient(x,y,xx,yy);
    g.addColorStop(0,'#FFFF77'); g.addColorStop(1,'#FFBBFF');
    ctx.beginPath(); ctx.moveTo(x+R,y);                   //|
    ctx.arcTo(xx,y,xx,y+R,R); ctx.arcTo(xx,yy,xx-R,yy,R); //| rectangle arrondi
    ctx.arcTo(x,yy,x,yy-R,R); ctx.arcTo(x,y,x+R,y,R);     //|
    ctx.fillStyle=g; ctx.fill(); ctx.fillStyle='black';
    if (T>0) {ctx.lineWidth=T; ctx.stroke();} // contour au trait
    for (var n=1,m=0; n<=N; ++n)
      if (n&K) { // le nombre n appartient à la carte K
        ctx.fillText(s=n.toString(),w-ctx.measureText(s).width/2,Y);
        if ((++m)<nCol) w+=wCol; else {m=0; w=X; Y+=hLin;}
      }
  }
K est le premier nombre de la carte.

Le test if (n&K) {...} suffit pour déterminer si le nombre n figure sur la carte K.

Adaptez les couleurs dans les deux instructions g.addColorStop().

La fonction Param permet de lire et tester une nouvelle valeur.
Elle est accéptée si c'est un nombre entier entre limInf et limSup.
Sinon, l'ancienne valeur est réactivée:
  function Param(val,ele,limInf,limSup) { // ...
    var i=parseInt(ele.value);
    if ((i==NaN)||(i<limInf)||(i>limSup)) ele.value=''+(i=val);
    return i;
  }
ele est l'élément correspondant à une zone input.

Remarquez la manière très simple de copier un canvas dans une nouvelle fenêtre:
  function NewWin() {
    var win=window.open('','_blank','width='+(cnv.width+20)+
      ',height='+cnv.height+',scrollbars=1,resizable=1,replace=1');
    win.document.write('<img src="'+cnv.toDataURL()+'"/>');
  }

Le zip ne comporte qu'un seul fichier CartesBin.html qui permet d'obtenir beaucoup de variantes de ce jeu.
Après avoir modifié des paramètres, cliquez sur le bouton Draw pour afficher le résultat.
Avec le bouton New window, on peut ainsi récupérer l'image (et p.ex. l'imprimer et la découper).

Testé avec les dernières versions de:
Chrome, Edge, Explorer, Firefox, Opera, Safari.

Bonne lecture ...

Quelques liens:
La magie binaire
Binary Magic Trick
Un petit tour de magie pour se distraire ...
Cartes magiques
Récréomath: Cartes binaires
CARTES MAGIQUES

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.