From 5598e19e017b085749a160118a40120df17fbd5a Mon Sep 17 00:00:00 2001
From: dberardo-com <65530457+dberardo-com@users.noreply.github.com>
Date: Tue, 13 Feb 2024 08:22:01 +0100
Subject: [PATCH] Added plain html example

---
 examples/plain-html/index.html | 51 ++++++++++++++++++++++++++++++++++
 1 file changed, 51 insertions(+)
 create mode 100644 examples/plain-html/index.html
diff --git a/examples/plain-html/index.html b/examples/plain-html/index.html
new file mode 100644
index 000000000..6c95ea569
--- /dev/null
+++ b/examples/plain-html/index.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <script>
+      const getDb = async () => {
+        const duckdb = window.duckdbduckdbWasm;
+        // @ts-ignore
+        if (window._db) return window._db;
+        const JSDELIVR_BUNDLES = duckdb.getJsDelivrBundles();
+
+        // Select a bundle based on browser checks
+        const bundle = await duckdb.selectBundle(JSDELIVR_BUNDLES);
+
+        const worker_url = URL.createObjectURL(
+          new Blob([`importScripts("${bundle.mainWorker}");`], {
+            type: "text/javascript",
+          })
+        );
+
+        // Instantiate the asynchronus version of DuckDB-wasm
+        const worker = new Worker(worker_url);
+        // const logger = null //new duckdb.ConsoleLogger();
+        const logger = new duckdb.ConsoleLogger();
+        const db = new duckdb.AsyncDuckDB(logger, worker);
+        await db.instantiate(bundle.mainModule, bundle.pthreadWorker);
+        URL.revokeObjectURL(worker_url);
+        window._db = db;
+        return db;
+      };
+    </script>
+    <script type="module">
+      import * as duckdbduckdbWasm from "https://cdn.jsdelivr.net/npm/@duckdb/duckdb-wasm@1.28.1-dev106.0/+esm";
+      window.duckdbduckdbWasm = duckdbduckdbWasm;
+      getDb().then(async (db) => {
+        // Create a new connection
+        const conn = await db.connect();
+        // Prepare query
+        const stmt = await conn.prepare(
+          `SELECT v + ? FROM generate_series(0, 10000) AS t(v);`
+        );
+        // ... and run the query with materialized results
+        console.log((await stmt.query(234)).toArray());
+      });
+    </script>
+  </body>
+</html>
