Merge branch '4.7' of scm.dev.nokia.troll.no:qt/qt-qml into 4.7-integration

* '4.7' of scm.dev.nokia.troll.no:qt/qt-qml:
  Focus should be applied to focus scopes all the way up the chain, not
  Add focus docs snippets
  Fix doc for status, add Image::onLoaded.
  Don't crash due to recursive positioning.
  ListModel::get() shouldn't print warnings for invalid indices since it
  Add \brief to TextInput
  Add missing .pro
  Restructure the examples. They are now organized into various
  graphicsWidgets doc example was previously removed
  Doc fix
  Add a "priority" property to Keys and KeyNavigation

49 files changed, 1192 insertions, 0 deletions

diff --git a/examples/declarative/toys/clocks/clocks.qml b/examples/declarative/toys/clocks/clocks.qml
new file mode 100644
index 0000000..22cf820
--- /dev/null
+++ b/examples/declarative/toys/clocks/clocks.qml
@@ -0,0 +1,14 @@
+import Qt 4.7
+import "content"
+
+Rectangle {
+    width: 640; height: 240
+    color: "#646464"
+
+    Row {
+        anchors.centerIn: parent
+        Clock { city: "New York"; shift: -4 }
+        Clock { city: "Mumbai"; shift: 5.5 }
+        Clock { city: "Tokyo"; shift: 9 }
+    }
+}
diff --git a/examples/declarative/toys/clocks/clocks.qmlproject b/examples/declarative/toys/clocks/clocks.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/clocks/clocks.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/clocks/content/Clock.qml b/examples/declarative/toys/clocks/content/Clock.qml
new file mode 100644
index 0000000..3426e6a
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/Clock.qml
@@ -0,0 +1,83 @@
+import Qt 4.7
+
+Item {
+    id: clock
+    width: 200; height: 230
+
+    property alias city: cityLabel.text
+    property variant hours
+    property variant minutes
+    property variant seconds
+    property variant shift : 0
+    property bool night: false
+
+    function timeChanged() {
+        var date = new Date;
+        hours = shift ? date.getUTCHours() + Math.floor(clock.shift) : date.getHours()
+        night = ( hours < 7 || hours > 19 )
+        minutes = shift ? date.getUTCMinutes() + ((clock.shift % 1) * 60) : date.getMinutes()
+        seconds = date.getUTCSeconds();
+    }
+
+    Timer {
+        interval: 100; running: true; repeat: true; triggeredOnStart: true
+        onTriggered: clock.timeChanged()
+    }
+
+    Image { id: background; source: "clock.png"; visible: clock.night == false }
+    Image { source: "clock-night.png"; visible: clock.night == true }
+
+    Image {
+        x: 92.5; y: 27
+        source: "hour.png"
+        smooth: true
+        transform: Rotation {
+            id: hourRotation
+            origin.x: 7.5; origin.y: 73; angle: 0
+            SpringFollow on angle {
+                spring: 2; damping: 0.2; modulus: 360
+                to: (clock.hours * 30) + (clock.minutes * 0.5)
+            }
+        }
+    }
+
+    Image {
+        x: 93.5; y: 17
+        source: "minute.png"
+        smooth: true
+        transform: Rotation {
+            id: minuteRotation
+            origin.x: 6.5; origin.y: 83; angle: 0
+            SpringFollow on angle {
+                spring: 2; damping: 0.2; modulus: 360
+                to: clock.minutes * 6
+            }
+        }
+    }
+
+    Image {
+        x: 97.5; y: 20
+        source: "second.png"
+        smooth: true
+        transform: Rotation {
+            id: secondRotation
+            origin.x: 2.5; origin.y: 80; angle: 0
+            SpringFollow on angle {
+                spring: 5; damping: 0.25; modulus: 360
+                to: clock.seconds * 6
+            }
+        }
+    }
+
+    Image {
+        anchors.centerIn: background; source: "center.png"
+    }
+
+    Text {
+        id: cityLabel
+        y: 200; anchors.horizontalCenter: parent.horizontalCenter
+        color: "white"
+        font.bold: true; font.pixelSize: 14
+        style: Text.Raised; styleColor: "black"
+    }
+}
diff --git a/examples/declarative/toys/clocks/content/background.png b/examples/declarative/toys/clocks/content/background.png
new file mode 100644
index 0000000..a885950
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/background.png
diff --git a/examples/declarative/toys/clocks/content/center.png b/examples/declarative/toys/clocks/content/center.png
new file mode 100755
index 0000000..7fbd802
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/center.png
diff --git a/examples/declarative/toys/clocks/content/clock-night.png b/examples/declarative/toys/clocks/content/clock-night.png
new file mode 100755
index 0000000..cc7151a
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/clock-night.png
diff --git a/examples/declarative/toys/clocks/content/clock.png b/examples/declarative/toys/clocks/content/clock.png
new file mode 100755
index 0000000..462edac
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/clock.png
diff --git a/examples/declarative/toys/clocks/content/hour.png b/examples/declarative/toys/clocks/content/hour.png
new file mode 100755
index 0000000..f8061a1
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/hour.png
diff --git a/examples/declarative/toys/clocks/content/minute.png b/examples/declarative/toys/clocks/content/minute.png
new file mode 100755
index 0000000..1297ec7
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/minute.png
diff --git a/examples/declarative/toys/clocks/content/second.png b/examples/declarative/toys/clocks/content/second.png
new file mode 100755
index 0000000..4aa9fb5
--- /dev/null
+++ b/examples/declarative/toys/clocks/content/second.png
diff --git a/examples/declarative/toys/dial/content/Dial.qml b/examples/declarative/toys/dial/content/Dial.qml
new file mode 100644
index 0000000..6f24801
--- /dev/null
+++ b/examples/declarative/toys/dial/content/Dial.qml
@@ -0,0 +1,43 @@
+import Qt 4.7
+
+Item {
+    id: root
+    property real value : 0
+
+    width: 210; height: 210
+
+    Image { source: "background.png" }
+
+//! [needle_shadow]
+    Image {
+        x: 93
+        y: 35
+        source: "needle_shadow.png"
+        transform: Rotation {
+            origin.x: 11; origin.y: 67
+            angle: needleRotation.angle
+        }
+    }
+//! [needle_shadow]
+//! [needle]
+    Image {
+        id: needle
+        x: 95; y: 33
+        smooth: true
+        source: "needle.png"
+        transform: Rotation {
+            id: needleRotation
+            origin.x: 7; origin.y: 65
+            angle: -130
+            SpringFollow on angle {
+                spring: 1.4
+                damping: .15
+                to: Math.min(Math.max(-130, root.value*2.6 - 130), 133)
+            }
+        }
+    }
+//! [needle]
+//! [overlay]
+    Image { x: 21; y: 18; source: "overlay.png" }
+//! [overlay]
+}
diff --git a/examples/declarative/toys/dial/content/background.png b/examples/declarative/toys/dial/content/background.png
new file mode 100644
index 0000000..75d555d
--- /dev/null
+++ b/examples/declarative/toys/dial/content/background.png
diff --git a/examples/declarative/toys/dial/content/needle.png b/examples/declarative/toys/dial/content/needle.png
new file mode 100644
index 0000000..2d19f75
--- /dev/null
+++ b/examples/declarative/toys/dial/content/needle.png
diff --git a/examples/declarative/toys/dial/content/needle_shadow.png b/examples/declarative/toys/dial/content/needle_shadow.png
new file mode 100644
index 0000000..8d8a928
--- /dev/null
+++ b/examples/declarative/toys/dial/content/needle_shadow.png
diff --git a/examples/declarative/toys/dial/content/overlay.png b/examples/declarative/toys/dial/content/overlay.png
new file mode 100644
index 0000000..3860a7b
--- /dev/null
+++ b/examples/declarative/toys/dial/content/overlay.png
diff --git a/examples/declarative/toys/dial/dial-example.qml b/examples/declarative/toys/dial/dial-example.qml
new file mode 100644
index 0000000..900954f
--- /dev/null
+++ b/examples/declarative/toys/dial/dial-example.qml
@@ -0,0 +1,50 @@
+import Qt 4.7
+import "content"
+
+//! [0]
+Rectangle {
+    color: "#545454"
+    width: 300; height: 300
+
+    // Dial with a slider to adjust it
+    Dial {
+        id: dial
+        anchors.centerIn: parent
+        value: slider.x * 100 / (container.width - 34)
+    }
+
+    Rectangle {
+        id: container
+        anchors { bottom: parent.bottom; left: parent.left
+            right: parent.right; leftMargin: 20; rightMargin: 20
+            bottomMargin: 10
+        }
+        height: 16
+
+        radius: 8
+        opacity: 0.7
+        smooth: true
+        gradient: Gradient {
+            GradientStop { position: 0.0; color: "gray" }
+            GradientStop { position: 1.0; color: "white" }
+        }
+
+        Rectangle {
+            id: slider
+            x: 1; y: 1; width: 30; height: 14
+            radius: 6
+            smooth: true
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "#424242" }
+                GradientStop { position: 1.0; color: "black" }
+            }
+
+            MouseArea {
+                anchors.fill: parent
+                drag.target: parent; drag.axis: Drag.XAxis
+                drag.minimumX: 2; drag.maximumX: container.width - 32
+            }
+        }
+    }
+}
+//! [0]
\ No newline at end of file
diff --git a/examples/declarative/toys/dial/dial.qmlproject b/examples/declarative/toys/dial/dial.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/dial/dial.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/dynamic/dynamic.qml b/examples/declarative/toys/dynamic/dynamic.qml
new file mode 100644
index 0000000..52c7c1e
--- /dev/null
+++ b/examples/declarative/toys/dynamic/dynamic.qml
@@ -0,0 +1,176 @@
+import Qt 4.7
+import Qt.labs.particles 1.0
+import "qml"
+
+Item {
+    id: window
+
+    property int activeSuns: 0
+
+    //This is a desktop-sized example
+    width: 1024; height: 512
+    
+    //This is the message box that pops up when there's an error
+    Rectangle {
+        id: dialog
+
+        opacity: 0
+        anchors.centerIn: parent
+        width: dialogText.width + 6; height: dialogText.height + 6
+        border.color: 'black'
+        color: 'lightsteelblue'
+        z: 65535 //Arbitrary number chosen to be above all the items, including the scaled perspective ones.
+
+        function show(str){
+            dialogText.text = str;
+            dialogAnim.start();
+        }
+
+        Text {
+            id: dialogText
+            x: 3; y: 3
+            font.pixelSize: 14
+        }
+
+        SequentialAnimation {
+            id: dialogAnim
+            NumberAnimation { target: dialog; property:"opacity"; to: 1; duration: 1000 }
+            PauseAnimation { duration: 5000 }
+            NumberAnimation { target: dialog; property:"opacity"; to: 0; duration: 1000 }
+        }
+    }
+
+    // sky
+    Rectangle {
+        id: sky
+        anchors { left: parent.left; top: parent.top; right: toolbox.right; bottom: parent.verticalCenter }
+        gradient: Gradient {
+            GradientStop { id: gradientStopA; position: 0.0; color: "#0E1533" }
+            GradientStop { id: gradientStopB; position: 1.0; color: "#437284" }
+        }
+    }
+
+    // stars (when there's no sun)
+    Particles {
+        id: stars
+        x: 0; y: 0; width: parent.width; height: parent.height / 2
+        source: "images/star.png"
+        angleDeviation: 360
+        velocity: 0; velocityDeviation: 0
+        count: parent.width / 10
+        fadeInDuration: 2800
+        opacity: 1
+    }
+
+    // ground
+    Rectangle {
+        id: ground
+        z: 2    // just above the sun so that the sun can set behind it
+        anchors { left: parent.left; top: parent.verticalCenter; right: toolbox.left; bottom: parent.bottom }
+        gradient: Gradient {
+            GradientStop { position: 0.0; color: "ForestGreen" }
+            GradientStop { position: 1.0; color: "DarkGreen" }
+        }
+    }
+
+    SystemPalette { id: activePalette }
+
+    // right-hand panel
+    Rectangle {
+        id: toolbox
+
+        width: 480
+        color: activePalette.window
+        anchors { right: parent.right; top: parent.top; bottom: parent.bottom }
+
+        Column {
+            anchors.centerIn: parent
+            spacing: 8
+
+            Text { text: "Drag an item into the scene." }
+
+            Rectangle {
+                width: childrenRect.width + 10; height: childrenRect.height + 10
+                border.color: "black"
+
+                Row {
+                    anchors.centerIn: parent
+                    spacing: 8
+
+                    PaletteItem {
+                        anchors.verticalCenter: parent.verticalCenter
+                        componentFile: "Sun.qml"
+                        image: "../images/sun.png"
+                    }
+                    PaletteItem {
+                        anchors.verticalCenter: parent.verticalCenter
+                        componentFile: "GenericSceneItem.qml"
+                        image: "../images/moon.png"
+                    }
+                    PaletteItem {
+                        anchors.verticalCenter: parent.verticalCenter
+                        componentFile: "PerspectiveItem.qml"
+                        image: "../images/tree_s.png"
+                    }
+                    PaletteItem {
+                        anchors.verticalCenter: parent.verticalCenter
+                        componentFile: "PerspectiveItem.qml"
+                        image: "../images/rabbit_brown.png"
+                    }
+                    PaletteItem {
+                        anchors.verticalCenter: parent.verticalCenter
+                        componentFile: "PerspectiveItem.qml"
+                        image: "../images/rabbit_bw.png"
+                    }
+                }
+            }
+
+            Text { text: "Active Suns: " + activeSuns }
+
+            Rectangle { width: parent.width; height: 1; color: "black" }
+
+            Text { text: "Arbitrary QML:" }
+
+            Rectangle {
+                width: 460; height: 240
+
+                TextEdit {
+                    id: qmlText
+                    anchors.fill: parent; anchors.margins: 5
+                    readOnly: false
+                    focusOnPress: true
+                    font.pixelSize: 14
+
+                    text: "import Qt 4.7\nImage {\n    id: smile\n    x: 500 * Math.random()\n    y: 200 * Math.random() \n    source: 'images/face-smile.png'\n\n    NumberAnimation on opacity { \n        to: 0; duration: 1500\n    }\n\n    Component.onCompleted: smile.destroy(1500);\n}"
+                }
+            }
+
+            Button {
+                text: "Create"
+                onClicked: {
+                    try { 
+                        Qt.createQmlObject(qmlText.text, window, 'CustomObject');
+                    } catch(err) {
+                        dialog.show('Error on line ' + err.qmlErrors[0].lineNumber + '\n' + err.qmlErrors[0].message);
+                    }
+                }
+            }
+        }
+    }
+
+    //Day state, for when a sun is added to the scene
+    states: State {
+        name: "Day"
+        when: window.activeSuns > 0
+
+        PropertyChanges { target: gradientStopA; color: "DeepSkyBlue" }
+        PropertyChanges { target: gradientStopB; color: "SkyBlue" }
+        PropertyChanges { target: stars; opacity: 0 }
+    }
+
+    transitions: Transition {
+        PropertyAnimation { duration: 3000 }
+        ColorAnimation { duration: 3000 }
+    }
+
+}
diff --git a/examples/declarative/toys/dynamic/dynamic.qmlproject b/examples/declarative/toys/dynamic/dynamic.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/dynamic/dynamic.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/dynamic/images/NOTE b/examples/declarative/toys/dynamic/images/NOTE
new file mode 100644
index 0000000..fcd87f9
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/NOTE
@@ -0,0 +1 @@
+Images (except star.png) are from the KDE project.
diff --git a/examples/declarative/toys/dynamic/images/face-smile.png b/examples/declarative/toys/dynamic/images/face-smile.png
new file mode 100644
index 0000000..3d66d72
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/face-smile.png
diff --git a/examples/declarative/toys/dynamic/images/moon.png b/examples/declarative/toys/dynamic/images/moon.png
new file mode 100644
index 0000000..1c0d606
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/moon.png
diff --git a/examples/declarative/toys/dynamic/images/rabbit_brown.png b/examples/declarative/toys/dynamic/images/rabbit_brown.png
new file mode 100644
index 0000000..ebfdeed
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/rabbit_brown.png
diff --git a/examples/declarative/toys/dynamic/images/rabbit_bw.png b/examples/declarative/toys/dynamic/images/rabbit_bw.png
new file mode 100644
index 0000000..7bff9b9
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/rabbit_bw.png
diff --git a/examples/declarative/toys/dynamic/images/star.png b/examples/declarative/toys/dynamic/images/star.png
new file mode 100644
index 0000000..27ef924
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/star.png
diff --git a/examples/declarative/toys/dynamic/images/sun.png b/examples/declarative/toys/dynamic/images/sun.png
new file mode 100644
index 0000000..7713ca5
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/sun.png
diff --git a/examples/declarative/toys/dynamic/images/tree_s.png b/examples/declarative/toys/dynamic/images/tree_s.png
new file mode 100644
index 0000000..6eac35a
--- /dev/null
+++ b/examples/declarative/toys/dynamic/images/tree_s.png
diff --git a/examples/declarative/toys/dynamic/qml/Button.qml b/examples/declarative/toys/dynamic/qml/Button.qml
new file mode 100644
index 0000000..963a850
--- /dev/null
+++ b/examples/declarative/toys/dynamic/qml/Button.qml
@@ -0,0 +1,40 @@
+import Qt 4.7
+
+Rectangle {
+    id: container
+
+    property variant text
+    signal clicked
+
+    height: text.height + 10; width: text.width + 20
+    border.width: 1
+    radius: 4
+    smooth: true
+
+    gradient: Gradient {
+        GradientStop {
+            position: 0.0
+            color: !mouseArea.pressed ? activePalette.light : activePalette.button
+        }
+        GradientStop {
+            position: 1.0
+            color: !mouseArea.pressed ? activePalette.button : activePalette.dark
+        }
+    }
+
+    SystemPalette { id: activePalette }
+
+    MouseArea {
+        id: mouseArea
+        anchors.fill: parent
+        onClicked: container.clicked()
+    }
+
+    Text {
+        id: text
+        anchors.centerIn:parent
+        font.pointSize: 10
+        text: parent.text
+        color: activePalette.buttonText
+    }
+}
diff --git a/examples/declarative/toys/dynamic/qml/PaletteItem.qml b/examples/declarative/toys/dynamic/qml/PaletteItem.qml
new file mode 100644
index 0000000..dcb5cc3
--- /dev/null
+++ b/examples/declarative/toys/dynamic/qml/PaletteItem.qml
@@ -0,0 +1,19 @@
+import Qt 4.7
+import "itemCreation.js" as Code
+
+Image {
+    id: paletteItem
+
+    property string componentFile
+    property string image
+
+    source: image
+
+    MouseArea { 
+        anchors.fill: parent
+
+        onPressed: Code.startDrag(mouse);
+        onPositionChanged: Code.continueDrag(mouse);
+        onReleased: Code.endDrag(mouse);
+    }
+}
diff --git a/examples/declarative/toys/dynamic/qml/PerspectiveItem.qml b/examples/declarative/toys/dynamic/qml/PerspectiveItem.qml
new file mode 100644
index 0000000..c04d3dc
--- /dev/null
+++ b/examples/declarative/toys/dynamic/qml/PerspectiveItem.qml
@@ -0,0 +1,25 @@
+import Qt 4.7
+
+Image {
+    id: rootItem
+
+    property bool created: false
+    property string image 
+
+    property double scaledBottom: y + (height + height*scale) / 2 
+    property bool onLand: scaledBottom > window.height / 2
+
+    source: image
+    opacity: onLand ? 1 : 0.25
+    scale: Math.max((y + height - 250) * 0.01, 0.3)
+    smooth: true
+
+    onCreatedChanged: {
+        if (created && !onLand)
+            rootItem.destroy();
+        else
+            z = scaledBottom;
+    }
+
+    onYChanged: z = scaledBottom;
+}
diff --git a/examples/declarative/toys/dynamic/qml/Sun.qml b/examples/declarative/toys/dynamic/qml/Sun.qml
new file mode 100644
index 0000000..43dcb9a
--- /dev/null
+++ b/examples/declarative/toys/dynamic/qml/Sun.qml
@@ -0,0 +1,38 @@
+import Qt 4.7
+
+Image {
+    id: sun
+
+    property bool created: false
+    property string image: "../images/sun.png"
+
+    source: image
+
+    // once item is created, start moving offscreen
+    NumberAnimation on y {
+        to: window.height / 2
+        running: created
+        onRunningChanged: {
+            if (running)
+                duration = (window.height - sun.y) * 10;
+            else
+                state = "OffScreen"
+        }
+    }
+
+    states: State {
+        name: "OffScreen"
+        StateChangeScript {
+            script: { sun.created = false; sun.destroy() }
+        }
+    }
+
+    onCreatedChanged: {
+        if (created) {
+            sun.z = 1;    // above the sky but below the ground layer 
+            window.activeSuns++;
+        } else {
+            window.activeSuns--;
+        }
+    }
+}
diff --git a/examples/declarative/toys/dynamic/qml/itemCreation.js b/examples/declarative/toys/dynamic/qml/itemCreation.js
new file mode 100644
index 0000000..59750f3
--- /dev/null
+++ b/examples/declarative/toys/dynamic/qml/itemCreation.js
@@ -0,0 +1,65 @@
+var itemComponent = null;
+var draggedItem = null;
+var startingMouse;
+var posnInWindow;
+
+function startDrag(mouse)
+{
+    posnInWindow = paletteItem.mapToItem(null, 0, 0);
+    startingMouse = { x: mouse.x, y: mouse.y }
+    loadComponent();
+}
+
+//Creation is split into two functions due to an asynchronous wait while
+//possible external files are loaded.
+
+function loadComponent() {
+    if (itemComponent != null) { // component has been previously loaded
+        createItem();
+        return;
+    }
+
+    itemComponent = Qt.createComponent(paletteItem.componentFile);
+    if (itemComponent.status == Component.Loading)  //Depending on the content, it can be ready or error immediately
+        component.statusChanged.connect(createItem);
+    else    
+        createItem();
+}
+
+function createItem() {
+    if (itemComponent.status == Component.Ready && draggedItem == null) {
+        draggedItem = itemComponent.createObject(window);
+        draggedItem.image = paletteItem.image;
+        draggedItem.x = posnInWindow.x;
+        draggedItem.y = posnInWindow.y;
+        draggedItem.z = 3;  // make sure created item is above the ground layer
+    } else if (itemComponent.status == Component.Error) {
+        draggedItem = null;
+        console.log("error creating component");
+        console.log(component.errorsString());
+    }
+}
+
+function continueDrag(mouse)
+{
+    if (draggedItem == null)
+        return;
+
+    draggedItem.x = mouse.x + posnInWindow.x - startingMouse.x;
+    draggedItem.y = mouse.y + posnInWindow.y - startingMouse.y;
+}
+
+function endDrag(mouse)
+{
+    if (draggedItem == null)
+        return;
+
+    if (draggedItem.x + draggedItem.width > toolbox.x) { //Don't drop it in the toolbox
+        draggedItem.destroy();
+        draggedItem = null;
+    } else {
+        draggedItem.created = true;
+        draggedItem = null;
+    }
+}
+
diff --git a/examples/declarative/toys/tic-tac-toe/content/Button.qml b/examples/declarative/toys/tic-tac-toe/content/Button.qml
new file mode 100644
index 0000000..ecf18cd
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/Button.qml
@@ -0,0 +1,37 @@
+import Qt 4.7
+
+Rectangle {
+    id: container
+
+    property string text: "Button"
+    property bool down: false
+    property string mainCol: "lightgray"
+    property string darkCol: "darkgray"
+    property string lightCol: "white"
+
+    width: buttonLabel.width + 20; height: buttonLabel.height + 6
+    border { width: 1; color: Qt.darker(mainCol) } 
+    radius: 8;
+    color: mainCol
+    smooth: true
+
+    gradient: Gradient {
+        GradientStop {
+            id: topGrad; position: 0.0
+            color: if (container.down) { darkCol } else { lightCol }
+        }
+        GradientStop { position: 1.0; color: mainCol }
+    }
+
+    signal clicked
+
+    MouseArea { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: buttonLabel
+
+        anchors.centerIn: container
+        text: container.text;
+        font.pixelSize: 14
+    }
+}
diff --git a/examples/declarative/toys/tic-tac-toe/content/TicTac.qml b/examples/declarative/toys/tic-tac-toe/content/TicTac.qml
new file mode 100644
index 0000000..d247943
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/TicTac.qml
@@ -0,0 +1,20 @@
+import Qt 4.7
+
+Item {
+    signal clicked
+
+    states: [
+        State { name: "X"; PropertyChanges { target: image; source: "pics/x.png" } },
+        State { name: "O"; PropertyChanges { target: image; source: "pics/o.png" } }
+    ]
+
+    Image {
+        id: image
+        anchors.centerIn: parent
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: parent.clicked()
+    }
+}
diff --git a/examples/declarative/toys/tic-tac-toe/content/pics/board.png b/examples/declarative/toys/tic-tac-toe/content/pics/board.png
new file mode 100644
index 0000000..7e5b7ba
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/pics/board.png
diff --git a/examples/declarative/toys/tic-tac-toe/content/pics/o.png b/examples/declarative/toys/tic-tac-toe/content/pics/o.png
new file mode 100644
index 0000000..abc7ee0
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/pics/o.png
diff --git a/examples/declarative/toys/tic-tac-toe/content/pics/x.png b/examples/declarative/toys/tic-tac-toe/content/pics/x.png
new file mode 100644
index 0000000..ddc65c8
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/pics/x.png
diff --git a/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js b/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js
new file mode 100644
index 0000000..f8d6d9f
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js
@@ -0,0 +1,145 @@
+function winner(board)
+{
+    for (var i=0; i<3; ++i) {
+        if (board.children[i].state!=""
+            && board.children[i].state==board.children[i+3].state
+            && board.children[i].state==board.children[i+6].state)
+            return true
+
+        if (board.children[i*3].state!=""
+            && board.children[i*3].state==board.children[i*3+1].state
+            && board.children[i*3].state==board.children[i*3+2].state)
+            return true
+    }
+
+    if (board.children[0].state!=""
+        && board.children[0].state==board.children[4].state!=""
+        && board.children[0].state==board.children[8].state!="")
+        return true
+
+    if (board.children[2].state!=""
+        && board.children[2].state==board.children[4].state!=""
+        && board.children[2].state==board.children[6].state!="")
+        return true
+
+    return false
+}
+
+function restart()
+{
+    // No moves left - start again
+    for (var i=0; i<9; ++i)
+        board.children[i].state = ""
+}
+
+function makeMove(pos,player)
+{
+    board.children[pos].state = player
+    if (winner(board)) {
+        win(player + " wins")
+        return true
+    } else {
+        return false
+    }
+}
+
+function computerTurn()
+{
+    var r = Math.random();
+    if(r < game.difficulty){
+        smartAI();
+    }else{
+        randAI();
+    }
+}
+
+function smartAI()
+{
+    function boardCopy(a){
+        var ret = new Object;
+        ret.children = new Array(9);
+        for(var i = 0; i<9; i++){
+            ret.children[i] = new Object;
+            ret.children[i].state = a.children[i].state;
+        }
+        return ret;
+    }
+    for(var i=0; i<9; i++){
+        var simpleBoard = boardCopy(board);
+        if (board.children[i].state == "") {
+            simpleBoard.children[i].state = "O";
+            if(winner(simpleBoard)){
+                makeMove(i,"O")
+                return
+            }
+        }
+    }
+    for(var i=0; i<9; i++){
+        var simpleBoard = boardCopy(board);
+        if (board.children[i].state == "") {
+            simpleBoard.children[i].state = "X";
+            if(winner(simpleBoard)){
+                makeMove(i,"O")
+                return
+            }
+        }
+    }
+    function thwart(a,b,c){//If they are at a, try b or c
+        if (board.children[a].state == "X") {
+            if (board.children[b].state == "") {
+                makeMove(b,"O")
+                return true
+            }else if (board.children[c].state == "") {
+                makeMove(c,"O")
+                return true
+            }
+        }
+        return false;
+    }
+    if(thwart(4,0,2)) return;
+    if(thwart(0,4,3)) return;
+    if(thwart(2,4,1)) return;
+    if(thwart(6,4,7)) return;
+    if(thwart(8,4,5)) return;
+    if(thwart(1,4,2)) return;
+    if(thwart(3,4,0)) return;
+    if(thwart(5,4,8)) return;
+    if(thwart(7,4,6)) return;
+    for(var i =0; i<9; i++){//Backup
+        if (board.children[i].state == "") {
+            makeMove(i,"O")
+            return
+        }
+    }
+    restart();
+}
+
+function randAI()
+{
+    var open = 0;
+    for (var i=0; i<9; ++i)
+        if (board.children[i].state == "") {
+            open += 1;
+        }
+    if(open == 0){
+        restart();
+        return;
+    }
+    var openA = new Array(open);//JS doesn't have lists I can append to (i think)
+    var acc = 0;
+    for (var i=0; i<9; ++i)
+        if (board.children[i].state == "") {
+            openA[acc] = i;
+            acc += 1;
+        }
+    var choice = openA[Math.floor(Math.random() * open)];
+    makeMove(choice, "O");
+}
+
+function win(s)
+{
+    msg.text = s
+    msg.opacity = 1
+    endtimer.running = true
+}
+
diff --git a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
new file mode 100644
index 0000000..dd13052
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
@@ -0,0 +1,77 @@
+import Qt 4.7
+import "content"
+import "content/tic-tac-toe.js" as Logic
+
+Item {
+    id: game
+
+    property bool show: false
+    property real difficulty: 1.0   //chance it will actually think
+
+    width: 440
+    height: 480
+    anchors.fill: parent
+
+    Image {
+        id: boardimage
+        anchors { verticalCenter: parent.verticalCenter; horizontalCenter: parent.horizontalCenter }
+        source: "content/pics/board.png"
+    }
+
+    Grid {
+        id: board
+        anchors.fill: boardimage
+        columns: 3
+
+        Repeater {
+            model: 9
+            TicTac {
+                width: board.width/3
+                height: board.height/3
+                onClicked: {
+                    if (!endtimer.running) {
+                        if (!Logic.makeMove(index,"X"))
+                            Logic.computerTurn()
+                    }
+                }
+            }
+        }
+
+        Timer {
+            id: endtimer
+            interval: 1600
+            onTriggered: { msg.opacity = 0; Logic.restart() }
+        }
+    }
+
+    Row {
+        spacing: 4
+        anchors { top: board.bottom; horizontalCenter: board.horizontalCenter }
+
+        Button {
+            text: "Hard"
+            onClicked: game.difficulty = 1.0;
+            down: game.difficulty == 1.0
+        }
+        Button {
+            text: "Moderate"
+            onClicked: game.difficulty = 0.8;
+            down: game.difficulty == 0.8
+        }
+        Button {
+            text: "Easy"
+            onClicked: game.difficulty = 0.2;
+            down: game.difficulty == 0.2
+        }
+    }
+
+    Text {
+        id: msg
+
+        anchors.centerIn: parent
+        opacity: 0
+        color: "blue"
+        style: Text.Outline; styleColor: "white"
+        font.pixelSize: 50; font.bold: true
+    }
+}
diff --git a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qmlproject b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/toys.qmlproject b/examples/declarative/toys/toys.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/toys.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/tvtennis/tvtennis.qml b/examples/declarative/toys/tvtennis/tvtennis.qml
new file mode 100644
index 0000000..c90d9c5
--- /dev/null
+++ b/examples/declarative/toys/tvtennis/tvtennis.qml
@@ -0,0 +1,71 @@
+import Qt 4.7
+
+Rectangle {
+    id: page
+    width: 640; height: 480
+    color: "Black"
+
+    // Make a ball to bounce
+    Rectangle {
+        id: ball
+
+        // Add a property for the target y coordinate
+        property int targetY : page.height - 10
+        property variant direction : "right"
+
+        x: 20; width: 20; height: 20; z: 1
+        color: "Lime"
+
+        // Move the ball to the right and back to the left repeatedly
+        SequentialAnimation on x {
+            loops: Animation.Infinite
+            NumberAnimation { to: page.width - 40; duration: 2000 }
+            PropertyAction { target: ball; property: "direction"; value: "left" }
+            NumberAnimation { to: 20; duration: 2000 }
+            PropertyAction { target: ball; property: "direction"; value: "right" }
+        }
+
+        // Make y follow the target y coordinate, with a velocity of 200
+        SpringFollow on y { to: ball.targetY; velocity: 200 }
+
+        // Detect the ball hitting the top or bottom of the view and bounce it
+        onYChanged: {
+            if (y <= 0) {
+                targetY = page.height - 20;
+            } else if (y >= page.height - 20) {
+                targetY = 0;
+            }
+        }
+    }
+
+    // Place bats to the left and right of the view, following the y
+    // coordinates of the ball.
+    Rectangle {
+        id: leftBat
+        color: "Lime"
+        x: 2; width: 20; height: 90
+        SpringFollow on y {
+            to: ball.y - 45; velocity: 300
+            enabled: ball.direction == 'left'
+        }
+    }
+    Rectangle {
+        id: rightBat
+        color: "Lime"
+        x: page.width - 22; width: 20; height: 90
+        SpringFollow on y {
+            to: ball.y-45; velocity: 300
+            enabled: ball.direction == 'right'
+        }
+    }
+
+    // The rest, to make it look realistic, if neither ever scores...
+    Rectangle { color: "Lime"; x: page.width/2-80; y: 0; width: 40; height: 60 }
+    Rectangle { color: "Black"; x: page.width/2-70; y: 10; width: 20; height: 40 }
+    Rectangle { color: "Lime"; x: page.width/2+40; y: 0; width: 40; height: 60 }
+    Rectangle { color: "Black"; x: page.width/2+50; y: 10; width: 20; height: 40 }
+    Repeater {
+        model: page.height / 20
+        Rectangle { color: "Lime"; x: page.width/2-5; y: index * 20; width: 10; height: 10 }
+    }
+}
diff --git a/examples/declarative/toys/tvtennis/tvtennis.qmlproject b/examples/declarative/toys/tvtennis/tvtennis.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/tvtennis/tvtennis.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}
diff --git a/examples/declarative/toys/velocity/Day.qml b/examples/declarative/toys/velocity/Day.qml
new file mode 100644
index 0000000..350c1c4
--- /dev/null
+++ b/examples/declarative/toys/velocity/Day.qml
@@ -0,0 +1,101 @@
+import Qt 4.7
+
+Component {
+    Item {
+        property variant stickies
+
+        id: page
+        width: 840; height: 480
+
+        Image { source: "cork.jpg" }
+
+        Text {
+            text: name; x: 15; y: 8; height: 40; width: 370
+            font.pixelSize: 18; font.bold: true; color: "white"
+            style: Text.Outline; styleColor: "black"
+        }
+
+        Repeater {
+            model: notes
+            Item {
+                id: stickyPage
+
+                property int randomX: Math.random() * 500 + 100
+                property int randomY: Math.random() * 200 + 50
+
+                x: randomX; y: randomY
+
+                SpringFollow on rotation {
+                    to: -flickable.horizontalVelocity / 100
+                    spring: 2.0; damping: 0.15
+                }
+
+                Item {
+                    id: sticky
+                    scale: 0.7
+
+                    Image {
+                        id: stickyImage
+                        x: 8 + -width * 0.6 / 2; y: -20
+                        source: "note-yellow.png"
+                        scale: 0.6; transformOrigin: Item.TopLeft
+                        smooth: true
+                    }
+
+                    TextEdit {
+                        id: myText
+                        x: -104; y: 36; width: 215; height: 200
+                        smooth: true
+                        font.pixelSize: 24
+                        readOnly: false
+                        rotation: -8
+                        text: noteText
+                    }
+
+                    Item {
+                        x: stickyImage.x; y: -20
+                        width: stickyImage.width * stickyImage.scale
+                        height: stickyImage.height * stickyImage.scale
+
+                        MouseArea {
+                            id: mouse
+                            anchors.fill: parent
+                            drag.target: stickyPage
+                            drag.axis: Drag.XandYAxis
+                            drag.minimumY: 0
+                            drag.maximumY: page.height - 80
+                            drag.minimumX: 100
+                            drag.maximumX: page.width - 140
+                            onClicked: { myText.focus = true }
+                        }
+                    }
+                }
+
+                Image {
+                    x: -width / 2; y: -height * 0.5 / 2
+                    source: "tack.png"
+                    scale: 0.7; transformOrigin: Item.TopLeft
+                }
+
+                states: State {
+                    name: "pressed"
+                    when: mouse.pressed
+                    PropertyChanges { target: sticky; rotation: 8; scale: 1 }
+                    PropertyChanges { target: page; z: 8 }
+                }
+
+                transitions: Transition {
+                    NumberAnimation { properties: "rotation,scale"; duration: 200 }
+                }
+            }
+        }
+    }
+}
+
+
+
+
+
+
+
+
diff --git a/examples/declarative/toys/velocity/cork.jpg b/examples/declarative/toys/velocity/cork.jpg
new file mode 100644
index 0000000..160bc00
--- /dev/null
+++ b/examples/declarative/toys/velocity/cork.jpg
diff --git a/examples/declarative/toys/velocity/note-yellow.png b/examples/declarative/toys/velocity/note-yellow.png
new file mode 100644
index 0000000..8ddecc8
--- /dev/null
+++ b/examples/declarative/toys/velocity/note-yellow.png
diff --git a/examples/declarative/toys/velocity/tack.png b/examples/declarative/toys/velocity/tack.png
new file mode 100644
index 0000000..cef2d1c
--- /dev/null
+++ b/examples/declarative/toys/velocity/tack.png
diff --git a/examples/declarative/toys/velocity/velocity.qml b/examples/declarative/toys/velocity/velocity.qml
new file mode 100644
index 0000000..871bafc
--- /dev/null
+++ b/examples/declarative/toys/velocity/velocity.qml
@@ -0,0 +1,75 @@
+import Qt 4.7
+
+Rectangle {
+    width: 800; height: 480
+    color: "#464646"
+
+    ListModel {
+        id: list
+
+        ListElement {
+            name: "Sunday"
+            notes: [ 
+                ListElement { noteText: "Lunch" },
+                ListElement { noteText: "Birthday Party" }
+            ]
+        }
+        
+        ListElement {
+            name: "Monday"
+            notes: [
+                ListElement { noteText: "Pickup kids from\nschool\n4.30pm" },
+                ListElement { noteText: "Checkout Qt" }, ListElement { noteText: "Read email" }
+            ]
+        }
+
+        ListElement {
+            name: "Tuesday"
+            notes: [
+                ListElement { noteText: "Walk dog" },
+                ListElement { noteText: "Buy newspaper" }
+            ]
+        }
+
+        ListElement {
+            name: "Wednesday"
+            notes: [ ListElement { noteText: "Cook dinner" } ]
+        }
+
+        ListElement {
+            name: "Thursday"
+            notes: [
+                ListElement { noteText: "Meeting\n5.30pm" },
+                ListElement { noteText: "Weed garden" }
+            ]
+        }
+
+        ListElement {
+            name: "Friday"
+            notes: [
+                ListElement { noteText: "More work" },
+                ListElement { noteText: "Grocery shopping" }
+            ]
+        }
+
+        ListElement {
+            name: "Saturday"
+            notes: [
+                ListElement { noteText: "Drink" },
+                ListElement { noteText: "Download Qt\nPlay with QML" }
+            ]
+        }
+    }
+
+    ListView {
+        id: flickable
+
+        anchors.fill: parent
+        focus: true
+        highlightRangeMode: ListView.StrictlyEnforceRange
+        orientation: ListView.Horizontal
+        snapMode: ListView.SnapOneItem
+        model: list
+        delegate: Day { }
+    }
+}
diff --git a/examples/declarative/toys/velocity/velocity.qmlproject b/examples/declarative/toys/velocity/velocity.qmlproject
new file mode 100644
index 0000000..d4909f8
--- /dev/null
+++ b/examples/declarative/toys/velocity/velocity.qmlproject
@@ -0,0 +1,16 @@
+import QmlProject 1.0
+
+Project {
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    /* List of plugin directories passed to QML runtime */
+    // importPaths: [ " ../exampleplugin " ]
+}