Shared publicly  - 
 
Unfortunately I don't have the time to try this out right now but it looks very interesting! Can anyone give it a try and let us know how well it works? Making a smoother path to presentation materials from notebooks is high on our todo list, and this sounds like a good first step in that direction. If it woks, we should definitely try to streamline the process as much as possible. +Wes McKinney, have you had a look at it yet?
Damián Avila originally shared:
 
How to embed IPython notebook in a html5 slideshow.

Some days ago, Wes McKinney (@wesmckinn) said in twitter: You know what would be awesome? An HTML5 slideshow where each slide contains an IPython notebook cell or two #python

To provide some help, I sent him a link (http://code.google.com/p/html5slides) where you can download a html5 slideshow template. But, this was a very little help, and he is working very hard in Pandas (http://pandas.sourceforge.net), so I proposed to me to achieve what he needs.

This morning I took my breakfast time to figure out one way to do this (disclaimer: maybe this is not the more elegant way to resolve the problem but I achieved the goal, jeje!)

1- You have to download this presentation [1] in html5 (modified from http://code.google.com/p/html5slides, thanks for your work!)

If you look at the code, you will see this block:

<article class='nobackground'>
<h3>
IPython embedded + title
</h3>

<iframe src='URI_obtained_from_your_IPython_notebook_running'></iframe>
</article>

Keep in mind this, we come back here soon!

2- You have to run a IPython notebook and, in the dashboard page, create a new notebook or load a previous one.

When the new page (with your notebook) opens, you have to seek and copy the URI provided in the address bar (IMPORTANT NOTE: take in mind that this URI is different each time you run IPython, so before you begin with your presentation, be sure that run your IPython notebook to get the properly URI) and paste it in the code of your presentation. Where? In 'URI_obtained_from_your_IPython_notebook_running', you know where it is (see the step 1 again if you don't get it).

3- Enjoy you presentation!!!

Here is a image of IPython notebook embedded in the presentation you downloaded before [1].

I hope you can find this useful.
See you!

[1] http://www.fileserve.com/file/vswyEsj/IPython_embedded.zip
2
1
Fernando Perez's profile photoDamián Avila's profile photoMatthew Turk's profile photoBenjamin Root's profile photo
21 comments
 
Thanks for sharing... It works pretty well. I hope others can replicate this without any problem. I think that some kind of native implementation of all this process in IPython would be great. If you have any question, don't hesitate to ask me (btw, I'm from Argentina, so you can also write to me in Spanish)... Regards.
 
I have not had a look yet. Looks like a promising approach though
 
What would really be great is to be able to display just a single input/output cell as an element on the slide. So the slide would become interactive. Would have to think about how that would be done
 
You can achieve something similar if you embed several different IPython notebooks with the cells of interest (whit the same methodology describe above)
 
But, I understand the interactive slide you proposed, let me think about that a little more...
 
Yes, we need to find a good approach for this, so that one can have a clean presentation workflow, without scrolling. During presentations, the ideal setup is to just switch whole slides without the need to scroll, but having in addition true interactive slides would be awesome.
 
I'm agree. This "quick tip" is the first attempt to achieve interactive slides, and now, we have it (all the notebook embedded, at least)!
I will continue working in this "approach" to achieve the "true" interactive slide, but I suspect that I will need some strong interaction with the IPython code (and obviously, time...).
 
Great. BTW, the ideal forum for this is the ipython-dev list, where you'll likely encounter other interested parties who might also be able/willing to help out!
 
What about having a "slide show" view for a notebook that provides a slide show like UI for a notebook where each cell is a slide. It would allow you to mix markup cells with code. I guess that doesn't let you have code and text in a single slide though.
 
Yes, it would be great. Certainly, in order to get there, we will have to deal with changes in the code that show us the notebook (i have not read the code yet). But this feature will be great!! In the meantime, we have this "Frankenstein" methodology... jeje!
 
+Fernando Perez, +Brian Granger -- sorry to reawaken an older thread, but do you think that connecting to a dynamically created IPython notebook inside a running web application would be feasible? As an example, if we wanted to programmatically spawn (on demand, from the server process) a new instance of the IPython notebook inside our existing web interface, would that be feasible?
 
I don't think there is any fundamental problem with this. Just a matter of writing the code.
 
+Brian Granger and +Damián Avila -- thanks for the pointers. Damian, what you describe is essentially what I was thinking about. I'll read the documentation and source a bit more in detail and continue any discussions on the IPython list. For reference, this would be in regards to embedding the notebook inside the +yt GUI, which is currently an ExtJS-based GUI with a bunch of widgets (which we are considering completely refocusing on) and a very simple cell / execute cell interface. The (proto-)idea would be to make our interface a backup in case 0MQ is not available locally, and otherwise use IPython.
 
+Matthew Turk, I'm in Boulder at a workshop and also had to give two talks at CU, where I met one of the yt developers (Sam ???). We had a brief chat about yt (I've read your paper from SC2011), and we'd certainly love to have better collaboration/integration between the projects. The workshop I'm at is an NIH/bioinformatics one, where folks like +Titus Brown are already using the notebook to run their analyses and make their results more accessible and easy to replicate (http://ivory.idyll.org/blog/apr-12/replication-i.html). If we can get similar reuse across other disciplines, we'll be well on our way to building a truly reusable platform with less code duplication between projects.

Do you have anyone in the yt team at Berkeley/LBL/Sandia/Stanford? If so, put us in touch and they could come to Berkeley to meet with +Min RK and I; we can give you some hands-on pointers to get things moving.
 
Hi +Fernando Perez -- it was both chatting with +Sam Skillman and seeing +Titus Brown's post that got me thinking about this. We are extremely conservative in adding new dependencies, and most of our users run exclusively on shared-user systems, both of which play into our development strategy. I think it's pretty fair to say, though, that our goals are pretty similar.

A couple +yt developers are in the Bay Area -- specifically, +Casey Stark, +J. S. Oishi and +Nathan Goldbaum (at LBNL/Berkeley, Stanford and UCSC, respectively). I'd be interested in learning more about this as well, but I'm not sure I will be in the Bay until the middle of July (just before SciPy 2012, which I'll also be attending.) Having now re-read the security and protocol definitions in the 0.13dev documentation, I'm coming around to think that perhaps we should refocus our widgets on operating on a clearly-defined RPC-exposing object that lives inside the IPython engine that gets spawned at the initialization of the server (and terminated during shutdown.) We could embed the IPython notebook as noted above, retain the basic structure of the existing web GUI we have, and have our widgets (and the affiliated loaded data) still accessible from within the notebook.

As I mentioned, though, I'm happy to continue this discussion on IPython-dev, although before I send any missives there I'll try to dive in to see more about the separation of the engine from the client and the affiliated APIs.
 
and btw +Matthew Turk, we're busy reworking our machinery to expose a clean way for python objects to expose a dynamic javascript view including callbacks into the python kernel. this is incredibly high on the priority/wishlist for many reasons, so by all means let's continue on ipython-dev to ensure we get the design right and all relevant parties participate in the discussion.
 
Awesome. That would essentially be our killer feature (I saw those d3.js demos from a while back) and the only remaining stumbling block. I've just issued a PR to add 0MQ, pyzmq and Tornado to the yt install script ( http://goo.gl/nfiKY ), so hopefully we can start laying the groundwork for future integration. I'll follow along on ipython-dev.
 
Great!!! I will look for this discussion in ipython-dev because I want to integrate NINJA-IDE and IPython in a deeper way...
Add a comment...