{ "cells": [ { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "# RISE Slideshow of a Jupyter Notebook" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "-" }, "tags": [] }, "source": [ "\n", "\"Open \n" ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "skip" }, "tags": [] }, "source": [ "Author: Monika Doerig\n", "\n", "Citation: \n", "- Full documentation of the [RISE notebook extension](http://rise.readthedocs.io/)" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "Press `Space` to proceed." ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "slide" }, "tags": [ "toc" ] }, "source": [ "Before getting to the introduction and details of creating a slideshow, let's set up this notebook to run in Google Colab.\n", "\n", "Keep pressing `Space` to proceed. " ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "slide" } }, "source": [ "## Setup Neurodesk" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "In code cells you press `Shift-Enter` (as usual) to evaluate your code and directly move to the next cell if it is already displayed. \n", "Press `Ctrl-Enter` to run a command without direclty moving to the next cell. \n", "\n", "Press Shift-Enter to run the following command to set up the Neurodesk environment." ] }, { "cell_type": "code", "execution_count": null, "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [], "vscode": { "languageId": "plaintext" } }, "outputs": [], "source": [ "%%capture\n", "import os\n", "import sys\n", "IN_COLAB = 'google.colab' in sys.modules\n", "\n", "if IN_COLAB:\n", " os.environ[\"LD_PRELOAD\"] = \"\";\n", " os.environ[\"APPTAINER_BINDPATH\"] = \"/content,/tmp,/cvmfs\"\n", " os.environ[\"MPLCONFIGDIR\"] = \"/content/matplotlib-mpldir\"\n", " os.environ[\"LMOD_CMD\"] = \"/usr/share/lmod/lmod/libexec/lmod\"\n", "\n", " !curl -J -O https://raw.githubusercontent.com/NeuroDesk/neurocommand/main/googlecolab_setup.sh\n", " !chmod +x googlecolab_setup.sh\n", " !./googlecolab_setup.sh\n", "\n", " os.environ[\"MODULEPATH\"] = ':'.join(map(str, list(map(lambda x: os.path.join(os.path.abspath('/cvmfs/neurodesk.ardc.edu.au/neurodesk-modules/'), x),os.listdir('/cvmfs/neurodesk.ardc.edu.au/neurodesk-modules/')))))" ] }, { "cell_type": "code", "execution_count": null, "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "outputs": [], "source": [ "# Press Ctrl-Enter to run the following commands to see the output (and not move directly to the next slide).\n", "\n", "# Output CPU information:\n", "!cat /proc/cpuinfo | grep 'vendor' | uniq\n", "!cat /proc/cpuinfo | grep 'model name' | uniq" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [ "rise" ] }, "source": [ "## Introduction to RISE\n", "\n", "RISE is Jupyter notebook slideshow extension that allows you to turn a Jupyter notebook into a live presentation based on [reveal.js](https://revealjs.com/). The full documentation can be found [here](http://rise.readthedocs.io/).\n", "\n", "Keep pressing `Space` to proceed along the main line.\n" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "### 1. How to create slideshows" ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "Open or create a new Notebook (File > New > Notebook) in JupyterLab. Navigate to the `View` option in the menu and select `Property Inspector` (Ctrl+Shift+U). Alternatively, directly click on the gears icon to access cell and notebook metadata (on the left or right sidebar): \n" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "raw_mimetype": "", "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "*You should be able to scroll down if the entire image is not displayed.*\n", "\n", "\n", "![../images/property_inspector.png](../images/property_inspector.png)" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "To prepare a slideshow, select a `Slide Type` for each cell from the dropdown menu. It can be chosen between the following types: \n", "- __Slide:__ This cell is the beginning of a new slide. These slides run from left to right. \n", "- __Subslide:__ This cell is the beginning of a new sub-slide, which is a new slide, but is displayed below the previous one and runs form top to bottom (instead of left to right): \n", "- __Fragment:__ A cell marked as fragment will split the contents of one slide into pieces; a break is created inside the slide and will not show up until `Space` is pressed one more time to see it. \n", "- __Skip:__ This cell is ignored altogether in reveal mode, it will not appear either in the main view, nor in the speaker view.\n", "- __Notes:__ This cell is marked to be discarded from the main view, but is meant to appear in the speaker view." ] }, { "cell_type": "markdown", "metadata": { "editable": true, "raw_mimetype": "", "slideshow": { "slide_type": "-" }, "tags": [] }, "source": [ "![../images/metadata.png](../images/metadata.png) " ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "### 2. Running slideshows in JupyterLab on Neurodesk\n", "- Start the slideshow by pressing the button `Render the current notebook as Reveal Slideshow` or by pressing Alt+R.\n" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "![../images/render.png](../images/render.png) " ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "### Navigation\n", "Using the `SpaceBar` primarily for moving forward and `Shift-SpaceBar` for backward navigation is strongly advised (or utilize the visual controller in the slideshow's bottom right corner). This method ensures smooth progression through the presentation, regardless of its detailed structure (slides, subslides, fragments...)." ] }, { "cell_type": "markdown", "metadata": { "slideshow": { "slide_type": "slide" } }, "source": [ "### Selection and evaluation\n", "To evaluate code, press `Shift-Enter` (as usual) to run it. This will move to the next cell if it is already displayed." ] }, { "cell_type": "code", "execution_count": 11, "metadata": { "slideshow": { "slide_type": "-" }, "tags": [] }, "outputs": [ { "data": { "text/plain": [ "(6,)" ] }, "execution_count": 11, "metadata": {}, "output_type": "execute_result" } ], "source": [ "# this is where you press Shift-Enter\n", "import numpy as np\n", "\n", "a = np.arange(6)\n", "a.shape" ] }, { "cell_type": "code", "execution_count": 6, "metadata": { "editable": true, "slideshow": { "slide_type": "-" }, "tags": [] }, "outputs": [ { "data": { "text/plain": [ "(1, 6)" ] }, "execution_count": 6, "metadata": {}, "output_type": "execute_result" } ], "source": [ "# Press Ctrl-Enter to also see this output\n", "a2 = a[np.newaxis, :]\n", "a2.shape" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [ "rise" ] }, "source": [ "### Other notes\n", "- Markdown Images get left aligned by default. Enclose the image like `
` to center it.\n", "- Speaker notes: By selecting the Slide Type called `Notes` the content of this cell will be shown in the speaker view (a separate browser window). This view also provieds a timer and a preview of the next upcoming slide. Press the `t` key to open a second window, with a presenter view, showing *Notes* cell which won't show up in the main slides (however, the presentation will start from the beginning)." ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "notes" }, "tags": [] }, "source": [ "This is an example of a *Notes* cell." ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "### 3. Customize RISE\n", "RISE can be customized in many ways - here some pointers on what can be [customized](https://rise.readthedocs.io/en/latest/customize.html#how-to-customize/):\n", "\n", "- presentation theme\n", "- transition between slides\n", "- auto-launch presentation mode\n", "- where to start the presentation\n", "- automatic selection of cells\n", "- slide sizes\n", "- decoration (header/footer/background)\n", "- vertical scrollbar\n", "- chalkboard capabilities\n", "- using a leap motion controller\n", "- native reveal.js settings\n", "- custom CSS\n", "- keyboard shortcuts" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "#### Settings Editor\n", "RISE settings for all notebooks can be changed via the Settings Editor.\n", "\n", "For example, to set up the notebook so that it starts immediately with the slideshow view, the configuration option ```autorun``` must be set to true. This is typically very helpful if a binder-hosted notebook is to be started in slideshow mode. \n" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "![../images/settings_editor.png](../images/settings_editor.png)" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "#### Notebook metadata\n", "\n", "Alternatively, these settings can also be saved/changed in the notebook metadata of the respective notebook, which contains a JSON object, that can be edited in the Property Inspector > ADVANCED TOOLS > Notebook metadata:" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "fragment" }, "tags": [] }, "source": [ "As an example, to autolunch the slideshow upon opening, the notebook metadata can be edited as follows: " ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "fragment" }, "tags": [] }, "source": [ "```javascript\n", " ...\n", " \"rise\": {\"autolaunch\": true}\n", " ...\n", "```" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "fragment" }, "tags": [] }, "source": [ "To start the slideshow at the beginning and not at the selected slide, the following configuration change can be made: " ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "fragment" }, "tags": [ "rise" ] }, "source": [ "```javascript\n", " ...\n", " \"rise\": {\"start_slideshow_at\": \"beginning\"}\n", " ...\n", "```" ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "slide" }, "tags": [] }, "source": [ "To save the configuration changes: \n", "1. Edit the metadata\n", "2. Save the changes by clicking the little tick icon that appears above the notebook metadata window." ] }, { "cell_type": "markdown", "metadata": { "editable": true, "slideshow": { "slide_type": "" }, "tags": [] }, "source": [ "![../images/change_metadata_notebook.png](../images/change_metadata_notebook.png)" ] } ], "metadata": { "celltoolbar": "Slideshow", "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.11.6" }, "rise": { "autolaunch": true, "scroll": true, "start_slideshow_at": "selected", "theme": "sky" }, "toc": { "base_numbering": 1 } }, "nbformat": 4, "nbformat_minor": 4 }