{"id":41413,"date":"2022-12-14T13:35:58","date_gmt":"2022-12-14T13:35:58","guid":{"rendered":"https:\/\/pitchmark.com\/serpent\/"},"modified":"2023-11-28T14:32:19","modified_gmt":"2023-11-28T14:32:19","slug":"serpent","status":"publish","type":"page","link":"https:\/\/pitchmark.com\/fr\/serpent\/","title":{"rendered":"Serpent"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"41413\" class=\"elementor elementor-41413 elementor-33883\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-3bec0014 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"3bec0014\" data-element_type=\"section\" data-e-type=\"section\" id=\"top\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d2b4a19\" data-id=\"d2b4a19\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2197bec8 elementor-widget elementor-widget-heading\" data-id=\"2197bec8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Serpent<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-53bfe61d elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"53bfe61d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6d79b9a1 elementor-widget elementor-widget-heading\" data-id=\"6d79b9a1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Vous n'\u00e9tiez pas cens\u00e9 trouver \u00e7a.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-76071bf4 elementor-widget elementor-widget-text-editor\" data-id=\"76071bf4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div style=\"margin: 0px; padding: 0px; color: #666666; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 14px;\" data-hook=\"rcv-block1\">Utilisez les touches W,A,S,D de votre clavier pour contr\u00f4ler le serpent en bas et ramasser les pommes sans revenir sur vous.<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-83f1dc9 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"83f1dc9\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-214af17\" data-id=\"214af17\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5abb0d8 elementor-widget elementor-widget-html\" data-id=\"5abb0d8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t  \n\n  \n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <meta http-equiv=\"X-UA-Compatible\" content=\"ie=bord\">\n    <title>Jeu de serpent utilisant HTML et Javascript - Studytonight<\/title>\n    <style>\n        .game-box {\n            text-align:center;   \n        }\n        .game-info {\n            text-align:center; \n            font-family:arial;\n            line-height:24px;\n        }\n    <\/style>\n  \n  \n    <div class=\"game-box\"><canvas id=\"canvas\" width=\"400\" height=\"400\"><\/canvas><\/div>\n    <div class=\"game-info\">\n        \n        <p id=\"game-status\"><\/p>\n        <p id=\"game-score\"><\/p>\n    <\/div>\n\n    <script>\n      var canvas, ctx, gameControl, gameActive;\n      \/\/ render X times per second\n      var x = 8;\n      \n      const CANVAS_BORDER_COLOUR = '#3c3c3b';\n      const CANVAS_BACKGROUND_COLOUR = \"#21532b\";\n      const SNAKE_COLOUR = 'white';\n      const SNAKE_BORDER_COLOUR = '#358f43';\n\n\n      window.onload = function() {\n        canvas = document.getElementById(\"canvas\");\n        ctx = canvas.getContext(\"2d\");\n\n        document.addEventListener(\"keydown\", keyDownEvent);\n\n        gameControl = startGame(x);\n      };\n      \n      \/* function to start the game *\/\n      function startGame(x) {\n          \/\/ setting gameActive flag to true\n          gameActive = true;\n          document.getElementById(\"game-status\").innerHTML = \"<small>Game Started<\/small>\";\n          document.getElementById(\"game-score\").innerHTML = \"\";\n          return setInterval(draw, 1000 \/ x);\n      }\n      \n      function pauseGame() {\n          \/\/ setting gameActive flag to false\n          clearInterval(gameControl);\n          gameActive = false;\n          document.getElementById(\"game-status\").innerHTML = \"<small>Game Paused<\/small>\";\n      }\n      \n      function endGame(x) {\n          \/\/ setting gameActive flag to false\n          clearInterval(gameControl);\n          gameActive = false;\n          document.getElementById(\"game-status\").innerHTML = \"<small>Game Over<\/small>\";\n          document.getElementById(\"game-score\").innerHTML = \"<h1>Score: \" + x + \"<\/h1>\";\n      }\n\n      \/\/ game world\n      var gridSize = (tileSize = 20); \/\/ 20 x 20 = 400\n      var nextX = (nextY = 0);\n\n      \/\/ snake\n      var defaultTailSize = 3;\n      var tailSize = defaultTailSize;\n      var snakeTrail = [];\n      var snakeX = (snakeY = 10);\n\n      \/\/ apple\n      var appleX = (appleY = 15);\n\n      \/\/ draw\n      function draw() {\n        \/\/ move snake in next pos\n        snakeX += nextX;\n        snakeY += nextY;\n\n        \/\/ snake over game world?\n        if (snakeX <0) { snakeX = gridSize - 1; } if (snakeX> gridSize - 1) {\n          snakeX = 0;\n        }\n\n        if (snakeY <0) { snakeY = gridSize - 1; } if (snakeY> gridSize - 1) {\n          snakeY = 0;\n        }\n\n        \/\/snake bite apple?\n        if (snakeX == appleX && snakeY == appleY) {\n          tailSize++;\n\n          appleX = Math.floor(Math.random() * gridSize);\n          appleY = Math.floor(Math.random() * gridSize);\n        }\n\n        \/\/  Select the colour to fill the canvas\n      ctx.fillStyle = CANVAS_BACKGROUND_COLOUR;\n      \/\/  Select the colour for the border of the canvas\n      ctx.strokestyle = CANVAS_BORDER_COLOUR;\n\n      \/\/ Draw a \"filled\" rectangle to cover the entire canvas\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n      \/\/ Draw a \"border\" around the entire canvas\n      ctx.strokeRect(0, 0, canvas.width, canvas.height);\n\n        \/\/ paint snake\n        ctx.fillStyle = SNAKE_COLOUR;\n        ctx.strokestyle = SNAKE_BORDER_COLOUR;\n        for (var i = 0; i <snakeTrail.length; i++) { ctx.fillRect( snakeTrail[i].x * tileSize, snakeTrail[i].y * tileSize, tileSize, tileSize ); ctx.strokeRect(snakeTrail[i].x * tileSize , snakeTrail[i].y* tileSize, tileSize, tileSize); \/\/snake bites it's tail? if (snakeTrail[i].x == snakeX && snakeTrail[i].y == snakeY) { if(tailSize> 3) {\n                endGame(tailSize);\n            }\n            tailSize = defaultTailSize;  \n          }\n        }\n\n        \/\/ paint apple\n        ctx.fillStyle = \"red\";\n        ctx.fillRect(appleX * tileSize, appleY * tileSize, tileSize, tileSize);\n\n        \/\/set snake trail\n        snakeTrail.push({ x: snakeX, y: snakeY });\n        while (snakeTrail.length > tailSize) {\n          snakeTrail.shift();\n        }\n      }\n\n      \/\/ input\n      function keyDownEvent(e) {\n        switch (e.keyCode) {\n          case 65:\n            nextX = -1;\n            nextY = 0;\n            break;\n          case 87:\n            nextX = 0;\n            nextY = -1;\n            break;\n          case 68:\n            nextX = 1;\n            nextY = 0;\n            break;\n          case 83:\n            nextX = 0;\n            nextY = 1;\n            break;\n          case 32:\n            if(gameActive == true) {\n                pauseGame();\n            }\n            else {\n                gameControl = startGame(x);\n            }\n            break;\n        }\n      }\n    <\/script>\n  \n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Serpent Vous n&rsquo;\u00e9tiez pas cens\u00e9 trouver \u00e7a. Utilisez les touches W,A,S,D de votre clavier pour contr\u00f4ler le serpent en bas et ramasser les pommes sans revenir sur vous. Jeu de serpent utilisant HTML et Javascript &#8211; Studytonight<\/p>\n","protected":false},"author":219820763,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_wpcom_ai_launchpad_about_page":false,"_wpcom_ai_launchpad_gallery_page":false,"footnotes":""},"class_list":["post-41413","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Serpent | Pitchmark<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/pitchmark.com\/fr\/serpent\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Serpent | Pitchmark\" \/>\n<meta property=\"og:description\" content=\"Serpent Vous n&rsquo;\u00e9tiez pas cens\u00e9 trouver \u00e7a. Utilisez les touches W,A,S,D de votre clavier pour contr\u00f4ler le serpent en bas et ramasser les pommes sans revenir sur vous. Jeu de serpent utilisant HTML et Javascript &#8211; Studytonight\" \/>\n<meta property=\"og:url\" content=\"https:\/\/pitchmark.com\/fr\/serpent\/\" \/>\n<meta property=\"og:site_name\" content=\"Pitchmark\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Linemarking\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-28T14:32:19+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@PitchmarkLtd\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/serpent\\\/\",\"url\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/serpent\\\/\",\"name\":\"Serpent | Pitchmark\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#website\"},\"datePublished\":\"2022-12-14T13:35:58+00:00\",\"dateModified\":\"2023-11-28T14:32:19+00:00\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/pitchmark.com\\\/fr\\\/serpent\\\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#website\",\"url\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/\",\"name\":\"Pitchmark\",\"description\":\"The Future Of Line Marking\",\"publisher\":{\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#organization\",\"name\":\"Pitchmark\",\"url\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/pitchmark.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Pitchmark-Dark-Green-Oval.png\",\"contentUrl\":\"https:\\\/\\\/pitchmark.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Pitchmark-Dark-Green-Oval.png\",\"width\":1348,\"height\":522,\"caption\":\"Pitchmark\"},\"image\":{\"@id\":\"https:\\\/\\\/pitchmark.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/Linemarking\",\"https:\\\/\\\/x.com\\\/PitchmarkLtd\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Serpent | Pitchmark","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/pitchmark.com\/fr\/serpent\/","og_locale":"fr_FR","og_type":"article","og_title":"Serpent | Pitchmark","og_description":"Serpent Vous n&rsquo;\u00e9tiez pas cens\u00e9 trouver \u00e7a. Utilisez les touches W,A,S,D de votre clavier pour contr\u00f4ler le serpent en bas et ramasser les pommes sans revenir sur vous. Jeu de serpent utilisant HTML et Javascript &#8211; Studytonight","og_url":"https:\/\/pitchmark.com\/fr\/serpent\/","og_site_name":"Pitchmark","article_publisher":"https:\/\/www.facebook.com\/Linemarking","article_modified_time":"2023-11-28T14:32:19+00:00","twitter_card":"summary_large_image","twitter_site":"@PitchmarkLtd","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/pitchmark.com\/fr\/serpent\/","url":"https:\/\/pitchmark.com\/fr\/serpent\/","name":"Serpent | Pitchmark","isPartOf":{"@id":"https:\/\/pitchmark.com\/fr\/#website"},"datePublished":"2022-12-14T13:35:58+00:00","dateModified":"2023-11-28T14:32:19+00:00","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/pitchmark.com\/fr\/serpent\/"]}]},{"@type":"WebSite","@id":"https:\/\/pitchmark.com\/fr\/#website","url":"https:\/\/pitchmark.com\/fr\/","name":"Pitchmark","description":"The Future Of Line Marking","publisher":{"@id":"https:\/\/pitchmark.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/pitchmark.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/pitchmark.com\/fr\/#organization","name":"Pitchmark","url":"https:\/\/pitchmark.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pitchmark.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/pitchmark.com\/wp-content\/uploads\/2022\/11\/Pitchmark-Dark-Green-Oval.png","contentUrl":"https:\/\/pitchmark.com\/wp-content\/uploads\/2022\/11\/Pitchmark-Dark-Green-Oval.png","width":1348,"height":522,"caption":"Pitchmark"},"image":{"@id":"https:\/\/pitchmark.com\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Linemarking","https:\/\/x.com\/PitchmarkLtd"]}]}},"jetpack_likes_enabled":false,"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/PdSCqU-aLX","_links":{"self":[{"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/pages\/41413","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/users\/219820763"}],"replies":[{"embeddable":true,"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/comments?post=41413"}],"version-history":[{"count":4,"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/pages\/41413\/revisions"}],"predecessor-version":[{"id":54022,"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/pages\/41413\/revisions\/54022"}],"wp:attachment":[{"href":"https:\/\/pitchmark.com\/fr\/wp-json\/wp\/v2\/media?parent=41413"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}