summaryrefslogtreecommitdiff
path: root/examples/webchannel/chatclient-qml/qmlchatclient.qml
diff options
context:
space:
mode:
authorBernd Lamecker <bernd.lamecker@basyskom.com>2014-09-17 15:30:36 +0200
committerMilian Wolff <milian.wolff@kdab.com>2014-10-16 12:33:23 +0200
commitd9845c2ae3c78085aa8e978e436c94c95998bc99 (patch)
tree00c5feb898e2d1bbcd98339714fcb763f8f805ab /examples/webchannel/chatclient-qml/qmlchatclient.qml
parente8c280a15f7822fa5a563388615313858fd90848 (diff)
downloadqtwebchannel-d9845c2ae3c78085aa8e978e436c94c95998bc99.tar.gz
Added some more examples
Implemented a C++ Server, providing a chatservice through a simple QObject using QWebChannel and also both a QML and HTML Client to interact with the server. The examples show how to use properties, signals and methods, separated in server and clients. This reverts commit e8c280a15f7822fa5a563388615313858fd90848. The integration issues w.r.t. unconditional usage of the websockets module have been resolved. Change-Id: I4a07646dcd5e6050d3bd6b9bd1c5b07dbc7d7d69 Reviewed-by: Milian Wolff <milian.wolff@kdab.com>
Diffstat (limited to 'examples/webchannel/chatclient-qml/qmlchatclient.qml')
-rw-r--r--examples/webchannel/chatclient-qml/qmlchatclient.qml173
1 files changed, 173 insertions, 0 deletions
diff --git a/examples/webchannel/chatclient-qml/qmlchatclient.qml b/examples/webchannel/chatclient-qml/qmlchatclient.qml
new file mode 100644
index 0000000..7ecd15c
--- /dev/null
+++ b/examples/webchannel/chatclient-qml/qmlchatclient.qml
@@ -0,0 +1,173 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc and/or its subsidiary(-ies).
+** Copyright (C) 2014 basysKom GmbH, author Bernd Lamecker <bernd.lamecker@basyskom.com>
+** Contact: http://www.qt-project.org/legal
+**
+** This file is part of the QtWebChannel module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL21$
+** 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 Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 2.1 or version 3 as published by the Free
+** Software Foundation and appearing in the file LICENSE.LGPLv21 and
+** LICENSE.LGPLv3 included in the packaging of this file. Please review the
+** following information to ensure the GNU Lesser General Public License
+** requirements will be met: https://www.gnu.org/licenses/lgpl.html and
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Digia gives you certain additional
+** rights. These rights are described in the Digia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.2
+import QtQuick.Controls 1.1
+import QtQuick.Window 2.0
+import QtQuick.Layouts 1.1
+import Qt.WebSockets 1.0
+import "qwebchannel.js" as WebChannel
+
+ApplicationWindow {
+ id: root
+ title: qsTr("Hello World")
+ width: 640
+ height: 480
+
+ property var channel;
+
+ WebSocket {
+ id: socket
+
+ url: "ws://localhost:12345";
+ active: false
+
+ // the following three properties/functions are required to align the QML WebSocket API with the HTML5 WebSocket API.
+ property var send: function (arg) {
+ sendTextMessage(arg);
+ }
+
+ onTextMessageReceived: {
+ onmessage({data: message});
+ }
+ property var onmessage;
+
+ onStatusChanged: if (socket.status == WebSocket.Error) {
+ console.error("Error: " + socket.errorString)
+ } else if (socket.status == WebSocket.Closed) {
+ messageBox.text += "\nSocket closed"
+ } else if (socket.status == WebSocket.Open) {
+ //open the webchannel with the socket as transport
+ new WebChannel.QWebChannel(socket, function(ch) {
+ root.channel = ch;
+
+ //connect to the changed signal of the userList property
+ ch.objects.chatserver.userListChanged.connect(function(args) {
+ userlist.text = '';
+ ch.objects.chatserver.userList.forEach(function(user) {
+ userlist.text += user + '\n';
+ });
+ });
+ //connect to the newMessage signal
+ ch.objects.chatserver.newMessage.connect(function(time, user, message) {
+ chat.text = chat.text + "[" + time + "] " + user + ": " + message + '\n';
+ });
+ //connect to the keep alive signal
+ ch.objects.chatserver.keepAlive.connect(function(args) {
+ if (loginName.text !== '')
+ //and call the keep alive response method as an answer
+ ch.objects.chatserver.keepAliveResponse(loginName.text)
+ });
+ });
+ }
+ }
+
+ GridLayout {
+ id: grid
+ columns: 2
+ anchors.fill: parent
+ Text {
+ id: chat
+ text: ""
+ Layout.fillHeight: true
+ Layout.fillWidth: true
+ }
+
+ Text {
+ id: userlist
+ text: ""
+ width: 150
+ Layout.fillHeight: true
+ }
+ TextField {
+ id: message
+ height: 50
+ Layout.columnSpan: 2
+ Layout.fillWidth: true
+
+ onEditingFinished: {
+ if (message.text.length)
+ //call the sendMessage method to send the message
+ root.channel.objects.chatserver.sendMessage(loginName.text, message.text);
+ message.text = '';
+ }
+ }
+ }
+
+
+ Window {
+ id: loginWindow;
+ title: "Login";
+ modality: Qt.ApplicationModal
+
+ TextField {
+ id: loginName
+
+ anchors.top: parent.top
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+ Button {
+ anchors.top: loginName.bottom
+ anchors.horizontalCenter: parent.horizontalCenter
+ id: loginButton
+ text: "Login"
+
+ onClicked: {
+ //call the login method
+ root.channel.objects.chatserver.login(loginName.text, function(arg) {
+ //check the return value for success
+ if (arg === true) {
+ loginError.visible = false;
+ loginWindow.close();
+ } else {
+ loginError.visible = true;
+ }
+ });
+
+ }
+ }
+ Text {
+ id: loginError
+ anchors.top: loginButton.bottom
+ anchors.horizontalCenter: parent.horizontalCenter
+ text: "Name already in use"
+ visible: false;
+ }
+ }
+
+ Component.onCompleted: {
+ loginWindow.show();
+ socket.active = true; //connect
+ }
+}