Documentation for QML Live example app

Change-Id: I96d798791ccfdb581c7c4b80bfd55fc8327448ef
Fixes: AUTOSUITE-777
Reviewed-by: Kavindra Palaraja <kpalaraja@luxoft.com>

11 files changed, 42 insertions, 89 deletions

diff --git a/doc/examples.qdoc b/doc/examples.qdoc
index c13b2f1..04eb651 100644
--- a/doc/examples.qdoc
+++ b/doc/examples.qdoc
@@ -37,6 +37,7 @@
 
    \list
     \li \l{contentplugin}{Content Plugin}
+    \li \l{customruntime}{Custom Runtime}
    \endlist
 
 */
diff --git a/examples/app/qml/window.qml b/doc/examples/customruntime.qdoc
index 2600e26..fdd2e2f 100644
--- a/examples/app/qml/window.qml
+++ b/doc/examples/customruntime.qdoc
@@ -1,7 +1,6 @@
 /****************************************************************************
 **
 ** Copyright (C) 2019 Luxoft Sweden AB
-** Copyright (C) 2018 Pelagicore AG
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the QmlLive tool.
@@ -29,36 +28,39 @@
 ** SPDX-License-Identifier: GPL-3.0
 **
 ****************************************************************************/
+/*!
+\example customruntime
+\title Custom Runtime Example
 
-import QtQuick 2.0
-import QtQuick.Window 2.2
+\brief Demonstrates how to create a Custom QmlLive Runtime
 
-Window {
-    id: window
-    width: 100
-    height: 100
-    visible: true
+\image customruntime-example.png Screenshot of the Custom QmlLive Runtime
 
-    ListView {
-        // TODO: Make it work with 'anchors.fill: parent'. Window size seems to
-        // be propagated too late to the contentItem, giving zero size initially.
-        width: window.width
-        height: window.height
+Creating a custom runtime with QmlLive features allows you to use your QML
+view setup, combined with additional C++ code and the QmlLive system.
 
-        model: ["red", "green", "blue", "black"]
-        delegate: Rectangle {
-            width: ListView.view.width
-            height: 25
-            color: model.modelData
-            Image {
-                anchors.left: parent.left
-                source: "../icon.png"
-            }
-            Text {
-                x: 25
-                text: model.modelData
-                color: "white"
-            }
-        }
-    }
-}
+Start with the \l LiveNodeEngine class. We need to modify this class to be
+able to receive workspace changes and active document updates. By default,
+the IPC listens to port 10234.
+
+The code snippet below shows a minimal custom QmlLive runtime:
+
+\snippet customruntime/main.cpp 0
+
+To specify project depedencies on platforms that support \c pkg-config,
+add the following line to your project file. This is assuming QmlLive is
+installed on your build host:
+
+\code
+CONFIG += link_pkgconfig
+PKGCONFIG += qmllive
+\endcode
+
+In case if your system doesn't support \c pkg-config, to compile everything
+directly into your application, include file \c{$(QMLLIVEPROJECT)/src/src.pri}
+by adding the line into your project file:
+
+\code
+include(src.pri)
+\endcode
+*/
diff --git a/doc/images/customruntime-example.png b/doc/images/customruntime-example.png
new file mode 100644
index 0000000..d5aba33
--- /dev/null
+++ b/doc/images/customruntime-example.png
diff --git a/doc/usage.qdoc b/doc/usage.qdoc
index ff4eeef..1fa6d17 100644
--- a/doc/usage.qdoc
+++ b/doc/usage.qdoc
@@ -184,7 +184,7 @@ on the port 10234.
 
 Here is a short example of a minimal custom QmlLive runtime:
 
-\snippet ../examples/app/main.cpp 0
+\snippet ../examples/customruntime/main.cpp 0
 
 On platforms where pkg-config is supported simply add the following to your
 project file if QmlLive is installed on your build host:
diff --git a/examples/app/qml/item.qml b/examples/app/qml/item.qml
deleted file mode 100644
index 85258c1..0000000
--- a/examples/app/qml/item.qml
+++ /dev/null
@@ -1,54 +0,0 @@
-/****************************************************************************
-**
-** Copyright (C) 2019 Luxoft Sweden AB
-** Copyright (C) 2018 Pelagicore AG
-** Contact: https://www.qt.io/licensing/
-**
-** This file is part of the QmlLive tool.
-**
-** $QT_BEGIN_LICENSE:GPL-QTAS$
-** Commercial License Usage
-** Licensees holding valid commercial Qt Automotive Suite 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 The Qt Company.  For
-** licensing terms and conditions see https://www.qt.io/terms-conditions.
-** For further information use the contact form at https://www.qt.io/contact-us.
-**
-** GNU General Public License Usage
-** Alternatively, this file may be used under the terms of the GNU
-** General Public License version 3 or (at your option) any later version
-** approved by the KDE Free Qt Foundation. The licenses are as published by
-** the Free Software Foundation and appearing in the file LICENSE.GPL3
-** included in the packaging of this file. Please review the following
-** information to ensure the GNU General Public License requirements will
-** be met: https://www.gnu.org/licenses/gpl-3.0.html.
-**
-** $QT_END_LICENSE$
-**
-** SPDX-License-Identifier: GPL-3.0
-**
-****************************************************************************/
-
-import QtQuick 2.0
-
-ListView {
-    width: 100
-    height: 100
-
-    model: ["red", "green", "blue", "black"]
-    delegate: Rectangle {
-        width: ListView.view.width
-        height: 25
-        color: model.modelData
-        Image {
-            anchors.left: parent.left
-            source: "../icon.png"
-        }
-        Text {
-            x: 25
-            text: model.modelData
-            color: "white"
-        }
-    }
-}
diff --git a/examples/app/app.pro b/examples/customruntime/customruntime.pro
index bb53fb3..90920fb 100644
--- a/examples/app/app.pro
+++ b/examples/customruntime/customruntime.pro
@@ -1,5 +1,5 @@
 TEMPLATE = app
-TARGET = app
+TARGET = customruntime
 CONFIG += c++11
 
 macx*: CONFIG -= app_bundle
@@ -9,7 +9,7 @@ include(../../src/lib.pri)
 
 SOURCES += main.cpp
 
-target.path = $$EXAMPLES_PREFIX/app
+target.path = $$EXAMPLES_PREFIX/customruntime
 INSTALLS += target
 
 qml.files = qml/*.qml
diff --git a/examples/app/icon.png b/examples/customruntime/icon.png
index 1bf2581..1bf2581 100644
--- a/examples/app/icon.png
+++ b/examples/customruntime/icon.png
diff --git a/examples/app/main.cpp b/examples/customruntime/main.cpp
index 9ddf336..1050432 100644
--- a/examples/app/main.cpp
+++ b/examples/customruntime/main.cpp
@@ -55,7 +55,7 @@ public:
 int main(int argc, char **argv)
 {
     QGuiApplication app(argc, argv);
-    MyQmlApplicationEngine engine(QStringLiteral("qml/window.qml"));
+    MyQmlApplicationEngine engine(QStringLiteral("qml/customruntime-window.qml"));
 
     if (!qEnvironmentVariableIsSet("MY_APP_ENABLE_QMLLIVE"))
         return app.exec();
diff --git a/examples/app/qml/customruntime-item.qml b/examples/customruntime/qml/customruntime-item.qml
index 68e4303..942a5af 100644
--- a/examples/app/qml/customruntime-item.qml
+++ b/examples/customruntime/qml/customruntime-item.qml
@@ -30,6 +30,7 @@
 **
 ****************************************************************************/
 
+//! [1]
 import QtQuick 2.0
 
 ListView {
@@ -52,3 +53,4 @@ ListView {
         }
     }
 }
+//! [1]
diff --git a/examples/app/qml/customruntime-window.qml b/examples/customruntime/qml/customruntime-window.qml
index 4818a04..a722f16 100644
--- a/examples/app/qml/customruntime-window.qml
+++ b/examples/customruntime/qml/customruntime-window.qml
@@ -30,6 +30,7 @@
 **
 ****************************************************************************/
 
+//! [2]
 import QtQuick 2.0
 import QtQuick.Window 2.2
 
@@ -62,3 +63,4 @@ Window {
         }
     }
 }
+//! [2]
diff --git a/examples/examples.pro b/examples/examples.pro
index 727afa9..6e28f9a 100644
--- a/examples/examples.pro
+++ b/examples/examples.pro
@@ -1,4 +1,4 @@
 TEMPLATE = subdirs
-SUBDIRS += app \
+SUBDIRS += customruntime \
            contentplugin