From 6905c23c8363ce3f6698b0bc81dc81eef0f8de20 Mon Sep 17 00:00:00 2001
From: Yann Bodson <yann.bodson@nokia.com>
Date: Wed, 31 Mar 2010 14:25:23 +1000
Subject: Improve flipable example.

---
 doc/src/snippets/declarative/flipable.qml          |  37 +++++++++++++++++++
 examples/declarative/flipable/back.png             | Bin 5048 -> 0 bytes
 examples/declarative/flipable/content/5_heart.png  | Bin 0 -> 3872 bytes
 examples/declarative/flipable/content/9_club.png   | Bin 0 -> 6135 bytes
 examples/declarative/flipable/content/Card.qml     |  38 ++++++++++++++++++++
 examples/declarative/flipable/content/back.png     | Bin 0 -> 1418 bytes
 examples/declarative/flipable/flipable-example.qml |  40 +++++----------------
 examples/declarative/flipable/front.png            | Bin 6431 -> 0 bytes
 .../graphicsitems/qdeclarativeflipable.cpp         |   2 +-
 9 files changed, 84 insertions(+), 33 deletions(-)
 create mode 100644 doc/src/snippets/declarative/flipable.qml
 delete mode 100644 examples/declarative/flipable/back.png
 create mode 100644 examples/declarative/flipable/content/5_heart.png
 create mode 100644 examples/declarative/flipable/content/9_club.png
 create mode 100644 examples/declarative/flipable/content/Card.qml
 create mode 100644 examples/declarative/flipable/content/back.png
 delete mode 100644 examples/declarative/flipable/front.png

diff --git a/doc/src/snippets/declarative/flipable.qml b/doc/src/snippets/declarative/flipable.qml
new file mode 100644
index 0000000..c837ebc
--- /dev/null
+++ b/doc/src/snippets/declarative/flipable.qml
@@ -0,0 +1,37 @@
+//! [0]
+import Qt 4.6
+
+Flipable {
+    id: flipable
+    width: 240
+    height: 240
+
+    property int angle: 0
+    property bool flipped: false
+
+    front: Image { source: "front.png" }
+    back: Image { source: "back.png" }
+
+    transform: Rotation {
+        origin.x: flipable.width/2; origin.y: flipable.height/2
+        axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
+        angle: flipable.angle
+    }
+
+    states: State {
+        name: "back"
+        PropertyChanges { target: flipable; angle: 180 }
+        when: flipable.flipped
+    }
+
+    transitions: Transition {
+        NumberAnimation { properties: "angle"; duration: 1000 }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: flipable.flipped = !flipable.flipped
+    }
+}
+//! [0]
+
diff --git a/examples/declarative/flipable/back.png b/examples/declarative/flipable/back.png
deleted file mode 100644
index 0b4cafc..0000000
Binary files a/examples/declarative/flipable/back.png and /dev/null differ
diff --git a/examples/declarative/flipable/content/5_heart.png b/examples/declarative/flipable/content/5_heart.png
new file mode 100644
index 0000000..fb59d81
Binary files /dev/null and b/examples/declarative/flipable/content/5_heart.png differ
diff --git a/examples/declarative/flipable/content/9_club.png b/examples/declarative/flipable/content/9_club.png
new file mode 100644
index 0000000..2545001
Binary files /dev/null and b/examples/declarative/flipable/content/9_club.png differ
diff --git a/examples/declarative/flipable/content/Card.qml b/examples/declarative/flipable/content/Card.qml
new file mode 100644
index 0000000..6b8fa69
--- /dev/null
+++ b/examples/declarative/flipable/content/Card.qml
@@ -0,0 +1,38 @@
+import Qt 4.6
+
+Flipable {
+    id: container
+
+    property alias image: frontImage.source
+    property bool flipped: true
+    property int xAxis: 0
+    property int yAxis: 0
+    property int angle: 0
+
+    width: front.width; height: front.height; state: "back"
+
+    front: Image { id: frontImage; smooth: true }
+    back: Image { source: "back.png"; smooth: true }
+
+    MouseArea { anchors.fill: parent; onClicked: container.flipped = !container.flipped }
+
+    transform: Rotation {
+        id: rotation; origin.x: container.width / 2; origin.y: container.height / 2
+        axis.x: container.xAxis; axis.y: container.yAxis; axis.z: 0
+    }
+
+    states: State {
+        name: "back"; when: container.flipped
+        PropertyChanges { target: rotation; angle: container.angle }
+    }
+
+    transitions: Transition {
+        ParallelAnimation {
+            NumberAnimation { target: rotation; properties: "angle"; duration: 600 }
+            SequentialAnimation {
+                NumberAnimation { target: container; property: "scale"; to: 0.75; duration: 300 }
+                NumberAnimation { target: container; property: "scale"; to: 1.0; duration: 300 }
+            }
+        }
+    }
+}
diff --git a/examples/declarative/flipable/content/back.png b/examples/declarative/flipable/content/back.png
new file mode 100644
index 0000000..f715d74
Binary files /dev/null and b/examples/declarative/flipable/content/back.png differ
diff --git a/examples/declarative/flipable/flipable-example.qml b/examples/declarative/flipable/flipable-example.qml
index c837ebc..eebc721 100644
--- a/examples/declarative/flipable/flipable-example.qml
+++ b/examples/declarative/flipable/flipable-example.qml
@@ -1,37 +1,13 @@
-//! [0]
 import Qt 4.6
+import "content"
 
-Flipable {
-    id: flipable
-    width: 240
-    height: 240
+Rectangle {
+    id: window; width: 480; height: 320
+    color: "darkgreen"
 
-    property int angle: 0
-    property bool flipped: false
-
-    front: Image { source: "front.png" }
-    back: Image { source: "back.png" }
-
-    transform: Rotation {
-        origin.x: flipable.width/2; origin.y: flipable.height/2
-        axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
-        angle: flipable.angle
-    }
-
-    states: State {
-        name: "back"
-        PropertyChanges { target: flipable; angle: 180 }
-        when: flipable.flipped
-    }
-
-    transitions: Transition {
-        NumberAnimation { properties: "angle"; duration: 1000 }
-    }
-
-    MouseArea {
-        anchors.fill: parent
-        onClicked: flipable.flipped = !flipable.flipped
+    Row {
+        anchors.centerIn: parent; spacing: 30
+        Card { image: "content/9_club.png"; angle: 180; yAxis: 1 }
+        Card { image: "content/5_heart.png"; angle: 540; xAxis: 1 }
     }
 }
-//! [0]
-
diff --git a/examples/declarative/flipable/front.png b/examples/declarative/flipable/front.png
deleted file mode 100644
index 796b605..0000000
Binary files a/examples/declarative/flipable/front.png and /dev/null differ
diff --git a/src/declarative/graphicsitems/qdeclarativeflipable.cpp b/src/declarative/graphicsitems/qdeclarativeflipable.cpp
index e670d3e..ccefc70 100644
--- a/src/declarative/graphicsitems/qdeclarativeflipable.cpp
+++ b/src/declarative/graphicsitems/qdeclarativeflipable.cpp
@@ -75,7 +75,7 @@ public:
 
     Here is a Flipable that flips whenever it is clicked:
 
-    \snippet examples/declarative/flipable/flipable-example.qml 0
+    \snippet doc/src/snippets/declarative/flipable.qml 0
 
     \image flipable.gif
 
-- 
cgit v0.12