summaryrefslogtreecommitdiff
path: root/examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc
diff options
context:
space:
mode:
authorVenugopal Shivashankar <venugopal.shivashankar@digia.com>2012-12-11 18:15:48 +0100
committerThe Qt Project <gerrit-noreply@qt-project.org>2012-12-12 18:26:45 +0100
commita2d8aa1b462b709c9a18292eb57971eaaeb18dbe (patch)
treea7f8941dc990f712e54750ff14d73cff2b2b32a5 /examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc
parente88665589b06aa0d87a5185cc780ed767cff0f70 (diff)
downloadqtwebkit-examples-a2d8aa1b462b709c9a18292eb57971eaaeb18dbe.tar.gz
Doc: Added documentation for the WebKit Widget examples
- Moved the qdoc files from the qtdoc repository - Added group pages for QML and QWidget-based examples - Added an index page - Updated the qhp details in the qdocconf Change-Id: I5f79fb1aedbfc3bcb42c84ac774ea1c4bd3a9036 Reviewed-by: Jerome Pasion <jerome.pasion@digia.com>
Diffstat (limited to 'examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc')
-rw-r--r--examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc162
1 files changed, 162 insertions, 0 deletions
diff --git a/examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc b/examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc
new file mode 100644
index 0000000..44ce91c
--- /dev/null
+++ b/examples/webkitwidgets/imageanalyzer/doc/src/webkit-bridge-imageanalyzer.qdoc
@@ -0,0 +1,162 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Digia Plc and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/legal
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia. For licensing terms and
+** conditions see http://qt.digia.com/licensing. For further information
+** use the contact form at http://qt.digia.com/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: http://www.gnu.org/copyleft/fdl.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+/*!
+ \example webkit/imageanalyzer
+ \title The Webkit Bridge Tutorial - Hybrid Client Application
+ \brief Demonstrates how to integrate web functionality with other core
+ functionality.
+ \ingroup webkit-widgetexamples
+
+ In this example, we will show how to write a hybrid application using
+\l{The QtWebKit Bridge}{QtWebKit Bridge}, which distinguishes itself from a
+thin client in that it performs heavy calculations on the client side in C++,
+like a native application, but presents nothing more than a \c QWebView for its
+user interface, displaying web content written in HTML/JavaScript. The
+application uses QtConcurrent to distribute its work across as many CPU cores as
+are available from the system, so it can process each image in parallel.
+
+For the full reference documentation of QtWebKit hybrid development, see
+\l{qtwebkit-bridge.html}{The QtWebKit Bridge}.
+
+Initially, you will see a user interface with an empty list of images. Clicking
+on some of the images in the lower pane below adds them to the list view above,
+as shown in the screenshot below.
+
+ \image webkit-imageanalyzer-screenshot.png
+
+Now, we can click on \b Analyze, and each image is analyzed using some
+computationally intensive C++ function, in parallel and on different cores.
+Progress is shown while the analysis is proceeding.
+
+ \image webkit-imageanalyzer-progress.png
+
+and in the end, we will see something like this, where the average RGB values of
+each image are shown.
+
+ \image webkit-imageanalyzer-complete.png
+
+The MainWindow is defined in C++, and creates a \l QNetworkDiskCache and a
+\l QWebView, and tells the \l QWebView to load the starting page, providing us
+with a user interface for the client.
+
+ \snippet webkit/imageanalyzer/mainwindow.cpp MainWindow - constructor
+
+In this example, the sample content is addressed with the \tt qrc:/index.html
+URL. \tt qrc:/ indicates that the file is stored as a Qt resource (attached to
+the executable). In a real-world application, the content and images would
+likely be retrieved from the network rather than from resources.
+
+We wish to initialize an object reference in the JavaScript web page to point
+to our \tt ImageAnalyzer before any other scripts are run. To do this, we
+connect the \l{QWebFrame::}{javaScriptWindowObjectCleared()} signal to a slot
+which does the object creation and handoff to JavaScript.
+
+ \snippet webkit/imageanalyzer/mainwindow.cpp MainWindow - addJSObject
+
+The ImageAnalyzer object is created and added to a JavaScript object on the web
+page's mainFrame with \c addToJavaScriptWindowObject().
+
+ The start page is resources/index.html.
+ In one of its <div> regions, we have images, each
+ with an \c onClick() handler that calls \c addImage().
+
+ \snippet webkit/imageanalyzer/resources/index.html sample images
+
+Clicking an image adds it to an images list.
+
+ \snippet webkit/imageanalyzer/resources/index.html addImage
+
+The \b {Analyze} button at the bottom of the image list is clicked when we
+want to start the analysis:
+
+ \snippet webkit/imageanalyzer/resources/index.html images list
+
+When the user clicks the \b {Analyze} button, \c analyzeImages() is called,
+another regular JavaScript method, shown below.
+Notice it assumes the \c imageAnalyzer object is already defined and initialized
+in JavaScript space, but we guaranteed that by connecting our setup slot to the
+appropriate signal, \l{QWebFrame::}{javaScriptWindowObjectCleared()}.
+
+ \snippet webkit/imageanalyzer/resources/index.html analyzeImages
+
+The only methods on \c ImageAnalyzer that we can or do call from JavaScript are
+those which are exposed through \{The Meta-Object System}{Qt's MetaObject}
+system: \l{The Property System}{property} getter/setter methods,
+\c public \l {Signals & Slots}{signals and slots}, and other
+\l{Q_INVOKABLE}{Q_INVOKABLE} functions.
+
+\snippet webkit/imageanalyzer/imageanalyzer.h ImageAnalyzer - public interface
+\dots
+\snippet webkit/imageanalyzer/imageanalyzer.h ImageAnalyzer - private members
+
+Most of the members are set up in the constructor:
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - Constructor
+
+Back on the JavaScript side, we want to connect signals from this object to
+JavaScript functions on our web page, after the web page is loaded, but before
+the images are analyzed.
+
+From \c connectSlots(), we can see how to connect signals from the imageAnalyzer
+object to regular JavaScript functions, which can also behave like slots. We use
+this to monitor and display progress from the C++ side.
+
+ \snippet webkit/imageanalyzer/resources/index.html connect slots
+
+The only public slot is \c startAnalysis(), called to place
+a list of URLs into the image analyzer's QtConcurrent processing queue
+from JavaScript space.
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - startAnalysis
+
+The images need to be loaded again now, which is why fetchURLs first checks the
+cache to see if we can save an extra network get.
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - fetchURLs
+
+For the images that were not in the cache, \c handleReply()
+will load them into a QImage when the data is ready.
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - handleReply
+
+After the images are loaded, they are queued up in preparation to be
+sent in a batch for analysis to a \l QFutureWatcher, which will distribute the
+processing across multiple threads and cores, depending on how many are available.
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - queueImage
+
+The function that gets performed on each image is \c averageRGB(),
+as specified in argument 2 to the \l{QtConcurrent::mapped()} function.
+Notice it repeats the same calculations 100 times on each pixel to keep the CPU
+very busy. This is done only for the purposes of the demo so that the analysis
+takes a noticeable time to complete.
+
+\snippet webkit/imageanalyzer/imageanalyzer.cpp ImageAnalyzer - averageRGB
+
+*/
+