Added new values to theme.json and added logic for ui

Also fixed normal speed not working and changed "Default" to "Normal" in the enums as it makes more sense.

openlp/core/display/html/display.js

@@ -43,6 +43,26 @@ var VerticalAlign = {
   Bottom: 2
 };
 
+/**
+ * Transition type enumeration
+ */
+var TransitionType = {
+  Fade: 0,
+  Slide: 1,
+  Convex: 2,
+  Concave: 3,
+  Zoom: 4
+};
+
+/**
+ * Transition speed enumeration
+ */
+var TransitionSpeed = {
+  Normal: 0,
+  Fast: 1,
+  Slow: 2
+};
+
 /**
  * Audio state enumeration
  */
@@ -329,6 +349,7 @@ var Display = {
   _alertState: AlertState.NotDisplaying,
   _transitionState: TransitionState.NoTransition,
   _animationState: AnimationState.NoAnimation,
+  _doTransitions: false,
   _revealConfig: {
     margin: 0.0,
     minScale: 1.0,
@@ -348,7 +369,8 @@ var Display = {
   /**
    * Start up reveal and do any other initialisation
    */
-  init: function () {
+  init: function (doTransitions=false) {
+    Display._doTransitions = doTransitions;
     Reveal.initialize(Display._revealConfig);
   },
   /**
@@ -360,9 +382,10 @@ var Display = {
   /**
    * Set the transition type
    * @param {string} transitionType - Can be one of "none", "fade", "slide", "convex", "concave", "zoom"
+   * @param {string} transitionSpeed - Can be one of "default", "fast", "slow"
    */
-  setTransition: function (transitionType) {
+  setTransition: function (transitionType, transitionSpeed) {
-    Reveal.configure({"transition": transitionType});
+    Reveal.configure({"transition": transitionType, "transitionSpeed": transitionSpeed});
   },
   /**
    * Clear the current list of slides
@@ -869,6 +892,44 @@ var Display = {
   },
   setTheme: function (theme) {
     Display._theme = theme;
+    // Set slide transitions
+    var new_transition_type = "none",
+        new_transition_speed = "default";
+    if (!!theme.display_slide_transition && Display._doTransitions) {
+      switch (theme.display_slide_transition_type) {
+        case TransitionType.Fade:
+          new_transition_type = "fade";
+          break;
+        case TransitionType.Slide:
+          new_transition_type = "slide";
+          break;
+        case TransitionType.Convex:
+          new_transition_type = "convex";
+          break;
+        case TransitionType.Concave:
+          new_transition_type = "concave";
+          break;
+        case TransitionType.Zoom:
+          new_transition_type = "zoom";
+          break;
+        default:
+          new_transition_type = "fade";
+      }
+      switch (theme.display_slide_transition_speed) {
+        case TransitionSpeed.Normal:
+          new_transition_speed = "default";
+          break;
+        case TransitionSpeed.Fast:
+          new_transition_speed = "fast";
+          break;
+        case TransitionSpeed.Slow:
+          new_transition_speed = "slow";
+          break;
+        default:
+          new_transition_speed = "default";
+      }
+    }
+    Display.setTransition(new_transition_type, new_transition_speed);
     // Set the background
     var globalBackground = $("#global-background")[0];
     var backgroundStyle = {};

openlp/core/display/window.py

@@ -198,7 +198,8 @@ class DisplayWindow(QtWidgets.QWidget):
         """
         Add stuff after page initialisation
         """
-        self.run_javascript('Display.init();')
+        js_is_display = str(self.is_display).lower()
+        self.run_javascript('Display.init({do_transitions});'.format(do_transitions=js_is_display))
         self._is_initialised = True
         if self._can_show_startup_screen:
             self.set_startup_screen()

openlp/core/lib/json/theme.json

@@ -11,6 +11,8 @@
     "display" :{
         "horizontal_align": 0,
         "slide_transition": false,
+        "slide_transition_type": 0,
+        "slide_transition_speed": 0,
         "vertical_align": 0
     },
     "font": {

openlp/core/lib/theme.py

@@ -127,6 +127,82 @@ class BackgroundGradientType(object):
             return BackgroundGradientType.LeftBottom
 
 
+class TransitionType(object):
+    """
+    Type enumeration for transition types.
+    """
+    Fade = 0
+    Slide = 1
+    Convex = 2
+    Concave = 3
+    Zoom = 4
+
+    @staticmethod
+    def to_string(transition_type):
+        """
+        Return a string representation of a transition type.
+        """
+        if transition_type == TransitionType.Fade:
+            return 'fade'
+        elif transition_type == TransitionType.Slide:
+            return 'slide'
+        elif transition_type == TransitionType.Convex:
+            return 'convex'
+        elif transition_type == TransitionType.Concave:
+            return 'concave'
+        elif transition_type == TransitionType.Zoom:
+            return 'zoom'
+
+    @staticmethod
+    def from_string(type_string):
+        """
+        Return a transition type for the given string.
+        """
+        if type_string == 'fade':
+            return TransitionType.Fade
+        elif type_string == 'slide':
+            return TransitionType.Slide
+        elif type_string == 'convex':
+            return TransitionType.Convex
+        elif type_string == 'concave':
+            return TransitionType.Concave
+        elif type_string == 'zoom':
+            return TransitionType.Zoom
+
+
+class TransitionSpeed(object):
+    """
+    Type enumeration for transition types.
+    """
+    Normal = 0
+    Fast = 1
+    Slow = 2
+
+    @staticmethod
+    def to_string(transition_speed):
+        """
+        Return a string representation of a transition type.
+        """
+        if transition_speed == TransitionSpeed.Normal:
+            return 'normal'
+        elif transition_speed == TransitionSpeed.Fast:
+            return 'fast'
+        elif transition_speed == TransitionSpeed.Slow:
+            return 'slow'
+
+    @staticmethod
+    def from_string(type_string):
+        """
+        Return a transition type for the given string.
+        """
+        if type_string == 'normal':
+            return TransitionSpeed.Normal
+        if type_string == 'fast':
+            return TransitionSpeed.Fast
+        elif type_string == 'slow':
+            return TransitionSpeed.Slow
+
+
 class HorizontalType(object):
     """
     Type enumeration for horizontal alignment.
@@ -153,7 +229,7 @@ class VerticalType(object):
 BOOLEAN_LIST = ['bold', 'italics', 'override', 'outline', 'shadow', 'slide_transition']
 
 INTEGER_LIST = ['size', 'line_adjustment', 'x', 'height', 'y', 'width', 'shadow_size', 'outline_size',
-                'horizontal_align', 'vertical_align', 'wrap_style']
+                'horizontal_align', 'vertical_align', 'wrap_style', 'slide_transition_type', 'slide_transition_speed']
 
 
 class Theme(object):

openlp/core/ui/themeform.py

@@ -98,6 +98,7 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         self.main_font_combo_box.activated.connect(self.calculate_lines)
         self.footer_font_combo_box.activated.connect(self.update_theme)
         self.footer_size_spin_box.valueChanged.connect(self.update_theme)
+        self.transitions_check_box.stateChanged.connect(self.on_transitions_check_box_state_changed)
 
     def set_defaults(self):
         """
@@ -145,6 +146,8 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         self.background_page.registerField('horizontal', self.horizontal_combo_box)
         self.background_page.registerField('vertical', self.vertical_combo_box)
         self.background_page.registerField('slide_transition', self.transitions_check_box)
+        self.background_page.registerField('slide_transition_type', self.transition_combo_box)
+        self.background_page.registerField('slide_transition_speed', self.transition_speed_combo_box)
         self.background_page.registerField('name', self.theme_name_edit)
 
     def calculate_lines(self):
@@ -251,10 +254,7 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         Change state as Shadow check box changed
         """
         if self.update_theme_allowed:
-            if state == QtCore.Qt.Checked:
+            self.theme.font_main_shadow = state == QtCore.Qt.Checked
-                self.theme.font_main_shadow = True
-            else:
-                self.theme.font_main_shadow = False
             self.shadow_color_button.setEnabled(self.theme.font_main_shadow)
             self.shadow_size_spin_box.setEnabled(self.theme.font_main_shadow)
             self.calculate_lines()
@@ -275,6 +275,16 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         if self.update_theme_allowed:
             self.theme.font_footer_override = (value != QtCore.Qt.Checked)
 
+    def on_transitions_check_box_state_changed(self, state):
+        """
+        Change state as Transitions check box is changed
+        """
+        if self.update_theme_allowed:
+            self.theme.display_slide_transition = state == QtCore.Qt.Checked
+            self.transition_combo_box.setEnabled(self.theme.display_slide_transition)
+            self.transition_speed_combo_box.setEnabled(self.theme.display_slide_transition)
+            self.calculate_lines()
+
     def exec(self, edit=False):
         """
         Run the wizard.
@@ -395,6 +405,8 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         self.setField('horizontal', self.theme.display_horizontal_align)
         self.setField('vertical', self.theme.display_vertical_align)
         self.setField('slide_transition', self.theme.display_slide_transition)
+        self.setField('slide_transition_type', self.theme.display_slide_transition_type)
+        self.setField('slide_transition_speed', self.theme.display_slide_transition_speed)
 
     def set_preview_page_values(self):
         """
@@ -538,6 +550,8 @@ class ThemeForm(QtWidgets.QWizard, Ui_ThemeWizard, RegistryProperties):
         self.theme.display_horizontal_align = self.horizontal_combo_box.currentIndex()
         self.theme.display_vertical_align = self.vertical_combo_box.currentIndex()
         self.theme.display_slide_transition = self.field('slide_transition')
+        self.theme.display_slide_transition_type = self.field('slide_transition_type')
+        self.theme.display_slide_transition_speed = self.field('slide_transition_speed')
 
     def accept(self):
         """

openlp/core/ui/themewizard.py

@@ -25,7 +25,13 @@ from PyQt5 import QtCore, QtGui, QtWidgets
 
 from openlp.core.common import is_macosx
 from openlp.core.common.i18n import UiStrings, translate
-from openlp.core.lib.theme import BackgroundGradientType, BackgroundType, HorizontalType
+from openlp.core.lib.theme import (
+    BackgroundGradientType,
+    BackgroundType,
+    HorizontalType,
+    TransitionType,
+    TransitionSpeed
+)
 from openlp.core.lib.ui import add_welcome_page, create_valign_selection_widgets
 from openlp.core.ui.icons import UiIcons
 from openlp.core.widgets.buttons import ColorButton
@@ -271,12 +277,22 @@ class Ui_ThemeWizard(object):
         self.vertical_label.setObjectName('vertical_label')
         self.vertical_combo_box.setObjectName('vertical_combo_box')
         self.alignment_layout.addRow(self.vertical_label, self.vertical_combo_box)
-        self.transitions_label = QtWidgets.QLabel(self.alignment_page)
-        self.transitions_label.setObjectName('transitions_label')
         self.transitions_check_box = QtWidgets.QCheckBox(self.alignment_page)
         self.transitions_check_box.setObjectName('transitions_check_box')
-        self.alignment_layout.addRow(self.transitions_label, self.transitions_check_box)
+        self.transition_layout = QtWidgets.QHBoxLayout()
-        self.alignment_layout.setItem(3, QtWidgets.QFormLayout.LabelRole, self.spacer)
+        self.transition_layout.setObjectName("transition_layout")
+        self.transition_combo_box = QtWidgets.QComboBox(self.alignment_page)
+        self.transition_combo_box.setObjectName("transition_combo_box")
+        self.transition_combo_box.addItems(['', '', '', '', ''])
+        self.transition_layout.addWidget(self.transition_combo_box)
+        self.transition_speed_label = QtWidgets.QLabel(self.alignment_page)
+        self.transition_speed_label.setObjectName("transition_speed_label")
+        self.transition_layout.addWidget(self.transition_speed_label)
+        self.transition_speed_combo_box = QtWidgets.QComboBox(self.alignment_page)
+        self.transition_speed_combo_box.setObjectName("transition_speed_combo_box")
+        self.transition_speed_combo_box.addItems(['', '', ''])
+        self.transition_layout.addWidget(self.transition_speed_combo_box)
+        self.alignment_layout.addRow(self.transitions_check_box, self.transition_layout)
         theme_wizard.addPage(self.alignment_page)
         # Area Position Page
         self.area_position_page = QtWidgets.QWizardPage()
@@ -460,7 +476,16 @@ class Ui_ThemeWizard(object):
         self.horizontal_combo_box.setItemText(HorizontalType.Right, translate('OpenLP.ThemeWizard', 'Right'))
         self.horizontal_combo_box.setItemText(HorizontalType.Center, translate('OpenLP.ThemeWizard', 'Center'))
         self.horizontal_combo_box.setItemText(HorizontalType.Justify, translate('OpenLP.ThemeWizard', 'Justify'))
-        self.transitions_label.setText(translate('OpenLP.ThemeWizard', 'Transitions:'))
+        self.transitions_check_box.setText(translate('OpenLP.ThemeWizard', 'Transitions:'))
+        self.transition_combo_box.setItemText(TransitionType.Fade, translate('OpenLP.ThemeWizard', 'Fade'))
+        self.transition_combo_box.setItemText(TransitionType.Slide, translate('OpenLP.ThemeWizard', 'Slide'))
+        self.transition_combo_box.setItemText(TransitionType.Concave, translate('OpenLP.ThemeWizard', 'Concave'))
+        self.transition_combo_box.setItemText(TransitionType.Convex, translate('OpenLP.ThemeWizard', 'Convex'))
+        self.transition_combo_box.setItemText(TransitionType.Zoom, translate('OpenLP.ThemeWizard', 'Zoom'))
+        self.transition_speed_label.setText(translate('OpenLP.ThemeWizard', 'Speed:'))
+        self.transition_speed_combo_box.setItemText(TransitionSpeed.Normal, translate('OpenLP.ThemeWizard', 'Normal'))
+        self.transition_speed_combo_box.setItemText(TransitionSpeed.Fast, translate('OpenLP.ThemeWizard', 'Fast'))
+        self.transition_speed_combo_box.setItemText(TransitionSpeed.Slow, translate('OpenLP.ThemeWizard', 'Slow'))
         self.area_position_page.setTitle(translate('OpenLP.ThemeWizard', 'Output Area Locations'))
         self.area_position_page.setSubTitle(translate('OpenLP.ThemeWizard', 'Allows you to change and move the'
                                                       ' Main and Footer areas.'))

resources/forms/themewizard.ui

@@ -765,13 +765,72 @@ p, li { white-space: pre-wrap; }
       </item>
      </widget>
     </item>
-    <item row="2" column="1">
+    <item row="2" column="0">
      <widget class="QCheckBox" name="transitionsCheckBox">
       <property name="text">
-       <string>Transitions</string>
+       <string>Transitions:</string>
       </property>
      </widget>
     </item>
+    <item row="2" column="1">
+     <layout class="QHBoxLayout" name="transitionLayout">
+      <item>
+       <widget class="QComboBox" name="transitionComboBox">
+        <item>
+         <property name="text">
+          <string>Fade</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Slide</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Convex</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Concave</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Zoom</string>
+         </property>
+        </item>
+       </widget>
+      </item>
+      <item>
+       <widget class="QLabel" name="transitionSpeedLabel">
+        <property name="text">
+         <string>Speed:</string>
+        </property>
+       </widget>
+      </item>
+      <item>
+       <widget class="QComboBox" name="transitionSpeedComboBox">
+        <item>
+         <property name="text">
+          <string>Normal</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Fast</string>
+         </property>
+        </item>
+        <item>
+         <property name="text">
+          <string>Slow</string>
+         </property>
+        </item>
+       </widget>
+      </item>
+     </layout>
+    </item>
    </layout>
   </widget>
   <widget class="QWizardPage" name="areaPositionPage">

tests/functional/openlp_core/lib/test_theme.py

@@ -181,4 +181,4 @@ class TestTheme(TestCase):
         assert 0 == theme.display_vertical_align, 'display_vertical_align should be 0'
         assert theme.font_footer_bold is False, 'font_footer_bold should be False'
         assert 'Arial' == theme.font_main_name, 'font_main_name should be "Arial"'
-        assert 49 == len(theme.__dict__), 'The theme should have 49 attributes'
+        assert 51 == len(theme.__dict__), 'The theme should have 51 attributes'

tests/js/test_display.js

@@ -123,12 +123,6 @@ describe("The Display object", function () {
     expect(Display.setTransition).toBeDefined();
   });
 
-  it("should have a correctly functioning setTransition() method", function () {
-    spyOn(Reveal, "configure");
-    Display.setTransition("fade");
-    expect(Reveal.configure).toHaveBeenCalledWith({"transition": "fade"});
-  });
-
   it("should have a correctly functioning clearSlides() method", function () {
     expect(Display.clearSlides).toBeDefined();
 
@@ -156,6 +150,55 @@ describe("The Display object", function () {
 
 });
 
+describe("Transitions", function () {
+  beforeEach(function() {
+    document.body.innerHTML = "";
+    _createDiv({"class": "slides"});
+    _createDiv({"class": "footer"});
+    _createDiv({"id": "global-background"});
+    Display._slides = {};
+  });
+  afterEach(function() {
+    // Reset theme
+    Display._theme = null;
+  });
+
+  it("should have a correctly functioning setTransition() method", function () {
+    spyOn(Reveal, "configure");
+    Display.setTransition("fade", "slow");
+    expect(Reveal.configure).toHaveBeenCalledWith({"transition": "fade", "transitionSpeed": "slow"});
+  });
+
+  it("should have enabled transitions when _doTransitions is true and setTheme is run", function () {
+    spyOn(Display, "setTransition");
+    Display._doTransitions = true;
+    var theme = {
+      "display_slide_transition": true,
+      "display_slide_transition_type": TransitionType.Slide,
+      "display_slide_transition_speed": TransitionSpeed.Fast
+    }
+
+    Display.setTheme(theme);
+
+    expect(Display.setTransition).toHaveBeenCalledWith("slide", "fast");
+  });
+
+  it("should have not enabled transitions when init() with no transitions and setTheme is run", function () {
+    spyOn(Display, "setTransition");
+    Display._doTransitions = false;
+    var theme = {
+      "display_slide_transition": true,
+      "display_slide_transition_type": TransitionType.Slide,
+      "display_slide_transition_speed": TransitionSpeed.Fast,
+    }
+
+    Display.setTheme(theme);
+
+    expect(Display.setTransition).toHaveBeenCalledWith("none", "default");
+  });
+
+});
+
 describe("Display.alert", function () {
   var alertContainer, alertBackground, alertText, settings, text;