diff options
Diffstat (limited to 'docutils')
| -rw-r--r-- | docutils/HISTORY.txt | 3 | ||||
| -rwxr-xr-x | docutils/docs/user/rst/images/pens.mp4 | bin | 0 -> 139138 bytes | |||
| -rw-r--r-- | docutils/docutils/writers/html5_polyglot/__init__.py | 37 | ||||
| -rw-r--r-- | docutils/test/functional/expected/video.html | 38 | ||||
| -rw-r--r-- | docutils/test/functional/input/data/video.txt | 34 | ||||
| -rw-r--r-- | docutils/test/functional/tests/html5_video.py | 14 |
6 files changed, 125 insertions, 1 deletions
diff --git a/docutils/HISTORY.txt b/docutils/HISTORY.txt index 8c6fe84f2..454cf1d88 100644 --- a/docutils/HISTORY.txt +++ b/docutils/HISTORY.txt @@ -103,6 +103,7 @@ Version 0.17b1 is found in `inline` and `literal` elements. Use <ins> and <del> if a matching class value is found in `inline`, `literal`, or `container` elements. + Use <small> for generated code line numbers. - Fix bug #398: properly close link tag to "schema.dcterms". @@ -110,7 +111,7 @@ Version 0.17b1 __ https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag - - Use <small> for code line numbers and also add them as "data-*" arguments. + - Use <video> for images with video MIME types supported by HTML5. * docutils/writers/html5_polyglot/minimal.css diff --git a/docutils/docs/user/rst/images/pens.mp4 b/docutils/docs/user/rst/images/pens.mp4 Binary files differnew file mode 100755 index 000000000..8202d398c --- /dev/null +++ b/docutils/docs/user/rst/images/pens.mp4 diff --git a/docutils/docutils/writers/html5_polyglot/__init__.py b/docutils/docutils/writers/html5_polyglot/__init__.py index b7376fb49..4d814f17d 100644 --- a/docutils/docutils/writers/html5_polyglot/__init__.py +++ b/docutils/docutils/writers/html5_polyglot/__init__.py @@ -27,11 +27,14 @@ the style sheet "plain.css" improves reading experience. """ __docformat__ = 'reStructuredText' +import mimetypes import os.path + import docutils from docutils import frontend, nodes, writers, io from docutils.transforms import writer_aux from docutils.writers import _html_base +from docutils.writers._html_base import PIL, url2pathname class Writer(writers._html_base.Writer): @@ -307,6 +310,40 @@ class HTMLTranslator(writers._html_base.HTMLTranslator): self.body_prefix.extend(header) self.header.extend(header) del self.body[start:] + + # MIME types supported by the HTML5 <video> element + videotypes = ('video/mp4', 'video/webm', 'video/ogg') + + def visit_image(self, node): + atts = {} + uri = node['uri'] + mimetype = mimetypes.guess_type(uri)[0] + if mimetype not in self.videotypes: + return super(HTMLTranslator, self).visit_image(node) + # image size + if 'width' in node: + atts['width'] = node['width'].replace('px', '') + if 'height' in node: + atts['height'] = node['height'].replace('px', '') + if 'align' in node: + atts['class'] = 'align-%s' % node['align'] + if 'controls' in node.get('classes', []): + atts['controls'] = 'controls' + atts['title'] = node.get('alt', uri) + + # No newline in inline context or if surrounded by <a>...</a>. + if (isinstance(node.parent, nodes.TextElement) or + (isinstance(node.parent, nodes.reference) and + not isinstance(node.parent.parent, nodes.TextElement))): + suffix = '' + else: + suffix = '\n' + self.body.append('%s<a href="%s">%s</a>%s</video>%s' + % (self.starttag(node, 'video', suffix, src=uri, **atts), + uri, node.get('alt', uri), suffix, suffix)) + + def depart_image(self, node): + pass # use HTML text-level tags if matching class value found supported_inline_tags = set(('code', 'kbd', 'dfn', 'samp', 'var', diff --git a/docutils/test/functional/expected/video.html b/docutils/test/functional/expected/video.html new file mode 100644 index 000000000..6940279ab --- /dev/null +++ b/docutils/test/functional/expected/video.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> +<head> +<meta charset="utf-8"/> +<meta name="viewport" content="width=device-width, initial-scale=1" /> +<meta name="generator" content="Docutils 0.17b2.dev: http://docutils.sourceforge.net/" /> +<title>Moving images (video)</title> +<link rel="stylesheet" href="../input/data/minimal.css" type="text/css" /> +<link rel="stylesheet" href="../input/data/plain.css" type="text/css" /> +</head> +<body> +<main id="moving-images-video"> +<h1 class="title">Moving images (video)</h1> + +<p>If the URL given to <cite>images and figures</cite> hints to a video format +supported by HTMLÂ 5 (MIME types 'video/mp4', 'video/webm', or +'video/ogg'), the HTML5 writer will place it in a <a class="reference external" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video">video element</a>.</p> +<video class="align-left" src="../../../docs/user/rst/images/pens.mp4" title="left-aligned test video"> +<a href="../../../docs/user/rst/images/pens.mp4">left-aligned test video</a> +</video> +<p>A class option value "controls" tells the browser to display controls +for video playback.</p> +<p>It is a good idea to include width and height attributes. If +height and width are not set, the page might flicker while the video +loads. According to the <a class="reference external" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video">HTML5 spec</a>, hight and width must be +specified as pixel values.</p> +<figure class="align-center"> +<video class="controls" controls="controls" src="../../../docs/user/rst/images/pens.mp4" title="../../../docs/user/rst/images/pens.mp4" width="30%"> +<a href="../../../docs/user/rst/images/pens.mp4">../../../docs/user/rst/images/pens.mp4</a> +</video> +<figcaption> +<p>Simple test video in a centered figure</p> +</figcaption> +</figure> +<p>A video like this <video src="../../../docs/user/rst/images/pens.mp4" title="testvideo" width="60"><a href="../../../docs/user/rst/images/pens.mp4">testvideo</a></video> can be included inline via substitution.</p> +</main> +</body> +</html> diff --git a/docutils/test/functional/input/data/video.txt b/docutils/test/functional/input/data/video.txt new file mode 100644 index 000000000..46ca2ff1a --- /dev/null +++ b/docutils/test/functional/input/data/video.txt @@ -0,0 +1,34 @@ +Moving images (video) +--------------------- + +If the URL given to `images and figures` hints to a video format +supported by HTMLÂ 5 (MIME types 'video/mp4', 'video/webm', or +'video/ogg'), the HTML5 writer will place it in a `video element`_. + +.. image:: ../../../docs/user/rst/images/pens.mp4 + :align: left + :alt: left-aligned test video + +A class option value "controls" tells the browser to display controls +for video playback. + +It is a good idea to include width and height attributes. If +height and width are not set, the page might flicker while the video +loads. According to the `HTML5 spec`__, hight and width must be +specified as pixel values. + +.. figure:: ../../../docs/user/rst/images/pens.mp4 + :width: 30% + :align: center + :class: controls + + Simple test video in a centered figure + +.. |testvideo| image:: ../../../docs/user/rst/images/pens.mp4 + :width: 60 px + +A video like this |testvideo| can be included inline via substitution. + +__ +.. _video element: + https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video diff --git a/docutils/test/functional/tests/html5_video.py b/docutils/test/functional/tests/html5_video.py new file mode 100644 index 000000000..6a4163785 --- /dev/null +++ b/docutils/test/functional/tests/html5_video.py @@ -0,0 +1,14 @@ +with open('functional/tests/_standalone_rst_defaults.py') as _f: + exec(_f.read()) + +# Source and destination file names. +test_source = "data/video.txt" +test_destination = "video.html" + +# Keyword parameters passed to publish_file. +writer_name = "html5" + +# Settings: +# local copy of stylesheets: +# (Test runs in ``docutils/test/``, we need relative path from there.) +settings_overrides['stylesheet_dirs'] = ('.', 'functional/input/data') |