Commit ce654cba authored by Romain Casati's avatar Romain Casati
Browse files

Support for RISE slideshow.

parent b7168ddc
{}
\ No newline at end of file
{}
\ No newline at end of file
{"load_extensions": {"jupyter-js-widgets/extension": true, "rise/main": true}}
{}
\ No newline at end of file
This diff is collapsed.
# RISE
RISE allows you to instantly turn your Jupyter Notebooks into a
slideshow. No out-of-band conversion is needed, switch from jupyter
notebook to a live *reveal.js*-based slideshow in a single keystroke,
and back.
![Basic usage](https://media.giphy.com/media/3oxHQtTxAaZwMOHr9u/giphy.gif)
## Resources
RISE stands for ***Reveal.js - Jupyter/IPython Slideshow Extension***:
* Demo notebook (no installation required)
* [![](https://mybinder.org/badge.svg)](https://mybinder.org/v2/gh/damianavila/RISE/master?filepath=examples%2FREADME.ipynb)
* Source code is on github <https://github.com/damianavila/RISE>
* [![Issues](http://img.shields.io/github/issues/damianavila/RISE.svg)](https://github.com/damianavila/RISE/issues)
* Documentation is hosted on readthedocs
* [![doc status](https://readthedocs.org/projects/rise/badge)](http://rise.readthedocs.io/)
* Chat room on gitter
* [![Gitter chat](https://badges.gitter.im/damianavila/RISE.png)](https://gitter.im/damianavila/RISE)
* Videos on youtube
* basic usage (4'30'')
<https://youtu.be/sXyFa_r1nxA>
## Installation
You essentially have 2 options:
### Option 1 - Using conda:
```
conda install -c conda-forge rise
```
### Option 2 - Using pip:
```
pip install RISE
```
## Development
To install RISE in development mode, see the
[Developer section](https://rise.readthedocs.io/en/stable/dev/index.html) of the RISE
documentation.
## Feedback
If you have any feedback, or find any bugs, please let us know just opening an issue.
## Support us
Please visit this page for more information: https://rise.readthedocs.io/en/stable/support.html
.transition-all {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
}
/* do not apply this on the <body> tag */
:not(body).rise-enabled {
background-color: #fff;
}
.rise-enabled {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
/* Reveal-specific */
/* Notebook-specific */
/* chalkboard plugin and RISE buttons */
/* button toolbar */
/* use !important to override stuff that
would normally be configured through
chalkboard options */
}
.rise-enabled .reveal {
/* element-overrides */
}
.rise-enabled .reveal.fade {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
opacity: 1;
}
.rise-enabled .reveal pre {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
font-size: 90%;
width: 100%;
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
overflow: hidden;
}
.rise-enabled .reveal section img {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
border: 0px solid black;
box-shadow: 0 0 10px rgba(0, 0, 0, 0);
transition: none;
}
.rise-enabled .reveal blockquote p:first-child,
.rise-enabled .reveal blockquote p:last-child {
display: inherit;
}
.rise-enabled .reveal a {
color: #727272;
}
.rise-enabled .reveal:hover {
color: #727272;
}
.rise-enabled .reveal .slides {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
text-align: left;
font-size: 160%;
}
.rise-enabled .reveal .slide-number {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
right: 3.3em;
bottom: 3.9em;
/* more harmful than helpful with reveal 3.8.0
font-size: 100%;
*/
color: #727272;
background-color: transparent;
}
.rise-enabled .reveal .controls .navigate-left,
.rise-enabled .reveal .controls .navigate-left.enabled {
border-right-color: #727272;
}
.rise-enabled .reveal .controls .navigate-left.enabled:hover,
.rise-enabled .reveal .controls .navigate-left.enabled.enabled:hover {
border-right-color: #dfdfdf;
}
.rise-enabled .reveal .controls .navigate-right,
.rise-enabled .reveal .controls .navigate-right.enabled {
border-left-color: #727272;
}
.rise-enabled .reveal .controls .navigate-right.enabled:hover,
.rise-enabled .reveal .controls .navigate-right.enabled.enabled:hover {
border-left-color: #dfdfdf;
}
.rise-enabled .reveal .controls .navigate-up,
.rise-enabled .reveal .controls .navigate-up.enabled {
border-bottom-color: #727272;
}
.rise-enabled .reveal .controls .navigate-up.enabled:hover,
.rise-enabled .reveal .controls .navigate-up.enabled.enabled:hover {
border-bottom-color: #dfdfdf;
}
.rise-enabled .reveal .controls .navigate-down,
.rise-enabled .reveal .controls .navigate-down.enabled {
border-top-color: #727272;
}
.rise-enabled .reveal .controls .navigate-down.enabled:hover,
.rise-enabled .reveal .controls .navigate-down.enabled.enabled:hover {
border-top-color: #dfdfdf;
}
.rise-enabled .reveal .progress {
margin-bottom: 0;
}
.rise-enabled .reveal .progress span {
background: #727272;
}
.rise-enabled .reveal .reveal-skip,
.rise-enabled .reveal .reveal-notes {
display: none;
}
.rise-enabled #notebook {
overflow: hidden;
}
.rise-enabled #notebook.reveal {
padding-top: 0px;
}
.rise-enabled #notebook-container {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
background-color: transparent;
box-shadow: none;
width: 100%;
height: 100% !important;
}
.rise-enabled.ctb_global_show .ctb_hideshow.ctb_show {
display: none;
}
.rise-enabled.ctb_global_show .ctb_show ~ .text_cell_render {
border-style: none;
}
.rise-enabled .celltoolbar {
height: inherit;
}
.rise-enabled .celltoolbar select,
.rise-enabled .celltoolbar .btn {
height: inherit;
font-size: inherit;
}
.rise-enabled .widget-area .form-control,
.rise-enabled .widget-area .dropdown-menu,
.rise-enabled .widget-area .btn {
font-size: inherit;
}
.rise-enabled .widget-area .dropdown-menu {
margin: 0px;
/* cancel the settings from reveal */
}
.rise-enabled .cell li {
line-height: 160%;
}
.rise-enabled .text_cell {
font-size: 160%;
}
.rise-enabled .text_cell .prompt {
display: none;
}
.rise-enabled .text_cell.rendered .rendered_html {
overflow-x: hidden;
overflow-y: hidden;
}
.rise-enabled .prompt {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
font-size: 90%;
}
.rise-enabled .output_prompt {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
margin-top: 2px;
}
.rise-enabled .output_subarea {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
margin-top: 0.05em;
}
.rise-enabled .CodeMirror {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
font-size: 100%;
margin-bottom: 1ex;
}
.rise-enabled a.anchor-link {
display: none;
}
.rise-enabled html {
overflow-y: auto;
}
.rise-enabled .dialog kbd {
padding: .1em .6em;
border: 1px solid #ccc;
font-size: 11px;
background-color: #f7f7f7;
color: #333;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
border-radius: 3px;
display: inline-block;
margin: 0 .1em;
text-shadow: 0 1px 0 #fff;
line-height: 1.4;
white-space: nowrap;
}
.rise-enabled #header {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
top: -200px;
opacity: 0;
}
.rise-enabled #site {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
height: 100% !important;
}
.rise-enabled #ipython-main-app {
position: static;
}
.rise-enabled ::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.rise-enabled ::-webkit-scrollbar * {
background: transparent;
}
.rise-enabled ::-webkit-scrollbar-thumb {
background: #727272 !important;
}
.rise-enabled #notescanvas {
position: absolute;
top: 0;
}
.rise-enabled #help_b,
.rise-enabled #exit_b,
.rise-enabled .chalkboard-button {
color: #727272;
position: fixed !important;
z-index: 30;
cursor: pointer;
}
.rise-enabled #exit_b {
top: 0.55em;
left: 0.5em;
}
.rise-enabled #help_b {
left: 0.6em ;
bottom: 0.55em;
}
.rise-enabled .chalkboard-button i {
display: block !important;
bottom: 1em !important;
font-size: 1.8em !important;
color: #727272 !important;
}
.rise-enabled #toggle-chalkboard.chalkboard-button {
left: 4em !important;
}
.rise-enabled #toggle-notes {
left: 7em !important;
}
.rise-enabled #notescanvas {
display: block !important;
}
.rise-enabled #chalkboard {
display: block !important;
}
#header {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
opacity: 1;
top: 0px;
}
#notebook-container {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
}
#notebook {
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
}
.chalkboard-button i {
display: none;
}
#notescanvas {
display: none;
}
#chalkboard {
display: none;
}
/* fix for issue #425 */
.rise-enabled .rendered_html table {
font-size: 75%;
}
/* fix for reveal dark themes */
body.rise-enabled.theme-black div.rendered_html tbody tr:nth-child(even),
body.rise-enabled.theme-black div.rendered_html thead th,
body.rise-enabled.theme-black div.input_prompt,
body.rise-enabled.theme-black div.output_text > pre,
body.rise-enabled.theme-black div.rendered_html,
body.rise-enabled.theme-black div.text_cell_render {
color: white;
}
body.rise-enabled.theme-blood div.rendered_html tbody tr:nth-child(even),
body.rise-enabled.theme-blood div.rendered_html thead th,
body.rise-enabled.theme-blood div.input_prompt,
body.rise-enabled.theme-blood div.output_text > pre,
body.rise-enabled.theme-blood div.rendered_html,
body.rise-enabled.theme-blood div.text_cell_render,
body.rise-enabled.theme-league div.rendered_html tbody tr:nth-child(even),
body.rise-enabled.theme-league div.rendered_html thead th,
body.rise-enabled.theme-league div.input_prompt,
body.rise-enabled.theme-league div.output_text > pre,
body.rise-enabled.theme-league div.rendered_html,
body.rise-enabled.theme-league div.text_cell_render,
body.rise-enabled.theme-night div.rendered_html tbody tr:nth-child(even),
body.rise-enabled.theme-night div.rendered_html thead th,
body.rise-enabled.theme-night div.input_prompt,
body.rise-enabled.theme-night div.output_text > pre,
body.rise-enabled.theme-night div.rendered_html,
body.rise-enabled.theme-night div.text_cell_render {
color: #eeeeee;
}
body.rise-enabled.theme-moon div.rendered_html tbody tr:nth-child(even),
body.rise-enabled.theme-moon div.rendered_html thead th,
body.rise-enabled.theme-moon div.input_prompt,
body.rise-enabled.theme-moon div.output_text > pre,
body.rise-enabled.theme-moon div.rendered_html,
body.rise-enabled.theme-moon div.text_cell_render {
color: #eee8d5;
}
This diff is collapsed.
# Chalkboard
With this plugin you can add a chalkboard to reveal.js. The plugin provides two possibilities to include handwritten notes to your presentation:
- you can make notes directly on the slides, e.g. to comment on certain aspects,
- you can open a chalkboard on which you can make notes.
The main use case in mind when implementing the plugin is classroom usage in which you may want to explain some course content and quickly need to make some notes.
The plugin records all drawings made so that they can be play backed using the ```autoSlide``` feature or the ```audio-slideshow``` plugin.
[Check out the live demo](https://rajgoel.github.io/reveal.js-demos/chalkboard-demo.html)
The chalkboard effect is based on [Chalkboard](https://github.com/mmoustafa/Chalkboard) by Mohamed Moustafa.
## Installation
Copy the file ```chalkboard.js``` and the ```img``` directory into the plugin folder of your reveal.js presentation, i.e. ```plugin/chalkboard```.
Add the plugins to the dependencies in your presentation as shown below.
```javascript
Reveal.initialize({
// ...
chalkboard: {
// optionally load pre-recorded chalkboard drawing from file
src: "chalkboard.json",
},
dependencies: [
// ...
{ src: 'plugin/chalkboard/chalkboard.js' },
// ...
],
keyboard: {
67: function() { RevealChalkboard.toggleNotesCanvas() }, // toggle notes canvas when 'c' is pressed
66: function() { RevealChalkboard.toggleChalkboard() }, // toggle chalkboard when 'b' is pressed
46: function() { RevealChalkboard.clear() }, // clear chalkboard when 'DEL' is pressed
8: function() { RevealChalkboard.reset() }, // reset chalkboard data on current slide when 'BACKSPACE' is pressed
68: function() { RevealChalkboard.download() }, // downlad recorded chalkboard drawing when 'd' is pressed
},
// ...
});
```
In order to include buttons for opening and closing the notes canvas or the chalkboard you should make sure that ```font-awesome``` is available. The easiest way is to include
```
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
```
to the ```head``` section of you HTML-file.
## Usage
### Enable & disable
With above configuration the notes canvas is opened and closed when pressing 'c' and the chalkboard is opened and closed when pressing 'b'.
### Mouse
- Click the left mouse button and drag to write on notes canvas or chalkboard
- Click the right mouse button and drag to wipe away previous drawings
### Touch
- Touch and move to write on notes canvas or chalkboard
- Touch and hold for half a second, then move to wipe away previous drawings
### Keyboard
- Click the 'DEL' key to clear the chalkboard </li>
- Click the 'd' key to download chalkboard drawings</li>
- Click the 'BACKSPACE' key to delete all chalkboard drawings on the current slide</li>
## Playback
If the ```autoSlide``` feature is set or if the ```audio-slideshow``` plugin is used, pre-recorded chalkboard drawings can be played. The slideshow plays back the user interaction with the chalkboard in the same way as it was conducted when recording the data.
## PDF-Export
If the slideshow is opened in [print mode](https://github.com/hakimel/reveal.js/#pdf-export) the pre-recorded chalkboard drawings (which must be provided in a file, see ```src``` option) are included in the PDF-file. Each drawing on the chalkboard is added after the slide that was shown when opening the chalkboard. Drawings are also included if they had been cleared (using the 'DEL' key). Drawings on the notes canvas are not included in the PDF-file.
## Configuration
The plugin has several configuration options:
- ```src```: Optional filename for pre-recorded drawings.
- ```readOnly```: Configuation option allowing to prevent changes to existing drawings. If set to ```true``` no changes can be made, if set to false ```false``` changes can be made, if unset or set to ```undefined``` no changes to the drawings can be made after returning to a slide or fragment for which drawings had been recorded before. In any case the recorded drawings for a slide or fragment can be cleared by pressing the 'DEL' key (i.e. by using the ```RevealChalkboard.clear()``` function).
- ```toggleNotesButton```: If set to ```true``` a button for opening and closing the notes canvas is shown. Alternatively, the css position attributes can be provided if the default position is not appropriate.
- ```toggleChalkboardButton```: If set to ```true``` a button for opening and closing the chalkboard is shown. Alternatively, the css position attributes can be provided if the default position is not appropriate.
- ```transition```: Gives the duration (in milliseconds) of the transition for a slide change, so that the notes canvas is drawn after the transition is completed.
- ```theme```: Can be set to either ```"chalkboard"``` or ```"whiteboard"```.
The following configuration options allow to change the appearance of the notes canvas and the chalkboard. All of these options require two values, the first gives the value for the notes canvas, the second for the chalkboard.
- ```color```: The first value gives the pen color, the second value gives the color of the chalk.
- ```background```: The first value expects a (semi-)transparent color which is used to provide visual feedback that the notes canvas is enabled, the second value expects a filename to a background image for the chalkboard.
- ```pen```: The first value expects a filename for an image of the pen used for the notes canvas, the second value expects a filename for an image of the pen used for the chalkboard.
All of the configurations are optional and the default values shown below are used if the options are not provided.
```javascript
Reveal.initialize({
// ...
chalkboard: {
src: null,
readOnly: undefined,
toggleChalkboardButton: { left: "30px", bottom: "30px", top: "auto", right: "auto" },
toggleNotesButton: { left: "30px", bottom: "30px", top: "auto", right: "auto" },
transition: 800,
theme: "chalkboard",
// configuration options for notes canvas and chalkboard
color: [ 'rgba(0,0,255,1)', 'rgba(255,255,255,0.5)' ],
background: [ 'rgba(127,127,127,.1)' , 'reveal.js-plugins/chalkboard/img/blackboard.png' ],
pen: [ 'url(reveal.js-plugins/chalkboard/img/boardmarker.png), auto', 'url(reveal.js-plugins/chalkboard/img/chalk.png), auto' ],
},
// ...
});
```
**Note:** Customisation of pens has changed since version 0.5 of the plugin, it is now possible to use standard cursors, e.g. by setting ```pen: [ 'crosshair', 'pointer' ]```. Please update your parameters if migrating from an older version.
## License
MIT licensed
Copyright (C) 2016 Asvin Goel
{
"_from": "reveal.js-chalkboard@~1.0.0",
"_id": "reveal.js-chalkboard@1.0.0",
"_inBundle": false,
"_integrity": "sha512-lSNmMiIbYo/1Bh2wF3JgWgAB6K60wI8GO5AJhO6sBTSVV5nRAQnlH6ybkzr8PnY+pbcjvsPsXVghFF7pt/2WIw==",
"_location": "/reveal.js-chalkboard",
"_phantomChildren": {},
"_requested": {
"type": "range",
"registry": true,
"raw": "reveal.js-chalkboard@~1.0.0",
"name": "reveal.js-chalkboard",
"escapedName": "reveal.js-chalkboard",
"rawSpec": "~1.0.0",
"saveSpec": null,
"fetchSpec": "~1.0.0"
},
"_requiredBy": [
"/"
],
"_resolved": "https://registry.npmjs.org/reveal.js-chalkboard/-/reveal.js-chalkboard-1.0.0.tgz",
"_shasum": "5fa4a1e631082f92524a78cb590897128158c993",
"_spec": "reveal.js-chalkboard@~1.0.0",
"_where": "/tmp/RISE/rise-reveal",
"author": {
"name": "Asvin Goel"
},
"bugs": {
"url": "https://github.com/rajgoel/reveal.js-plugins.git/issues"
},
"bundleDependencies": false,
"deprecated": false,
"description": "Add a blackboard to your reveal.js presentations",
"homepage": "https://github.com/rajgoel/reveal.js-plugins/blob/master/chalkboard/README.md",
"keywords": [
"reveal",
"chalkboard",
"blackboard"
],
"license": "MIT",