Doc: update screenshots for QML debugging

Update changed UI strings.

Use button names in text instead of inlineimages.

Change-Id: Ibe9d91ed27c1afc06a3b7b11157e3d5de3979b17
Reviewed-by: Aurindam Jana <aurindam.jana@nokia.com>

24 files changed, 16 insertions, 18 deletions

diff --git a/doc/images/qml-inspector-app-on-top.png b/doc/images/qml-inspector-app-on-top.png
index bc1fe5b0a1..6214a5dbd6 100644
--- a/doc/images/qml-inspector-app-on-top.png
+++ b/doc/images/qml-inspector-app-on-top.png
diff --git a/doc/images/qml-inspector-pause.png b/doc/images/qml-inspector-pause.png
index 1adcb39499..bf2e87c26b 100644
--- a/doc/images/qml-inspector-pause.png
+++ b/doc/images/qml-inspector-pause.png
diff --git a/doc/images/qml-inspector-play.png b/doc/images/qml-inspector-play.png
index 83b71841bc..f5c61b8ea6 100644
--- a/doc/images/qml-inspector-play.png
+++ b/doc/images/qml-inspector-play.png
diff --git a/doc/images/qml-inspector-select-button.png b/doc/images/qml-inspector-select-button.png
index a72c0c11ef..a51a06cf66 100644
--- a/doc/images/qml-inspector-select-button.png
+++ b/doc/images/qml-inspector-select-button.png
diff --git a/doc/images/qml-inspector-step-into.png b/doc/images/qml-inspector-step-into.png
deleted file mode 100644
index b3aaafa3b6..0000000000
--- a/doc/images/qml-inspector-step-into.png
+++ /dev/null
diff --git a/doc/images/qml-link-debugging-library.png b/doc/images/qml-link-debugging-library.png
index 550216817e..cdeb8c7c69 100644
--- a/doc/images/qml-link-debugging-library.png
+++ b/doc/images/qml-link-debugging-library.png
diff --git a/doc/images/qml-observer-bar-copy-color.png b/doc/images/qml-observer-bar-copy-color.png
index 5fed826dc2..d11c67ae0b 100644
--- a/doc/images/qml-observer-bar-copy-color.png
+++ b/doc/images/qml-observer-bar-copy-color.png
diff --git a/doc/images/qml-observer-bar-observe.png b/doc/images/qml-observer-bar-observe.png
index 8189f5e5cf..3e8436dbd5 100644
--- a/doc/images/qml-observer-bar-observe.png
+++ b/doc/images/qml-observer-bar-observe.png
diff --git a/doc/images/qml-observer-bar-reload.png b/doc/images/qml-observer-bar-reload.png
index 482e531af9..3c05180d01 100644
--- a/doc/images/qml-observer-bar-reload.png
+++ b/doc/images/qml-observer-bar-reload.png
diff --git a/doc/images/qml-observer-buttons.png b/doc/images/qml-observer-buttons.png
index 8c4e9f0816..919ff10991 100644
--- a/doc/images/qml-observer-buttons.png
+++ b/doc/images/qml-observer-buttons.png
diff --git a/doc/images/qml-observer-context-menu.png b/doc/images/qml-observer-context-menu.png
index 8eb25e7fca..c7d35b0db3 100644
--- a/doc/images/qml-observer-context-menu.png
+++ b/doc/images/qml-observer-context-menu.png
diff --git a/doc/images/qml-observer-view.png b/doc/images/qml-observer-view.png
index 6fef32c77b..d21dcb33cd 100644
--- a/doc/images/qml-observer-view.png
+++ b/doc/images/qml-observer-view.png
diff --git a/doc/images/qml-script-console.png b/doc/images/qml-script-console.png
index 29751f91fd..589f7437fa 100644
--- a/doc/images/qml-script-console.png
+++ b/doc/images/qml-script-console.png
diff --git a/doc/images/qtcreator-debugging-continue.png b/doc/images/qtcreator-debugging-continue.png
index bb7dc31698..325c91a819 100644
--- a/doc/images/qtcreator-debugging-continue.png
+++ b/doc/images/qtcreator-debugging-continue.png
diff --git a/doc/images/qtquick-example-children.png b/doc/images/qtquick-example-children.png
index 6169de99ab..191bc9903b 100644
--- a/doc/images/qtquick-example-children.png
+++ b/doc/images/qtquick-example-children.png
diff --git a/doc/images/qtquick-example-property-values.png b/doc/images/qtquick-example-property-values.png
index e6ed0bf777..36736e60bb 100644
--- a/doc/images/qtquick-example-property-values.png
+++ b/doc/images/qtquick-example-property-values.png
diff --git a/doc/images/qtquick-example-qml-inspector.png b/doc/images/qtquick-example-qml-inspector.png
index 0569931cd1..f9e901da8f 100644
--- a/doc/images/qtquick-example-qml-inspector.png
+++ b/doc/images/qtquick-example-qml-inspector.png
diff --git a/doc/images/qtquick-example-script-console.png b/doc/images/qtquick-example-script-console.png
index 69e5d15bc6..2e7f7b88e7 100644
--- a/doc/images/qtquick-example-script-console.png
+++ b/doc/images/qtquick-example-script-console.png
diff --git a/doc/images/qtquick-example-setting-breakpoint1.png b/doc/images/qtquick-example-setting-breakpoint1.png
index eb2cf12241..218844fdba 100644
--- a/doc/images/qtquick-example-setting-breakpoint1.png
+++ b/doc/images/qtquick-example-setting-breakpoint1.png
diff --git a/doc/images/qtquick-example-setting-breakpoint2.png b/doc/images/qtquick-example-setting-breakpoint2.png
index 1e6260e006..4e12753910 100644
--- a/doc/images/qtquick-example-setting-breakpoint2.png
+++ b/doc/images/qtquick-example-setting-breakpoint2.png
diff --git a/doc/images/qtquick-example-setting-breakpoint3.png b/doc/images/qtquick-example-setting-breakpoint3.png
index 09a0138e72..4942554ec2 100644
--- a/doc/images/qtquick-example-setting-breakpoint3.png
+++ b/doc/images/qtquick-example-setting-breakpoint3.png
diff --git a/doc/images/qtquick-example-stack.png b/doc/images/qtquick-example-stack.png
index c200845769..f5303f4420 100644
--- a/doc/images/qtquick-example-stack.png
+++ b/doc/images/qtquick-example-stack.png
diff --git a/doc/src/debugger/qtquick-debugger-example.qdoc b/doc/src/debugger/qtquick-debugger-example.qdoc
index 8a0931e6ad..4cdfbe57d0 100644
--- a/doc/src/debugger/qtquick-debugger-example.qdoc
+++ b/doc/src/debugger/qtquick-debugger-example.qdoc
@@ -49,7 +49,7 @@
         \o  To look at the code that starts a new game, place a breakpoint in
             samegame.qml by clicking between the line number and the window
             border on the line where where the \c startNewGame() function is
-            called.
+            called (1).
 
             \image qtquick-example-setting-breakpoint1.png
 
@@ -70,7 +70,7 @@
             \image qtquick-example-setting-breakpoint2.png
 
         \o  Click the
-            \inlineimage qml-inspector-step-into.png
+            \inlineimage qtcreator-debug-button-step-into.png
             (\gui {Step Into}) button on the toolbar or press \key F11 to step
             into the code in the stack. The samegame.js file opens in the code
             editor at the function that starts a new game.
@@ -88,7 +88,7 @@
             \image qtquick-example-setting-breakpoint3.png
 
         \o  To execute JavaScript commands in the current context, select the
-            \gui {QML Script Console} tab.
+            \gui {Console} tab.
 
         \o  To change the score to 1000, enter \c{gameCanvas.score = 1000}
             in the console.
@@ -111,8 +111,8 @@
         \o  Click
             \inlineimage qml-inspector-select-button.png
             (\gui Select) to activate selection mode and then click the
-            \gui {New Game} button to move into the \gui newGameButton component
-            in the \gui {QML Script Console} and the code editor.
+            \gui {Quit} button to move into the \gui ButtonLabel component
+            in the \gui {Console} and the code editor.
 
             \image qtquick-example-property-values.png
 
diff --git a/doc/src/debugger/qtquick-debugging.qdoc b/doc/src/debugger/qtquick-debugging.qdoc
index aaedfc656e..0a5c4e3b85 100644
--- a/doc/src/debugger/qtquick-debugging.qdoc
+++ b/doc/src/debugger/qtquick-debugging.qdoc
@@ -159,10 +159,10 @@
     \section1 Executing JavaScript Expressions
 
     When the application is interrupted by a breakpoint, you can use the
-    \gui {QML Script Console} to execute JavaScript expressions in the current
-    context. To open it, choose \gui {Window > View > QML Script Console}.
+    \gui {Console} to execute JavaScript expressions in the current
+    context. To open it, choose \gui {Window > Views > Console}.
 
-    \image qml-script-console.png "QML Script Console view"
+    \image qml-script-console.png "Console view"
 
     You can type JavaScript expressions and use them to get information about
     the state or your application. You can change property values temporarily,
@@ -174,11 +174,11 @@
 
     If you change property values or add properties in the code editor, the
     debugger can update the properties in the running application when you save
-    the file. This is enabled by default. To disable it, click
+    the file. This is enabled by default. To disable it, click the
     \inlineimage qml-observer-bar-reload.png "Apply Changes on Save button"
-    on the toolbar.
+    (\gui {Apply Changes on Save}) button on the toolbar.
 
-    When you change property values in the \gui {QML Script Console} or
+    When you change property values in the \gui {Console} or
     \gui {QML Inspector}, they are immediately updated in the running
     application, but not in the source code.
 
@@ -249,8 +249,8 @@
     contains zoom controls.
 
     To inspect colors, click the \gui {Color Picker} button. You can also click
-    \inlineimage qml-observer-bar-copy-color.png "Copy Color button"
-    to copy the color definition to the clipboard.
+    \inlineimage qml-observer-bar-copy-color.png "Color Picker button"
+    (\gui {Color Picker}) to copy the color definition to the clipboard.
 
     To switch out of the inspection mode, deselect the \gui Select, \gui Zoom,
     and \gui {Color Picker} button.
@@ -260,14 +260,12 @@
 
     To play and pause animations in the running application, select
     \inlineimage qml-inspector-play.png
-    and
+    (\gui {Play Animations}) and
     \inlineimage qml-inspector-pause.png
-    on the toolbar.
+    (\gui {Pause Animations}) on the toolbar.
 
     To change the speed at which animations are played, click and hold down
-    \inlineimage qml-inspector-play.png
-    or
-    \inlineimage qml-inspector-pause.png
+    \gui {Play/Pause Animations}
     and select a value.
 
 */