From 6781d84b8a98f4c28efebaf7ed15d0666083ef11 Mon Sep 17 00:00:00 2001
From: MDN <actions@users.noreply.github.com>
Date: Sun, 6 Jun 2021 00:57:45 +0000
Subject: [CRON] sync translated content

---
 files/de/_redirects.txt                            |   1 +
 files/de/_wikihistory.json                         |  12 +-
 .../css/tools/cubic_bezier_generator/index.html    | 322 +++++++++++++++++++++
 .../css/tools/cubic_bezier_generator/index.html    | 321 --------------------
 4 files changed, 329 insertions(+), 327 deletions(-)
 create mode 100644 files/de/orphaned/web/css/tools/cubic_bezier_generator/index.html
 delete mode 100644 files/de/web/css/tools/cubic_bezier_generator/index.html

(limited to 'files/de')

diff --git a/files/de/_redirects.txt b/files/de/_redirects.txt
index b5a8e00f50..ff653c0d9c 100644
--- a/files/de/_redirects.txt
+++ b/files/de/_redirects.txt
@@ -606,6 +606,7 @@
 /de/docs/Web/CSS/Pseudoklasse	/de/docs/Web/CSS/Pseudo-classes
 /de/docs/Web/CSS/Referenz	/de/docs/Web/CSS/Reference
 /de/docs/Web/CSS/Spezifität	/de/docs/Web/CSS/Specificity
+/de/docs/Web/CSS/Tools/Cubic_Bezier_Generator	/de/docs/orphaned/Web/CSS/Tools/Cubic_Bezier_Generator
 /de/docs/Web/CSS/Vererbung	/de/docs/Web/CSS/inheritance
 /de/docs/Web/CSS/Wertdefinitionssyntax	/de/docs/Web/CSS/Value_definition_syntax
 /de/docs/Web/CSS/attr	/de/docs/Web/CSS/attr()
diff --git a/files/de/_wikihistory.json b/files/de/_wikihistory.json
index 3422f470b6..43d9e23e23 100644
--- a/files/de/_wikihistory.json
+++ b/files/de/_wikihistory.json
@@ -6062,12 +6062,6 @@
       "creativenitish"
     ]
   },
-  "Web/CSS/Tools/Cubic_Bezier_Generator": {
-    "modified": "2019-03-23T22:43:38.857Z",
-    "contributors": [
-      "Sebastianz"
-    ]
-  },
   "Web/CSS/Tools/Linear-gradient_Generator": {
     "modified": "2019-03-23T22:43:38.482Z",
     "contributors": [
@@ -14758,6 +14752,12 @@
       "Sebastianz"
     ]
   },
+  "orphaned/Web/CSS/Tools/Cubic_Bezier_Generator": {
+    "modified": "2019-03-23T22:43:38.857Z",
+    "contributors": [
+      "Sebastianz"
+    ]
+  },
   "orphaned/Web/Guide/Events": {
     "modified": "2019-03-18T21:10:49.464Z",
     "contributors": [
diff --git a/files/de/orphaned/web/css/tools/cubic_bezier_generator/index.html b/files/de/orphaned/web/css/tools/cubic_bezier_generator/index.html
new file mode 100644
index 0000000000..e36d2c78c0
--- /dev/null
+++ b/files/de/orphaned/web/css/tools/cubic_bezier_generator/index.html
@@ -0,0 +1,322 @@
+---
+title: Cubic Bezier Generator
+slug: orphaned/Web/CSS/Tools/Cubic_Bezier_Generator
+tags:
+  - CSS
+  - Werkzeuge
+translation_of: Web/CSS/Tools/Cubic_Bezier_Generator
+original_slug: Web/CSS/Tools/Cubic_Bezier_Generator
+---
+<div id="Tool">
+<div class="hidden">
+<pre class="brush:html">&lt;html&gt;
+    &lt;canvas id="bezier" width="336" height="336"&gt;
+    &lt;/canvas&gt;
+    &lt;form&gt;
+       &lt;label for="x1"&gt;x1 = &lt;/label&gt;&lt;input onchange="updateCanvas();" type="text" maxlength=6 id="x1" value="0.79" class='field'&gt;
+       &lt;label for="y1"&gt;y1 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y1" value="0.33" class='field'&gt;
+       &lt;label for="x2"&gt;x2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="x2" value="0.14" class='field'&gt;
+       &lt;label for="y2"&gt;y2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y2" value="0.53" class='field'&gt;
+       &lt;br&gt;
+       &lt;output id="output"&gt;Log&lt;/output&gt;
+    &lt;/form&gt;
+&lt;/html&gt;
+     </pre>
+
+<pre class="brush:css">.field {
+    width: 40px;
+}
+     </pre>
+
+<pre class="brush:js">function updateCanvas() {
+
+    var x1 = document.getElementById('x1').value;
+    var y1 = document.getElementById('y1').value;
+    var x2 = document.getElementById('x2').value;
+    var y2 = document.getElementById('y2').value;
+
+    drawBezierCurve(x1, y1, x2, y2);
+}
+
+const radius = 4;
+// Place needed to draw the rulers
+const rulers = 30.5;
+const margin = 10.5;
+const basic_scale_size = 5; // Size of 0.1 tick on the rulers
+var scaling; //LIMITATION: scaling is computed once: if canvas.height/canvas.width change it won't be recalculated
+var dragSM = 0; // Drag state machine: 0 = nodrag, others = object being dragged
+
+function initCanvas() {
+    // get the canvas element using the DOM
+    var canvas = document.getElementById('bezier');
+
+    // Make sure we don't execute when canvas isn't supported
+    if (canvas.getContext) {
+        // use getContext to use the canvas for drawing
+        var ctx = canvas.getContext('2d');
+
+        scaling = Math.min(canvas.height - rulers - margin, canvas.width - rulers - margin);
+
+        canvas.onmousedown = mouseDown;
+        canvas.onmouseup = mouseUp;
+    } else {
+        alert('You need Safari or Firefox 1.5+ to see this demo.');
+    }
+}
+
+function cX(x) {
+    return x * scaling + rulers;
+}
+
+function reverseX(x) {
+    return (x - rulers) / scaling;
+}
+
+function lX(x) {
+    //Used when drawing vertical lines to prevent subpixel blur
+    var result = cX(x);
+    return Math.round(result) == result ? result + 0.5 : result;
+}
+
+function cY(y) {
+
+    return (1 - y) * scaling + margin;
+}
+
+function reverseY(y) {
+    return (margin - y) / scaling + 1;
+}
+
+function lY(y) {
+    // Used when drawing horizontal lines to prevent subpixel blur
+    var result = cY(y);
+    return Math.round(result) == result ? result + 0.5 : result;
+}
+
+function drawBezierCurve(x1, y1, x2, y2) {
+
+    // get the canvas element using the DOM
+    var canvas = document.getElementById('bezier');
+
+    // Make sure we don't execute when canvas isn't supported
+    if (canvas.getContext) {
+
+        // use getContext to use the canvas for drawing
+        var ctx = canvas.getContext('2d');
+
+
+
+        // Clear canvas
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+        // Draw the rulers
+        ctx.beginPath();
+        ctx.strokeStyle = "black";
+
+        // Draw the Y axis
+        ctx.moveTo(cX(0), cY(0));
+        ctx.lineTo(cX(1), cY(0));
+        ctx.textAlign = "right";
+
+        for (var i = 0.1; i &lt;= 1; i = i + 0.1) {
+            ctx.moveTo(-basic_scale_size + cX(0), lY(i));
+            if ((i == 0.5) || (i &gt; 0.9)) {
+                ctx.moveTo(-2 * basic_scale_size + cX(0), lY(i));
+                ctx.fillText(Math.round(i * 10) / 10, -3 * basic_scale_size + cX(0), cY(i) + 4);
+                // Limitation the constant 4 should be font size dependant
+            }
+            ctx.lineTo(cX(0), lY(i));
+        }
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+
+        // Draw the Y axis label
+        ctx.save();
+        ctx.rotate(-Math.PI / 2);
+        ctx.textAlign = "left";
+        ctx.fillText("Output (Value Ratio)", -cY(0), -3 * basic_scale_size + cX(0));
+        ctx.restore();
+
+        // Draw the X axis
+        ctx.moveTo(cX(0), cY(0));
+        ctx.lineTo(cX(0), cY(1));
+        ctx.textAlign = "center";
+        for (i = 0.1; i &lt;= 1; i = i + 0.1) {
+            ctx.moveTo(lX(i), basic_scale_size + cY(0));
+            if ((i == 0.5) || (i &gt; 0.9)) {
+                ctx.moveTo(lX(i), 2 * basic_scale_size + cY(0));
+                ctx.fillText(Math.round(i * 10) / 10, cX(i), 4 * basic_scale_size + cY(0));
+                // Limitation the constant 4 should be dependant of the font size
+            }
+            ctx.lineTo(lX(i), cY(0));
+        }
+
+        // Draw the X axis label
+        ctx.textAlign = "left";
+        ctx.fillText("Input (Time Duration Ratio)", cX(0), 4 * basic_scale_size + cY(0));
+        // Limitation the constant 4 should be dependant of the font size
+        ctx.stroke();
+        ctx.closePath();
+
+        // Draw the Bézier Curve
+        ctx.beginPath();
+        ctx.moveTo(cX(0), cY(0));
+        ctx.strokeStyle = 'blue';
+        ctx.bezierCurveTo(cX(x1), cY(y1), cX(x2), cY(y2), cX(1), cY(1));
+        ctx.stroke();
+        ctx.closePath();
+
+
+
+        // Draw the P2 point (with a line to P0)
+        ctx.beginPath();
+        ctx.strokeStyle = 'red';
+        ctx.moveTo(cX(x1), cY(y1));
+        ctx.lineTo(cX(0), cY(0));
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+        ctx.moveTo(cX(x1), cY(y1));
+        ctx.arc(cX(x1), cY(y1), radius, 0, 2 * Math.PI);
+        ctx.stroke();
+        ctx.fillStyle = 'white';
+        ctx.fill();
+        ctx.closePath();
+
+
+
+        // Draw the P3 point (with a line to P1)
+        ctx.beginPath();
+        ctx.strokeStyle = 'red';
+        ctx.moveTo(cX(x2), cY(y2));
+        ctx.lineTo(cX(1), cY(1));
+        ctx.stroke();
+        ctx.closePath();
+
+        ctx.beginPath();
+        ctx.moveTo(cX(x2), cY(y2));
+        ctx.arc(cX(x2), cY(y2), radius, 0, 2 * Math.PI);
+        ctx.stroke();
+        ctx.fill();
+        ctx.closePath();
+
+        // Draw the P1(1,1) point (with dashed hints)
+        ctx.beginPath();
+        ctx.moveTo(cX(1), cY(1));
+        ctx.strokeStyle = 'lightgrey';
+        ctx.lineTo(cX(0), cY(1));
+        ctx.moveTo(cX(1), cY(1));
+        ctx.lineTo(cX(1), cY(0));
+        ctx.stroke();
+        ctx.closePath();
+
+        ctx.beginPath();
+        ctx.strokeStyle = "black";
+        ctx.fillStyle = "black";
+        ctx.arc(cX(1), cY(1), radius, 0, 2 * Math.PI);
+        ctx.fill();
+        ctx.stroke();
+        ctx.closePath();
+
+
+        // Draw the P0(0,0) point
+        ctx.beginPath();
+        ctx.arc(cX(0), cY(0), radius, 0, 2 * Math.PI);
+        ctx.fill();
+        ctx.stroke();
+        ctx.closePath();
+
+
+    } else {
+        alert('You need Safari or Firefox 1.5+ to see this demo.');
+    }
+}
+
+function mouseDown(e) {
+
+    var canvas = document.getElementById('bezier');
+
+    var x1 = cX(document.getElementById('x1').value);
+    var y1 = cY(document.getElementById('y1').value);
+
+    var x = e.pageX - canvas.offsetLeft;
+    var y = e.pageY - canvas.offsetTop;
+
+    var output = document.getElementById('output');
+    output.value = "(" + x + "," + y + ") should be (" + x1 + "," + y1 + ")";
+
+
+    if ((x1 + radius &gt;= x) &amp;&amp; (x1 - radius &lt;= x) &amp;&amp; (y1 + radius &gt;= y) &amp;&amp; (y1 - radius &lt;= y)) {
+        var output = document.getElementById('output');
+        output.value = "P1!";
+        dragSM = 1;
+    }
+
+    var x2 = cX(document.getElementById('x2').value);
+    var y2 = cY(document.getElementById('y2').value);
+
+    if ((x2 + radius &gt;= x) &amp;&amp; (x2 - radius &lt;= x) &amp;&amp; (y2 + radius &gt;= y) &amp;&amp; (y2 - radius &lt;= y)) {
+        var output = document.getElementById('output');
+        output.value = "P2!";
+        dragSM = 2;
+    }
+
+    // If we are starting a drag
+    if (dragSM != 0) {
+        canvas.onmousemove = mouseMove;
+    }
+}
+
+function mouseUp(e) {
+
+    var output = document.getElementById('output');
+    output.value = "Mouse up!";
+    dragSM = 0;
+    canvas.onmousemove = null;
+}
+
+function mouseMove(e) {
+    if (dragSM != 0) {
+        var canvas = document.getElementById('bezier');
+
+        var x = e.pageX - canvas.offsetLeft;
+        var y = e.pageY - canvas.offsetTop;
+
+        var output = document.getElementById('output');
+        output.value = "Drag!";
+
+        if (dragSM == 1) {
+            var x1 = document.getElementById('x1');
+            var y1 = document.getElementById('y1');
+            x1.value = reverseX(x);
+            x1.value = Math.round(x1.value * 10000) / 10000;
+            y1.value = reverseY(y);
+            y1.value = Math.round(y1.value * 10000) / 10000;
+            if (x1.value &lt; 0) { x1.value = 0; }
+            if (x1.value &gt; 1) { x1.value = 1; }
+        } else if (dragSM == 2) {
+            var x2 = document.getElementById('x2');
+            var y2 = document.getElementById('y2');
+            x2.value = reverseX(x);
+            x2.value = Math.round(x2.value * 10000) / 10000;
+            y2.value = reverseY(y);
+            y2.value = Math.round(y2.value * 10000) / 10000;
+            if (x2.value &lt; 0) { x2.value = 0; }
+            if (x2.value &gt; 1) { x2.value = 1; }
+        }
+        updateCanvas();
+    }
+}
+
+initCanvas();
+updateCanvas();
+     </pre>
+</div>
+
+<p>{{draft}}</p>
+
+<p><span class="seoSummary">Dies ist ein Beispielwerkzeug; es erlaubt die Bearbeitung von Bezierkurven. Es ist noch nicht wirklich nützlich, wird es aber sein!</span></p>
+
+<p>{{EmbedLiveSample("Tool", 1000, 2000)}}</p>
+</div>
diff --git a/files/de/web/css/tools/cubic_bezier_generator/index.html b/files/de/web/css/tools/cubic_bezier_generator/index.html
deleted file mode 100644
index a401f734aa..0000000000
--- a/files/de/web/css/tools/cubic_bezier_generator/index.html
+++ /dev/null
@@ -1,321 +0,0 @@
----
-title: Cubic Bezier Generator
-slug: Web/CSS/Tools/Cubic_Bezier_Generator
-tags:
-  - CSS
-  - Werkzeuge
-translation_of: Web/CSS/Tools/Cubic_Bezier_Generator
----
-<div id="Tool">
-<div class="hidden">
-<pre class="brush:html">&lt;html&gt;
-    &lt;canvas id="bezier" width="336" height="336"&gt;
-    &lt;/canvas&gt;
-    &lt;form&gt;
-       &lt;label for="x1"&gt;x1 = &lt;/label&gt;&lt;input onchange="updateCanvas();" type="text" maxlength=6 id="x1" value="0.79" class='field'&gt;
-       &lt;label for="y1"&gt;y1 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y1" value="0.33" class='field'&gt;
-       &lt;label for="x2"&gt;x2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="x2" value="0.14" class='field'&gt;
-       &lt;label for="y2"&gt;y2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y2" value="0.53" class='field'&gt;
-       &lt;br&gt;
-       &lt;output id="output"&gt;Log&lt;/output&gt;
-    &lt;/form&gt;
-&lt;/html&gt;
-     </pre>
-
-<pre class="brush:css">.field {
-    width: 40px;
-}
-     </pre>
-
-<pre class="brush:js">function updateCanvas() {
-
-    var x1 = document.getElementById('x1').value;
-    var y1 = document.getElementById('y1').value;
-    var x2 = document.getElementById('x2').value;
-    var y2 = document.getElementById('y2').value;
-
-    drawBezierCurve(x1, y1, x2, y2);
-}
-
-const radius = 4;
-// Place needed to draw the rulers
-const rulers = 30.5;
-const margin = 10.5;
-const basic_scale_size = 5; // Size of 0.1 tick on the rulers
-var scaling; //LIMITATION: scaling is computed once: if canvas.height/canvas.width change it won't be recalculated
-var dragSM = 0; // Drag state machine: 0 = nodrag, others = object being dragged
-
-function initCanvas() {
-    // get the canvas element using the DOM
-    var canvas = document.getElementById('bezier');
-
-    // Make sure we don't execute when canvas isn't supported
-    if (canvas.getContext) {
-        // use getContext to use the canvas for drawing
-        var ctx = canvas.getContext('2d');
-
-        scaling = Math.min(canvas.height - rulers - margin, canvas.width - rulers - margin);
-
-        canvas.onmousedown = mouseDown;
-        canvas.onmouseup = mouseUp;
-    } else {
-        alert('You need Safari or Firefox 1.5+ to see this demo.');
-    }
-}
-
-function cX(x) {
-    return x * scaling + rulers;
-}
-
-function reverseX(x) {
-    return (x - rulers) / scaling;
-}
-
-function lX(x) {
-    //Used when drawing vertical lines to prevent subpixel blur
-    var result = cX(x);
-    return Math.round(result) == result ? result + 0.5 : result;
-}
-
-function cY(y) {
-
-    return (1 - y) * scaling + margin;
-}
-
-function reverseY(y) {
-    return (margin - y) / scaling + 1;
-}
-
-function lY(y) {
-    // Used when drawing horizontal lines to prevent subpixel blur
-    var result = cY(y);
-    return Math.round(result) == result ? result + 0.5 : result;
-}
-
-function drawBezierCurve(x1, y1, x2, y2) {
-
-    // get the canvas element using the DOM
-    var canvas = document.getElementById('bezier');
-
-    // Make sure we don't execute when canvas isn't supported
-    if (canvas.getContext) {
-
-        // use getContext to use the canvas for drawing
-        var ctx = canvas.getContext('2d');
-
-
-
-        // Clear canvas
-        ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-        // Draw the rulers
-        ctx.beginPath();
-        ctx.strokeStyle = "black";
-
-        // Draw the Y axis
-        ctx.moveTo(cX(0), cY(0));
-        ctx.lineTo(cX(1), cY(0));
-        ctx.textAlign = "right";
-
-        for (var i = 0.1; i &lt;= 1; i = i + 0.1) {
-            ctx.moveTo(-basic_scale_size + cX(0), lY(i));
-            if ((i == 0.5) || (i &gt; 0.9)) {
-                ctx.moveTo(-2 * basic_scale_size + cX(0), lY(i));
-                ctx.fillText(Math.round(i * 10) / 10, -3 * basic_scale_size + cX(0), cY(i) + 4);
-                // Limitation the constant 4 should be font size dependant
-            }
-            ctx.lineTo(cX(0), lY(i));
-        }
-        ctx.stroke();
-        ctx.closePath();
-        ctx.beginPath();
-
-        // Draw the Y axis label
-        ctx.save();
-        ctx.rotate(-Math.PI / 2);
-        ctx.textAlign = "left";
-        ctx.fillText("Output (Value Ratio)", -cY(0), -3 * basic_scale_size + cX(0));
-        ctx.restore();
-
-        // Draw the X axis
-        ctx.moveTo(cX(0), cY(0));
-        ctx.lineTo(cX(0), cY(1));
-        ctx.textAlign = "center";
-        for (i = 0.1; i &lt;= 1; i = i + 0.1) {
-            ctx.moveTo(lX(i), basic_scale_size + cY(0));
-            if ((i == 0.5) || (i &gt; 0.9)) {
-                ctx.moveTo(lX(i), 2 * basic_scale_size + cY(0));
-                ctx.fillText(Math.round(i * 10) / 10, cX(i), 4 * basic_scale_size + cY(0));
-                // Limitation the constant 4 should be dependant of the font size
-            }
-            ctx.lineTo(lX(i), cY(0));
-        }
-
-        // Draw the X axis label
-        ctx.textAlign = "left";
-        ctx.fillText("Input (Time Duration Ratio)", cX(0), 4 * basic_scale_size + cY(0));
-        // Limitation the constant 4 should be dependant of the font size
-        ctx.stroke();
-        ctx.closePath();
-
-        // Draw the Bézier Curve
-        ctx.beginPath();
-        ctx.moveTo(cX(0), cY(0));
-        ctx.strokeStyle = 'blue';
-        ctx.bezierCurveTo(cX(x1), cY(y1), cX(x2), cY(y2), cX(1), cY(1));
-        ctx.stroke();
-        ctx.closePath();
-
-
-
-        // Draw the P2 point (with a line to P0)
-        ctx.beginPath();
-        ctx.strokeStyle = 'red';
-        ctx.moveTo(cX(x1), cY(y1));
-        ctx.lineTo(cX(0), cY(0));
-        ctx.stroke();
-        ctx.closePath();
-        ctx.beginPath();
-        ctx.moveTo(cX(x1), cY(y1));
-        ctx.arc(cX(x1), cY(y1), radius, 0, 2 * Math.PI);
-        ctx.stroke();
-        ctx.fillStyle = 'white';
-        ctx.fill();
-        ctx.closePath();
-
-
-
-        // Draw the P3 point (with a line to P1)
-        ctx.beginPath();
-        ctx.strokeStyle = 'red';
-        ctx.moveTo(cX(x2), cY(y2));
-        ctx.lineTo(cX(1), cY(1));
-        ctx.stroke();
-        ctx.closePath();
-
-        ctx.beginPath();
-        ctx.moveTo(cX(x2), cY(y2));
-        ctx.arc(cX(x2), cY(y2), radius, 0, 2 * Math.PI);
-        ctx.stroke();
-        ctx.fill();
-        ctx.closePath();
-
-        // Draw the P1(1,1) point (with dashed hints)
-        ctx.beginPath();
-        ctx.moveTo(cX(1), cY(1));
-        ctx.strokeStyle = 'lightgrey';
-        ctx.lineTo(cX(0), cY(1));
-        ctx.moveTo(cX(1), cY(1));
-        ctx.lineTo(cX(1), cY(0));
-        ctx.stroke();
-        ctx.closePath();
-
-        ctx.beginPath();
-        ctx.strokeStyle = "black";
-        ctx.fillStyle = "black";
-        ctx.arc(cX(1), cY(1), radius, 0, 2 * Math.PI);
-        ctx.fill();
-        ctx.stroke();
-        ctx.closePath();
-
-
-        // Draw the P0(0,0) point
-        ctx.beginPath();
-        ctx.arc(cX(0), cY(0), radius, 0, 2 * Math.PI);
-        ctx.fill();
-        ctx.stroke();
-        ctx.closePath();
-
-
-    } else {
-        alert('You need Safari or Firefox 1.5+ to see this demo.');
-    }
-}
-
-function mouseDown(e) {
-
-    var canvas = document.getElementById('bezier');
-
-    var x1 = cX(document.getElementById('x1').value);
-    var y1 = cY(document.getElementById('y1').value);
-
-    var x = e.pageX - canvas.offsetLeft;
-    var y = e.pageY - canvas.offsetTop;
-
-    var output = document.getElementById('output');
-    output.value = "(" + x + "," + y + ") should be (" + x1 + "," + y1 + ")";
-
-
-    if ((x1 + radius &gt;= x) &amp;&amp; (x1 - radius &lt;= x) &amp;&amp; (y1 + radius &gt;= y) &amp;&amp; (y1 - radius &lt;= y)) {
-        var output = document.getElementById('output');
-        output.value = "P1!";
-        dragSM = 1;
-    }
-
-    var x2 = cX(document.getElementById('x2').value);
-    var y2 = cY(document.getElementById('y2').value);
-
-    if ((x2 + radius &gt;= x) &amp;&amp; (x2 - radius &lt;= x) &amp;&amp; (y2 + radius &gt;= y) &amp;&amp; (y2 - radius &lt;= y)) {
-        var output = document.getElementById('output');
-        output.value = "P2!";
-        dragSM = 2;
-    }
-
-    // If we are starting a drag
-    if (dragSM != 0) {
-        canvas.onmousemove = mouseMove;
-    }
-}
-
-function mouseUp(e) {
-
-    var output = document.getElementById('output');
-    output.value = "Mouse up!";
-    dragSM = 0;
-    canvas.onmousemove = null;
-}
-
-function mouseMove(e) {
-    if (dragSM != 0) {
-        var canvas = document.getElementById('bezier');
-
-        var x = e.pageX - canvas.offsetLeft;
-        var y = e.pageY - canvas.offsetTop;
-
-        var output = document.getElementById('output');
-        output.value = "Drag!";
-
-        if (dragSM == 1) {
-            var x1 = document.getElementById('x1');
-            var y1 = document.getElementById('y1');
-            x1.value = reverseX(x);
-            x1.value = Math.round(x1.value * 10000) / 10000;
-            y1.value = reverseY(y);
-            y1.value = Math.round(y1.value * 10000) / 10000;
-            if (x1.value &lt; 0) { x1.value = 0; }
-            if (x1.value &gt; 1) { x1.value = 1; }
-        } else if (dragSM == 2) {
-            var x2 = document.getElementById('x2');
-            var y2 = document.getElementById('y2');
-            x2.value = reverseX(x);
-            x2.value = Math.round(x2.value * 10000) / 10000;
-            y2.value = reverseY(y);
-            y2.value = Math.round(y2.value * 10000) / 10000;
-            if (x2.value &lt; 0) { x2.value = 0; }
-            if (x2.value &gt; 1) { x2.value = 1; }
-        }
-        updateCanvas();
-    }
-}
-
-initCanvas();
-updateCanvas();
-     </pre>
-</div>
-
-<p>{{draft}}</p>
-
-<p><span class="seoSummary">Dies ist ein Beispielwerkzeug; es erlaubt die Bearbeitung von Bezierkurven. Es ist noch nicht wirklich nützlich, wird es aber sein!</span></p>
-
-<p>{{EmbedLiveSample("Tool", 1000, 2000)}}</p>
-</div>
-- 
cgit v1.2.3-54-g00ecf