SeleniumBase/examples/presenter/ReadMe.md

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>