Doc: Fixed the syntax of QML code snippets.

6 files changed, 98 insertions, 103 deletions

diff --git a/doc/src/declarative/qdeclarativestates.qdoc b/doc/src/declarative/qdeclarativestates.qdoc
index b663d43a41..69b348b42f 100644
--- a/doc/src/declarative/qdeclarativestates.qdoc
+++ b/doc/src/declarative/qdeclarativestates.qdoc
@@ -71,7 +71,7 @@ of an item, set the \l {Item::}{state} property to the name of the state.
 Non-Item objects can use states through the StateGroup element.
 
 
-\section1 Creating states
+\section1 Creating States
 
 To create a state, add a \l State object to the item's \l {Item::}{states} property,
 which holds a list of states for that item.
@@ -91,7 +91,7 @@ objects, not just the object that owns the state. For example:
 
 \qml
 Rectangle {
-    ...
+    // ...
     states: [
         State {
             name: "moved"
@@ -106,14 +106,7 @@ As a convenience, if an item only has one state, its \l {Item::}{states}
 property can be defined as a single \l State, without the square-brace list
 syntax:
 
-\qml
-Item {
-    ...
-    states: State {
-        ...
-    }
-}
-\endqml
+\snippet doc/src/snippets/declarative/propertyanimation.qml single state
 
 A \l State is not limited to performing modifications on property values. It 
 can also:
@@ -130,7 +123,7 @@ demonstrates how to declare a basic set of states and apply animated
 transitions between them.
 
 
-\section1 The default state
+\section1 The Default State
 
 Of course, the \l Rectangle in the example above could have simply been moved
 by setting its position to (50, 50) in the mouse area's \c onClicked handler.
@@ -146,7 +139,7 @@ like this:
 
 \qml 
 Rectangle {
-    ...
+    // ...
 
     MouseArea {
         id: mouseArea
@@ -154,8 +147,9 @@ Rectangle {
     }
 
     states: State {
-        name: "moved"; when: mouseArea.pressed
-        ...
+        name: "moved"
+        when: mouseArea.pressed
+        // ...
     }
 }
 \endqml 
@@ -171,7 +165,7 @@ using the \l {State::}{when} property, the above code could be changed to:
 
 \qml 
 Rectangle {
-    ...
+    // ...
 
     MouseArea {
         anchors.fill: parent
@@ -181,7 +175,7 @@ Rectangle {
 
     states: State {
         name: "moved"
-        ...
+        // ...
     }
 }
 \endqml 
@@ -191,7 +185,7 @@ as it provides a simpler (and a better, more declarative) solution than
 assigning the state from signal handlers.
 
 
-\section1 Animating state changes
+\section1 Animating State Changes
 
 
 State changes can be easily animated through \l {Transitions}{transitions}. A
@@ -203,12 +197,14 @@ movement of the \l Rectangle would be animated:
 
 \qml
 Rectangle {
-    ...
+    // ...
 
-    MouseArea { ... }
+    MouseArea {
+        // Handle mouse events...
+    }
 
     states: [
-       ...
+       // States are defined here...
     ]
      
     transitions: [
@@ -224,5 +220,4 @@ during a state change within this item, their values should be animated over 500
 milliseconds.
 
 See the \l Transitions documentation for more information.
-
 */
diff --git a/doc/src/snippets/declarative/mousearea/mousearea.qml b/doc/src/snippets/declarative/mousearea/mousearea.qml
index 7cd0a7792e..1dc0598b7f 100644
--- a/doc/src/snippets/declarative/mousearea/mousearea.qml
+++ b/doc/src/snippets/declarative/mousearea/mousearea.qml
@@ -46,74 +46,72 @@ Rectangle {
     width: childrenRect.width
     height: childrenRect.height
 
-Row {
+    Row {
+        //! [intro]
+        Rectangle {
+            width: 100; height: 100
+            color: "green"
 
-//! [intro]
-Rectangle { 
-    width: 100; height: 100
-    color: "green"
-
-    MouseArea { 
-        anchors.fill: parent
-        onClicked: { parent.color = 'red' }
-    }
-}
-//! [intro]
+            MouseArea {
+                anchors.fill: parent
+                onClicked: { parent.color = 'red' }
+            }
+        }
+        //! [intro]
 
-//! [intro-extended]
-Rectangle {
-    width: 100; height: 100
-    color: "green"
+        //! [intro-extended]
+        Rectangle {
+            width: 100; height: 100
+            color: "green"
 
-    MouseArea {
-        anchors.fill: parent
-        acceptedButtons: Qt.LeftButton | Qt.RightButton
-        onClicked: {
-            if (mouse.button == Qt.RightButton)
-                parent.color = 'blue';
-            else
-                parent.color = 'red';
+            MouseArea {
+                anchors.fill: parent
+                acceptedButtons: Qt.LeftButton | Qt.RightButton
+                onClicked: {
+                    if (mouse.button == Qt.RightButton)
+                        parent.color = 'blue';
+                    else
+                        parent.color = 'red';
+                }
+            }
         }
-    }
-}
-//! [intro-extended]
+        //! [intro-extended]
 
-//! [drag]
-Rectangle {
-    id: container
-    width: 600; height: 200
+        //! [drag]
+        Rectangle {
+            id: container
+            width: 600; height: 200
 
-    Rectangle {
-        id: rect
-        width: 50; height: 50
-        color: "red"
-        opacity: (600.0 - rect.x) / 600
+            Rectangle {
+                id: rect
+                width: 50; height: 50
+                color: "red"
+                opacity: (600.0 - rect.x) / 600
 
-        MouseArea {
-            anchors.fill: parent
-            drag.target: rect
-            drag.axis: Drag.XAxis
-            drag.minimumX: 0
-            drag.maximumX: container.width - rect.width
+                MouseArea {
+                    anchors.fill: parent
+                    drag.target: rect
+                    drag.axis: Drag.XAxis
+                    drag.minimumX: 0
+                    drag.maximumX: container.width - rect.width
+                }
+            }
         }
-    }
-}
-//! [drag]
+        //! [drag]
 
-//! [mousebuttons]
-Text {
-    text: mouseArea.pressedButtons & Qt.RightButton ? "right" : ""
-    horizontalAlignment: Text.AlignHCenter
-    verticalAlignment: Text.AlignVCenter
-
-    MouseArea {
-        id: mouseArea
-        anchors.fill: parent
-        acceptedButtons: Qt.LeftButton | Qt.RightButton
-    }
-}
-//! [mousebuttons]
+        //! [mousebuttons]
+        Text {
+            text: mouseArea.pressedButtons & Qt.RightButton ? "right" : ""
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
 
-}
+            MouseArea {
+                id: mouseArea
+                anchors.fill: parent
+                acceptedButtons: Qt.LeftButton | Qt.RightButton
+            }
+        }
+        //! [mousebuttons]
 
+    }
 }
diff --git a/doc/src/snippets/declarative/propertyanimation.qml b/doc/src/snippets/declarative/propertyanimation.qml
index 1f1cbaf206..30eeba8c65 100644
--- a/doc/src/snippets/declarative/propertyanimation.qml
+++ b/doc/src/snippets/declarative/propertyanimation.qml
@@ -48,10 +48,12 @@ Rectangle {
     width: 100; height: 100
     color: "red"
 
+    //! [single state]
     states: State {
         name: "moved"
         PropertyChanges { target: rect; x: 50 }
     }
+    //! [single state]
 
     transitions: Transition { 
         PropertyAnimation { properties: "x,y"; easing.type: Easing.InOutQuad } 
@@ -83,18 +85,16 @@ Rectangle {
 }
 //![propertyvaluesource]
 
-//![standalone]
-Rectangle {
-    id: theRect
-    width: 100; height: 100
-    color: "red"
-
-    // this is a standalone animation, it's not running by default
-    PropertyAnimation { id: animation; target: theRect; property: "width"; to: 30; duration: 500 }
-
-    MouseArea { anchors.fill: parent; onClicked: animation.running = true }
-}
-//![standalone]
+    //![standalone]
+    Rectangle {
+        id: theRect
+        width: 100; height: 100
+        color: "red"
 
+        // this is a standalone animation, it's not running by default
+        PropertyAnimation { id: animation; target: theRect; property: "width"; to: 30; duration: 500 }
 
+        MouseArea { anchors.fill: parent; onClicked: animation.running = true }
+    }
+    //![standalone]
 }
diff --git a/src/declarative/graphicsitems/qdeclarativepathview.cpp b/src/declarative/graphicsitems/qdeclarativepathview.cpp
index 87ea214f6d..29838f6804 100644
--- a/src/declarative/graphicsitems/qdeclarativepathview.cpp
+++ b/src/declarative/graphicsitems/qdeclarativepathview.cpp
@@ -379,14 +379,14 @@ void QDeclarativePathViewPrivate::regenerate()
     \l decrementCurrentIndex() or \l incrementCurrentIndex(), for example to navigate
     using the left and right arrow keys:
 
-    \code
+    \qml
     PathView {
-        ...
+        // ...
         focus: true
         Keys.onLeftPressed: decrementCurrentIndex()
         Keys.onRightPressed: incrementCurrentIndex()
     }
-    \endcode
+    \endqml
 
     The path view itself is a focus scope (see \l{qmlfocus#Acquiring Focus and Focus Scopes}{the focus documentation page} for more details).
 
@@ -437,7 +437,7 @@ QDeclarativePathView::~QDeclarativePathView()
     Component {
         Rectangle {
             visible: PathView.onPath
-            ...
+            // ...
         }
     }
     \endqml
@@ -697,14 +697,14 @@ void QDeclarativePathViewPrivate::setAdjustedOffset(qreal o)
     of the \l{PathView::onPath}{PathView.onPath} attached property to ensure that
     the highlight is hidden when flicked away from the path.
 
-    \code
+    \qml
     Component {
         Rectangle {
             visible: PathView.onPath
-            ...
+            // ...
         }
     }
-    \endcode
+    \endqml
 
     \sa highlightItem, highlightRangeMode
 */
diff --git a/src/declarative/util/qdeclarativeanimation.cpp b/src/declarative/util/qdeclarativeanimation.cpp
index dd7e5fd168..f2c54ab36d 100644
--- a/src/declarative/util/qdeclarativeanimation.cpp
+++ b/src/declarative/util/qdeclarativeanimation.cpp
@@ -672,7 +672,9 @@ QDeclarativeColorAnimation::~QDeclarativeColorAnimation()
 
     \qml
     Item {
-        states: [ ... ]
+        states: [
+            // States are defined here...
+        ]
 
         transition: Transition {
             NumberAnimation { from: "#c0c0c0"; duration: 2000 }
diff --git a/src/declarative/util/qdeclarativeconnections.cpp b/src/declarative/util/qdeclarativeconnections.cpp
index 15e5ac55dd..dbb6f43af3 100644
--- a/src/declarative/util/qdeclarativeconnections.cpp
+++ b/src/declarative/util/qdeclarativeconnections.cpp
@@ -71,8 +71,8 @@ public:
 
 /*!
     \qmlclass Connections QDeclarativeConnections
-  \ingroup qml-utility-elements
-  \since 4.7
+    \ingroup qml-utility-elements
+    \since 4.7
     \brief A Connections element describes generalized connections to signals.
 
     A Connections object creates a connection to a QML signal.
@@ -115,7 +115,7 @@ public:
     MouseArea {
         id: area
     }
-    ...
+    // ...
     Connections {
         target: area
         onClicked: foo(...)