Skip to content

GitLab

Last edited by Raoul Snyman
Page history

Renderer_2.0

From version 2.6 we've rewritten our display system to make use of Reveal.js and QtWebEngine. This also means that everything has been rewritten from scratch. Here's how to use Renderer 2.0.

Introduction

Versions of OpenLP prior to 2.6 had a very inflexible renderer and display system. We decided to rewrite the display system when we also needed to migrate to QtWebEngine, and decided to base it on a JavaScript presentation system called Reveal.js. Using Reveal.js gave us the ability to be more flexible and make future features easier to implement.

Some of the "instant" benefits we get are the following:

  • A few transition types
  • Stretched image backgrounds
  • Video backgrounds (supported video types)
  • Multiple backgrounds per item (currently not used)

Potential Gotchas

Asynchronous

As opposed to QtWebKit's synchronous calls, QtWebEngine is asynchronous, which means that any JavaScript function calls are returned immediately. For the most part this isn't a problem, there's no real reason to wait for the JavaScript to finish executing before continuing, and the user won't experience any problems (in fact, it'll mean that OpenLP will be slightly more responsive). Just don't be surprised when the slide doesn't change immediately.

Basic Do's and Don't's

Don't

  • Use the underlying QWebEngineView directly

Do

  • Use an instance of DisplayWindow
  • Use the Python methods of the DisplayWindow instance

DisplayWindow Reference

The following public methods should be used to set or interact with content in the display window.

  • DisplayWindow.set_verses(self, verses)
    Set verses in the display
  • DisplayWindow.set_images(self, images)
    Set images in the display
  • DisplayWindow.set_video(self, video)
    Set video in the display
  • DisplayWindow.play_video(self)
    Play the currently loaded video
  • DisplayWindow.pause_video(self)
    Pause the currently playing video
  • DisplayWindow.stop_video(self)
    Stop the currently playing video
  • DisplayWindow.set_video_playback_rate(self, rate)
    Set the playback rate of the current video. The rate can be any valid float, with 0.0 being stopped, 1.0 being normal speed, over 1.0 is faster, under 1.0 is slower, and negative is backwards. rate A float indicating the playback rate.
  • DisplayWindow.set_video_volume(self, level)
    Set the volume of the current video. The volume should be an int from 0 to 100, where 0 is no sound and 100 is maximum volume. Any values outside this range will raise a ValueError. level A number between 0 and 100
  • DisplayWindow.toggle_video_mute(self)
    Toggle the mute of the current video
  • DisplayWindow.save_screenshot(self, fname=None)
    Save a screenshot, either returning it or saving it to file
  • DisplayWindow.set_theme(self, theme)
    Set the theme of the display