updated with nicer background

3 files changed, 157 insertions, 71 deletions

diff --git a/examples/animatedbackground/AnimatedPresentation.qml b/examples/animatedbackground/AnimatedPresentation.qml
new file mode 100644
index 0000000..7c02544
--- /dev/null
+++ b/examples/animatedbackground/AnimatedPresentation.qml
@@ -0,0 +1,79 @@
+import QtQuick 2.0
+import Prezo 1.0
+
+Presentation {
+
+    id: deck
+
+    width: 600
+    height: 400
+
+
+    property bool inTransition: false;
+
+    property variant fromSlide;
+    property variant toSlide;
+
+    property int transitionTime: 2000;
+
+    BackgroundSwirls {}
+
+    ShaderEffectItem {
+        id: effect
+        anchors.fill: parent
+        visible: deck.inTransition
+        property variant source: ShaderEffectSource { sourceItem: fromSlide; smooth: true }
+        property real ratio: 0
+        property real amplitude: 0.1 * ratio
+        property real frequency: 20
+        property real time: 0
+        NumberAnimation on time { loops: Animation.Infinite; from: 0; to: Math.PI * 2; duration: 2000 }
+        fragmentShader:
+            "uniform highp float amplitude;" +
+            "uniform highp float frequency;" +
+            "uniform highp float time;" +
+            "uniform lowp float ratio;" +
+            "uniform sampler2D source;" +
+            "varying highp vec2 qt_TexCoord0;" +
+            "void main() {" +
+            "    highp vec2 p = sin(time + frequency * qt_TexCoord0);" +
+            "    gl_FragColor = texture2D(source, qt_TexCoord0 + amplitude * vec2(p.y, -p.x)) * (1. - ratio);" +
+            "}"
+    }
+
+    SequentialAnimation {
+        id: transition
+        ScriptAction { script: {
+                deck.inTransition = true
+                fromSlide.opacity = 0
+                toSlide.visible = true
+            }
+        }
+
+        ParallelAnimation {
+            NumberAnimation { target: effect; property: "ratio"; from: 0; to: 1; duration: deck.transitionTime; }
+            NumberAnimation { target: toSlide; property: "opacity"; from: 0; to: 1; duration: deck.transitionTime; easing.type: Easing.InQuart }
+        }
+
+        ScriptAction { script: {
+                deck.inTransition = false
+                fromSlide.visible = false
+                fromSlide.opacity = 0
+                toSlide.opacity = 1
+            }
+        }
+    }
+
+    function switchSlides(from, to)
+    {
+        if (deck.inTransition)
+            return false
+
+        deck.fromSlide = from
+        deck.toSlide = to
+
+        transition.running = true;
+
+        return true
+    }
+}
diff --git a/examples/animatedbackground/BackgroundSwirls.qml b/examples/animatedbackground/BackgroundSwirls.qml
new file mode 100644
index 0000000..8227932
--- /dev/null
+++ b/examples/animatedbackground/BackgroundSwirls.qml
@@ -0,0 +1,77 @@
+import QtQuick 2.0
+import Qt.labs.particles 2.0
+
+Item {
+    anchors.fill: parent
+
+    Rectangle {
+        anchors.fill: parent
+        gradient: Gradient {
+            GradientStop { position: 0; color: "lightsteelblue" }
+            GradientStop { position: 1; color: "black" }
+        }
+    }
+
+    Rectangle {
+        id: colorTableItem
+        width: 16
+        height: 16
+        anchors.fill: parent
+
+        property color color1: Qt.rgba(0.8, 0.8, 1, 0.3)
+        property color color2: Qt.rgba(0.8, 0.8, 1, 0.3)
+
+        gradient: Gradient {
+            GradientStop { position: 0; color: colorTableItem.color1 }
+            GradientStop { position: 0.3; color: "transparent" }
+            GradientStop { position: 0.7; color: "transparent" }
+            GradientStop { position: 1; color: colorTableItem.color2 }
+        }
+
+        visible: false
+    }
+
+    ShaderEffectSource {
+        id: colorTableSource
+        sourceItem: colorTableItem
+        smooth: true
+    }
+
+    Repeater {
+        model: 4
+        Swirl {
+
+            width: parent.width
+            anchors.bottom: parent.bottom
+            height: parent.height / (2 + index)
+            opacity: 0.3
+            speed: (index + 1) / 5
+            colorTable: colorTableSource
+        }
+    }
+
+    ParticleSystem{
+        id: particles
+    }
+    ColoredParticle{
+        anchors.fill: parent
+        system: particles
+        image: "particle.png"
+        alpha: 0
+        colorVariation: 0.3
+    }
+    TrailEmitter{
+        anchors.fill: parent
+        system: particles
+        particlesPerSecond: Math.sqrt(parent.width * parent.height) / 30
+        particleDuration: 2000
+        emitting: true
+        particleSize: 4
+        particleSizeVariation: 2
+
+        acceleration: AngleVector{ angle: 90; angleVariation: 360; magnitude: 20; }
+        speed: AngleVector{ angle: -90; angleVariation: 360; magnitude: 10; }
+
+    }
+
+}
diff --git a/examples/animatedbackground/SlideDeck.qml b/examples/animatedbackground/SlideDeck.qml
index 6abc374..4b763cf 100644
--- a/examples/animatedbackground/SlideDeck.qml
+++ b/examples/animatedbackground/SlideDeck.qml
@@ -3,80 +3,10 @@ import Prezo 1.0
 
 import Qt.labs.particles 2.0
 
-Presentation {
+AnimatedPresentation {
     width: 640
     height: 360
 
-    Rectangle {
-        anchors.fill: parent
-        gradient: Gradient {
-            GradientStop { position: 0; color: "lightsteelblue" }
-            GradientStop { position: 1; color: "black" }
-        }
-    }
-
-    Rectangle {
-        id: colorTableItem
-        width: 16
-        height: 16
-        anchors.fill: parent
-
-        property color color1: Qt.rgba(0.8, 0.8, 1, 0.5)
-        property color color2: Qt.rgba(0.8, 0.8, 1, 0.5)
-
-        gradient: Gradient {
-            GradientStop { position: 0; color: colorTableItem.color1 }
-            GradientStop { position: 0.3; color: "transparent" }
-            GradientStop { position: 0.7; color: "transparent" }
-            GradientStop { position: 1; color: colorTableItem.color2 }
-        }
-
-        visible: false
-    }
-
-    ShaderEffectSource {
-        id: colorTableSource
-        sourceItem: colorTableItem
-        smooth: true
-    }
-
-    Repeater {
-        model: 4
-        Swirl {
-
-            width: parent.width
-            anchors.bottom: parent.bottom
-            height: parent.height / (2 + index)
-            opacity: 0.3
-            speed: index + 1
-            colorTable: colorTableSource
-        }
-    }
-
-    ParticleSystem{
-        id: particles
-    }
-    ColoredParticle{
-        anchors.fill: parent
-        system: particles
-        image: "particle.png"
-        alpha: 0
-        colorVariation: 0.3
-    }
-    TrailEmitter{
-        anchors.fill: parent
-        system: particles
-        particlesPerSecond: Math.sqrt(parent.width * parent.height) / 30
-        particleDuration: 2000
-        emitting: true
-        particleSize: 4
-        particleSizeVariation: 2
-
-        acceleration: AngleVector{ angle: 90; angleVariation: 360; magnitude: 20; }
-        speed: AngleVector{ angle: -90; angleVariation: 360; magnitude: 10; }
-
-    }
-
     property color textColor: "white"
 
     Slide {