unslug fr: move

1 files changed, 79 insertions, 0 deletions

diff --git a/files/fr/web/api/webgl_api/by_example/detect_webgl/index.html b/files/fr/web/api/webgl_api/by_example/detect_webgl/index.html
new file mode 100644
index 0000000000..fec1fd88a0
--- /dev/null
+++ b/files/fr/web/api/webgl_api/by_example/detect_webgl/index.html
@@ -0,0 +1,79 @@
+---
+title: Détecter WebGL
+slug: Web/API/WebGL_API/By_example/Détecter_WebGL
+tags:
+  - Apprendre
+  - Débutant
+  - Exemple
+  - Graphisme
+  - Tutoriel
+  - WebGL
+translation_of: Web/API/WebGL_API/By_example/Detect_WebGL
+---
+<div>{{IncludeSubnav("/fr/Apprendre")}}</div>
+
+<div>{{PreviousNext("Apprendre/WebGL/Par_exemple","Apprendre/WebGL/Par_exemple/Appliquer_des_couleurs")}}</div>
+
+<p class="summary">Dans cet exemple, on voit comment détecter un contexte de rendu {{Glossary("WebGL")}} et afficher le résultat à l'utilisateur.</p>
+
+<p>{{EmbedLiveSample("Détecter_le_support_WebGL",660,150)}}</p>
+
+<h3 id="Détecter_le_support_WebGL">Détecter le support WebGL</h3>
+
+<p>Dans ce premier exemple, on vérifie si le navigateur prend en charge {{Glossary("WebGL")}}. Pour cela, on essaye d'obtenir le {{domxref("WebGLRenderingContext","contexte de rendu WebGL","",1)}} à partir d'un élément {{domxref("HTMLCanvasElement","canvas")}}. Le {{domxref("WebGLRenderingContext","contexte de rendu WebGL", "", 1)}} est une interface qui permet de connaître et de modifier l'état du moteur graphique WebGL, d'envoyer des données à WebGL et d'exécuter des commandes de dessin.</p>
+
+<p>La gestion d'une machine graphique au sein d'une seule interface n'est pas propre à {{Glossary("WebGL")}}. Les autres {̣{Glossary("API")}} graphiques comme {{domxref("CanvasRenderingContext2D","le contexte de rendu 2D du canevas", "", 1)}}. Cependant, les propriétés et variables qui peuvent être manipulées changent d'une API à l'autre.</p>
+
+<pre class="brush: html">&lt;p&gt;[ On affichera ici le résultat de la détection du support WebGL ]&lt;/p&gt;
+&lt;button&gt;Cliquez ici pour détecter WebGLRenderingContext&lt;/button&gt;
+</pre>
+
+<pre class="brush: css">body {
+  text-align : center;
+}
+button {
+  display : block;
+  font-size : inherit;
+  margin : auto;
+  padding : 0.6em;
+}
+</pre>
+
+<pre class="brush: js">// On exécute tout dans le gestionnaire d'événement
+// correspondant au chargement de la fenêtre. De cette
+// façon, le DOM est complètement chargé et mis en forme
+// avant de le manipuler.
+window.addEventListener("load", function() {
+  var paragraph = document.querySelector("p"),
+    button = document.querySelector("button");
+
+  // On ajoute un gestionnaire d'événement pour
+  // le clic sur le bouton
+  button.addEventListener("click", detectWebGLContext, false);
+  function detectWebGLContext () {
+
+    // On crée un élément canvas. Le canvas n'est pas
+    // ajouté au document et il n'est donc jamais
+    // affiché dans la fenêtre du navigateur
+    var canvas = document.createElement("canvas");
+
+    // On récupère le contexte WebGLRenderingContext
+    // depuis l'élément canvas.
+    var gl = canvas.getContext("webgl")
+      || canvas.getContext("experimental-webgl");
+
+    // On affiche le résultat.
+    if (gl &amp;&amp; gl instanceof WebGLRenderingContext) {
+      paragraph.innerHTML =
+        "Félicitations, votre navigateur supporte WebGL.";
+    } else {
+      paragraph.innerHTML = "Échec du contexte WebGL. "
+        + "Votre navigateur peut ne pas supporter WebGL.";
+    }
+  }
+}, false);
+</pre>
+
+<p>Le code source de cet exemple est également disponible sur <a href="https://github.com/idofilin/webgl-by-example/tree/master/detect-webgl">GitHub</a>.</p>
+
+<div>{{PreviousNext("Apprendre/WebGL/Par_exemple","Apprendre/WebGL/Par_exemple/Appliquer_des_couleurs")}}</div>