embed clip in a jupyter notebook

[laurentperrinet]

using a video clip generated by:

duration = 20.
fig_mpl, ax = plt.subplots(1, figsize=(6, 5), facecolor='white')

def draw_elementary_pattern(ax, center):
    ax.add_artist(mpl.patches.Wedge(center, 1., 0, 180, width=.1))

def make_frame_mpl(t):
    ax.cla()
    draw_elementary_pattern(ax, t/duration)
    return mplfig_to_npimage(fig_mpl) # RGB image of the figure

animation = mpy.VideoClip(make_frame_mpl, duration=duration)

I am trying to embed it in the notebook using:

mpy.ipython_display("circles.webm", fps=20, loop=1, autoplay=1)

This was working nicely when I was using python 2, but seems to be broken when using python 3:

(The video generated by

animation.write_videofile("circles.webm", fps=20)

would show fine in the browser when opened directly)

$ python3 --version
Python 3.4.3

$ ipython --version
3.1.0

any clue?

(and thanks a lot for this excellent piece of code!)

[Zulko]

I just tried that exact line and it works for me on my jupyter... are you using firefox or chrome ?

Also, hint: instead of first writing to a file and then importing in the notebook, you can directly preview the clip with

clip.ipython_display(fps=20, loop=1, autoplay=1)

which is faster to write in the notebook.

[laurentperrinet]

when doing

animation.write_videofile("circles.mp4", fps=20)
from IPython.core.display import HTML
HTML("""
    <video controls src="{0}" loop=1 autoplay width=100%/> 
    """.format('circles.mp4')
)

it would work while

def video(fname, mimetype):
    """Load the video in the file `fname`, with given mimetype, and display as HTML5 video.
    """
    from IPython.display import HTML
    video_encoded = open(fname, "rb").read().encode("base64")
    video_tag = '<video controls alt="test" src="data:video/{0};base64,{1}">'.format(mimetype, video_encoded)
    return HTML(data=video_tag)
video('circles.mp4', 'mp4')

gives

---------------------------------------------------------------------------
AttributeError                            Traceback (most recent call last)
<ipython-input-11-500091b8409e> in <module>()
      6     video_tag = '<video controls alt="test" src="data:video/{0};base64,{1}">'.format(mimetype, video_encoded)
      7     return HTML(data=video_tag)
----> 8 video('circles.mp4', 'mp4')

<ipython-input-11-500091b8409e> in video(fname, mimetype)
      3     """
      4     from IPython.display import HTML
----> 5     video_encoded = open(fname, "rb").read().encode("base64")
      6     video_tag = '<video controls alt="test" src="data:video/{0};base64,{1}">'.format(mimetype, video_encoded)
      7     return HTML(data=video_tag)

AttributeError: 'bytes' object has no attribute 'encode'

[Zulko]

Is this code linked to the previous problem ? The code you showed is not from moviepy (in moviepy I use the base64 module, I hope it doesn't bug in python3).

The previous problem seems to be that your browser can't open the video, but we don't see any moviepy-related bug... Also, does it work when you use clip.ipython_display() ?

[laurentperrinet]

It seems to be a problem in the way python 3 handles byte objects (for a nice and comprehensive description of the changes, see https://docs.python.org/3.3/whatsnew/3.0.html#text-vs-data-instead-of-unicode-vs-8-bit ). I have submitted a PR to solve this.

[keikoro]

The related PR by OP got merged. Closing.