From 9bb6d699c74008bcd434e92fd152f9c6fb5f67f2 Mon Sep 17 00:00:00 2001
From: Oliver Wieland <oli@team-wieland.de>
Date: Thu, 12 Sep 2013 20:38:46 +0200
Subject: [PATCH 1/2] Fixes bug 1223841: Transition does not work if texts are
 the same

Fixes: https://launchpad.net/bugs/1223841
---
 openlp/core/lib/htmlbuilder.py | 61 ++++++++++++++++++----------------
 1 file changed, 33 insertions(+), 28 deletions(-)

diff --git a/openlp/core/lib/htmlbuilder.py b/openlp/core/lib/htmlbuilder.py
index c578ddb46..8cd716844 100644
--- a/openlp/core/lib/htmlbuilder.py
+++ b/openlp/core/lib/htmlbuilder.py
@@ -129,9 +129,8 @@ sup {
     }
 
     function show_text(newtext){
+        var fade_direction = 0;
         var match = /-webkit-text-fill-color:[^;\"]+/gi;
-        if(timer != null)
-            clearTimeout(timer);
         /*
         QtWebkit bug with outlines and justify causing outline alignment
         problems. (Bug 859950) Surround each word with a <span> to workaround,
@@ -150,39 +149,45 @@ sup {
                 newtext = '<span>' + newtext + '</span>';
             }
         }
+        
         text_fade('lyricsmain', newtext);
         text_fade('lyricsoutline', newtext);
         text_fade('lyricsshadow', newtext.replace(match, ''));
         if(text_opacity() == 1) return;
-        timer = setTimeout(function(){
-            show_text(newtext);
+        timer = setInterval(function(){
+            text_fade('lyricsmain', newtext);
+            text_fade('lyricsoutline', newtext);
+            text_fade('lyricsshadow', newtext.replace(match, ''));
+            if(text_opacity() == 1) clearInterval(timer);
         }, 100);
-    }
 
-    function text_fade(id, newtext){
-        /*
-        Using -webkit-transition: opacity 1s linear; would have been preferred
-        but it isn't currently quick enough when animating multiple layers of
-        large areas of large text. Therefore do it manually as best we can.
-        Hopefully in the future we can revisit and do more interesting
-        transitions using -webkit-transition and -webkit-transform.
-        However we need to ensure interrupted transitions (quickly change 2
-        slides) still looks pretty and is zippy.
-        */
-        var text = document.getElementById(id);
-        if(text == null) return;
-        if(!transition){
-            text.innerHTML = newtext;
-            return;
-        }
-        if(newtext == text.innerHTML){
-            text.style.opacity = parseFloat(text.style.opacity) + 0.3;
-            if(text.style.opacity > 0.7)
-                text.style.opacity = 1;
-        } else {
-            text.style.opacity = parseFloat(text.style.opacity) - 0.3;
-            if(text.style.opacity <= 0.1){
+        function text_fade(id, newtext){
+            /*
+            Using -webkit-transition: opacity 1s linear; would have been preferred
+            but it isn't currently quick enough when animating multiple layers of
+            large areas of large text. Therefore do it manually as best we can.
+            Hopefully in the future we can revisit and do more interesting
+            transitions using -webkit-transition and -webkit-transform.
+            However we need to ensure interrupted transitions (quickly change 2
+            slides) still looks pretty and is zippy.
+            */
+            var text = document.getElementById(id);
+            if(text == null) return;
+            if(!transition){
                 text.innerHTML = newtext;
+                return;
+            }
+            if(fade_direction != 1){
+                text.style.opacity = parseFloat(text.style.opacity) - 0.3;
+                if(text.style.opacity <= 0.1){
+                    text.innerHTML = newtext;
+                    fade_direction = 1;
+                }
+            }else{
+                text.style.opacity = parseFloat(text.style.opacity) + 0.3;
+                if(text.style.opacity > 0.7){
+                    text.style.opacity = 1;
+                }
             }
         }
     }

From ddd644d874348ccfd9f6f3963da57ba924fadffe Mon Sep 17 00:00:00 2001
From: Oliver Wieland <oli@team-wieland.de>
Date: Thu, 12 Sep 2013 20:57:15 +0200
Subject: [PATCH 2/2] clear timer on quick slide changes

---
 openlp/core/lib/htmlbuilder.py | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/openlp/core/lib/htmlbuilder.py b/openlp/core/lib/htmlbuilder.py
index 8cd716844..ccc0036ce 100644
--- a/openlp/core/lib/htmlbuilder.py
+++ b/openlp/core/lib/htmlbuilder.py
@@ -131,6 +131,8 @@ sup {
     function show_text(newtext){
         var fade_direction = 0;
         var match = /-webkit-text-fill-color:[^;\"]+/gi;
+        if (timer != null)
+            clearInterval(timer);
         /*
         QtWebkit bug with outlines and justify causing outline alignment
         problems. (Bug 859950) Surround each word with a <span> to workaround,