raoul/openlp
1
0
Fork 0
forked from openlp/openlp
Code Issues Pull Requests Projects Releases Wiki Activity

Revert htmlbuilder for now

Browse Source
This commit is contained in:
Ken Roberts 2016-06-04 01:03:25 -07:00
parent ed7ea01f43
commit a4483af5b4
1 changed files with 76 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

152
openlp/core/lib/htmlbuilder.py
View File

@ -396,74 +396,74 @@ from openlp.core.lib.theme import BackgroundType, BackgroundGradientType, Vertic
log = logging.getLogger(__name__) log = logging.getLogger(__name__)
# TODO: Tested at home # TODO: Verify where this is used before converting to python3
HTMLSRC = """ HTMLSRC = """
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>OpenLP Display</title> <title>OpenLP Display</title>
<style> <style>
*{{ *{
margin: 0; margin: 0;
padding: 0; padding: 0;
border: 0; border: 0;
overflow: hidden; overflow: hidden;
-webkit-user-select: none; -webkit-user-select: none;
}} }
body {{ body {
{background_css}; %s;
}} }
.size {{ .size {
position: absolute; position: absolute;
left: 0px; left: 0px;
top: 0px; top: 0px;
width: 100%; width: 100%%;
height: 100%; height: 100%%;
}} }
#black {{ #black {
z-index: 8; z-index: 8;
background-color: black; background-color: black;
display: none; display: none;
}} }
#bgimage {{ #bgimage {
z-index: 1; z-index: 1;
}} }
#image {{ #image {
z-index: 2; z-index: 2;
}} }
{additions} %s
#footer {{ #footer {
position: absolute; position: absolute;
z-index: 6; z-index: 6;
{footer_css} %s
}} }
/* lyric css */ /* lyric css */
{lyrics_css} %s
sup {{ sup {
font-size: 0.6em; font-size: 0.6em;
vertical-align: top; vertical-align: top;
position: relative; position: relative;
top: -0.3em; top: -0.3em;
}} }
</style> </style>
<script> <script>
var timer = null; var timer = null;
var transition = {transitions}; var transition = %s;
{js_additions} %s
function show_image(src){{ function show_image(src){
var img = document.getElementById('image'); var img = document.getElementById('image');
img.src = src; img.src = src;
if(src == '') if(src == '')
img.style.display = 'none'; img.style.display = 'none';
else else
img.style.display = 'block'; img.style.display = 'block';
}} }
function show_blank(state){{ function show_blank(state){
var black = 'none'; var black = 'none';
var lyrics = ''; var lyrics = '';
switch(state){{ switch(state){
case 'theme': case 'theme':
lyrics = 'hidden'; lyrics = 'hidden';
break; break;
@ -472,18 +472,18 @@ sup {{
break; break;
case 'desktop': case 'desktop':
break; break;
}} }
document.getElementById('black').style.display = black; document.getElementById('black').style.display = black;
document.getElementById('lyricsmain').style.visibility = lyrics; document.getElementById('lyricsmain').style.visibility = lyrics;
document.getElementById('image').style.visibility = lyrics; document.getElementById('image').style.visibility = lyrics;
document.getElementById('footer').style.visibility = lyrics; document.getElementById('footer').style.visibility = lyrics;
}} }
function show_footer(footertext){{ function show_footer(footertext){
document.getElementById('footer').innerHTML = footertext; document.getElementById('footer').innerHTML = footertext;
}} }
function show_text(new_text){{ function show_text(new_text){
var match = /-webkit-text-fill-color:[^;\"]+/gi; var match = /-webkit-text-fill-color:[^;\"]+/gi;
if(timer != null) if(timer != null)
clearTimeout(timer); clearTimeout(timer);
@ -493,35 +493,35 @@ sup {{
but only in this scenario. but only in this scenario.
*/ */
var txt = document.getElementById('lyricsmain'); var txt = document.getElementById('lyricsmain');
if(window.getComputedStyle(txt).textAlign == 'justify'){{ if(window.getComputedStyle(txt).textAlign == 'justify'){
if(window.getComputedStyle(txt).webkitTextStrokeWidth != '0px'){{ if(window.getComputedStyle(txt).webkitTextStrokeWidth != '0px'){
new_text = new_text.replace(/(\s|&nbsp;)+(?![^<]*>)/g, new_text = new_text.replace(/(\s|&nbsp;)+(?![^<]*>)/g,
function(match) {{ function(match) {
return '</span>' + match + '<span>'; return '</span>' + match + '<span>';
}}); });
new_text = '<span>' + new_text + '</span>'; new_text = '<span>' + new_text + '</span>';
}} }
}} }
text_fade('lyricsmain', new_text); text_fade('lyricsmain', new_text);
}} }
function text_fade(id, new_text){{ function text_fade(id, new_text){
/* /*
Show the text. Show the text.
*/ */
var text = document.getElementById(id); var text = document.getElementById(id);
if(text == null) return; if(text == null) return;
if(!transition){{ if(!transition){
text.innerHTML = new_text; text.innerHTML = new_text;
return; return;
}} }
// Fade text out. 0.1 to minimize the time "nothing" is shown on the screen. // Fade text out. 0.1 to minimize the time "nothing" is shown on the screen.
text.style.opacity = '0.1'; text.style.opacity = '0.1';
// Fade new text in after the old text has finished fading out. // Fade new text in after the old text has finished fading out.
timer = window.setTimeout(function(){{_show_text(text, new_text)}}, 400); timer = window.setTimeout(function(){_show_text(text, new_text)}, 400);
}} }
function _show_text(text, new_text) {{ function _show_text(text, new_text) {
/* /*
Helper function to show the new_text delayed. Helper function to show the new_text delayed.
*/ */
@ -529,18 +529,18 @@ sup {{
text.style.opacity = '1'; text.style.opacity = '1';
// Wait until the text is completely visible. We want to save the timer id, to be able to call // Wait until the text is completely visible. We want to save the timer id, to be able to call
// clearTimeout(timer) when the text has changed before finishing fading. // clearTimeout(timer) when the text has changed before finishing fading.
timer = window.setTimeout(function(){{timer = null;}}, 400); timer = window.setTimeout(function(){timer = null;}, 400);
}} }
function show_text_completed(){{ function show_text_completed(){
return (timer == null); return (timer == null);
}} }
</script> </script>
</head> </head>
<body> <body>
<img id="bgimage" class="size" {bgimage} /> <img id="bgimage" class="size" %s />
<img id="image" class="size" {image} /> <img id="image" class="size" %s />
{html_additions} %s
<div class="lyricstable"><div id="lyricsmain" style="opacity:1" class="lyricscell lyricsmain"></div></div> <div class="lyricstable"><div id="lyricsmain" style="opacity:1" class="lyricscell lyricsmain"></div></div>
<div id="footer" class="footer"></div> <div id="footer" class="footer"></div>
<div id="black" class="size"></div> <div id="black" class="size"></div>
@ -582,17 +582,17 @@ def build_html(item, screen, is_live, background, image=None, plugins=None):
css_additions += plugin.get_display_css() css_additions += plugin.get_display_css()
js_additions += plugin.get_display_javascript() js_additions += plugin.get_display_javascript()
html_additions += plugin.get_display_html() html_additions += plugin.get_display_html()
html = HTMLSRC.format(background_css=build_background_css(item, width), html = HTMLSRC % (
additions=css_additions, build_background_css(item, width),
footer_css=build_footer_css(item, height), css_additions,
lyrics_css=build_lyrics_css(item), build_footer_css(item, height),
transitions='true' if (theme_data and build_lyrics_css(item),
theme_data.display_slide_transition and 'true' if theme_data and theme_data.display_slide_transition and is_live else 'false',
is_live) else 'false', js_additions,
js_additions=js_additions, bgimage_src,
bgimage=bgimage_src, image_src,
image=image_src, html_additions
html_additions=html_additions) )
return html return html
@ -650,23 +650,23 @@ def build_lyrics_css(item):
:param item: Service Item containing theme and location information :param item: Service Item containing theme and location information
""" """
# TODO: Tested at home # TODO: Verify this before converting to python3
style = """ style = """
.lyricstable {{ .lyricstable {
z-index: 5; z-index: 5;
position: absolute; position: absolute;
display: table; display: table;
{stable} %s
}} }
.lyricscell {{ .lyricscell {
display: table-cell; display: table-cell;
word-wrap: break-word; word-wrap: break-word;
-webkit-transition: opacity 0.4s ease; -webkit-transition: opacity 0.4s ease;
{lyrics} %s
}} }
.lyricsmain {{ .lyricsmain {
{main} %s
}} }
""" """
theme_data = item.theme_data theme_data = item.theme_data
lyricstable = '' lyricstable = ''
@ -680,7 +680,7 @@ def build_lyrics_css(item):
lyricsmain += ' text-shadow: {theme} {shadow}px ' \ lyricsmain += ' text-shadow: {theme} {shadow}px ' \
'{shadow}px;'.format(theme=theme_data.font_main_shadow_color, '{shadow}px;'.format(theme=theme_data.font_main_shadow_color,
shadow=theme_data.font_main_shadow_size) shadow=theme_data.font_main_shadow_size)
lyrics_css = style.format(stable=lyricstable, lyrics=lyrics, main=lyricsmain) lyrics_css = style % (lyricstable, lyrics, lyricsmain)
return lyrics_css return lyrics_css