Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui

Conflicts:
	src/declarative/qml/parser/javascriptgrammar.cpp
	src/declarative/qml/parser/javascriptgrammar_p.h

15 files changed, 392 insertions, 0 deletions

diff --git a/demos/declarative/phonebrowser/content/LikeOMeter.qml b/demos/declarative/phonebrowser/content/LikeOMeter.qml
new file mode 100644
index 0000000..31b8195
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/LikeOMeter.qml
@@ -0,0 +1,34 @@
+Item {
+    id: Container
+    properties: Property {
+        name: "rating"
+        value: 2
+    }
+    HorizontalLayout {
+        Star {
+            rating: 0
+            onClicked: { Container.rating = rating }
+            on: Container.rating >= 0
+        }
+        Star {
+            rating: 1
+            onClicked: { Container.rating = rating }
+            on: Container.rating >= 1
+        }
+        Star {
+            rating: 2
+            onClicked: { Container.rating = rating }
+            on: Container.rating >= 2
+        }
+        Star {
+            rating: 3
+            onClicked: { Container.rating = rating }
+            on: Container.rating >= 3
+        }
+        Star {
+            rating: 4
+            onClicked: { Container.rating = rating }
+            on: Container.rating >= 4
+        }
+    }
+}
diff --git a/demos/declarative/phonebrowser/content/MediaButton.qml b/demos/declarative/phonebrowser/content/MediaButton.qml
new file mode 100644
index 0000000..bb2510a
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/MediaButton.qml
@@ -0,0 +1,40 @@
+Item {
+    id: Container
+    signals: Signal {
+        name: "clicked"
+    }
+    properties: Property {
+        name: "text"
+    }
+    Image {
+        id: Image
+        source: "pics/button.png"
+    }
+    Image {
+        id: Pressed
+        source: "pics/button-pressed.png"
+        opacity: 0
+    }
+    MouseRegion {
+        id: MouseRegion
+        anchors.fill: Image
+        onClicked: { Container.clicked.emit(); }
+    }
+    Text {
+        font.bold: true
+        color: "white"
+        anchors.centeredIn: Image
+        text: Container.text
+    }
+    width: Image.width
+    states: [
+        State {
+            name: "Pressed"
+            when: MouseRegion.pressed == true
+            SetProperties {
+                target: Pressed
+                opacity: 1
+            }
+        }
+    ]
+}
diff --git a/demos/declarative/phonebrowser/content/PhoneInfoContainer.qml b/demos/declarative/phonebrowser/content/PhoneInfoContainer.qml
new file mode 100644
index 0000000..da475b1
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/PhoneInfoContainer.qml
@@ -0,0 +1,113 @@
+Flipable {
+    id: Container
+
+    properties: [
+        Property { name: "frontContainer"; value: ContainerFront },
+        Property { name: "flickableArea"; value: Flickable },
+        Property { name: "phoneTitle"; value: "N/A" },
+        Property { name: "phoneDescription"; value: "..." },
+        Property { name: "phoneSpecifications"; value: "" },
+        Property { name: "phoneUrl"; value: "" },
+        Property { name: "rating"; value: 2 }
+    ]
+
+    signals: Signal { name: "closed" }
+
+    axis: Axis { startX: Container.width / 2; endX: Container.width / 2; endY: 1 }
+
+    front: Item {
+        id: ContainerFront; anchors.fill: Container
+
+        Rect {
+            anchors.fill: parent
+            color: "black"; opacity: 0.4
+            pen.color: "white"; pen.width: 2
+        }
+
+        MediaButton {
+            id: BackButton; x: 630; y: 400; text: "Back"
+            onClicked: { Container.closed.emit() }
+        }
+
+        MediaButton {
+            id: MoreButton; x: 530; y: 400; text: "More..."
+            onClicked: { Container.state='Back' }
+        }
+
+        Text {
+            id: TitleText
+            style: Raised; styleColor: "black"
+            color: "white"
+            x: 420; y: 30; width: parent.width
+            text: Container.phoneTitle; font.size: 22
+        }
+
+        LikeOMeter { x: 420; y: 75; rating: Container.rating }
+
+        Flickable {
+            id: Flickable
+            x: 420; width: 280; height: 260; y: 120; clip: true
+            viewportWidth: 280; viewportHeight: DescriptionText.height
+
+            Text {
+                id: DescriptionText
+                wrap: true
+                color: "white"
+                width: parent.width
+                text: Container.phoneDescription
+                font.size: 12
+            }
+        }
+
+        Text {
+            color: "white"; width: 300; x: 50; y: 300
+            text: Container.phoneSpecifications
+        }
+
+        ScrollBar {
+            id: ScrollBar
+            x: 720; y: Flickable.y; width: 7
+            height: Flickable.height; opacity: 0
+            flickableArea: Flickable; clip: true
+        }
+    }
+
+    back: Item {
+        anchors.fill: Container
+
+        Rect {
+            anchors.fill: parent
+            color: "black"
+            opacity: 0.4
+            pen.color: "white"
+            pen.width: 2
+        }
+
+        Flickable {
+            width: Container.width-20
+            height: Container.height-20
+            x: 10; y: 10; clip: true
+            viewportWidth: UrlView.width
+            viewportHeight: UrlView.height
+
+            WebView { id: UrlView; url: Container.phoneUrl; idealWidth: parent.width }
+        }
+
+        MediaButton {
+            id: BackButton2; x: 630; y: 400; text: "Back"; onClicked: { Container.state='' }
+        }
+    }
+
+    states: [
+        State {
+            name: "Back"
+            SetProperty { target: Container; property: "rotation"; value: 180 }
+        }
+    ]
+
+    transitions: [
+        Transition {
+            NumericAnimation { easing: "easeInOutQuad"; properties: "rotation"; duration: 500 }
+        }
+    ]
+}
diff --git a/demos/declarative/phonebrowser/content/PhonesPathView.qml b/demos/declarative/phonebrowser/content/PhonesPathView.qml
new file mode 100644
index 0000000..acef6c3
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/PhonesPathView.qml
@@ -0,0 +1,120 @@
+PathView {
+    id: Container; pathItemCount: 6
+
+    path: Path {
+        startX: -50; startY: 40;
+
+        PathAttribute { name: "scale"; value: 0.2 }
+
+        PathCubic {
+            x: 400; y: 220
+            control1X: 140; control1Y: 40
+            control2X: 210; control2Y: 220
+        }
+
+        PathAttribute { name: "scale"; value: 1.2  }
+        PathAttribute { name: "z"; value: 1 }
+
+        PathCubic {
+            x: 850; y: 40
+            control2X: 660; control2Y: 40
+            control1X: 590; control1Y: 220
+        }
+
+        PathAttribute { name: "scale"; value: 0.2 }
+    }
+
+    delegate: Component {
+        id: PhoneDelegate
+
+        Item {
+            id: Wrapper; width: 320; height: 200
+            scale: Wrapper.PathView.scale; z: Wrapper.PathView.z
+
+            Connection {
+                sender: PhoneInfoContainer; signal: "closed()"
+                script: { if (Wrapper.state == 'Details') Wrapper.state = '' }
+            }
+
+            Script {
+               function phoneClicked() {
+                  if (MainWindow.minimized == true) {
+                     MainWindow.minimized = false;
+                  } else {
+                     PhoneInfoContainer.phoneTitle = title;
+                     PhoneInfoContainer.flickableArea.yPosition = 0;
+                     PhoneInfoContainer.phoneDescription = description;
+                     PhoneInfoContainer.phoneSpecifications = specifications;
+                     PhoneInfoContainer.phoneUrl = url;
+                     PhoneInfoContainer.rating = rating;
+                     Wrapper.state = "Details";
+                  }
+               }
+            }
+
+            Rect {
+                id: Dvd; anchors.fill: parent; color: "white"
+
+                Item {
+                    x: (parent.width-width)/2
+                    y: (parent.height-height)/2
+                    width: Thumb.width*Thumb.scale
+                    height: Thumb.height*Thumb.scale
+
+                    Image {
+                        id: Thumb; source: thumb
+                        scale: 0.95*Math.min(Dvd.height/height,Dvd.width/width)
+                    }
+                }
+
+                Image { source: "pics/shadow-right.png"; x: Dvd.width; height: Dvd.height }
+                Image { source: "pics/shadow-bottom.png"; y: Dvd.height; width: Dvd.width }
+
+                Image {
+                    id: Corner
+                    source: "pics/shadow-corner.png"
+                    x: Dvd.width; y: Dvd.height
+                }
+            }
+
+            MouseRegion { anchors.fill: Wrapper; onClicked: { phoneClicked() } }
+
+            states: [
+                State {
+                    name: "Details"
+                    ParentChange { target: Wrapper; parent: PhoneInfoContainer.frontContainer }
+                    SetProperties { target: Wrapper; x: 50; y: 60; scale: 1 }
+                    SetProperties { target: PhoneInfoContainer; y: 20 }
+                    SetProperties { target: Container; y: "-480" }
+                    SetProperties { target: CloseButton; opacity: 0 }
+                    SetProperties { target: CategoryText; y: "-50" }
+                },
+
+                State {
+                    name: "Stacked"
+                    when: MainWindow.minimized == true
+                    ParentChange { target: Wrapper; parent: Stack }
+                    SetProperties {target: Wrapper; x: 0; y: 0; scale: 0.2 }
+                    SetProperties { target: CloseButton; opacity: 0 }
+                    SetProperties { target: CategoryText; y: "-50" }
+                }
+            ]
+
+            transitions: [
+                Transition {
+                    fromState: ""; toState: "Details,Stacked"
+                    ParentChangeAction { }
+                    NumericAnimation { properties: "x,y,scale,opacity"; duration: 500; easing: "easeInOutQuad" }
+                },
+
+                Transition {
+                    fromState: "Details,Stacked"
+                    toState: ""
+                    ParentChangeAction { }
+                    NumericAnimation { properties: "x,y,scale,opacity"; duration: 500; easing: "easeInOutQuad" }
+                }
+            ]
+
+        }
+    }
+}
diff --git a/demos/declarative/phonebrowser/content/ScrollBar.qml b/demos/declarative/phonebrowser/content/ScrollBar.qml
new file mode 100644
index 0000000..a0f2925
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/ScrollBar.qml
@@ -0,0 +1,38 @@
+Item {
+    id: Container
+    properties: Property {
+        name: "flickableArea"
+    }
+    Rect {
+        radius: 5
+        color: "black"
+        opacity: 0.3
+        pen.color: "white"
+        pen.width: 2
+        x: 0
+        y: flickableArea.pageYPosition * Container.height
+        width: parent.width
+        height: flickableArea.pageHeight * Container.height
+    }
+    states: [
+        State {
+            name: "show"
+            when: flickableArea.moving
+            SetProperties {
+                target: Container
+                opacity: 1
+            }
+        }
+    ]
+    transitions: [
+        Transition {
+            fromState: "*"
+            toState: "*"
+            NumericAnimation {
+                target: Container
+                properties: "opacity"
+                duration: 400
+            }
+        }
+    ]
+}
diff --git a/demos/declarative/phonebrowser/content/Star.qml b/demos/declarative/phonebrowser/content/Star.qml
new file mode 100644
index 0000000..ebcd78b
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/Star.qml
@@ -0,0 +1,47 @@
+Item {
+    id: Container
+    width: 24
+    height: 24
+
+    properties: [
+        Property { name: "rating" },
+        Property { name: "on" }
+    ]
+
+    signals: Signal {
+        name: "clicked"
+    }
+    Image {
+        id: Image
+        source: "pics/ghns_star.png"
+        x: 6
+        y: 7
+        opacity: 0.4
+        scale: 0.5
+    }
+    MouseRegion {
+        anchors.fill: Container
+        onClicked: { Container.clicked.emit() }
+    }
+    states: [
+        State {
+            name: "on"
+            when: Container.on == true
+            SetProperties {
+                target: Image
+                opacity: 1
+                scale: 1
+                x: 1
+                y: 0
+            }
+        }
+    ]
+    transitions: [
+        Transition {
+            NumericAnimation {
+                properties: "opacity,scale,x,y"
+                easing: "easeOutBounce"
+            }
+        }
+    ]
+}
diff --git a/demos/declarative/phonebrowser/content/pics/background.png b/demos/declarative/phonebrowser/content/pics/background.png
new file mode 100644
index 0000000..5b37072
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/background.png
diff --git a/demos/declarative/phonebrowser/content/pics/button-pressed.png b/demos/declarative/phonebrowser/content/pics/button-pressed.png
new file mode 100644
index 0000000..e434d32
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/button-pressed.png
diff --git a/demos/declarative/phonebrowser/content/pics/button.png b/demos/declarative/phonebrowser/content/pics/button.png
new file mode 100644
index 0000000..56a63ce
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/button.png
diff --git a/demos/declarative/phonebrowser/content/pics/ghns_star.png b/demos/declarative/phonebrowser/content/pics/ghns_star.png
new file mode 100644
index 0000000..4ad43cc
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/ghns_star.png
diff --git a/demos/declarative/phonebrowser/content/pics/reflection.png b/demos/declarative/phonebrowser/content/pics/reflection.png
new file mode 100644
index 0000000..c143a48
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/reflection.png
diff --git a/demos/declarative/phonebrowser/content/pics/shadow-bottom.png b/demos/declarative/phonebrowser/content/pics/shadow-bottom.png
new file mode 100644
index 0000000..523f6e7
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/shadow-bottom.png
diff --git a/demos/declarative/phonebrowser/content/pics/shadow-corner.png b/demos/declarative/phonebrowser/content/pics/shadow-corner.png
new file mode 100644
index 0000000..ef8c856
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/shadow-corner.png
diff --git a/demos/declarative/phonebrowser/content/pics/shadow-right-screen.png b/demos/declarative/phonebrowser/content/pics/shadow-right-screen.png
new file mode 100644
index 0000000..9856c4f
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/shadow-right-screen.png
diff --git a/demos/declarative/phonebrowser/content/pics/shadow-right.png b/demos/declarative/phonebrowser/content/pics/shadow-right.png
new file mode 100644
index 0000000..f534a35
--- /dev/null
+++ b/demos/declarative/phonebrowser/content/pics/shadow-right.png