Revamp WebSockets example

Fix a warning, expand the documentation, and add a picture to it.

Task-number: QTBUG-112850
Pick-to: 6.5 6.6
Change-Id: I203392a95bef206fecc2777d060e215d95235296
Reviewed-by: Alex Blasche <alexander.blasche@qt.io>

1 files changed, 57 insertions, 2 deletions

diff --git a/examples/remoteobjects/websockets/doc/src/websocket.qdoc b/examples/remoteobjects/websockets/doc/src/websocket.qdoc
index a1a3c91..a18a9fb 100644
--- a/examples/remoteobjects/websockets/doc/src/websocket.qdoc
+++ b/examples/remoteobjects/websockets/doc/src/websocket.qdoc
@@ -3,10 +3,65 @@
 
 /*!
     \example websockets
-    \title QtRemoteObjects WebSockets Example
+    \title QtRemoteObjects WebSockets Applications
     \brief Using a non-QIODevice-based transport (QWebSocket) with QtRemoteObjects.
+    \examplecategory {Input/Output}
+    \meta tag {rpc,network,websockets}
     \ingroup qtremoteobjects-examples
 
-    This is achieved by implementing a small QIODevice-derived wrapper for QWebSocket.
+    This example shares a \c QStandardItemModel over a web socket. The model
+    can be edited in the window of the \c wsserver application, and the
+    changes are propagated to the window of the \c wsclient application.
 
+    This is made possible by implementing a small QIODevice-derived wrapper,
+    \c WebSocketIoDevice, for \c QWebSocket. SSL is used if Qt is compiled
+    with support for it.
+
+    \image StandardItemTableWindow.webp
+
+    \section1 The WsServer Application
+
+    The \c wsserver application creates a \c QStandardItemModel with two
+    columns and inserts data into it.
+
+    \snippet websockets/wsserver/main.cpp 0
+
+    It then starts a \c QWebSocketServer bound to port 8088, and hosts the
+    data model.
+
+    \snippet websockets/wsserver/main.cpp 1
+
+    When handling new connections, SSL is configured if Qt is compiled
+    with support for it. Then a \c WebSocketIoDevice is created using the
+    incoming WebSocketServer connection.
+
+    \snippet websockets/wsserver/main.cpp 2
+
+    A QTreeView is created with the QStandardItemModel as model.
+    Then multiple timers are started with QTimer::singleShot to perform
+    more modifications to the model.
+
+    \snippet websockets/wsserver/main.cpp 3
+
+    \section1 The WsClient Application
+
+    The \c wsclient application creates a QWebSocket and a
+    \c WebSocketIoDevice taking it as an argument.
+
+    \snippet websockets/wsclient/main.cpp 0
+
+    If Qt is compiled with support for SSL, the client is configured with it.
+
+    \snippet websockets/wsclient/main.cpp 1
+
+    Then a QRemoteObjectNode is created, and setup to use the
+    WebSocketIoDevice. Then it connects to \c wsserver.
+
+    \snippet websockets/wsclient/main.cpp 2
+
+    A QTreeView is created to display the data from the server. The model is
+    acquired from the node, and it is then set as the model of the
+    QTreeView, which is then shown.
+
+    \snippet websockets/wsclient/main.cpp 3
 */