{"id":183,"date":"2015-11-14T03:00:57","date_gmt":"2015-11-14T02:00:57","guid":{"rendered":"http:\/\/www.cmarzin.fr\/site\/?p=183"},"modified":"2016-01-07T23:47:10","modified_gmt":"2016-01-07T22:47:10","slug":"tetris","status":"publish","type":"post","link":"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/","title":{"rendered":"Tetris"},"content":{"rendered":"<p><script type=\"text\/javascript\" src=\"[insert_php]echo get_site_url();[\/insert_php]\/content\/tutos\/tetris\/jeu.js\"><\/script><\/p>\n<div class=\"sources\"><i class=\"fa fa-download\"><\/i> <a href=\"[insert_php]echo get_site_url();[\/insert_php]\/content\/tutos\/tetris\/tetris.rar\">Javascript<\/a> <a href=\"[insert_php]echo get_site_url();[\/insert_php]\/content\/tutos\/tetris\/tetrisfla.rar\">Actionscript<\/a>\n<\/div>\n<h2 class=\"bloctitle\">Pr\u00e9sentation<\/h2>\n<div class=\"bloc\">\n<div class=\"captures\">\n\t\t<style type=\"text\/css\">\n\t\t\t#gallery-1 {\n\t\t\t\tmargin: auto;\n\t\t\t}\n\t\t\t#gallery-1 .gallery-item {\n\t\t\t\tfloat: left;\n\t\t\t\tmargin-top: 10px;\n\t\t\t\ttext-align: center;\n\t\t\t\twidth: 25%;\n\t\t\t}\n\t\t\t#gallery-1 img {\n\t\t\t\tborder: 2px solid #cfcfcf;\n\t\t\t}\n\t\t\t#gallery-1 .gallery-caption {\n\t\t\t\tmargin-left: 0;\n\t\t\t}\n\t\t\t\/* see gallery_shortcode() in wp-includes\/media.php *\/\n\t\t<\/style>\n\t\t<div id='gallery-1' class='gallery galleryid-183 gallery-columns-4 gallery-size-thumbnail'><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris1.jpg' title=\"\" data-rl_title=\"\" class=\"rl-gallery-link\" data-rl_caption=\"\" data-rel=\"lightbox-gallery-1\"><img width=\"300\" height=\"169\" src=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris1-300x169.jpg\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris1-300x170.jpg 300w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris1-1024x579.jpg 1024w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris1.jpg 1274w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\n\t\t\t<\/dt><\/dl><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris2.jpg' title=\"\" data-rl_title=\"\" class=\"rl-gallery-link\" data-rl_caption=\"\" data-rel=\"lightbox-gallery-1\"><img width=\"300\" height=\"169\" src=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris2-300x169.jpg\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris2-300x169.jpg 300w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris2-1024x577.jpg 1024w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris2.jpg 1223w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\n\t\t\t<\/dt><\/dl><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris3.jpg' title=\"\" data-rl_title=\"\" class=\"rl-gallery-link\" data-rl_caption=\"\" data-rel=\"lightbox-gallery-1\"><img width=\"300\" height=\"169\" src=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris3-300x169.jpg\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris3-300x169.jpg 300w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris3-1024x578.jpg 1024w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris3.jpg 1687w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\n\t\t\t<\/dt><\/dl><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris4.jpg' title=\"\" data-rl_title=\"\" class=\"rl-gallery-link\" data-rl_caption=\"\" data-rel=\"lightbox-gallery-1\"><img width=\"300\" height=\"169\" src=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris4-300x169.jpg\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris4-300x169.jpg 300w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris4-1024x579.jpg 1024w, https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris4.jpg 1901w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\n\t\t\t<\/dt><\/dl><br style=\"clear: both\" \/>\n\t\t<\/div>\n<\/div>\n<p>Tetris est un jeu vid\u00e9o de puzzle con\u00e7u en 1984 par Alekse\u00ef Pajitnov. B\u00e2ti sur des r\u00e8gles simples et exigeant intelligence et adresse, il est l&rsquo;un des jeux vid\u00e9o les plus populaires au monde. Ses versions sont innombrables, y compris en 3D, et cette multiplicit\u00e9 se d\u00e9cline sur tous les types d&rsquo;ordinateurs.<\/p>\n<p>Il est consid\u00e9r\u00e9 comme un des grands classiques de l&rsquo;histoire des jeux vid\u00e9o aux c\u00f4t\u00e9s de Pong, Space Invaders ou encore Pac-Man.<\/p>\n<p>Des pi\u00e8ces de couleur (parfois il n&rsquo;y a pas de couleur, et ce sont les motifs sur les pi\u00e8ces qui changent) et de formes diff\u00e9rentes descendent du haut de l&rsquo;\u00e9cran. Le joueur ne peut pas ralentir ou emp\u00eacher cette chute mais peut l&rsquo;acc\u00e9l\u00e9rer ou d\u00e9cider \u00e0 quel angle de rotation (0\u00b0, 90\u00b0, 180\u00b0, 270\u00b0) et \u00e0 quel emplacement lat\u00e9ral l&rsquo;objet peut atterrir. Lorsqu&rsquo;une ligne horizontale est compl\u00e9t\u00e9e sans vide, elle dispara\u00eet et les blocs sup\u00e9rieurs tombent. Si le joueur ne parvient pas \u00e0 faire dispara\u00eetre les lignes assez vite et que l&rsquo;\u00e9cran se remplit jusqu&rsquo;en haut, il est submerg\u00e9 et la partie est finie.<\/p>\n<p>Le jeu ne se termine donc jamais par la victoire du joueur. Avant de perdre, le joueur doit tenter de compl\u00e9ter un maximum de lignes. Faire une seule ligne ne rapporte que 40 points, alors qu&rsquo;en faire 2 en rapporte 100, 3 lignes rapportent 300 et 4 lignes (le maximum) en rapportent 1200. Le nombre de points est augment\u00e9 \u00e0 chaque niveau selon l&rsquo;\u00e9quation f(p, n)= p(n+1) o\u00f9 p est le nombre de points au niveau 0 et n le niveau.<\/p>\n<p>Les pi\u00e8ces de Tetris, sur lesquelles repose enti\u00e8rement le jeu, sont des t\u00e9trominos. Il en existe sept formes diff\u00e9rentes, toutes bas\u00e9es sur un assemblage de quatre carr\u00e9s \u2013 le mot \u00ab Tetris \u00bb (du pr\u00e9fixe grec tetra-, qui signifie quatre) prend donc tout son sens. Le joueur peut faire tourner plusieurs fois, \u00e0 gauche et\/ou \u00e0 droite selon la version, de 90\u00b0 n&rsquo;importe quel bloc pour le poser de la fa\u00e7on d\u00e9sir\u00e9e pendant que le bloc descend. Chacune des sept pi\u00e8ces dispose d&rsquo;une couleur qui lui est propre, et certains joueurs se r\u00e9f\u00e8rent aux pi\u00e8ces seulement par ce d\u00e9tail. Au d\u00e9sarroi de ceux-ci, la couleur des pi\u00e8ces varie g\u00e9n\u00e9ralement d&rsquo;une version de Tetris \u00e0 une autre. Cependant, d&rsquo;apr\u00e8s les consignes de la Tetris Company, ceci n&rsquo;a aucune incidence sur le jeu.<\/p>\n<p>Le champ de jeu, aussi connu sous l&rsquo;appellation \u00ab puits \u00bb dans les anciens Tetris et en tant que \u00ab matrice \u00bb dans les plus r\u00e9cents, est l&rsquo;espace dans lequel tombent les pi\u00e8ces. Il dispose toujours d&rsquo;une grille en arri\u00e8re-plan, visible ou non, dont les cases sont de la m\u00eame grandeur que les carr\u00e9s des pi\u00e8ces, et que celles-ci suivent dans leur chute. Il est \u00e9galement entour\u00e9 par une armature appel\u00e9e \u00ab t\u00e9trion \u00bb, infranchissable, qui pose les limites du champ de jeu.<\/p>\n<p>La vitesse de la chute des pi\u00e8ces est d\u00e9termin\u00e9e par le niveau auquel vous \u00eates. Plus le niveau est \u00e9lev\u00e9, plus les pi\u00e8ces tombent vite. Au niveau 0 on peut faire 5-6 d\u00e9placements lat\u00e9raux avant que la pi\u00e8ce tombe d&rsquo;un rang, au niveau 9 on ne peut plus faire que 1-2 mouvements lat\u00e9raux. Le niveau 15 \u00e9quivaut au niveau de la vitesse \u00e0 tout le temps appuyer sur la fl\u00e8che du bas, il n&rsquo;y a plus de d\u00e9placements lat\u00e9raux possibles directement. Le joueur peut alors dans ce cas tenter de les r\u00e9aliser par des successions rapides de rotations, une pi\u00e8ce n&rsquo;est d\u00e9finitivement pos\u00e9e sur l&rsquo;\u00e9cran de jeu que dans le cas o\u00f9 le joueur cesse toute action sur celle-ci. En effectuant continuellement des rotations sur une pi\u00e8ce, le joueur l&#8217;emp\u00eache donc de se poser d\u00e9finitivement, il est alors possible d&rsquo;op\u00e9rer des d\u00e9placements lat\u00e9raux et selon les cas il peut \u00eatre envisageable de faire passer une pi\u00e8ce par dessus une autre d\u00e9j\u00e0 pos\u00e9e. Ainsi il est toujours possible de placer et d&rsquo;orienter de fa\u00e7on enti\u00e8rement libre une pi\u00e8ce quel que soit le niveau de jeu en cours.<\/p>\n<p>Nous n&rsquo;allons bien entendu pas reproduire la totalit\u00e9 du comportement du jeu, d&rsquo;une part car il s&rsquo;agit d&rsquo;un exercice et non d&rsquo;un moteur tout pr\u00eat, et d&rsquo;autre part car il faut bien qu&rsquo;il vous reste un peu de grain \u00e0 moudre de votre c\u00f4t\u00e9<\/p><\/div>\n<div class=\"lsep\"><\/div>\n<div class=\"sourcesdown\"><i class=\"fa fa-book\"><\/i> <a href=\"https:\/\/fr.wikipedia.org\/wiki\/Tetris\" target=\"_blank\">Wikipedia<\/a> <a href=\"http:\/\/forums.mediabox.fr\/wiki\/tutoriaux\/javascript\/divers\/exercice_tetris\" target=\"_blank\">Mediabox<\/a><\/div>\n<h2 class=\"bloctitle\">Le code Javascript de la classe jeu.js<\/h2>\n<div class=\"bloccode\">\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\/\/ variables\r\nvar canvas,ctx,W,H,posX,posY,images,grille,pieces,lateral,vitesse,timer,piece,nextP,nextColor,stock,preview,cadence,T,jeuX,jeuY,previewX,previewY,sounds;\r\n \r\nvar fond = new Image();\r\nfond.src = &quot;assets\/fond.jpg&quot;;\r\n \r\n\/\/ importer un fichier \r\nfunction include(fileName){\r\n\tdocument.write(&quot;&lt;script type='text\/javascript' src='js\/&quot;+fileName+&quot;.js'&gt;&lt;\/script&gt;&quot; );\r\n}\r\ninclude(&quot;piece&quot;); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ importer la classe Piece\r\ninclude(&quot;bloc&quot;); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ importer la classe Bloc\r\ninclude(&quot;sounds&quot;); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ importer la classe Sounds\r\n \r\nwindow.onload = function() {\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Pr\u00e9parer le jeu\r\n    canvas = document.getElementById('canvas');\t\t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9cup\u00e9re le canvas\r\n    ctx = canvas.getContext('2d');\t\t\t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9cup\u00e9re le context\r\n\tW = 480;\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ largeur du jeu\r\n\tH = 480;\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ hauteur du jeu\r\n\tposX = canvas.offsetLeft;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ d\u00e9calage du canvas sur X\r\n\tposY = canvas.offsetTop;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ d\u00e9calage du canvas sur Y\r\n\tcanvas.width = W;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ largeur du canvas\r\n\tcanvas.height = H;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ hauteur du canvas\r\n\tT = 21;\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ largeur des tuiles\r\n\tjeuX = \t\t4*T;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ position de la zone de jeu sur x\r\n\tjeuY = \t\t2*T;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ position de la zone de jeu sur y\r\n\tpreviewX = \t15*T;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ position de la zone de preview sur x\r\n\tpreviewY = \t2*T;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ position de la zone de preview sur y\r\n\tcanvas.setAttribute('tabindex','1'); \t\t\t\t\t\t\t\t\t\t\t\/\/ s\u00e9lectionne le canvas dans la page\r\n\tcanvas.focus(); \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ donne le focus au canvas\r\n\tloadImages(5);\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ charge 5 images\r\n}\t\t\r\n \r\nfunction loadImages(nbImg){\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Charger des images\r\n\timages = &#x5B;];\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ vide le tableau contenant les images \r\n\tfor(i=1; i&lt;nbImg+1; i++){\t\t\t\t\t\t\t\t\t\t\t\t\/\/ boucle sur le nombre d'images\r\n\t\tvar b = new Image();\t\t\t\t\t\t\t\t\t\t\t\t\/\/ cr\u00e9e une nouvelle image\r\n\t\tb.src = &quot;assets\/tuile&quot;+i+&quot;.jpg&quot;;\t\t\t\t\t\t\t\t\t\t\/\/ associe son bitmap\r\n\t\tb.onload = function() {\t\t\t\t\t\t\t\t\t\t\t\t\/\/ quand l'image est charg\u00e9e\r\n\t\t\timages.push(this);\t\t\t\t\t\t\t\t\t\t\t\/\/ ajoute la au stock d'images\r\n\t\t\tif(--nbImg==0) init();\t\t\t\t\t\t\t\t\t\t\t\/\/ s'il n'y a plus d'image \u00e0 charger initialise le jeu\r\n\t\t};\r\n\t}\r\n}\r\n \r\nfunction init() {\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Initialer le jeu\r\n\tstock = \t&#x5B;];\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ liste des blocs de la zone de jeu\r\n\tpreview = \t&#x5B;];\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ liste des blocs de la zone de preview\r\n\tgrille = \t&#x5B;];\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ grille affich\u00e9e \u00e0 l'\u00e9cran\r\n\tpieces = \t&#x5B;];\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ liste des diff\u00e9rents types de pieces\r\n\tvitesse = \t18;\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ vitesse du jeu\r\n\ttimer = \t0; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ d\u00e9compte le temps pass\u00e9\r\n\tpiece = \tnull; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la piece en cours de jeu\r\n\tnextP = \tMath.floor(Math.random()*7); \t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence de la prochaine piece\r\n\tnextColor = Math.floor(Math.random()*5); \t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence de la prochaine couleur\r\n\tcadence = \tsetInterval(update, 15); \t\t\t\t\t\t\t\t\t\t\/\/ cadence du jeu\r\n\tfor(var i=0; i&lt;20; i++)\t{grille.push(&#x5B;0,0,0,0,0,0,0,0,0,0])}; \t\t\t\t\t\t\t\t\/\/ cr\u00e9ation dela grille de jeu \r\n\tfor(var i=0; i&lt;7; i++)\t{pieces.push(new Piece(i,T,grille,stock))};\t \t\t\t\t\t\t\/\/ cr\u00e9ation des types de pieces \r\n\tdocument.addEventListener(&quot;keydown&quot;, keyDown, false); \t\t\t\t\t\t\t\t\t\/\/ \u00e9coute l'appui d'une touche sur la page\r\n\tsounds = new Sounds();\r\n}\r\n \r\nfunction keyDown(e){\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Gestion du clavier\r\n\tif (e.keyCode == 37 &amp;&amp; piece.checkMove(&quot;g&quot;)) lateral=true; \t\t\t\t\t\t\t\t\/\/ d\u00e9place la piece \u00e0 gauche \r\n\tif (e.keyCode == 39 &amp;&amp; piece.checkMove(&quot;d&quot;)) lateral=true; \t\t\t\t\t\t\t\t\/\/ d\u00e9place la piece \u00e0 droite \r\n\tif (e.keyCode == 38) piece.rotate(), sounds.rotate.play();\t \t\t\t\t\t\t\t\/\/ oriente la piece\r\n\tif (e.keyCode == 40) while(piece.checkMove(&quot;b&quot;)) timer = 0; \t\t\t\t\t\t\t\t\/\/ fait checkLine la piece \r\n}\r\n \r\nfunction update(e) {\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Mise \u00e0 jour du jeu\r\n\tpiece == null ? newPiece() : movePiece(); \t\t\t\t\t\t\t\t\t\t\/\/ cr\u00e9e une piece si aucune en cours, sinon d\u00e9place la\r\n\tlateral = false; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ annule les mouvements lat\u00e9raux \r\n\tcheckLine(); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ v\u00e9rifie si une ligne est remplie \r\n\trender(); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ rendu graphique du jeu\r\n};\r\n \r\nfunction newPiece(){\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Cr\u00e9er une piece\r\n\tpreview = &#x5B;]; \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ vide le tableau de preview\r\n\tpiece = pieces&#x5B;nextP]; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la piece devient la nouvelle piece\r\n\tpiece.init(nextColor); \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ initialise la piece avec la bonne couleur\r\n\tnextP = Math.floor(Math.random()*7); \t\t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence de la nouvelle piece\r\n\tnextColor = Math.floor(Math.random()*5); \t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence de la nouvelle couleur\r\n \tpieces&#x5B;nextP].buildPreview(preview,nextColor); \t\t\t\t\t\t\t\t\t\t\/\/ construit la preview de la nouvelle piece\r\n\tif(!piece.buildPiece()) gameover(); \t\t\t\t\t\t\t\t\t\t\t\/\/ construit la piece, fin de partie si un bloc touche le haut\r\n}\r\n \r\nfunction movePiece(){\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ D\u00e9placer la piece\r\n\tif (timer&gt;=vitesse || lateral) { \t\t\t\t\t\t\t\t\t\t\t\/\/ si mouvement lat\u00e9ral ou temps \u00e9coul\u00e9\r\n\t\tif (piece.checkMove(&quot;b&quot;)) { \t\t\t\t\t\t\t\t\t\t\t\/\/ si la piece peut descendre elle descend\r\n\t\t\tlateral ? piece.Y-- : timer = 0; \t\t\t\t\t\t\t\t\t\/\/ si mouvement lat\u00e9ral la piece remonte sinon fin du temps\r\n\t\t} else { \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ sinon\r\n\t\t\tsounds.touchDown.play();\t\t\t\t\t\t\t\t\t\t\/\/ bruitage\r\n\t\t\tpiece.drawInGrid(); \t\t\t\t\t\t\t\t\t\t\t\/\/ ajoute les blocs de la piece \u00e0 la grille\r\n\t\t\tpiece = null; \t\t\t\t\t\t\t\t\t\t\t\t\/\/ vide la piece en cours\r\n\t\t\tfor (var i=0;i&lt;stock.length;i++){ \t\t\t\t\t\t\t\t\t\/\/ parcours tous les blocs\r\n\t\t\t\tvar b = stock&#x5B;i]; \t\t\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence le bloc test\u00e9\r\n\t\t\t\tif (b.T == &quot;piece&quot;) { \t\t\t\t\t\t\t\t\t\t\/\/ si le bloc fait partie de la piece\r\n\t\t\t\t\tstock&#x5B;i--] = new Bloc(&quot;tuile&quot;,b.couleur,b.x\/T,b.y\/T); \t\t\t\t\t\/\/ remplace le bloc par une tuile\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t} else { \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ sinon\r\n\t\ttimer++; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ incr\u00e9mente le temps\r\n\t}\t\r\n}\r\n \r\nfunction checkLine(){\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ V\u00e9rifier si une ligne est remplie\r\n\tvar full,couleur,C,L,b,i, ligne = 19; \t\t\t\t\t\t\t\t\t\t\t\/\/ variables locales\r\n\twhile (ligne&gt;=0) {\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ teste toutes les lignes de l'aire de jeu \u00e0 partir de la derni\u00e8re\r\n\t\tfull = true; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ par d\u00e9faut la ligne est remplie\r\n\t\tfor(C=0; C&lt;10; C++){\t\t\t\t\t\t\t\t\t\t\t\t\/\/ v\u00e9rifie chaque colonne\r\n\t\t\tif(!grille&#x5B;ligne]&#x5B;C]) full = false; \t\t\t\t\t\t\t\t\t\/\/ si une case est vide la ligne n'est pas remplie\r\n\t\t}\r\n\t\tif (full) {\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ si la ligne est remplie\r\n\t\t\tsounds.full.play();\t\t\t\t\t\t\t\t\t\t\t\/\/ bruitage\r\n\t\t\tfor (i=stock.length-1;i&gt;=0; i--){\t\t\t\t\t\t\t\t\t\/\/ parcours tous les blocs\r\n\t\t\t\tif(stock&#x5B;i].L == ligne) stock.splice(i,1); \t\t\t\t\t\t\t\/\/ retire tous les blocs concernant cette ligne\r\n\t\t\t}\r\n\t\t\tfor (L=ligne; L&gt;0; L--) {\t\t\t\t\t\t\t\t\t\t\/\/ remonte les lignes depuis la derni\u00e8re\r\n\t\t\t\tfor (C=0; C&lt;10; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ parcours toutes les colonnes de la ligne \r\n\t\t\t\t\tgrille&#x5B;L]&#x5B;C] = grille&#x5B;L-1]&#x5B;C];\t\t\t\t\t\t\t\t\/\/ la case prend la r\u00e9f\u00e9rence de celle du dessus\r\n\t\t\t\t\tif (grille&#x5B;L]&#x5B;C]) {\t\t\t\t\t\t\t\t\t\/\/ si la case n'est pas vide\r\n\t\t\t\t\t\tfor (i=0;i&lt;stock.length;i++){\t\t\t\t\t\t\t\/\/ parcours tous les blocs\r\n\t\t\t\t\t\t\tb = stock&#x5B;i];\t\t\t\t\t\t\t\t\/\/ r\u00e9f\u00e9rence le bloc en cours\r\n\t\t\t\t\t\t\tif(b.L == L-1 &amp;&amp; b.C == C) {\t\t\t\t\t\t\/\/ si il s'agit du bloc au dessus de la case\r\n\t\t\t\t\t\t\t\tcouleur = b.couleur;\t\t\t\t\t\t\/\/ r\u00e9cup\u00e9re la couleur du bloc\r\n\t\t\t\t\t\t\t\tstock.splice(i,1);\t\t\t\t\t\t\/\/ supprime la le bloc\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\tstock.push(new Bloc(&quot;tuile&quot;,couleur,C,L));\t\t\t\t\t\/\/ cr\u00e9e une nouvelle tuile pour cette case\r\n\t\t\t\t\t}\t\t\t\t\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t\tfor (C=0; C&lt;10; C++) grille&#x5B;0]&#x5B;C] = 0;\t\t\t\t\t\t\t\t\t\/\/ vide la premi\u00e8re ligne de l'aire de jeu\r\n\t\t\tligne++; \t\t\t\t\t\t\t\t\t\t\t\t\/\/ ind\u00e9crement la ligne\r\n\t\t}\r\n\t\tligne--; \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ d\u00e9cr\u00e9mente la ligne\r\n\t}\r\n}\r\n \r\nfunction gameover(){\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Terminer la partie\r\n\tclearInterval(cadence); \t\t\t\t\t\t\t\t\t\t\t\t\/\/ stoppe la boucle principale\r\n\talert(&quot;game over&quot;); \t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ signale au joueur qu'il a perdu\r\n\tinit(); \t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ relance le jeu\r\n}\r\n \r\nfunction render() {\t\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ Dessiner le jeu\r\n\tctx.fillStyle = &quot;rgb(51,51,51)&quot;;\r\n\tctx.fillRect(0, 0, W, H);\r\n\tctx.drawImage(fond, 0, 0);\r\n\tfor(var i=0; i&lt;stock.length; i++){\r\n\t\tctx.drawImage(images&#x5B;stock&#x5B;i].couleur], stock&#x5B;i].x+jeuX, stock&#x5B;i].y+jeuY);\r\n\t}\r\n\tfor(var i=0; i&lt;preview.length; i++){\r\n\t\tctx.drawImage(images&#x5B;preview&#x5B;i].couleur], preview&#x5B;i].x+previewX, preview&#x5B;i].y+previewY);\r\n\t}\r\n}\r\n<\/pre>\n<\/div>\n<div class=\"lsep\"><\/div>\n<h2 class=\"bloctitle\">Le code Javascript de la classe blocs.js<\/h2>\n<div class=\"bloccode\">\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\/\/ l'objet Bloc\r\nfunction Bloc(type,color,C,L,cX=0,cY=0){\r\n\tthis.couleur = color;\t\t\t\t\t\t\/\/ couleur du bloc\r\n\tthis.C = C;\t\t\t\t\t\t\t\/\/ colonne\r\n\tthis.L = L;\t\t\t\t\t\t\t\/\/ ligne\r\n\tthis.x = (C+cX)*T;\t\t\t\t\t\t\/\/ position sur x\r\n\tthis.y = (L+cY)*T;\t\t\t\t\t\t\/\/ position sur y\r\n\tthis.T = type;\t\t\t\t\t\t\t\/\/ type de bloc\r\n \r\n\tthis.move = function(X,Y){\t\t\t\t\t\/\/ D\u00e9placer le bloc\r\n\t\tif (this.T == &quot;piece&quot;) {\t\t\t\t\/\/ si le bloc fait partie de la piece en cours\r\n\t\t\tthis.x = (this.C+Math.floor(X))*T;\t\t\/\/ nouvelle position sur x\r\n\t\t\tthis.y = (this.L+Math.floor(Y))*T;\t\t\/\/ nouvelle position sur y\r\n\t\t}\r\n\t}\r\n}\r\n<\/pre>\n<\/div>\n<div class=\"lsep\"><\/div>\n<h2 class=\"bloctitle\">Le code Javascript de la classe sounds.js<\/h2>\n<div class=\"bloccode\">\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\/\/ l'objet Sounds\r\nfunction Sounds(){\r\n\tthis.full = new Audio('assets\/SFX_line.ogg'); \r\n\tthis.touchDown = new Audio('assets\/SFX_PieceTouchDown.ogg'); \r\n\tthis.rotate = new Audio('assets\/SFX_rotate.ogg'); \r\n}\r\n<\/pre>\n<\/div>\n<div class=\"lsep\"><\/div>\n<h2 class=\"bloctitle\">Le code Javascript de la classe blocs.js<\/h2>\n<div class=\"bloccode\">\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\/\/ l'objet Piece\r\nfunction Piece(mapNum, T, grid, stock){\r\n \r\n\tthis.X = 4;\r\n\tthis.Y = 0;\r\n\tthis.T = T;\r\n\tthis.grille = grid;\r\n\tthis.stock = stock;\r\n\tthis.color = Math.floor(Math.random()*5);\r\n \r\n\tvar C;\r\n\tvar L;\r\n\tvar temp;\r\n\tvar maps = &#x5B;\r\n\t\t\t\t\t&#x5B;&#x5B;1,1,1,1],&#x5B;0,0,0,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;1,1,1,0],&#x5B;0,0,1,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;0,0,1,0],&#x5B;1,1,1,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;0,1,0,0],&#x5B;1,1,1,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;1,1,0,0],&#x5B;1,1,0,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;1,0,0,0],&#x5B;1,1,0,0],&#x5B;0,1,0,0],&#x5B;0,0,0,0]],\r\n\t\t\t\t\t&#x5B;&#x5B;0,1,0,0],&#x5B;1,1,0,0],&#x5B;1,0,0,0],&#x5B;0,0,0,0]]\r\n\t\t\t\t]\r\n \r\n\tvar map = maps&#x5B;mapNum];\t\r\n \r\n\tthis.init = function(color){\t\t\t\t\t\t\t\t\t\t\t\/\/ Initialiser la piece\r\n\t\tthis.X = 4;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ colonne\r\n\t\tthis.Y = 0;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ ligne\r\n\t\tthis.color = color;\t\t\t\t\t\t\t\t\t\t\t\/\/ couleur\r\n\t}\r\n \r\n\tthis.drawInGrid = function(){\t\t\t\t\t\t\t\t\t\t\t\/\/ Ajouter la piece dans la grille\r\n\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ colonnes de la ligne\r\n\t\t\t\tif (map&#x5B;L]&#x5B;C]) {\t\t\t\t\t\t\t\t\t\/\/ si la case est remplie\r\n\t\t\t\t\tthis.grille&#x5B;this.Y+L]&#x5B;C+this.X] = map&#x5B;L]&#x5B;C];\t\t\t\t\t\/\/ mise a jour de la grille\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\t\t\t\r\n \r\n\tthis.buildPiece = function(){\t\t\t\t\t\t\t\t\t\t\t\/\/ Construire la piece\r\n\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ colonnes de la piece\r\n\t\t\t\tif (map&#x5B;L]&#x5B;C]) {\t\t\t\t\t\t\t\t\t\/\/ si la case est remplie\r\n\t\t\t\t\tthis.stock.push(new Bloc(&quot;piece&quot;,this.color,C,L,this.X,this.Y));\t\t\/\/ ajoute le bloc correspondant\r\n\t\t\t\t\tif (this.grille&#x5B;this.Y+L]&#x5B;this.X+C]) return false;\t\t\t\t\/\/ si le bloc touche le haut de la zone de jeu, partie perdue\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn true;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la piece a \u00e9t\u00e9 construire\r\n\t}\r\n \r\n\tthis.buildPreview = function(tab,color){\t\t\t\t\t\t\t\t\t\/\/ Construire la preview\r\n\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ colonnes de la piece\r\n\t\t\t\tif (map&#x5B;L]&#x5B;C]) {\t\t\t\t\t\t\t\t\t\/\/ si la case est remplie\r\n\t\t\t\t\ttab.push(new Bloc(&quot;preview&quot;,color,C,L));\t\t\t\t\t\/\/ ajoute le bloc correspondant\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n \r\n\tthis.checkMove = function (dir) {\t\t\t\t\t\t\t\t\t\t\/\/ V\u00e9rifier si la piece peut bouger\r\n\t\tvar col = 0;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la nouvelle colone\r\n\t\tvar lig = 0;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la nouvelle ligne\r\n\t\tif(dir==&quot;b&quot;) lig = 1;\t\t\t\t\t\t\t\t\t\t\t\/\/ si la piece descend \r\n\t\tif(dir==&quot;g&quot;) col = -1;\t\t\t\t\t\t\t\t\t\t\t\/\/ si la piece va a gauche\r\n\t\tif(dir==&quot;d&quot;) col = 1;\t\t\t\t\t\t\t\t\t\t\t\/\/ si la piece va a droite\r\n\t\tfor (var L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (var C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\/\/ colonnes de la piece\r\n\t\t\t\tif(map&#x5B;L]&#x5B;C]) {\t\t\t\t\t\t\t\t\t\t\/\/ si la case n'est pas vide\r\n\t\t\t\t\tif(dir==&quot;b&quot; &amp;&amp; this.Y+L+1&gt;=20) \t\t\treturn false;\t\t\t\/\/ si le bloc sort par le bas, ne bouge pas\r\n\t\t\t\t\tif(dir==&quot;g&quot; &amp;&amp; this.X&lt;=0) \t\t\treturn false;\t\t\t\/\/ si le bloc sort par la gauche, ne bouge pas\r\n\t\t\t\t\tif(dir==&quot;d&quot; &amp;&amp; this.X+C+1&gt;9) \t\t\treturn false;\t\t\t\/\/ si le bloc sort par le droite, ne bouge pas\r\n\t\t\t\t\tif(this.grille&#x5B;this.Y+L+lig]&#x5B;this.X+C+col]) \treturn false;\t\t\t\/\/ si le bloc est occup\u00e9e dans la grille, ne bouge pas\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tthis.X += col;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ nouvelle colone\r\n\t\tthis.Y += lig;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ nouvelle ligne\r\n\t\tif(dir==&quot;b&quot;) {\t\t\t\t\t\t\t\t\t\t\t\t\/\/ si la piece descend\r\n\t\t\tfor (var i=0; i&lt;this.stock.length; i++) {\t\t\t\t\t\t\t\/\/ parcours tous les blocs\r\n\t\t\t\tthis.stock&#x5B;i].move(this.X,this.Y);\t\t\t\t\t\t\t\/\/ d\u00e9place le bloc\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn true;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la piece peut bouger\r\n\t}\r\n \r\n\tthis.rotate = function() {\t\t\t\t\t\t\t\t\t\t\t\/\/ Changer le sens de la piece\r\n\t\tif (this.checkRotation()){\t\t\t\t\t\t\t\t\t\t\/\/ si la piece peut bouger\r\n\t\t\tfor (var i=this.stock.length-1; i&gt;=0;i--){\t\t\t\t\t\t\t\/\/ parcours tous les blocs\r\n\t\t\t\tif (this.stock&#x5B;i].T == &quot;piece&quot;) this.stock.splice(i,1);\t\t\t\t\t\/\/ retire les blocs de la piece\r\n\t\t\t}\r\n\t\t\tthis.buildPiece();\t\t\t\t\t\t\t\t\t\t\/\/ construit la nouvelle piece\r\n\t\t}\r\n\t}\r\n \r\n\tthis.checkRotation = function() {\t\t\t\t\t\t\t\t\t\t\/\/ Tester si la nouvelle orientation est possible\r\n\t\ttemp = &#x5B;&#x5B;0,0,0,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0],&#x5B;0,0,0,0]];\t\t\t\t\t\t\t\/\/ orientation temporaire de la piece\r\n\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ colonnes de la ligne\r\n\t\t\t\ttemp&#x5B;C]&#x5B;3-L] = map&#x5B;L]&#x5B;C];\t\t\t\t\t\t\t\t\/\/ rotation de la piece\r\n\t\t\t}\r\n\t\t}\r\n\t\twhile (!(temp&#x5B;0]&#x5B;0] || temp&#x5B;1]&#x5B;0] || temp&#x5B;2]&#x5B;0] || temp&#x5B;3]&#x5B;0])) {\t\t\t\t\t\/\/ Tant que la premi\u00e8re colonne est vide\r\n\t\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\t\tfor (C=1; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\/\/ colonnes de la ligne\r\n\t\t\t\t\ttemp&#x5B;L]&#x5B;C-1] = temp&#x5B;L]&#x5B;C];\t\t\t\t\t\t\t\/\/ d\u00e9cale les colonnes vers la gauche\r\n\t\t\t\t}\r\n\t\t\t\ttemp&#x5B;L]&#x5B;3] = 0;\t\t\t\t\t\t\t\t\t\t\/\/ vide la derni\u00e8re colonne\r\n\t\t\t}\r\n\t\t}\r\n\t\tfor (L=0; L&lt;4; L++) {\t\t\t\t\t\t\t\t\t\t\t\/\/ lignes de la piece\r\n\t\t\tfor (C=0; C&lt;4; C++) {\t\t\t\t\t\t\t\t\t\t\/\/ colonnes de la ligne\r\n\t\t\t\tif (temp&#x5B;L]&#x5B;C]){ \t\t\t\t\t\t\t\t\t\/\/ si la case est remplie\r\n\t\t\t\t\tif (this.grille&#x5B;L + this.Y]&#x5B;C + this.X] || C + this.X &gt; 9 || L + this.Y &gt; 19) return false; \/\/ si une erreur est d\u00e9tect\u00e9e la piece n'est pas tourn\u00e9e\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tmap = temp;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ valide la nouvelle orientation de la piece\r\n\t\treturn true;\t\t\t\t\t\t\t\t\t\t\t\t\/\/ la piece est tourn\u00e9e\r\n\t}\r\n}\r\n<\/pre>\n<\/div>\n<div class=\"lsep\"><\/div>\n<div class=\"sourcesdown\"><i class=\"fa fa-cog\"><\/i> <a href=\"https:\/\/developer.mozilla.org\/fr\/docs\/Web\/API\/CanvasRenderingContext2D\" target=\"_blank\">Canvas Rendering Context 2D<\/a> <a href=\"https:\/\/developer.mozilla.org\/fr\/docs\/Web\/API\/WindowTimers\/setInterval\" target=\"_blank\">setInterval<\/a><\/div>\n<h2 class=\"bloctitle\">A retenir<\/h2>\n<div class=\"blocorange\">\nA ecrire&#8230;\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p><i class=\"fa fa-clock-o\"><\/i> 06h00<br \/>\n<i class=\"fa fa-user\"><\/i> Interm\u00e9diaire<br \/>\n<i class=\"fa fa-code\"><\/i> Moteur<br \/>\n<i class=\"fa fa-cog\"><\/i> Javascript<br \/>\n<i class=\"fa fa-graduation-cap\"><\/i> Tableaux et grilles<br \/>\n<i class=\"fa fa-suitcase\"><\/i> POO et Javascript avanc\u00e9<\/p>\n","protected":false},"author":1,"featured_media":166,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"aside","meta":[],"categories":[4],"tags":[11,23],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tetris - Cmarzin\" \/>\n<meta property=\"og:description\" content=\"06h00  Interm\u00e9diaire  Moteur  Javascript  Tableaux et grilles  POO et Javascript avanc\u00e9\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/\" \/>\n<meta property=\"og:site_name\" content=\"Cmarzin\" \/>\n<meta property=\"article:published_time\" content=\"2015-11-14T02:00:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2016-01-07T22:47:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"300\" \/>\n\t<meta property=\"og:image:height\" content=\"169\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Dur\u00e9e de lecture est.\">\n\t<meta name=\"twitter:data1\" content=\"14 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/#website\",\"url\":\"https:\/\/www.cmarzin.fr\/site\/\",\"name\":\"Cmarzin\",\"description\":\"Formation et d\\u00e9veloppement Web et Multimedias\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.cmarzin.fr\/site\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#primaryimage\",\"inLanguage\":\"fr-FR\",\"url\":\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris.jpg\",\"contentUrl\":\"https:\/\/www.cmarzin.fr\/site\/wp-content\/uploads\/tetris.jpg\",\"width\":300,\"height\":169},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#webpage\",\"url\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/\",\"name\":\"Tetris - Cmarzin\",\"isPartOf\":{\"@id\":\"https:\/\/www.cmarzin.fr\/site\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#primaryimage\"},\"datePublished\":\"2015-11-14T02:00:57+00:00\",\"dateModified\":\"2016-01-07T22:47:10+00:00\",\"author\":{\"@id\":\"https:\/\/www.cmarzin.fr\/site\/#\/schema\/person\/7c0008d57d9793c6cac9bea19c9dc1ba\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/\",\"url\":\"https:\/\/www.cmarzin.fr\/site\/\",\"name\":\"Accueil\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@id\":\"https:\/\/www.cmarzin.fr\/site\/2015\/11\/14\/tetris\/#webpage\"}}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/#\/schema\/person\/7c0008d57d9793c6cac9bea19c9dc1ba\",\"name\":\"cmarzin@noos.fr\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.cmarzin.fr\/site\/#personlogo\",\"inLanguage\":\"fr-FR\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2719b7011bb8e1850a08c47f07a022ed?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2719b7011bb8e1850a08c47f07a022ed?s=96&d=mm&r=g\",\"caption\":\"cmarzin@noos.fr\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/posts\/183"}],"collection":[{"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/comments?post=183"}],"version-history":[{"count":27,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/posts\/183\/revisions"}],"predecessor-version":[{"id":787,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/posts\/183\/revisions\/787"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/media\/166"}],"wp:attachment":[{"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/media?parent=183"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/categories?post=183"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cmarzin.fr\/site\/wp-json\/wp\/v2\/tags?post=183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}