251 lines
12 KiB
Markdown
Executable File
251 lines
12 KiB
Markdown
Executable File
[<img src="https://seleniumbase.io/cdn/img/sb_logo_10t.png" title="SeleniumBase" width="220">](https://github.com/seleniumbase/SeleniumBase/)
|
|
|
|
<h1> 📑 Presenter / Slides 🎞️ </h1>
|
|
|
|
<p>SeleniumBase Presenter / Slides lets you use Python to generate HTML presentations and slide shows from Reveal-JS.</p>
|
|
|
|
<b>Here's a sample presentation:</b>
|
|
|
|
<a href="https://seleniumbase.io/other/presenter.html"><img width="500" src="https://seleniumbase.io/other/presenter.gif" title="Screenshot"></a><br>
|
|
|
|
([Click on the image/GIF for the actual presentation](https://seleniumbase.io/other/presenter.html))
|
|
|
|
([Here's the code for that presentation](https://github.com/seleniumbase/SeleniumBase/blob/master/examples/presenter/my_presentation.py))
|
|
|
|
Slides can include HTML, code, images, and iframes.
|
|
|
|
Here's how to run the example presentation:
|
|
|
|
```bash
|
|
cd examples/presenter
|
|
pytest my_presentation.py
|
|
```
|
|
|
|
**Here's a presentation with a chart:**
|
|
|
|
<a href="https://seleniumbase.io/other/core_presentation.html"><img width="428" src="https://seleniumbase.io/other/sb_core_areas.png" title="Screenshot"></a><br>
|
|
|
|
([Click on the image/GIF for the actual presentation](https://seleniumbase.io/other/core_presentation.html))
|
|
|
|
([Here's the code for that presentation](https://github.com/seleniumbase/SeleniumBase/blob/master/examples/presenter/core_presentation.py))
|
|
|
|
Here's how to run that example:
|
|
|
|
```bash
|
|
cd examples/presenter
|
|
pytest core_presentation.py
|
|
```
|
|
|
|
|
|
<h3><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="24" /> Creating a new presentation:</h3>
|
|
|
|
```python
|
|
self.create_presentation(name=None, theme="serif", transition="default")
|
|
""" Creates a Reveal-JS presentation that you can add slides to.
|
|
@Params
|
|
name - If creating multiple presentations at the same time,
|
|
use this to specify the name of the current presentation.
|
|
theme - Set a theme with a unique style for the presentation.
|
|
Valid themes: "serif" (default), "sky", "white", "black",
|
|
"simple", "league", "moon", "night",
|
|
"beige", "blood", and "solarized".
|
|
transition - Set a transition between slides.
|
|
Valid transitions: "none" (default), "slide", "fade",
|
|
"zoom", "convex", and "concave".
|
|
"""
|
|
```
|
|
|
|
If creating multiple presentations at the same time, you can pass the ``name`` parameter to distinguish between different presentations.
|
|
Notes are disabled by default. You can enable notes by specifying:
|
|
``show_notes=True``
|
|
|
|
|
|
<h3><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="24" /> Adding a slide to a presentation:</h3>
|
|
|
|
```python
|
|
self.add_slide(content=None, image=None, code=None, iframe=None,
|
|
content2=None, notes=None, transition=None, name=None)
|
|
""" Allows the user to add slides to a presentation.
|
|
@Params
|
|
content - The HTML content to display on the presentation slide.
|
|
image - Attach an image (from a URL link) to the slide.
|
|
code - Attach code of any programming language to the slide.
|
|
Language-detection will be used to add syntax formatting.
|
|
iframe - Attach an iFrame (from a URL link) to the slide.
|
|
content2 - HTML content to display after adding an image or code.
|
|
notes - Additional notes to include with the slide.
|
|
ONLY SEEN if show_notes is set for the presentation.
|
|
transition - Set a transition between slides. (overrides previous)
|
|
Valid transitions: "none" (default), "slide", "fade",
|
|
"zoom", "convex", and "concave".
|
|
name - If creating multiple presentations at the same time,
|
|
use this to select the presentation to add slides to.
|
|
"""
|
|
```
|
|
|
|
|
|
<h3><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="24" /> Running a presentation:</h3>
|
|
|
|
```python
|
|
self.begin_presentation(
|
|
filename="my_presentation.html", show_notes=False, interval=0)
|
|
""" Begin a Reveal-JS Presentation in the web browser.
|
|
@Params
|
|
name - If creating multiple presentations at the same time,
|
|
use this to select the one you wish to add slides to.
|
|
filename - The name of the HTML file that you wish to
|
|
save the presentation to. (filename must end in ".html")
|
|
show_notes - When set to True, the Notes feature becomes enabled,
|
|
which allows presenters to see notes next to slides.
|
|
interval - The delay time between autoplaying slides. (in seconds)
|
|
If set to 0 (default), autoplay is disabled.
|
|
"""
|
|
```
|
|
|
|
Before the presentation is run, the full HTML is saved to the ``saved_presentations/`` folder.
|
|
|
|
|
|
All methods have the optional ``name`` argument, which is only needed if you're creating multiple presentations at once.
|
|
|
|
<h3><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="24" /> Here's an example of using SeleniumBase Presenter:</h3>
|
|
|
|
```python
|
|
from seleniumbase import BaseCase
|
|
|
|
|
|
class MyPresenterClass(BaseCase):
|
|
|
|
def test_presenter(self):
|
|
self.create_presentation(theme="serif")
|
|
self.add_slide(
|
|
'<h1>Welcome</h1><br />\n'
|
|
'<h3>Press the <b>Right Arrow</b></h3>')
|
|
self.add_slide(
|
|
'<h3>SeleniumBase Presenter</h3><br />\n'
|
|
'<img width="240" src="https://seleniumbase.io/img/logo3a.png" />'
|
|
'<span style="margin:144px;" />'
|
|
'<img src="https://seleniumbase.io/other/python_3d_logo.png" />'
|
|
'<br /><br />\n<h4>Create presentations with <b>Python</b></h4>')
|
|
self.add_slide(
|
|
'<h3>Make slides using <b>HTML</b>:</h3><br />\n'
|
|
'<table style="padding:10px;border:4px solid black;font-size:50;">'
|
|
'\n<tr style="background-color:CDFFFF;">\n'
|
|
'<th>Row ABC</th><th>Row XYZ</th></tr>\n'
|
|
'<tr style="background-color:DCFDDC;">'
|
|
'<td>Value ONE</td><td>Value TWO</td></tr>\n'
|
|
'<tr style="background-color:DFDFFB;">\n'
|
|
'<td>Value THREE</td><td>Value FOUR</td></tr>\n'
|
|
'</table><br />\n<h4>(HTML <b>table</b> example)</h4>')
|
|
self.add_slide(
|
|
'<h3>Keyboard Shortcuts:</h3>\n'
|
|
'<table style="padding:10px;border:4px solid black;font-size:30;'
|
|
'background-color:FFFFDD;">\n'
|
|
'<tr><th>Key</th><th>Action</th></tr>\n'
|
|
'<tr><td><b>=></b></td><td>Next Slide (N also works)</td></tr>\n'
|
|
'<tr><td><b><=</b></td><td>Previous Slide (P also works)</td></tr>'
|
|
'\n<tr><td>F</td><td>Full Screen Mode</td></tr>\n'
|
|
'<tr><td>O</td><td>Overview Mode Toggle</td></tr>\n'
|
|
'<tr><td>esc</td><td>Exit Full Screen / Overview Mode</td></tr>\n'
|
|
'<tr><td><b>.</b></td><td>Pause/Resume Toggle</td></tr>\n'
|
|
'<tr><td>space</td><td>Next Slide (alternative)</td></tr></table>'
|
|
)
|
|
self.add_slide(
|
|
'<h3>Add <b>images</b> to slides:</h3>',
|
|
image="https://seleniumbase.io/other/seagulls.jpg")
|
|
self.add_slide(
|
|
'<h3>Add <b>code</b> to slides:</h3>',
|
|
code=(
|
|
'from seleniumbase import BaseCase\n\n'
|
|
'class MyTestClass(BaseCase):\n\n'
|
|
' def test_basics(self):\n'
|
|
' self.open("https://store.xkcd.com/search")\n'
|
|
' self.type(\'input[name="q"]\', "xkcd book\\n")\n'
|
|
' self.assert_text("xkcd: volume 0", "h3")\n'
|
|
' self.open("https://xkcd.com/353/")\n'
|
|
' self.assert_title("xkcd: Python")\n'
|
|
' self.assert_element(\'img[alt="Python"]\')\n'
|
|
' self.click(\'a[rel="license"]\')\n'
|
|
' self.assert_text("free to copy and reuse")\n'
|
|
' self.go_back()\n'
|
|
' self.click_link("About")\n'
|
|
' self.assert_exact_text("xkcd.com", "h2")'))
|
|
self.add_slide(
|
|
"<h3>Highlight <b>code</b> in slides:</h3>",
|
|
code=(
|
|
'from seleniumbase import BaseCase\n\n'
|
|
'<mark>class MyTestClass(BaseCase):</mark>\n\n'
|
|
' def test_basics(self):\n'
|
|
' self.open("https://store.xkcd.com/search")\n'
|
|
' self.type(\'input[name="q"]\', "xkcd book\\n")\n'
|
|
' self.assert_text("xkcd: volume 0", "h3")'))
|
|
self.add_slide(
|
|
'<h3>Add <b>iFrames</b> to slides:</h3>',
|
|
iframe="https://seleniumbase.io/demo_page")
|
|
self.add_slide(
|
|
'<h3>Getting started is <b>easy</b>:</h3>',
|
|
code=(
|
|
'from seleniumbase import BaseCase\n\n'
|
|
'class MyPresenterClass(BaseCase):\n\n'
|
|
' def test_presenter(self):\n'
|
|
' self.create_presentation(theme="serif")\n'
|
|
' self.add_slide("Welcome to Presenter!")\n'
|
|
' self.add_slide(\n'
|
|
' "Add code to slides:",\n'
|
|
' code=(\n'
|
|
' "from seleniumbase import BaseCase\\n\\n"\n'
|
|
' "class MyPresenterClass(BaseCase):\\n\\n"\n'
|
|
' " def test_presenter(self):\\n"\n'
|
|
' " self.create_presentation()\\n"))\n'
|
|
' self.begin_presentation(\n'
|
|
' filename="demo.html", show_notes=True)'))
|
|
self.add_slide(
|
|
'<h3>Include <b>notes</b> with slides:</h3><br />',
|
|
code=('self.add_slide("[Your HTML goes here]",\n'
|
|
' code="[Your software code goes here]",\n'
|
|
' content2="[Additional HTML goes here]",\n'
|
|
' notes="[Attached speaker notes go here]"\n'
|
|
' "[Note A! -- Note B! -- Note C! ]")'),
|
|
notes='<h2><ul><li>Note A!<li>Note B!<li>Note C!<li>Note D!</h2>',
|
|
content2="<h4>(Notes can include HTML tags)</h4>")
|
|
self.add_slide(
|
|
'<h3>Multiple <b>themes</b> available:</h3>',
|
|
code=(
|
|
'self.create_presentation(theme="serif")\n\n'
|
|
'self.create_presentation(theme="sky")\n\n'
|
|
'self.create_presentation(theme="simple")\n\n'
|
|
'self.create_presentation(theme="white")\n\n'
|
|
'self.create_presentation(theme="moon")\n\n'
|
|
'self.create_presentation(theme="black")\n\n'
|
|
'self.create_presentation(theme="night")\n\n'
|
|
'self.create_presentation(theme="beige")\n\n'
|
|
'self.create_presentation(theme="league")'))
|
|
self.add_slide(
|
|
'<h2><b>The End</b></h2>',
|
|
image="https://seleniumbase.io/img/sb_logo_10.png")
|
|
self.begin_presentation(
|
|
filename="presenter.html", show_notes=True, interval=0)
|
|
```
|
|
|
|
That example is from [my_presentation.py](https://github.com/seleniumbase/SeleniumBase/blob/master/examples/presenter/my_presentation.py), which you can run from the ``examples/presenter`` folder with the following command:
|
|
|
|
```bash
|
|
pytest my_presentation.py
|
|
```
|
|
|
|
<h3><img src="https://seleniumbase.io/img/sb_icon.png" title="SeleniumBase" width="24" /> Saving a presentation:</h3>
|
|
|
|
If you want to save the presentation you created as an HTML file, use:
|
|
|
|
```python
|
|
self.save_presentation(filename="my_presentation.html", show_notes=True)
|
|
```
|
|
|
|
Presentations automatically get saved when calling:
|
|
```python
|
|
self.begin_presentation(show_notes=True)
|
|
```
|
|
|
|
--------
|
|
|
|
<h3 align="left"><img src="https://seleniumbase.io/cdn/img/sb_logo_b.png" alt="SeleniumBase" width="240" /></h3>
|