Initial commit

.dockerignore

@@ -0,0 +1,6 @@
+.github/
+Dockerfile
+LICENSE
+README.md
+.gitignore
+.dockerignore

.github/workflows/update-hf.yml

@@ -0,0 +1,20 @@
+name: Update Hugging Face repository
+on:
+  push:
+    branches: [main]
+
+  workflow_dispatch:
+
+jobs:
+  push-to-hf:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+          lfs: true
+      - name: Push to Hugging Face
+        env:
+          HF_USER: ${{ secrets.HF_USER }}
+          HF_TOKEN: ${{ secrets.HF_TOKEN }}
+        run: git push https://$HF_USER:[email protected]/spaces/voila-dashboards/voila-huggingface main --force

.gitignore

@@ -0,0 +1,160 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#pdm.lock
+#   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
+#   in version control.
+#   https://pdm.fming.dev/#use-with-ide
+.pdm.toml
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/

Dockerfile

@@ -0,0 +1,20 @@
+FROM condaforge/mambaforge:latest
+
+# The HF Space container runs with user ID 1000.
+RUN useradd -m -u 1000 user
+USER user
+
+# Set home to the user's home directory
+ENV HOME=/home/user \
+  PATH=/home/user/.local/bin:$PATH
+
+# Set the working directory to the user's home directory
+WORKDIR $HOME/app
+COPY --chown=user . .
+
+RUN mamba env create --prefix $HOME/env  -f ./environment.yml
+
+EXPOSE 7860
+WORKDIR $HOME/app
+
+CMD mamba run -p $HOME/env --no-capture-output voila --no-browser notebooks/

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Voilà Dashboards
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,46 @@
+---
+title: Voila demo deployed on Hugging Face Spaces
+emoji: 🚀
+colorFrom: yellow
+colorTo: green
+sdk: docker
+pinned: true
+license: mit
+---
+
+
+> :warning: **The above header is required by Hugging Face!**
+
+# Voila demo deployed on Hugging Face Spaces
+
+This repository contains an example of deploying Voila dashboards from GitHub to [Hugging Face Spaces](https://huggingface.co/spaces). 
+
+![vl-hf](https://github.com/voila-dashboards/voila-huggingface/assets/4451292/48464930-c657-4a36-9f00-5eea576f956d)
+
+## Links.
+
+- Hugging Face Project: <https://huggingface.co/spaces/voila-dashboards/voila-huggingface>
+- Web App: <https://voila-dashboards-voila-huggingface.hf.space/>
+- Spaces Documentation: <https://huggingface.co/docs/hub/spaces>
+
+## How to deploy your own dashboards.
+1. Create a [Hugging Face](https://huggingface.co/) account and generate a user access token with writing rights.
+
+2. Create a new repository on GitHub by using this repository as a template.
+
+3. Create a new blank docker Space on Hugging Face.
+
+5. Replace the project URL defined in `.github/workflows/update-hf.yml` (current URL is `huggingface.co/spaces/voila-dashboards/voila-huggingface`) with the URL of your Space project.
+
+6. Add 2 secrets to this repository, named `HF_USER` for the Hugging Face user name and `HF_TOKEN` for the access token.
+
+7. Add new notebooks to the `notebooks` directory.
+
+8. Update dashboard dependencies in the `environment.yml` file.
+
+9. On every commit to the `main` branch, the repository will is synced and deployed to the Hugging Face Spaces.
+
+10. To get direct access to your deployment, go to `Embed this Space` and copy the direct URL of the Space.
+
+![hf1](https://github.com/voila-dashboards/voila-huggingface/assets/4451292/7af28013-617b-46c5-a07d-16e885a5581f)
+![hf-2](https://github.com/voila-dashboards/voila-huggingface/assets/4451292/5d685fe9-45c8-4f77-9f0c-da6686dde09f)

environment.yml

@@ -0,0 +1,21 @@
+name: voila
+channels:
+  - conda-forge
+dependencies:
+  - python=3.10
+  - ipywidgets
+  - ipykernel
+  - pandas
+  - pip
+  - bokeh
+  - bqplot
+  - ipympl=0.9.2
+  - jupyterlab-fasta
+  - matplotlib
+  - scipy
+  - vega_datasets
+  - ipyvolume
+
+  - pip:
+    - voila==0.5.0
+    - voila-topbar==0.1.1

notebooks/basics.ipynb

@@ -0,0 +1,88 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "source": [
+    "# So easy, *voilà*!\n",
+    "\n",
+    "In this example notebook, we demonstrate how Voilà can render Jupyter notebooks with interactions requiring a roundtrip to the kernel."
+   ],
+   "metadata": {}
+  },
+  {
+   "cell_type": "markdown",
+   "source": [
+    "## Jupyter Widgets"
+   ],
+   "metadata": {}
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "source": [
+    "import ipywidgets as widgets\n",
+    "\n",
+    "slider = widgets.FloatSlider(description='$x$')\n",
+    "text = widgets.FloatText(disabled=True, description='$x^2$')\n",
+    "\n",
+    "def compute(*ignore):\n",
+    "    text.value = str(slider.value ** 2)\n",
+    "\n",
+    "slider.observe(compute, 'value')\n",
+    "\n",
+    "slider.value = 4\n",
+    "\n",
+    "widgets.VBox([slider, text])"
+   ],
+   "outputs": [],
+   "metadata": {}
+  },
+  {
+   "cell_type": "markdown",
+   "source": [
+    "## Basic outputs of code cells"
+   ],
+   "metadata": {}
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "source": [
+    "import pandas as pd\n",
+    "\n",
+    "iris = pd.read_csv('https://raw.githubusercontent.com/mwaskom/seaborn-data/master/iris.csv')\n",
+    "iris"
+   ],
+   "outputs": [],
+   "metadata": {}
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "source": [],
+   "outputs": [],
+   "metadata": {}
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.8.5"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 4
+}

notebooks/bqplot.ipynb

@@ -0,0 +1,62 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "# So easy, *voilà*!\n",
+    "\n",
+    "In this example notebook, we demonstrate how Voilà can render custom Jupyter widgets such as [bqplot](https://github.com/bloomberg/bqplot). "
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import warnings\n",
+    "warnings.filterwarnings('ignore')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "from bqplot import pyplot as plt\n",
+    "\n",
+    "plt.figure(1, title='Line Chart')\n",
+    "np.random.seed(0)\n",
+    "n = 200\n",
+    "x = np.linspace(0.0, 10.0, n)\n",
+    "y = np.cumsum(np.random.randn(n))\n",
+    "plt.plot(x, y)\n",
+    "plt.show()"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.7.3"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

notebooks/dashboard.ipynb

@@ -0,0 +1,148 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "This demo uses Voilà to render a notebook to a custom HTML page using gridstack.js for the layout of each output. In the cell metadata you can change the default cell with and height (in grid units between 1 and 12) by specifying.\n",
+    " * `grid_row`\n",
+    " * `grid_columns`"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "n = 200\n",
+    "\n",
+    "x = np.linspace(0.0, 10.0, n)\n",
+    "y = np.cumsum(np.random.randn(n)*10).astype(int)\n"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import ipywidgets as widgets"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "label_selected = widgets.Label(value=\"Selected: 0\")\n",
+    "label_selected"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "grid_columns": 8,
+    "grid_rows": 4
+   },
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "from bqplot import pyplot as plt\n",
+    "import bqplot\n",
+    "\n",
+    "fig = plt.figure( title='Histogram')\n",
+    "np.random.seed(0)\n",
+    "hist = plt.hist(y, bins=25)\n",
+    "hist.scales['sample'].min = float(y.min())\n",
+    "hist.scales['sample'].max = float(y.max())\n",
+    "display(fig)\n",
+    "fig.layout.width = 'auto'\n",
+    "fig.layout.height = 'auto'\n",
+    "fig.layout.min_height = '300px' # so it shows nicely in the notebook\n",
+    "fig.layout.flex = '1'"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "grid_columns": 12,
+    "grid_rows": 6
+   },
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "from bqplot import pyplot as plt\n",
+    "import bqplot\n",
+    "\n",
+    "fig = plt.figure( title='Line Chart')\n",
+    "np.random.seed(0)\n",
+    "n = 200\n",
+    "p = plt.plot(x, y)\n",
+    "fig"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "fig.layout.width = 'auto'\n",
+    "fig.layout.height = 'auto'\n",
+    "fig.layout.min_height = '300px' # so it shows nicely in the notebook\n",
+    "fig.layout.flex = '1'"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "brushintsel = bqplot.interacts.BrushIntervalSelector(scale=p.scales['x'])"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "def update_range(*args):\n",
+    "    label_selected.value = \"Selected range {}\".format(brushintsel.selected)\n",
+    "    mask = (x > brushintsel.selected[0]) & (x < brushintsel.selected[1])\n",
+    "    hist.sample = y[mask]\n",
+    "    \n",
+    "brushintsel.observe(update_range, 'selected')\n",
+    "fig.interaction = brushintsel"
+   ]
+  }
+ ],
+ "metadata": {
+  "celltoolbar": "Edit Metadata",
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.6.4"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

notebooks/ipympl.ipynb

@@ -0,0 +1,110 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "# So easy, *voilà*!\n",
+    "\n",
+    "In this example notebook, we demonstrate how Voilà can render custom interactive matplotlib figures using the [ipympl](https://github.com/matplotlib/ipympl) widget."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "%matplotlib widget\n",
+    "import ipympl\n",
+    "\n",
+    "import numpy as np\n",
+    "import matplotlib.pyplot as plt\n",
+    "\n",
+    "x = np.linspace(0, 2 * np.pi, 500)\n",
+    "y1 = np.sin(x)\n",
+    "y2 = np.sin(3 * x)\n",
+    "\n",
+    "fig, ax = plt.subplots()\n",
+    "ax.fill(x, y1, 'b', x, y2, 'r', alpha=0.3)\n",
+    "plt.show()"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "import matplotlib.pyplot as plt\n",
+    "\n",
+    "plt.style.use('ggplot')\n",
+    "\n",
+    "fig, axes = plt.subplots(ncols=2, nrows=2)\n",
+    "ax1, ax2, ax3, ax4 = axes.ravel()\n",
+    "\n",
+    "# scatter plot (Note: `plt.scatter` doesn't use default colors)\n",
+    "x, y = np.random.normal(size=(2, 200))\n",
+    "ax1.plot(x, y, 'o')\n",
+    "\n",
+    "# sinusoidal lines with colors from default color cycle\n",
+    "L = 2 * np.pi\n",
+    "x = np.linspace(0, L)\n",
+    "ncolors = len(plt.rcParams['axes.prop_cycle'])\n",
+    "shift = np.linspace(0, L, ncolors, endpoint=False)\n",
+    "for s in shift:\n",
+    "    ax2.plot(x, np.sin(x + s), '-')\n",
+    "ax2.margins(0)\n",
+    "\n",
+    "# bar graphs\n",
+    "x = np.arange(5)\n",
+    "y1, y2 = np.random.randint(1, 25, size=(2, 5))\n",
+    "width = 0.25\n",
+    "ax3.bar(x, y1, width)\n",
+    "ax3.bar(x + width, y2, width,\n",
+    "        color=list(plt.rcParams['axes.prop_cycle'])[2]['color'])\n",
+    "ax3.set_xticks(x + width)\n",
+    "ax3.set_xticklabels(['a', 'b', 'c', 'd', 'e'])\n",
+    "\n",
+    "# circles with colors from default color cycle\n",
+    "for i, color in enumerate(plt.rcParams['axes.prop_cycle']):\n",
+    "    xy = np.random.normal(size=2)\n",
+    "    ax4.add_patch(plt.Circle(xy, radius=0.3, color=color['color']))\n",
+    "\n",
+    "ax4.axis('equal')\n",
+    "ax4.margins(0)\n",
+    "\n",
+    "plt.show()"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": []
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.7.3"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

notebooks/ipyvolume.ipynb

@@ -0,0 +1,44 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "# So easy, *voilà*!\n",
+    "\n",
+    "In this example notebook, we demonstrate how Voilà can render custom Jupyter widgets such as [ipyvolume](https://github.com/maartenbreddels/ipyvolume). "
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import ipyvolume as ipv\n",
+    "ipv.examples.example_ylm();"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.7.3"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

notebooks/mimerenderers.ipynb

@@ -0,0 +1,489 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "ff203dda-d0f3-48a8-95d5-587fbe1acae8",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "from IPython.display import display\n",
+    "from IPython.display import (\n",
+    "    HTML, Image, Latex, Math, Markdown, SVG\n",
+    ")"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "83934e25-4c2a-4521-b128-f4da77793fe8",
+   "metadata": {},
+   "source": [
+    "## Text"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "4c0ef0c2-a7c2-4aee-b047-d009e9794ef9",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "text = \"\"\"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam urna\n",
+    "libero, dictum a egestas non, placerat vel neque. In imperdiet iaculis fermentum. \n",
+    "Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia \n",
+    "Curae; Cras augue tortor, tristique vitae varius nec, dictum eu lectus. Pellentesque \n",
+    "id eleifend eros. In non odio in lorem iaculis sollicitudin. In faucibus ante ut \n",
+    "arcu fringilla interdum. Maecenas elit nulla, imperdiet nec blandit et, consequat \n",
+    "ut elit.\"\"\"\n",
+    "print(text)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "9f841613-56a3-4b9f-a342-929f77534159",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import sys; print('this is stderr', file=sys.stderr)"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "ff9bcbcb-8b11-4215-a5bd-a82265ab63f2",
+   "metadata": {},
+   "source": [
+    "## HTML"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "317c2b55-881f-436c-8cc5-1753e8ebb4b6",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "div = HTML('<div style=\"width:100px;height:100px;background:grey;\" />')\n",
+    "div"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "e410f2d6-d6be-4dc5-b3fa-80ee61ac30ec",
+   "metadata": {},
+   "source": [
+    "## Markdown"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "8088840b-ebec-4964-b823-4864330aa021",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "md = Markdown(\"\"\"\n",
+    "### Subtitle\n",
+    "\n",
+    "This is some *markdown* text with math $F=ma$.\n",
+    "\n",
+    "\"\"\")\n",
+    "md"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "de749ce9-0531-4151-b2c5-6100706ddd59",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "display(md)"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "a4d62188-c67b-4058-a679-a08f6ad0ad87",
+   "metadata": {},
+   "source": [
+    "## LaTeX"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "09eb8496-cea0-496a-97de-f887ce924d3d",
+   "metadata": {},
+   "source": [
+    "Examples LaTeX in a markdown cell:\n",
+    "\n",
+    "\n",
+    "\\begin{align}\n",
+    "\\nabla \\times \\vec{\\mathbf{B}} -\\, \\frac1c\\, \\frac{\\partial\\vec{\\mathbf{E}}}{\\partial t} & = \\frac{4\\pi}{c}\\vec{\\mathbf{j}} \\\\   \\nabla \\cdot \\vec{\\mathbf{E}} & = 4 \\pi \\rho \\\\\n",
+    "\\nabla \\times \\vec{\\mathbf{E}}\\, +\\, \\frac1c\\, \\frac{\\partial\\vec{\\mathbf{B}}}{\\partial t} & = \\vec{\\mathbf{0}} \\\\\n",
+    "\\nabla \\cdot \\vec{\\mathbf{B}} & = 0\n",
+    "\\end{align}"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "e59f7a97-9ad5-424f-ba99-2f69deba04a1",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "math = Latex(\"$F=ma$\")\n",
+    "math"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "0f14b258-22e0-465d-9b86-d134e7d4a07c",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "maxwells = Latex(r\"\"\"\n",
+    "\\begin{align}\n",
+    "\\nabla \\times \\vec{\\mathbf{B}} -\\, \\frac1c\\, \\frac{\\partial\\vec{\\mathbf{E}}}{\\partial t} & = \\frac{4\\pi}{c}\\vec{\\mathbf{j}} \\\\   \\nabla \\cdot \\vec{\\mathbf{E}} & = 4 \\pi \\rho \\\\\n",
+    "\\nabla \\times \\vec{\\mathbf{E}}\\, +\\, \\frac1c\\, \\frac{\\partial\\vec{\\mathbf{B}}}{\\partial t} & = \\vec{\\mathbf{0}} \\\\\n",
+    "\\nabla \\cdot \\vec{\\mathbf{B}} & = 0\n",
+    "\\end{align}\n",
+    "\"\"\")\n",
+    "maxwells"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "cefadf9b-3bab-451e-963d-38cee15c05ea",
+   "metadata": {},
+   "source": [
+    "## PDF"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "0654a20f-1c14-47fd-a8b2-4de3fcbe6379",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "%matplotlib inline\n",
+    "import matplotlib.pyplot as plt\n",
+    "import numpy as np\n",
+    "from IPython.display import set_matplotlib_formats\n",
+    "set_matplotlib_formats('pdf')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "e472026e-1019-4ef1-aae7-190dfa27c6a6",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "plt.scatter(np.random.rand(20), np.random.rand(20), c=np.random.rand(20))"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "52d8c23c-85e9-4a58-b2ab-a1686f5efaf3",
+   "metadata": {},
+   "source": [
+    "## Image"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "e6b7d130-7033-4783-bec1-031beabe66ef",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "img = Image(\"https://apod.nasa.gov/apod/image/1707/GreatWallMilkyWay_Yu_1686.jpg\")\n",
+    "img"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "f0063685-9296-4149-abfb-5d0e15cc0b3c",
+   "metadata": {},
+   "source": [
+    "## SVG"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "959bbce1-1bbb-45a4-8373-d3994bab420d",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "svg_source = \"\"\"\n",
+    "<svg width=\"400\" height=\"110\">\n",
+    "  <rect width=\"300\" height=\"100\" style=\"fill:#E0E0E0;\" /> \n",
+    "</svg>\n",
+    "\"\"\"\n",
+    "svg = SVG(svg_source)\n",
+    "svg"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "41009292-8e51-4fde-90d2-804a52aa6d7f",
+   "metadata": {},
+   "source": [
+    "## HTML Tables"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "dbc0850d-bce6-4b6d-901e-c6ea1b857898",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "from vega_datasets import data"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "384e0e32-001d-4e40-bda7-4c76578fe123",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "df = data.cars()"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "702d284d-fefb-4b68-a327-ab311179c991",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "df.head()"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "5355a073-8ab7-46f9-87c8-04f2a2c4af7c",
+   "metadata": {},
+   "source": [
+    "## Vega"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "ba337247-3bfa-4f70-b067-b25d4236660c",
+   "metadata": {
+    "tags": []
+   },
+   "outputs": [],
+   "source": [
+    "from IPython.display import display\n",
+    "import pandas as pd\n",
+    "\n",
+    "def Vega(spec):\n",
+    "    bundle = {}\n",
+    "    bundle['application/vnd.vega.v5+json'] = spec\n",
+    "    display(bundle, raw=True)\n",
+    "\n",
+    "def VegaLite(spec):\n",
+    "    bundle = {}\n",
+    "    bundle['application/vnd.vegalite.v4+json'] = spec\n",
+    "    display(bundle, raw=True)\n",
+    "\n",
+    "Vega({\n",
+    "  \"$schema\": \"https://vega.github.io/schema/vega/v5.0.json\",\n",
+    "  \"width\": 400,\n",
+    "  \"height\": 200,\n",
+    "  \"padding\": 5,\n",
+    "\n",
+    "  \"data\": [\n",
+    "    {\n",
+    "      \"name\": \"table\",\n",
+    "      \"values\": [\n",
+    "        {\"category\": \"A\", \"amount\": 28},\n",
+    "        {\"category\": \"B\", \"amount\": 55},\n",
+    "        {\"category\": \"C\", \"amount\": 43},\n",
+    "        {\"category\": \"D\", \"amount\": 91},\n",
+    "        {\"category\": \"E\", \"amount\": 81},\n",
+    "        {\"category\": \"F\", \"amount\": 53},\n",
+    "        {\"category\": \"G\", \"amount\": 19},\n",
+    "        {\"category\": \"H\", \"amount\": 87}\n",
+    "      ]\n",
+    "    }\n",
+    "  ],\n",
+    "\n",
+    "  \"signals\": [\n",
+    "    {\n",
+    "      \"name\": \"tooltip\",\n",
+    "      \"value\": {},\n",
+    "      \"on\": [\n",
+    "        {\"events\": \"rect:mouseover\", \"update\": \"datum\"},\n",
+    "        {\"events\": \"rect:mouseout\",  \"update\": \"{}\"}\n",
+    "      ]\n",
+    "    }\n",
+    "  ],\n",
+    "\n",
+    "  \"scales\": [\n",
+    "    {\n",
+    "      \"name\": \"xscale\",\n",
+    "      \"type\": \"band\",\n",
+    "      \"domain\": {\"data\": \"table\", \"field\": \"category\"},\n",
+    "      \"range\": \"width\",\n",
+    "      \"padding\": 0.05,\n",
+    "      \"round\": True\n",
+    "    },\n",
+    "    {\n",
+    "      \"name\": \"yscale\",\n",
+    "      \"domain\": {\"data\": \"table\", \"field\": \"amount\"},\n",
+    "      \"nice\": True,\n",
+    "      \"range\": \"height\"\n",
+    "    }\n",
+    "  ],\n",
+    "\n",
+    "  \"axes\": [\n",
+    "    { \"orient\": \"bottom\", \"scale\": \"xscale\" },\n",
+    "    { \"orient\": \"left\", \"scale\": \"yscale\" }\n",
+    "  ],\n",
+    "\n",
+    "  \"marks\": [\n",
+    "    {\n",
+    "      \"type\": \"rect\",\n",
+    "      \"from\": {\"data\":\"table\"},\n",
+    "      \"encode\": {\n",
+    "        \"enter\": {\n",
+    "          \"x\": {\"scale\": \"xscale\", \"field\": \"category\"},\n",
+    "          \"width\": {\"scale\": \"xscale\", \"band\": 1},\n",
+    "          \"y\": {\"scale\": \"yscale\", \"field\": \"amount\"},\n",
+    "          \"y2\": {\"scale\": \"yscale\", \"value\": 0}\n",
+    "        },\n",
+    "        \"update\": {\n",
+    "          \"fill\": {\"value\": \"steelblue\"}\n",
+    "        },\n",
+    "        \"hover\": {\n",
+    "          \"fill\": {\"value\": \"red\"}\n",
+    "        }\n",
+    "      }\n",
+    "    },\n",
+    "    {\n",
+    "      \"type\": \"text\",\n",
+    "      \"encode\": {\n",
+    "        \"enter\": {\n",
+    "          \"align\": {\"value\": \"center\"},\n",
+    "          \"baseline\": {\"value\": \"bottom\"},\n",
+    "          \"fill\": {\"value\": \"#333\"}\n",
+    "        },\n",
+    "        \"update\": {\n",
+    "          \"x\": {\"scale\": \"xscale\", \"signal\": \"tooltip.category\", \"band\": 0.5},\n",
+    "          \"y\": {\"scale\": \"yscale\", \"signal\": \"tooltip.amount\", \"offset\": -2},\n",
+    "          \"text\": {\"signal\": \"tooltip.amount\"},\n",
+    "          \"fillOpacity\": [\n",
+    "            {\"test\": \"datum === tooltip\", \"value\": 0},\n",
+    "            {\"value\": 1}\n",
+    "          ]\n",
+    "        }\n",
+    "      }\n",
+    "    }\n",
+    "  ]\n",
+    "})"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "be6347a4-f418-49d2-a83e-ba0ef6366505",
+   "metadata": {},
+   "source": [
+    "## GeoJSON"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "67a6bc44-7588-4ae0-8eae-0428b6428f80",
+   "metadata": {
+    "tags": []
+   },
+   "outputs": [],
+   "source": [
+    "from IPython.display import GeoJSON, JSON\n",
+    "\n",
+    "data = {\n",
+    "    \"type\": \"Feature\",\n",
+    "    \"geometry\": {\n",
+    "        \"type\": \"Point\",\n",
+    "        \"coordinates\": [-118.4563712, 34.0163116]\n",
+    "    }\n",
+    "}\n",
+    "\n",
+    "GeoJSON(data)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "1a1a2fc6",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "JSON(data)"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "dc69fbe1",
+   "metadata": {},
+   "source": [
+    "# Fasta"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "85730759",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "def Fasta(data=''):\n",
+    "    bundle = {}\n",
+    "    bundle['application/vnd.fasta.fasta'] = data\n",
+    "    bundle['text/plain'] = data\n",
+    "    display(bundle, raw=True)\n",
+    "\n",
+    "\n",
+    "Fasta(\"\"\">SEQUENCE_1\n",
+    "MTEITAAMVKELRESTGAGMMDCKNALSETNGDFDKAVQLLREKGLGKAAKKADRLAAEG\n",
+    "LVSVKVSDDFTIAAMRPSYLSYEDLDMTFVENEYKALVAELEKENEERRRLKDPNKPEHK\n",
+    "IPQFASRKQLSDAILKEAEEKIKEELKAQGKPEKIWDNIIPGKMNSFIADNSQLDSKLTL\n",
+    "MGQFYVMDDKKTVEQVIAEKEKEFGGKIKIVEFICFEVGEGLEKKTEDFAAEVAAQL\n",
+    ">SEQUENCE_2\n",
+    "SATVSEINSETDFVAKNDQFIALTKDTTAHIQSNSLQSVEELHSSTINGVKFEEYLKSQI\n",
+    "ATIGENLVVRRFATLKAGANGVVNGYIHTNGRVGVVIAAACDSAEVASKSRDLLRQICMH\"\"\")"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3 (ipykernel)",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.10.6"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}

notebooks/reveal.ipynb

@@ -0,0 +1,92 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "slideshow": {
+     "slide_type": "slide"
+    }
+   },
+   "outputs": [],
+   "source": [
+    "print('hi')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import ipywidgets as widgets\n",
+    "slider = widgets.FloatSlider(description='x')\n",
+    "text = widgets.FloatText(disabled=True, description='$x^2$')\n",
+    "text.disabled\n",
+    "def compute(*ignore):\n",
+    "    text.value = str(slider.value**2)\n",
+    "slider.observe(compute, 'value')\n",
+    "slider.value = 14\n",
+    "widgets.VBox([slider, text])"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "slideshow": {
+     "slide_type": "slide"
+    }
+   },
+   "outputs": [],
+   "source": [
+    "print('voila')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "slideshow": {
+     "slide_type": "subslide"
+    }
+   },
+   "outputs": [],
+   "source": [
+    "1+2"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": []
+  }
+ ],
+ "metadata": {
+  "celltoolbar": "Slideshow",
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.6.4"
+  },
+  "voila": {
+    "template": "reveal"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

voila.json

@@ -0,0 +1,11 @@
+{
+  "Voila": {
+    "ip":"0.0.0.0",
+    "port": 7860,
+    "tornado_settings": {
+      "headers": {
+        "Content-Security-Policy": "frame-ancestors self *"
+      }
+    }
+  }
+}