From 23724ae119adb51536a58043ea1ce51fd6faa01a Mon Sep 17 00:00:00 2001 From: Jo Franchetti Date: Mon, 17 Mar 2025 11:22:21 +0000 Subject: [PATCH 1/3] adding exmaple for createObjectURL --- examples/_data.ts | 5 + examples/scripts/create_object_url.ts | 200 ++++++++++++++++++++++++++ 2 files changed, 205 insertions(+) create mode 100644 examples/scripts/create_object_url.ts diff --git a/examples/_data.ts b/examples/_data.ts index b3669f778..65ce5321e 100644 --- a/examples/_data.ts +++ b/examples/_data.ts @@ -198,6 +198,11 @@ export const sidebar = [ href: "/examples/webassembly/", type: "example", }, + { + title: "Create object URL", + href: "/examples/create_object_url/", + type: "example", + }, ], }, diff --git a/examples/scripts/create_object_url.ts b/examples/scripts/create_object_url.ts new file mode 100644 index 000000000..04b299bda --- /dev/null +++ b/examples/scripts/create_object_url.ts @@ -0,0 +1,200 @@ +/** + * @title Create Object URL + * @difficulty beginner + * @tags web + * @run -allow-net + * @resource {https://docs.deno.com/api/web/~/URL.createObjectURL } Doc: Deno.createObjectURL + * @group Web Standard APIs + * + * Demonstrates using URL.createObjectURL() to create a downloadable text file from in-memory content. + */ + +// Create a basic HTML page with JavaScript that uses URL.createObjectURL() +const html = ` + + + URL.createObjectURL Demo + + + +

URL.createObjectURL Examples in Deno

+ +
+

Example 1: Generate Downloadable Text File

+ +

Creates a Blob containing text and generates a downloadable link

+
+ +
+

Example 2: Generate JSON File

+ +

Creates a Blob containing JSON data and generates a downloadable link

+
+ +
+

Example 3: Draw on Canvas and Export

+ +
+ + +
+

Draw on the canvas above and download the result as a PNG image

+
+ + + +`; + +// Start a simple server to serve the HTML page +console.log("Starting server at http://localhost:8000"); +await Deno.serve((req) => { + return new Response(html, { + headers: { "content-type": "text/html; charset=utf-8" }, + }); +}, { port: 8000 }); From 6f29f370e07812816a0283bbfa769fc90910276c Mon Sep 17 00:00:00 2001 From: Jo Franchetti Date: Mon, 17 Mar 2025 11:39:51 +0000 Subject: [PATCH 2/3] adding exmaple for createObjectURL --- examples/scripts/create_object_url.ts | 15 --------------- 1 file changed, 15 deletions(-) diff --git a/examples/scripts/create_object_url.ts b/examples/scripts/create_object_url.ts index 04b299bda..8863cbb16 100644 --- a/examples/scripts/create_object_url.ts +++ b/examples/scripts/create_object_url.ts @@ -21,21 +21,6 @@ const html = ` margin: 0 auto; padding: 20px; } - button { - padding: 10px 15px; - background: #4CAF50; - color: white; - border: none; - border-radius: 4px; - cursor: pointer; - margin: 10px 0; - } - pre { - background: #f4f4f4; - padding: 10px; - border-radius: 4px; - overflow: auto; - } .example { margin-bottom: 30px; border-bottom: 1px solid #eee; From a0ae819408faafbaf96bb702258d351f247f4952 Mon Sep 17 00:00:00 2001 From: Jo Franchetti Date: Mon, 17 Mar 2025 13:10:24 +0000 Subject: [PATCH 3/3] update as per review --- examples/scripts/create_object_url.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/examples/scripts/create_object_url.ts b/examples/scripts/create_object_url.ts index 8863cbb16..543ebafd0 100644 --- a/examples/scripts/create_object_url.ts +++ b/examples/scripts/create_object_url.ts @@ -1,8 +1,8 @@ /** - * @title Create Object URL + * @title Generate downloadable files * @difficulty beginner * @tags web - * @run -allow-net + * @run --allow-net * @resource {https://docs.deno.com/api/web/~/URL.createObjectURL } Doc: Deno.createObjectURL * @group Web Standard APIs * @@ -23,7 +23,7 @@ const html = ` } .example { margin-bottom: 30px; - border-bottom: 1px solid #eee; + border-bottom: 1px solid #eee;deno padding-bottom: 20px; }