diff --git a/site/render-as-img.html b/site/playground-render-as-img.html
similarity index 100%
rename from site/render-as-img.html
rename to site/playground-render-as-img.html
diff --git a/site/scale.html b/site/playground-scale.html
similarity index 100%
rename from site/scale.html
rename to site/playground-scale.html
diff --git a/site/playground.html b/site/playground.html
new file mode 100644
index 0000000..f75cece
--- /dev/null
+++ b/site/playground.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+	<meta charset="UTF-8">
+	<title>Function Plot</title>
+  <link rel="stylesheet" type="text/css" rel="noopener" target="_blank" href="./css/reset.css">
+<style>
+body, text {
+    font-family: Arial, sans-serif;
+    color: black;
+    font-size: 14px;
+}
+</style>
+</head>
+<body>
+  <div id="playground"></div>
+  <script src="function-plot.js"></script>
+<script>
+(function() {
+    functionPlot({
+        target: "#playground",
+        data: [
+            {
+                fn: "x^2"
+            }
+        ]
+    })
+})()
+</script>
+</body>
+</html>
diff --git a/site/sampling.html b/site/sampling.html
deleted file mode 100644
index d9d63d2..0000000
--- a/site/sampling.html
+++ /dev/null
@@ -1,134 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head lang="en">
-	<meta charset="UTF-8">
-	<title>sampling</title>
-  <style>
-    body {
-      font: 10px sans-serif;
-    }
-
-    .axis path,
-    .axis line {
-      fill: none;
-      stroke: #000;
-      shape-rendering: crispEdges;
-      opacity: 0.1;
-    }
-
-  </style>
-</head>
-<body>
-  <span id="sample-1"></span>
-  <span id="sample-2"></span>
-  <span id="sample-3"></span>
-  <span id="sample-4"></span>
-
-  <script src="js/vendor/d3.js"></script>
-  <script src="js/bundle.js"></script>
-  <script>
-    functionPlot({
-      target: '#sample-1',
-//      xDomain: [-1, 1],
-//      yDomain: [-1.5, 1.5],
-      data: [{
-//        fn: 'x^2'
-//        fn: 'x^3'
-//        fn: 'sin(exp(x))'
-//        fn: 'sin(300 * x)'
-//        fn: 'sin(x) / x'
-//        fn: '(x * sqrt(x - 2 + 1 / x)) / (x - 1)'
-//        fn: 'x < 1 ? -sqrt(x) : sqrt(x)'   // alternative
-//        fn: 'tan(x)'
-//        fn: '1 / x'
-//        fn: 'sin(1 / x)'
-//        fn: 'sqrt(x)'
-        fn: '1 + (x^2) + 0.0125 * log(abs(1 - 3 * (x - 1)))'
-      }]
-    });
-//    var a = functionPlot({
-//      target: '#sample-1',
-//      xDomain: [-0.5, 6],
-//      yDomain: [-1.5, 1.5],
-//      data: [{
-//        fn: function (x) {
-//          return Math.sin(Math.pow(Math.E, x));     // 1525 samples in google, 2953 full to the right
-////          return Math.sin(1 / x);
-////          return Math.sin(x);
-////          return Math.tan(x);
-////          return x * x;
-////          return 1 / x;
-//        },
-//        sampling: {
-////          initialSamples: 500,
-////          depth: 25
-////          eps: 0.01
-//        }
-//        ,graphOptions: {
-////          type: 'scatter'
-//        }
-//      }]
-//    });
-
-//    var b = functionPlot({
-//      target: '#sample-2',
-//      xDomain: [-0.5, 6],
-//      yDomain: [-1.5, 1.5],
-//      data: [{
-//        fn: function (x) {
-//          return Math.sin(Math.pow(Math.E, x));     // 1525 samples in google, 2953 full to the right
-////          return Math.sin(1 / x);
-////          return Math.sin(x);
-////          return Math.tan(x);
-////          return x * x;
-////          return 1 / x;
-//        },
-//        sampling: {
-//          initialSamples: 4000,
-//          depth: 0,
-////          eps: 0.01
-//        }
-////        ,graphOptions: {
-////          type: 'scatter'
-////        }
-//      }]
-//    });
-////    a.addLink(b);
-////    b.addLink(a);
-//
-//    functionPlot({
-//      target: '#sample-3',
-//      data: [{
-//        fn: function (x) {
-//          return x * x;
-//        },
-//        sampling: {
-//          initialSamples: 100,
-//          depth: 25
-//        },
-//        graphOptions: {
-//          type: 'scatter'
-//        }
-//      }]
-//    });
-//
-//    functionPlot({
-//      target: '#sample-4',
-//      data: [{
-//        fn: function (x) {
-////          return Math.tan(x);
-//          var a = 0.001;
-//          return x + a * a / (a * a + x * x);
-//        },
-//        sampling: {
-//          initialSamples: 500,
-//          depth: 25
-//        },
-//        graphOptions: {
-////          type: 'scatter'
-//        }
-//      }]
-//    });
-  </script>
-</body>
-</html>
