openlp-core team mailing list archive
-
openlp-core team
-
Mailing list archive
-
Message #26322
[Merge] lp:~oliwee/openlp/transparentBackground into lp:openlp
Oliver Wieland has proposed merging lp:~oliwee/openlp/transparentBackground into lp:openlp.
Requested reviews:
OpenLP Core (openlp-core)
For more details, see:
https://code.launchpad.net/~oliwee/openlp/transparentBackground/+merge/250562
Added transparency behind main text to theme
new theme option 'Transparency' for setting the transparency of the background of the main text
new theme option 'Smooth transition' to choose if there should be a smoother transition to the transparent area
--
Your team OpenLP Core is requested to review the proposed merge of lp:~oliwee/openlp/transparentBackground into lp:openlp.
=== modified file 'openlp/core/lib/htmlbuilder.py'
--- openlp/core/lib/htmlbuilder.py 2015-01-18 13:39:21 +0000
+++ openlp/core/lib/htmlbuilder.py 2015-02-22 20:45:40 +0000
@@ -585,7 +585,7 @@
build_background_css(item, width),
css_additions,
build_footer_css(item, height),
- build_lyrics_css(item),
+ build_lyrics_css(item, width),
'true' if theme_data and theme_data.display_slide_transition and is_live else 'false',
js_additions,
bgimage_src,
@@ -641,7 +641,7 @@
return background
-def build_lyrics_css(item):
+def build_lyrics_css(item, display_width):
"""
Build the lyrics display css
@@ -669,8 +669,16 @@
lyrics = ''
lyricsmain = ''
if theme_data and item.main:
- lyricstable = 'left: %spx; top: %spx;' % (item.main.x(), item.main.y())
- lyrics = build_lyrics_format_css(theme_data, item.main.width(), item.main.height())
+ lyricstable = 'left: 0px; padding-left: %spx; top: %spx; width: 100%%; ' % (item.main.x(), item.main.y())
+ transparency = 1 - (float(theme_data.display_background_transparency) / 100)
+ if theme_data.display_smooth_transparency:
+ lyricstable += 'background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%%, rgba(0,0,0,%s) 2%%, rgba(0,0,0,%s) 98%%,rgba(0,0,0,0) 100%%);'\
+ % (transparency, transparency)
+ else:
+ lyricstable += 'background: rgba(0,0,0,%s);' % (transparency)
+
+
+ lyrics = build_lyrics_format_css(theme_data, item.main.width(), item.main.height(), display_width)
lyricsmain += build_lyrics_outline_css(theme_data)
if theme_data.font_main_shadow:
lyricsmain += ' text-shadow: %s %spx %spx;' % \
@@ -693,7 +701,7 @@
return ''
-def build_lyrics_format_css(theme_data, width, height):
+def build_lyrics_format_css(theme_data, width, height, display_width):
"""
Build the css which controls the theme format. Also used by renderer for splitting verses
@@ -715,13 +723,16 @@
padding_bottom = '0.5em'
else:
padding_bottom = '0'
+
+ padding_right = display_width - width;
+
lyrics = '%s word-wrap: break-word; ' \
'text-align: %s; vertical-align: %s; font-family: %s; ' \
'font-size: %spt; color: %s; line-height: %d%%; margin: 0;' \
- 'padding: 0; padding-bottom: %s; padding-left: %spx; width: %spx; height: %spx; ' % \
+ 'padding: 0; padding-bottom: %s; padding-left: %spx; padding-right: %spx; width: %spx; height: %spx; ' % \
(justify, align, valign, theme_data.font_main_name, theme_data.font_main_size,
theme_data.font_main_color, 100 + int(theme_data.font_main_line_adjustment), padding_bottom,
- left_margin, width, height)
+ left_margin, padding_right, width, height)
if theme_data.font_main_italics:
lyrics += 'font-style:italic; '
if theme_data.font_main_bold:
=== modified file 'openlp/core/lib/json/theme.json'
--- openlp/core/lib/json/theme.json 2013-10-18 18:10:47 +0000
+++ openlp/core/lib/json/theme.json 2015-02-22 20:45:40 +0000
@@ -11,7 +11,9 @@
"display" :{
"horizontal_align": 0,
"slide_transition": false,
- "vertical_align": 0
+ "vertical_align": 0,
+ "background_transparency": 100,
+ "smooth_transparency": 0
},
"font": {
"footer": {
=== modified file 'openlp/core/lib/renderer.py'
--- openlp/core/lib/renderer.py 2015-01-18 13:39:21 +0000
+++ openlp/core/lib/renderer.py 2015-02-22 20:45:40 +0000
@@ -381,7 +381,7 @@
</script><style>*{margin: 0; padding: 0; border: 0;}
#main {position: absolute; top: 0px; %s %s}</style></head><body>
<div id="main"></div></body></html>""" % \
- (build_lyrics_format_css(theme_data, self.page_width, self.page_height),
+ (build_lyrics_format_css(theme_data, self.page_width, self.page_height, self.display.width()),
build_lyrics_outline_css(theme_data))
self.web.setHtml(html)
self.empty_height = self.web_frame.contentsSize().height()
=== modified file 'openlp/core/lib/theme.py'
--- openlp/core/lib/theme.py 2015-01-18 13:39:21 +0000
+++ openlp/core/lib/theme.py 2015-02-22 20:45:40 +0000
@@ -318,7 +318,7 @@
element.appendChild(value)
background.appendChild(element)
- def add_display(self, horizontal, vertical, transition):
+ def add_display(self, horizontal, vertical, transition, background_transparency, smooth_transparency):
"""
Add a Display options.
@@ -343,6 +343,16 @@
value = self.theme_xml.createTextNode(str(transition))
element.appendChild(value)
background.appendChild(element)
+ # Background Transparency
+ element = self.theme_xml.createElement('backgroundTransparency')
+ value = self.theme_xml.createTextNode(str(background_transparency))
+ element.appendChild(value)
+ background.appendChild(element)
+ # Smooth Transparency
+ element = self.theme_xml.createElement('smoothTransparency')
+ value = self.theme_xml.createTextNode(str(smooth_transparency))
+ element.appendChild(value)
+ background.appendChild(element)
def child_element(self, element, tag, value):
"""
@@ -555,5 +565,7 @@
self.add_display(
self.display_horizontal_align,
self.display_vertical_align,
- self.display_slide_transition
+ self.display_slide_transition,
+ self.display_background_transparency,
+ self.display_smooth_transparency
)
=== modified file 'openlp/core/ui/themeform.py'
--- openlp/core/ui/themeform.py 2015-01-18 13:39:21 +0000
+++ openlp/core/ui/themeform.py 2015-02-22 20:45:40 +0000
@@ -134,6 +134,8 @@
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('background_transparency', self.background_transparency_spin_box)
+ self.background_page.registerField('smooth_transparency', self.smooth_transparency_check_box)
self.background_page.registerField('name', self.theme_name_edit)
def calculate_lines(self):
@@ -366,6 +368,8 @@
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('background_transparency', self.theme.display_background_transparency)
+ self.setField('smooth_transparency', self.theme.display_smooth_transparency)
def set_preview_page_values(self):
"""
@@ -496,6 +500,8 @@
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_background_transparency = self.field('background_transparency')
+ self.theme.display_smooth_transparency = self.field('smooth_transparency')
def accept(self):
"""
=== modified file 'openlp/core/ui/themewizard.py'
--- openlp/core/ui/themewizard.py 2015-01-18 13:39:21 +0000
+++ openlp/core/ui/themewizard.py 2015-02-22 20:45:40 +0000
@@ -261,6 +261,23 @@
self.transitions_check_box.setObjectName('transitions_check_box')
self.alignment_layout.addRow(self.transitions_label, self.transitions_check_box)
self.alignment_layout.setItem(3, QtGui.QFormLayout.LabelRole, self.spacer)
+ self.transparency_layout = QtGui.QHBoxLayout()
+ self.transparency_layout.setObjectName('transparency_layout')
+ self.background_transparency_label = QtGui.QLabel(self.alignment_page)
+ self.background_transparency_label.setObjectName('background_transparency_label')
+ self.background_transparency_spin_box = QtGui.QSpinBox(self.alignment_page)
+ self.background_transparency_spin_box.setMaximum(100)
+ self.background_transparency_spin_box.setObjectName('background_transparency_spin_box')
+ self.transparency_layout.addWidget(self.background_transparency_spin_box)
+ self.transparency_layout.addSpacing(20)
+ self.smooth_transparency_label = QtGui.QLabel(self.alignment_page)
+ self.smooth_transparency_label.setObjectName('smooth_transparency_label')
+ self.transparency_layout.addWidget(self.smooth_transparency_label)
+ self.transparency_layout.addSpacing(20)
+ self.smooth_transparency_check_box = QtGui.QCheckBox(self.alignment_page)
+ self.smooth_transparency_check_box.setObjectName('smooth_transparency_check_box')
+ self.transparency_layout.addWidget(self.smooth_transparency_check_box)
+ self.alignment_layout.addRow(self.smooth_transparency_label, self.transparency_layout)
theme_wizard.addPage(self.alignment_page)
# Area Position Page
self.area_position_page = QtGui.QWizardPage()
@@ -458,6 +475,9 @@
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.background_transparency_label.setText(translate('OpenLP.ThemeWizard', 'Transparency:'))
+ self.background_transparency_spin_box.setSuffix(translate('OpenLP.ThemeWizard', '%'))
+ self.smooth_transparency_label.setText(translate('OpenLP.ThemeWizard', 'Smooth Transition:'))
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.'))
=== modified file 'tests/functional/openlp_core_lib/test_htmlbuilder.py'
--- tests/functional/openlp_core_lib/test_htmlbuilder.py 2014-07-24 21:57:16 +0000
+++ tests/functional/openlp_core_lib/test_htmlbuilder.py 2015-02-22 20:45:40 +0000
@@ -169,7 +169,24 @@
z-index: 5;
position: absolute;
display: table;
- left: 10px; top: 20px;
+ left: 0px; padding-left: 10px; top: 20px; width: 100%; background: rgba(0,0,0,0.5);
+}
+.lyricscell {
+ display: table-cell;
+ word-wrap: break-word;
+ -webkit-transition: opacity 0.4s ease;
+ lyrics_format_css
+}
+.lyricsmain {
+ text-shadow: #000000 5px 5px;
+}
+"""
+LYRICS_CSS_SMOOTH = """
+.lyricstable {
+ z-index: 5;
+ position: absolute;
+ display: table;
+ left: 0px; padding-left: 10px; top: 20px; width: 100%; background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 2%, rgba(0,0,0,0.5) 98%,rgba(0,0,0,0) 100%);
}
.lyricscell {
display: table-cell;
@@ -184,7 +201,7 @@
LYRICS_OUTLINE_CSS = ' -webkit-text-stroke: 0.125em #000000; -webkit-text-fill-color: #FFFFFF; '
LYRICS_FORMAT_CSS = ' word-wrap: break-word; text-align: justify; vertical-align: bottom; ' + \
'font-family: Arial; font-size: 40pt; color: #FFFFFF; line-height: 108%; margin: 0;padding: 0; ' + \
- 'padding-bottom: 0.5em; padding-left: 2px; width: 1580px; height: 810px; font-style:italic; font-weight:bold; '
+ 'padding-bottom: 0.5em; padding-left: 2px; padding-right: 340px; width: 1580px; height: 810px; font-style:italic; font-weight:bold; '
FOOTER_CSS_BASE = """
left: 10px;
bottom: 0px;
@@ -275,13 +292,40 @@
item.theme_data.font_main_shadow = True
item.theme_data.font_main_shadow_color = '#000000'
item.theme_data.font_main_shadow_size = 5
-
+ item.theme_data.display_background_transparency = 50
+ item.theme_data.display_smooth_transparency = 0
+ display_width = 1024
+
# WHEN: Create the css.
- css = build_lyrics_css(item)
+ css = build_lyrics_css(item, display_width)
# THEN: The css should be equal.
self.assertEqual(LYRICS_CSS, css, 'The lyrics css should be equal.')
+ def build_lyrics_css_smooth_transparency_test(self):
+ """
+ Test the build_lyrics_css() function with smooth transparency enabled
+ """
+ # GIVEN: Mocked method and arguments.
+ with patch('openlp.core.lib.htmlbuilder.build_lyrics_format_css') as mocked_build_lyrics_format_css, \
+ patch('openlp.core.lib.htmlbuilder.build_lyrics_outline_css') as mocked_build_lyrics_outline_css:
+ mocked_build_lyrics_format_css.return_value = 'lyrics_format_css'
+ mocked_build_lyrics_outline_css.return_value = ''
+ item = MagicMock()
+ item.main = QtCore.QRect(10, 20, 10, 20)
+ item.theme_data.font_main_shadow = True
+ item.theme_data.font_main_shadow_color = '#000000'
+ item.theme_data.font_main_shadow_size = 5
+ item.theme_data.display_background_transparency = 50
+ item.theme_data.display_smooth_transparency = 1
+ display_width = 1024
+
+ # WHEN: Create the css.
+ css = build_lyrics_css(item, display_width)
+
+ # THEN: The css should be equal.
+ self.assertEqual(LYRICS_CSS_SMOOTH, css, 'The lyrics css should be equal.')
+
def build_lyrics_outline_css_test(self):
"""
Test the build_lyrics_outline_css() function
@@ -315,9 +359,11 @@
theme_data.font_main_line_adjustment = 8
width = 1580
height = 810
+ display_width = 1920
+
# WHEN: Get the css.
- css = build_lyrics_format_css(theme_data, width, height)
+ css = build_lyrics_format_css(theme_data, width, height, display_width)
# THEN: They should be equal.
self.assertEqual(LYRICS_FORMAT_CSS, css, 'The lyrics format css should be equal.')
=== modified file 'tests/functional/openlp_core_lib/test_theme.py'
--- tests/functional/openlp_core_lib/test_theme.py 2015-01-18 13:39:21 +0000
+++ tests/functional/openlp_core_lib/test_theme.py 2015-02-22 20:45:40 +0000
@@ -61,4 +61,4 @@
self.assertTrue(default_theme.font_footer_name == "Arial",
'The theme should have a font_footer_name of Arial')
self.assertTrue(default_theme.font_main_bold is False, 'The theme should have a font_main_bold of false')
- self.assertTrue(len(default_theme.__dict__) == 47, 'The theme should have 47 variables')
+ self.assertTrue(len(default_theme.__dict__) == 49, 'The theme should have 49 variables')
Follow ups
