From ad118eeb8ef457350930820ff4df0aef889269a8 Mon Sep 17 00:00:00 2001 From: Antonio Cuni Date: Thu, 28 Apr 2022 17:19:09 +0200 Subject: [PATCH 1/2] Refactor the demo page 1. Rename simple script into hello world 2. Rename simple script 2 into simple clock 3. Group demos into categories, starting with simple examples towards more complex ones --- .../{simple_script.html => hello_world.html} | 2 +- pyscriptjs/examples/index.html | 66 +++++++++++-------- ...{simple_script2.html => simple_clock.html} | 0 3 files changed, 40 insertions(+), 28 deletions(-) rename pyscriptjs/examples/{simple_script.html => hello_world.html} (93%) rename pyscriptjs/examples/{simple_script2.html => simple_clock.html} (100%) diff --git a/pyscriptjs/examples/simple_script.html b/pyscriptjs/examples/hello_world.html similarity index 93% rename from pyscriptjs/examples/simple_script.html rename to pyscriptjs/examples/hello_world.html index aaa3fbf..6ced2d8 100644 --- a/pyscriptjs/examples/simple_script.html +++ b/pyscriptjs/examples/hello_world.html @@ -4,7 +4,7 @@ - Simple script + PyScript Hello World diff --git a/pyscriptjs/examples/index.html b/pyscriptjs/examples/index.html index f35beaa..ffd1ec5 100644 --- a/pyscriptjs/examples/index.html +++ b/pyscriptjs/examples/index.html @@ -12,18 +12,53 @@ -

PyScript demos

+

PyScript demos

+ +
+

Basic examples

+

Hello world

+

A static demo of the <py-script> tag

+ +

Simple clock

+

A dynamic demo of the <py-script> tag

+ +

REPL

+

A Python REPL (Read Eval Print Loop).

+ +

REPL2

+

A Python REPL (Read Eval Print Loop) with slightly better formatting.

+ +

TODO App

+

Demo showing how would a Simple TODO App would look like in PyScript tag

+ +

PyScript Native TODO App

+

Demo showing how would a Simple TODO App would look like only using PyScript native elements tag

+ +
+

JS Interaction

+
+ +

Simple d3 visualization

+

Minimal d3 demo demonstrating how to create a visualization

+ +

Webgl Icosahedron Example

+

Demo showing how a Simple Webgl scene would work in PyScript tag

+ + +
+

Visualizations & Dashboards

+
+

Simple Static Bokeh Plot

+

Minimal Bokeh demo demonstrating how to create a simple bokeh plot from code

+

Bokeh Interactive

Interactive demo using a Bokeh slider widget to dynamically change a value in the page WARNING: This examples takes a little longer to load. So be patient :)

-

Simple Static Bokeh Plot

-

Minimal Bokeh demo demonstrating how to create a simple bokeh plot from code

-

KMeans Demo in Panel

Interactive KMeans Chart using Panel @@ -45,31 +80,8 @@

Freedom Units!

A Toga application (a Fahrenheit to Celsius converter), rendered as a Single Page App

-

Simple d3 visualization

-

Minimal d3 demo demonstrating how to create a visualization

-

Fractals with NumPy and canvas

Visualization of Mandelbrot and Julia sets with NumPy and HTML5 canvas

-

REPL

-

A Python REPL (Read Eval Print Loop).

- -

REPL2

-

A Python REPL (Read Eval Print Loop) with slightly better formatting.

- -

Simple script

-

A static demo of the <py-script> tag

- -

Simple script 2

-

A dynamic demo of the <py-script> tag

- -

TODO App

-

Demo showing how would a Simple TODO App would look like in PyScript tag

- -

PyScript Native TODO App

-

Demo showing how would a Simple TODO App would look like only using PyScript native elements tag

- -

Webgl Icosahedron Example

-

Demo showing how a Simple Webgl scene would work in PyScript tag

diff --git a/pyscriptjs/examples/simple_script2.html b/pyscriptjs/examples/simple_clock.html similarity index 100% rename from pyscriptjs/examples/simple_script2.html rename to pyscriptjs/examples/simple_clock.html From 1d643814212e99f2fba2bcb8702fdae6c861ada2 Mon Sep 17 00:00:00 2001 From: Antonio Cuni Date: Thu, 28 Apr 2022 17:27:16 +0200 Subject: [PATCH 2/2] add MIME rendering examples --- pyscriptjs/examples/index.html | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/pyscriptjs/examples/index.html b/pyscriptjs/examples/index.html index ffd1ec5..34cd04f 100644 --- a/pyscriptjs/examples/index.html +++ b/pyscriptjs/examples/index.html @@ -36,6 +36,19 @@

PyScript Native TODO App

Demo showing how would a Simple TODO App would look like only using PyScript native elements tag

+
+

MIME Rendering

+
+ +

Matplotlib

+

Demonstrates rendering matplotlib figure as output of the py-script tag

+ +

Altair

+

Demonstrates rendering altair plot as output of the py-script tag

+ +

Folium

+

Demonstrates rendering Folium map as output of the py-script tag

+

JS Interaction