From d5c50fe4aa3cf7b0b5351f9137d0378b2e7a68b3 Mon Sep 17 00:00:00 2001 From: damianavila Date: Wed, 31 May 2017 17:47:37 -0300 Subject: [PATCH 1/6] Better per-slide scrolling (defaulting to False but with options to enable it), upgrade to latest reveal.js and add one option to pass the transition we want. --- nbconvert/exporters/slides.py | 19 +++++++++++++- nbconvert/postprocessors/serve.py | 2 +- nbconvert/templates/html/slides_reveal.tpl | 30 ++++++++++++++++------ 3 files changed, 41 insertions(+), 10 deletions(-) diff --git a/nbconvert/exporters/slides.py b/nbconvert/exporters/slides.py index 42bc8cd77..cfede8308 100644 --- a/nbconvert/exporters/slides.py +++ b/nbconvert/exporters/slides.py @@ -6,7 +6,7 @@ from copy import deepcopy from warnings import warn -from traitlets import Unicode, default +from traitlets import Bool, Unicode, default from .html import HTMLExporter @@ -103,6 +103,21 @@ def _reveal_url_prefix_default(self): """ ).tag(config=True) + reveal_transition = Unicode('linear', + help=""" + Name of the reveal.js transition to use. + + The list of themes that ship by default with reveal.js are: + default, cube, page, concave, zoom, none. + """ + ).tag(config=True) + + reveal_scroll = Bool(False, + help=""" + Whether to enable/disable scrolling per slide basis + """ + ).tag(config=True) + require_js_url = Unicode( "https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js", help=""" @@ -146,6 +161,8 @@ def from_notebook_node(self, nb, resources=None, **kw): resources['reveal'] = {} resources['reveal']['url_prefix'] = self.reveal_url_prefix resources['reveal']['theme'] = self.reveal_theme + resources['reveal']['transition'] = self.reveal_transition + resources['reveal']['scroll'] = self.reveal_scroll resources['reveal']['require_js_url'] = self.require_js_url resources['reveal']['jquery_url'] = self.jquery_url resources['reveal']['font_awesome_url'] = self.font_awesome_url diff --git a/nbconvert/postprocessors/serve.py b/nbconvert/postprocessors/serve.py index 872c8db7f..6c73240c4 100644 --- a/nbconvert/postprocessors/serve.py +++ b/nbconvert/postprocessors/serve.py @@ -45,7 +45,7 @@ class ServePostProcessor(PostProcessorBase): open_in_browser = Bool(True, help="""Should the browser be opened automatically?""" ).tag(config=True) - reveal_cdn = Unicode("https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.1.0", + reveal_cdn = Unicode("https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0", help="""URL for reveal.js CDN.""" ).tag(config=True) reveal_prefix = Unicode("reveal.js", help="URL prefix for reveal.js").tag(config=True) diff --git a/nbconvert/templates/html/slides_reveal.tpl b/nbconvert/templates/html/slides_reveal.tpl index 16890c174..4d90294d0 100644 --- a/nbconvert/templates/html/slides_reveal.tpl +++ b/nbconvert/templates/html/slides_reveal.tpl @@ -85,7 +85,6 @@ if( window.location.search.match( /print-pdf/gi ) ) { /* Overrides of notebook CSS for static HTML export */ .reveal { font-size: 160%; - overflow-y: scroll; } .reveal pre { width: inherit; @@ -190,8 +189,7 @@ require( progress: true, history: true, - theme: Reveal.getQueryHash().theme, // available themes are in /css/theme - transition: Reveal.getQueryHash().transition || 'linear', // default/cube/page/concave/zoom/linear/none + transition: "{{resources.reveal.transition}}", // Optional libraries used to extend on reveal.js dependencies: [ @@ -211,13 +209,29 @@ require( Reveal.addEventListener('slidechanged', update); - var update_scroll = function(event){ - $(".reveal").scrollTop(0); - }; - - Reveal.addEventListener('slidechanged', update_scroll); + function setScrollingSlide(scroll) { + + if (scroll === "True") { + var h = $('.reveal').height() * 0.95; + var hpx = "" + h + "px"; + $('section.present').find('section') + .filter(function() { + return $(this).height() > h; + }) + .css('height', hpx) + .css('overflow-y', 'scroll') + .css('margin-top', '20px'); + } + } + + Reveal.addEventListener( 'slidechanged', function( event ) { + // check and set the scrolling slide every time the slide change + var scroll = "{{resources.reveal.scroll}}"; + setScrollingSlide(scroll); + }); } + ); From 16c843f1ad285ba57bc421af0a27f1d56740ca4d Mon Sep 17 00:00:00 2001 From: damianavila Date: Thu, 1 Jun 2017 16:24:34 -0300 Subject: [PATCH 2/6] Correct docstrings about the transitions and use the slide one as default (previous know as linear but that name was deprecated). --- nbconvert/exporters/slides.py | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/nbconvert/exporters/slides.py b/nbconvert/exporters/slides.py index cfede8308..29e3e8472 100644 --- a/nbconvert/exporters/slides.py +++ b/nbconvert/exporters/slides.py @@ -103,12 +103,12 @@ def _reveal_url_prefix_default(self): """ ).tag(config=True) - reveal_transition = Unicode('linear', + reveal_transition = Unicode('slide', help=""" Name of the reveal.js transition to use. - The list of themes that ship by default with reveal.js are: - default, cube, page, concave, zoom, none. + The list of transitions that ships by default with reveal.js are: + none, fade, slide, convex, concave and zoom. """ ).tag(config=True) From acbd41fbc993b2b4c761ee91cbd7dd100811974a Mon Sep 17 00:00:00 2001 From: damianavila Date: Thu, 1 Jun 2017 16:25:44 -0300 Subject: [PATCH 3/6] Correct docstring for scroll option. --- nbconvert/exporters/slides.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/nbconvert/exporters/slides.py b/nbconvert/exporters/slides.py index 29e3e8472..32a4ce9b8 100644 --- a/nbconvert/exporters/slides.py +++ b/nbconvert/exporters/slides.py @@ -114,7 +114,7 @@ def _reveal_url_prefix_default(self): reveal_scroll = Bool(False, help=""" - Whether to enable/disable scrolling per slide basis + If True, enable scrolling within each slide """ ).tag(config=True) From 8eeeb2f8aa86620a70bbc966fba8b799086dc4e9 Mon Sep 17 00:00:00 2001 From: damianavila Date: Thu, 1 Jun 2017 16:51:58 -0300 Subject: [PATCH 4/6] Get the boolean in the correct way and simplify the function a little bit --- nbconvert/templates/html/slides_reveal.tpl | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/nbconvert/templates/html/slides_reveal.tpl b/nbconvert/templates/html/slides_reveal.tpl index 4d90294d0..dfe7ca4e8 100644 --- a/nbconvert/templates/html/slides_reveal.tpl +++ b/nbconvert/templates/html/slides_reveal.tpl @@ -209,9 +209,9 @@ require( Reveal.addEventListener('slidechanged', update); - function setScrollingSlide(scroll) { - - if (scroll === "True") { + function setScrollingSlide() { + var scroll = {{ resources.reveal.scroll | json_dumps }} + if (scroll === true) { var h = $('.reveal').height() * 0.95; var hpx = "" + h + "px"; $('section.present').find('section') @@ -224,11 +224,8 @@ require( } } - Reveal.addEventListener( 'slidechanged', function( event ) { - // check and set the scrolling slide every time the slide change - var scroll = "{{resources.reveal.scroll}}"; - setScrollingSlide(scroll); - }); + // check and set the scrolling slide every time the slide change + Reveal.addEventListener('slidechanged', setScrollingSlide); } From 51d5c7793b0478e56844b4550861a6222a1bf81f Mon Sep 17 00:00:00 2001 From: damianavila Date: Thu, 1 Jun 2017 20:15:32 -0300 Subject: [PATCH 5/6] Better (without track) scrolling bar and unified colors for controls, progress and the scrollbar as well --- nbconvert/templates/html/slides_reveal.tpl | 48 ++++++++++++++++++++++ 1 file changed, 48 insertions(+) diff --git a/nbconvert/templates/html/slides_reveal.tpl b/nbconvert/templates/html/slides_reveal.tpl index dfe7ca4e8..999af43af 100644 --- a/nbconvert/templates/html/slides_reveal.tpl +++ b/nbconvert/templates/html/slides_reveal.tpl @@ -115,6 +115,41 @@ if( window.location.search.match( /print-pdf/gi ) ) { .reveal .progress { position: static; } +.reveal .controls .navigate-left, +.reveal .controls .navigate-left.enabled { + border-right-color: #727272; +} +.reveal .controls .navigate-left.enabled:hover, +.reveal .controls .navigate-left.enabled.enabled:hover { + border-right-color: #dfdfdf; +} +.reveal .controls .navigate-right, +.reveal .controls .navigate-right.enabled { + border-left-color: #727272; +} +.reveal .controls .navigate-right.enabled:hover, +.reveal .controls .navigate-right.enabled.enabled:hover { + border-left-color: #dfdfdf; +} +.reveal .controls .navigate-up, +.reveal .controls .navigate-up.enabled { + border-bottom-color: #727272; +} +.reveal .controls .navigate-up.enabled:hover, +.reveal .controls .navigate-up.enabled.enabled:hover { + border-bottom-color: #dfdfdf; +} +.reveal .controls .navigate-down, +.reveal .controls .navigate-down.enabled { + border-top-color: #727272; +} +.reveal .controls .navigate-down.enabled:hover, +.reveal .controls .navigate-down.enabled.enabled:hover { + border-top-color: #dfdfdf; +} +.reveal .progress span { + background: #727272; +} div.input_area { padding: 0.06em; } @@ -148,6 +183,19 @@ a.anchor-link { .rendered_html p { text-align: inherit; } +::-webkit-scrollbar +{ + width: 6px; + height: 6px; +} +::-webkit-scrollbar * +{ + background:transparent; +} +::-webkit-scrollbar-thumb +{ + background: #727272 !important; +} From 2364f4c5eda2d83e0d643c7356fe06bfc6f2e097 Mon Sep 17 00:00:00 2001 From: damianavila Date: Fri, 2 Jun 2017 13:47:38 -0300 Subject: [PATCH 6/6] Use CSS calc instead of awful px based height --- nbconvert/templates/html/slides_reveal.tpl | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/nbconvert/templates/html/slides_reveal.tpl b/nbconvert/templates/html/slides_reveal.tpl index 999af43af..bd1e06b15 100644 --- a/nbconvert/templates/html/slides_reveal.tpl +++ b/nbconvert/templates/html/slides_reveal.tpl @@ -261,12 +261,11 @@ require( var scroll = {{ resources.reveal.scroll | json_dumps }} if (scroll === true) { var h = $('.reveal').height() * 0.95; - var hpx = "" + h + "px"; $('section.present').find('section') .filter(function() { return $(this).height() > h; }) - .css('height', hpx) + .css('height', 'calc(95vh)') .css('overflow-y', 'scroll') .css('margin-top', '20px'); }