Add another example. Fix the Jinja2 template to use TOML. Turn off mypy checking of examples.

Author: pauleveritt

.flake8

@@ -7,5 +7,6 @@ docstring-convention = google
 per-file-ignores =
     tests/*:S101
     src/psc/static/pyscript.py:D100,D101,D102,D103,D107,D200,D212,D415,N802,N806
+    src/psc/gallery/examples/*: F821
 rst-roles = class,const,func,meth,mod,ref
 rst-directives = deprecated

README.md

@@ -2,8 +2,8 @@
 
 A list of community contributed content that enriches PyScript's ecosystem.
 
-We strive to make people feel valued and valuable, and we hope to make lots of iterations with the help of the community to build a place that's inclusive and uplifting to all. 
-Please check our [code of conduct](https://github.com/pyscript/governance/blob/main/CODE-OF-CONDUCT.md). 
+We strive to make people feel valued and valuable, and we hope to make lots of iterations with the help of the community to build a place that's inclusive and uplifting to all.
+Please check our [code of conduct](https://github.com/pyscript/governance/blob/main/CODE-OF-CONDUCT.md).
 If you're interested in contributing head over to our [how to contribute](CONTRIBUTING.MD) document.
 
 ## `awesome-pyscript`

TODO.md

@@ -4,13 +4,13 @@
 
 ## Eventually
 
-- Upgrade mypy
-- Remove type hints from examples
-- Add another example
 - Get nox to work with downloaded pyodide/pyscript
 - Get rid of Poetry
 
 ## Done
 
 - Add a build step for the downloader
 - Upgrade to latest PyScript
+- Upgrade mypy
+- Remove type hints from examples
+- Add another example

awesome-pyscript.md

@@ -24,12 +24,12 @@ Got something to list in Awesome PyScript?
 
 Ongoing sources of articles, videos, and more.
 
-- [Articles and demos](https://jeff.glass/tags/pyscript/) by [Jeff Glass](https://twitter.com/jeffersglass) 
+- [Articles and demos](https://jeff.glass/tags/pyscript/) by [Jeff Glass](https://twitter.com/jeffersglass)
 - GIS and data science [PyScript tutorials](https://geo.rocks/categories/pyscript/) by [Dominik Weckmüller](https://twitter.com/domegis)
-- [PyScript in-depth articles](https://www.jhanley.com/blog/category/pyscript/) by [John Hanley](https://twitter.com/NeoPrimeAws). 
+- [PyScript in-depth articles](https://www.jhanley.com/blog/category/pyscript/) by [John Hanley](https://twitter.com/NeoPrimeAws).
 John has many useful articles discussing using PyScript in an app, what happens under the hood, and more.
 
-- [PyScript tutorial YouTube playlist](https://www.youtube.com/playlist?list=PLpdmBGJ6ELUJ2ujkBcMQ3n0D2J2exAVTs) multi-part video series by [@1littlecoder](https://twitter.com/1littlecoder) 
+- [PyScript tutorial YouTube playlist](https://www.youtube.com/playlist?list=PLpdmBGJ6ELUJ2ujkBcMQ3n0D2J2exAVTs) multi-part video series by [@1littlecoder](https://twitter.com/1littlecoder)
 
 ## Talks, Videos, Podcasts
 
@@ -38,7 +38,7 @@ Not a listing of everything -- only a few "first look" videos included.
 
 - [Rethinking Data Visualization with PyScript](https://youtu.be/Xd-tmhdLJp0) by [Valerio Maggio](https://twitter.com/leriomaggio) (July 2022)
 
-- [JupyterLite at EuroSciPy](https://twitter.com/sklearn_inria/status/1564524486057132032) ([repo](https://github.com/Vincent-Maladiere/scipy-demo)) by Vincent Maladiére and taught by 
+- [JupyterLite at EuroSciPy](https://twitter.com/sklearn_inria/status/1564524486057132032) ([repo](https://github.com/Vincent-Maladiere/scipy-demo)) by Vincent Maladiére and taught by
 [@ogrisel](https://twitter.com/ogrisel) (Aug 2022)
 
 - [Inside the PyScript Source](https://www.youtube.com/watch?v=SqNNLssFzm4) video by [Paul Everitt](https://twitter.com/paulweveritt/status) (May 2022)
@@ -59,9 +59,9 @@ Here are some of the recommended ones:
 - [PyScript - Deep Dive for Developer](https://www.youtube.com/watch?v=xAtoMtCfR3g) video by [Andrej Baranovskij](https://twitter.com/andrejusb) (May 2022)
 
 - [Python In The Browser! PyScript First Look](https://www.youtube.com/watch?v=vxqBm6_0vyk) video by [Traversy Media](https://twitter.com/traversymedia) (May 2022)
- 
+
 - [Python + pyscript + WebAssembly: Python Web Apps, Running Locally with pyscript](https://www.youtube.com/watch?v=lC2jUeDKv-s) video by [Michael Kennedy](https://twitter.com/mkennedy) (May 2022)
- 
+
 - [PyScript First Impressions - Run Python in HTML Document](https://www.youtube.com/watch?v=yrn1OYu9q0E) long livestream by [Mariya Sha](https://www.pythonsimplified.org) (May 2022)
 
 - [PyCon Keynote](https://www.youtube.com/watch?v=qKfkCY7cmBQ) by [Peter Wang](https://twitter.com/pwang) unveiling PyScript (Apr 2022)

poetry.lock

@@ -36,7 +36,7 @@ flake8-docstrings = ">=1.6.0"
 flake8-rst-docstrings = ">=0.2.5"
 furo = ">=2021.11.12"
 isort = ">=5.10.1"
-mypy = ">=0.930"
+mypy = ">=0.981"
 pep8-naming = ">=0.12.1"
 pre-commit = ">=2.16.0"
 pre-commit-hooks = ">=4.1.0"
@@ -87,7 +87,7 @@ show_column_numbers = true
 show_error_codes = true
 show_error_context = true
 files = ["src/psc", "tests"]
-exclude = [".nox", "docs","static","pyodide"]
+exclude = [".nox", "docs","static","pyodide", "src/psc/gallery"]
 no_implicit_optional = true
 
 [[tool.mypy.overrides]]

pyproject.toml

@@ -34,10 +34,11 @@ def download(
     dry_run: bool = typer.Option(False, "--dry-run")
 ) -> None:  # pragma: no cover
     """Download Pyodide and PyScript distributions into project dir."""
+    http = PoolManager()
+
     # Get Pyodide first
     pyodide_url_prefix = "https://github.com/pyodide/pyodide/releases/download"
     pyodide_url = f"{pyodide_url_prefix}/0.21.3/pyodide-build-0.21.3.tar.bz2"
-    http = PoolManager()
     pyodide_request: HTTPResponse = http.request("GET", pyodide_url)  # type: ignore
     with TemporaryDirectory() as tmp_dir_name:
         os.chdir(tmp_dir_name)
@@ -52,15 +53,19 @@ def download(
             print("Downloaded Pyodide")
 
     # Next, PyScript
-    pyscript_url = "https://pyscript.net/latest/pyscript.js"
-    pyscript_request: HTTPResponse = http.request("GET", pyscript_url)  # type: ignore
-    if not dry_run:
-        target = HERE / "pyscript"
+    filenames = ("pyscript.js", "pyscript.js.map")
+    for fn in filenames:
+        pyscript_url = f"https://pyscript.net/latest/{fn}"
+        pyscript_request: HTTPResponse = http.request(
+            "GET", pyscript_url
+        )  # type: ignore
         if not dry_run:
-            with open(target / "pyscript.js", "wb") as pyscript_output:
-                pyscript_output.write(pyscript_request.data)
+            target = HERE / "pyscript"
+            if not dry_run:
+                with open(target / fn, "wb") as pyscript_output:
+                    pyscript_output.write(pyscript_request.data)
 
-        print("Downloaded PyScript")
+    print("Downloaded PyScript")
 
 
 @app.command()

src/psc/__main__.py

@@ -9,8 +9,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
 
-    <title>Hello World</title>
-    <meta name="subtitle" content="The classic hello world, but in Python -- in a browser!">
+    <title>Hello World Python</title>
+    <meta name="subtitle" content="The hello world example, but in a .py file.">
 
     <link rel="icon" type="image/png" href="../../../favicon.png">
     <script defer src="../../../pyscript/pyscript.js"></script>

src/psc/gallery/examples/hello_world/index.html

@@ -0,0 +1,2 @@
+h1 {
+}

src/psc/gallery/examples/hello_world/index.md

@@ -0,0 +1 @@
+/* Stuff here */

src/psc/gallery/examples/hello_world_py/hello_world.css

@@ -0,0 +1,3 @@
+"""Say Hello."""
+output = Element("output")
+output.write("From Python...")

src/psc/gallery/examples/hello_world_py/hello_world.js

@@ -0,0 +1,34 @@
+<!--
+  contributor: example@contributor.me
+  tags: example-tag, another-example
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+
+    <title>Hello World</title>
+    <meta name="subtitle" content="The classic hello world, but in Python -- in a browser!">
+
+    <link rel="icon" type="image/png" href="../../../favicon.png">
+    <script defer src="../../../pyscript/pyscript.js"></script>
+    <link rel="stylesheet" href="hello_world.css">
+    <script defer src="hello_world.js"></script>
+</head>
+
+<body>
+<py-config>
+    autoclose_loader = true
+
+    [[runtimes]]
+    src = "../../../pyodide/pyodide.js"
+</py-config>
+<main>
+    <h1>Hello Python ...</h1>
+    <div id="output"></div>
+    <py-script src="./hello_world.py"></py-script>
+</main>
+</body>
+</html>

src/psc/gallery/examples/hello_world_py/hello_world.py

@@ -1,22 +1,21 @@
 {% extends "layout.jinja2" %}
 {% block extra_head %}
-    <meta name="subtitle" content="{{ subtitle }}" >
+    <meta name="subtitle" content="{{ subtitle }}">
     <script defer src="{{ root_path }}/pyscript/pyscript.js"></script>
     {{ extra_head | safe }}{% endblock %}
 {% block extra_body %}
-<py-config>
-autoclose_loader: true
-runtimes:
-    - src: "{{ root_path }}/pyodide/pyodide.js"
-      name: pyodide-0.20
-      lang: python
-</py-config>
-{{ extra_pyscript | safe }}
+    <py-config>
+        autoclose_loader = true
+
+        [[runtimes]]
+        src = "{{ root_path }}/pyodide/pyodide.js"
+    </py-config>
+    {{ extra_pyscript | safe }}
 {% endblock %}
 {% block main %}
-<main id="main_container" class="container">
-    <h1 class="title">{{ title }}</h1>
-    <h1 class="subtitle">{{ subtitle }}</h1>
-{{ main | safe }}
-</main>
+    <main id="main_container" class="container">
+        <h1 class="title">{{ title }}</h1>
+        <h1 class="subtitle">{{ subtitle }}</h1>
+        {{ main | safe }}
+    </main>
 {% endblock %}