Merge branch 'us11-gui-layout' into 'master'

US11: GUI-Layout

See merge request tobias.wach/ccats!7

cli/src/commands.cpp

@@ -1,19 +1,18 @@
 #include "../include/commands.hpp"
 
-CMD
-    commands[]{
-        {CMD_HELP, "help", "show help"},
-        {CMD_STATUS, "status", "query status of IP"},
-        {CMD_DISCONNECT, "disconnect", "disconnect from IP"},
+CMD commands[]{
+    {CMD_HELP, "help", "show help"},
+    {CMD_STATUS, "status", "query status of IP"},
+    {CMD_DISCONNECT, "disconnect", "disconnect from IP"},
 
-        /* TODO
-        {CMD_PUT	, "put", "upload file to IP and add to queue"},
-        {CMD_REMOVE	, "remove", "remove file from IP and queue (stops xfer
-        if required)"}, {CMD_GET	, "get", "retrieve file from IP"},
-        {CMD_SETUP	, "setup", "configure server at IP"},
-        {CMD_LOG	, "log", "show log from IP"}
-        */
-    };
+    /* TODO
+    {CMD_PUT	, "put", "upload file to IP and add to queue"},
+    {CMD_REMOVE	, "remove", "remove file from IP and queue (stops xfer
+    if required)"}, {CMD_GET	, "get", "retrieve file from IP"},
+    {CMD_SETUP	, "setup", "configure server at IP"},
+    {CMD_LOG	, "log", "show log from IP"}
+    */
+};
 
 COMMANDID getCmdIdFromString(const char *str) {
   COMMANDID ret = CMD_UNKNOWN;

gui/src/FooterForm.ui.qml

@@ -0,0 +1,52 @@
+import QtQuick 2.4
+import QtQuick.Controls 2.4
+import QtQuick.Layouts 1.3
+
+Page {
+    width: 1280
+    height: 200
+
+    Connections {
+        target: _qmlHandler
+        onLog: {
+            footerLog.append(logText)
+            footerFlickable.contentY = footerLog.height - footerFlickable.height
+        }
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        color: "#404040"
+
+        ColumnLayout {
+            anchors.fill: parent
+
+            Text {
+                id: footerStatusText
+                height: 30
+                color: "#ffffff"
+                text: qsTr("Status: Connected to foobar")
+                font.pixelSize: 23
+                Layout.preferredHeight: 30
+                Layout.preferredWidth: parent.width
+            }
+
+            Flickable {
+                id: footerFlickable
+                flickableDirection: Flickable.VerticalFlick
+                Layout.preferredHeight: 170
+                Layout.preferredWidth: parent.width
+
+                TextArea.flickable: TextArea {
+                    id: footerLog
+                    wrapMode: TextArea.Wrap
+                    text: qsTr("Log goes here\nNew Line works as well")
+                    font.pointSize: 15
+                }
+
+                ScrollBar.vertical: ScrollBar {
+                }
+            }
+        }
+    }
+}

gui/src/HelpForm.ui.qml

@@ -0,0 +1,20 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.5
+
+Page {
+    width: 1280
+    height: 470
+
+    Text {
+        id: helpPlaceholder
+        x: 220
+        y: 135
+        width: 840
+        height: 200
+        color: "#ffffff"
+        text: qsTr("Tons of useful information goes here")
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        font.pixelSize: 40
+    }
+}

gui/src/IpPopupForm.ui.qml

@@ -0,0 +1,64 @@
+import QtQuick 2.4
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+
+Popup {
+    id: popup
+    height: 200
+    dim: true
+    clip: false
+    width: 400
+    modal: true
+    focus: true
+    closePolicy: Popup.NoAutoClose
+
+    ColumnLayout {
+        anchors.fill: parent
+
+        Text {
+            Layout.alignment: Qt.AlignCenter
+            id: popupText
+            color: "#ffffff"
+            text: qsTr("Enter the IP to connect:")
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            font.pixelSize: 20
+        }
+
+        TextField {
+            Layout.alignment: Qt.AlignCenter
+            id: popupIpInput
+            text: qsTr("")
+            placeholderText: "Enter IP"
+            horizontalAlignment: Text.AlignHCenter
+            validator: RegExpValidator {
+                regExp: /^(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))$/
+            }
+        }
+
+        Text {
+            id: popupStatusText
+            color: "#df3f3f"
+            text: qsTr("Text field for status")
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            Layout.alignment: Qt.AlignCenter
+            font.pixelSize: 20
+        }
+
+        Button {
+            Layout.alignment: Qt.AlignCenter
+            id: popupConnectButton
+            text: qsTr("Connect")
+            enabled: popupIpInput.acceptableInput
+            font.pointSize: 16
+            // @disable-check M223
+            onClicked: {
+                // @disable-check M222
+                _qmlHandler.onIpPopupEnterIp(popupIpInput.text)
+                // @disable-check M222
+                popup.close()
+            }
+        }
+    }
+}

gui/src/MessagesForm.ui.qml

@@ -0,0 +1,66 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.5
+import QtQuick.Layouts 1.3
+
+Page {
+    width: 1280
+    height: 470
+
+    font.capitalization: Font.MixedCase
+
+    Connections {
+        target: _qmlHandler
+        onMessage: {
+            messagesLog.append(msg)
+            messagesFlickable.contentY = messagesLog.height - messagesFlickable.height
+        }
+    }
+
+    ColumnLayout {
+        anchors.fill: parent
+
+        Flickable {
+            id: messagesFlickable
+            flickableDirection: Flickable.VerticalFlick
+            Layout.preferredHeight: 400
+            Layout.preferredWidth: parent.width
+
+            TextArea.flickable: TextArea {
+                id: messagesLog
+                wrapMode: TextArea.Wrap
+                text: qsTr("Messages go here\nNew Line works as well")
+                font.pointSize: 15
+            }
+
+            ScrollBar.vertical: ScrollBar {
+            }
+        }
+
+        RowLayout {
+            Layout.preferredHeight: 70
+            Layout.preferredWidth: parent.width
+
+            TextField {
+                id: messagesInputField
+                Layout.preferredWidth: 1060
+                Layout.preferredHeight: parent.height
+                placeholderText: "Enter message..."
+                text: qsTr("")
+                font.pixelSize: 20
+            }
+
+            Button {
+                id: messagesSendButton
+                Layout.preferredWidth: 180
+                Layout.preferredHeight: parent.height
+                text: qsTr("Send")
+
+                // @disable-check M223
+                onClicked: {
+                    // @disable-check M222
+                    _qmlHandler.onMessagesSendButton(messagesInputField.text)
+                }
+            }
+        }
+    }
+}

gui/src/ReceivingForm.ui.qml

@@ -3,26 +3,14 @@ import QtQuick.Controls 2.5
 
 Page {
     width: 1280
-    height: 670
-    title: "Receiving"
+    height: 470
 
-    Label {
-        color: "#000000"
-        text: "This is where the UI for receiving files goes."
-        font.pointSize: 30
-        anchors.verticalCenterOffset: 1
-        anchors.horizontalCenterOffset: 1
-        z: 3
-        anchors.centerIn: parent
-    }
-
-    Rectangle {
-        id: rectangle
-        x: 0
-        y: 0
-        width: 1280
-        height: 670
+    Text {
+        id: receivingPlaceholder
+        x: 154
+        y: 212
         color: "#ffffff"
-        z: 2
+        text: qsTr("This will be implemented with the actual functionality")
+        font.pixelSize: 40
     }
 }

gui/src/SendingForm.ui.qml

@@ -4,47 +4,79 @@ import QtQuick.Dialogs 1.0
 
 Page {
     width: 1280
-    height: 670
+    height: 470
+    font.capitalization: Font.MixedCase
 
     title: qsTr("Sending")
 
     Connections {
-      target: _qmlHandler
-      onSetFileUrlText: {
-        fileUrlText.text = signalText
-      }
+        target: _qmlHandler
+        onSendingSetFileUrlText: {
+            sendingSelectedFileText.text = signalText
+        }
     }
 
     Button {
-        id: selectFileButton
-        x: 510
-        y: 291
+        id: sendingClearFileButton
+        x: 900
+        y: 40
+        width: 260
+        height: 90
+        text: qsTr("Clear Selection")
+        font.pointSize: 16
+    }
+
+    Button {
+        id: sendingSelectFileButton
+        x: 120
+        y: 40
         width: 260
-        height: 89
+        height: 90
         text: qsTr("Select File")
         font.pointSize: 16
-        onClicked: {fileDialog.open()}
+        // @disable-check M223
+        onClicked: {
+            // @disable-check M222
+            fileDialog.open()
+        }
     }
 
     Text {
-        id: fileUrlText
+        id: sendingSelectedFileText
         x: 54
-        y: 427
+        y: 186
         width: 1172
         height: 52
         color: "#ffffff"
-        text: qsTr("")
+        text: qsTr("Selected File: None")
         verticalAlignment: Text.AlignVCenter
         horizontalAlignment: Text.AlignHCenter
         font.pixelSize: 23
     }
 
     FileDialog {
-      id: fileDialog
-      title: "Please choose a file"
-      folder: shortcuts.home
-      onAccepted: {
-        _qmlHandler.onSelectFile(fileDialog.fileUrl)
-      }
+        id: sendingFileDialog
+        title: "Please choose a file"
+        folder: shortcuts.home
+        // @disable-check M223
+        onAccepted: {
+            // @disable-check M222
+            _qmlHandler.onSendingSelectFileButton(fileDialog.fileUrl)
+        }
+    }
+
+    Button {
+        id: sendingSendFileButton
+        x: 510
+        y: 304
+        width: 260
+        height: 90
+        text: qsTr("Send File")
+        font.pointSize: 16
+        // @disable-check M223
+        onClicked: {
+            // @disable-check M222
+            _qmlHandler.onSendingSendFileButton()
+        }
     }
 }

gui/src/SettingsForm.ui.qml

@@ -0,0 +1,71 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.5
+
+Page {
+    width: 1280
+    height: 470
+
+    font.capitalization: Font.MixedCase
+
+    ComboBox {
+        id: settingsCovertMethodPicker
+        x: 328
+        y: 59
+        width: 285
+        height: 48
+
+        model: ListModel {
+            ListElement {
+                text: "Method 1"
+            }
+            ListElement {
+                text: "Method 2"
+            }
+            ListElement {
+                text: "Method 3"
+            }
+        }
+    }
+
+    Text {
+        id: settingsCovertMethodText
+        x: 56
+        y: 71
+        color: "#ffffff"
+        text: qsTr("Covert Channel Method:")
+        font.pixelSize: 20
+    }
+
+    Button {
+        id: settingsSwitchServerButton
+        x: 549
+        y: 343
+        width: 182
+        height: 71
+        text: qsTr("Switch Server")
+        font.pointSize: 15
+        // @disable-check M223
+        onClicked: {
+            // @disable-check M222
+            _qmlHandler.onSettingsSwitchServerButton()
+        }
+    }
+
+    Text {
+        id: settingsSaveIpText
+        x: 56
+        y: 154
+        color: "#ffffff"
+        text: qsTr("Save last IP:")
+        font.pixelSize: 20
+    }
+
+    Switch {
+        id: settingsSaveIpSwitch
+        x: 328
+        y: 142
+        text: qsTr("")
+        checked: false
+        display: AbstractButton.IconOnly
+    }
+}

gui/src/SwitchIpPopupForm.ui.qml

@@ -0,0 +1,82 @@
+import QtQuick 2.4
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+
+Popup {
+    id: popup
+    height: 200
+    dim: true
+    clip: false
+    width: 400
+    modal: true
+    focus: true
+    closePolicy: Popup.NoAutoClose
+
+    ColumnLayout {
+        anchors.fill: parent
+
+        Text {
+            Layout.alignment: Qt.AlignCenter
+            id: switchText
+            color: "#ffffff"
+            text: qsTr("Enter the IP to connect:")
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            font.pixelSize: 20
+        }
+
+        TextField {
+            Layout.alignment: Qt.AlignCenter
+            id: switchIpInput
+            text: qsTr("")
+            placeholderText: "Enter IP"
+            horizontalAlignment: Text.AlignHCenter
+            validator: RegExpValidator {
+                regExp: /^(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\.(\d|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))$/
+            }
+        }
+
+        Text {
+            id: switchStatusText
+            color: "#df3f3f"
+            text: qsTr("Text field for status")
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            Layout.alignment: Qt.AlignCenter
+            font.pixelSize: 20
+        }
+
+        RowLayout {
+            Layout.alignment: Qt.AlignCenter
+
+            Button {
+                Layout.alignment: Qt.AlignLeft
+                id: switchConnectButton
+                text: qsTr("Connect")
+                rightPadding: 8
+                padding: 12
+                enabled: switchIpInput.acceptableInput
+                font.pointSize: 16
+                // @disable-check M223
+                onClicked: {
+                    // @disable-check M222
+                    _qmlHandler.onSwitchPopupEnterIp(popupIpInput.text)
+                    // @disable-check M222
+                    popup.close()
+                }
+            }
+
+            Button {
+                Layout.alignment: Qt.AlignRight
+                id: switchCancelButton
+                text: qsTr("Cancel")
+                font.pointSize: 16
+                // @disable-check M223
+                onClicked: {
+                    // @disable-check M222
+                    popup.close()
+                }
+            }
+        }
+    }
+}

gui/src/main.cpp

@@ -40,7 +40,7 @@ int main(int argc, char *argv[]) {
 
     // Set the path to the CLI - pass argument h (help) for now
     // TODO: Change hardcoded path
-    execl("../../cli/build/ccats-cli", "ccats-cli", "c", "127.0.0.1",
+    execl("../../cli/build/ccats-cli", "ccats-cli", "127.0.0.1", "--machine",
           (char *)NULL);
 
     exit(1);

gui/src/main.qml

@@ -8,50 +8,80 @@ ApplicationWindow {
     height: 720
     title: qsTr("Covert Channel - Control Panel")
 
-    header: ToolBar {
-        contentHeight: 50
+    Connections {
+        target: _qmlHandler
+        onSettingsOpenSwitchServerPopup: {
+            switchDialog.open()
+        }
+    }
+
+    SwipeView {
+        id: swipeView
+        anchors.fill: parent
+        currentIndex: header.currentIndex
+
+        SendingForm {
+
+        }
+
+        ReceivingForm {
+
+        }
+
+        MessagesForm {
 
-        ToolButton {
-            id: toolButton
-            text: stackView.depth > 1 ? "\u25C0" : "\u2630"
-            font.pixelSize: Qt.application.font.pixelSize * 1.6
-            onClicked: {
-                if (stackView.depth > 1) {
-                    stackView.pop()
-                } else {
-                    drawer.open()
-                }
-            }
         }
 
-        Label {
-            text: stackView.currentItem.title
-            anchors.centerIn: parent
+        SettingsForm {
+
+        }
+
+        HelpForm {
+
         }
     }
 
-    Drawer {
-        id: drawer
-        width: window.width * 0.66
-        height: 50
+    header: TabBar {
+        id: header
+        currentIndex: swipeView.currentIndex
+        contentHeight: 50
+
+        TabButton {
+            text: qsTr("Sending")
+        }
+
+        TabButton {
+            text: qsTr("Receiving")
+        }
+
+        TabButton {
+            text: qsTr("Messages")
+        }
 
-        Column {
-            anchors.fill: parent
+        TabButton {
+            text: qsTr("Settings")
+        }
 
-            ItemDelegate {
-                text: qsTr("Receiving")
-                width: parent.width
-                onClicked: {
-                    stackView.push("ReceivingForm.ui.qml")
-                    drawer.close()
-                }
-            }
+        TabButton {
+            text: qsTr("Help")
         }
     }
 
-    StackView {
-        id: stackView
-        initialItem: "SendingForm.ui.qml"
-        anchors.fill: parent
+    footer: FooterForm {
+
+    }
+
+    IpPopupForm {
+        id: ipDialog
+        x: Math.round((parent.width - width) / 2)
+        y: Math.round((parent.height - height) / 2)
     }
+
+    SwitchIpPopupForm {
+        id: switchDialog
+        x: Math.round((parent.width - width) / 2)
+        y: Math.round((parent.height - height) / 2)
+    }
+
+    Component.onCompleted: ipDialog.open()
 }

gui/src/qml.qrc

@@ -3,6 +3,12 @@
         <file>main.qml</file>
         <file>SendingForm.ui.qml</file>
         <file>ReceivingForm.ui.qml</file>
+        <file>SettingsForm.ui.qml</file>
+        <file>MessagesForm.ui.qml</file>
         <file>qtquickcontrols2.conf</file>
+        <file>IpPopupForm.ui.qml</file>
+        <file>HelpForm.ui.qml</file>
+        <file>FooterForm.ui.qml</file>
+        <file>SwitchIpPopupForm.ui.qml</file>
     </qresource>
 </RCC>

gui/src/qmlhandler.cpp

@@ -1,15 +1,34 @@
 #include "qmlhandler.h"
-#include <string>
-
-using namespace std;
-
-string fileUrl;
 
 QMLHandler::QMLHandler(QObject *parent) : QObject(parent) {}
 
-void QMLHandler::onSelectFile(QUrl url) {
+// Sending
+void QMLHandler::onSendingSelectFileButton(QUrl url) {
   qInfo() << "File Selected: " << url.toString();
-  emit setFileUrlText("Selected File: " + url.toString());
+  emit sendingSetFileUrlText("Selected File: " + url.toString());
+}
+
+void QMLHandler::onSendingSendFileButton() {
+  qInfo() << "Sending File";
+  emit log("Sending File");
+}
+
+// Receiving
+
+// Messages
+void QMLHandler::onMessagesSendButton(QString msg) { emit message(msg); }
+
+// Settings
+void QMLHandler::onSettingsSwitchServerButton() {
+  emit settingsOpenSwitchServerPopup();
+}
+
+// Ip Popup
+void QMLHandler::onIpPopupEnterIp(QString ip) {
+  qInfo() << "Connecting to " << ip;
+}
 
-  fileUrl = url.toString().toStdString();
+// Switch Popup
+void QMLHandler::onSwitchPopupEnterIp(QString ip) {
+  qInfo() << "Switching to " << ip;
 }

gui/src/qmlhandler.h

@@ -1,5 +1,6 @@
-#ifndef CCATS_GUI_QMLHANDLER_H
-#define CCATS_GUI_QMLHANDLER_H
+#ifndef QMLHANDLER_H
+#define QMLHANDLER_H
+
 
 #include <QDebug>
 #include <QObject>
@@ -12,10 +13,42 @@ public:
   explicit QMLHandler(QObject *parent = 0);
 
 signals:
-  void setFileUrlText(QString signalText);
+  // Sending
+  void sendingSetFileUrlText(QString signalText);
+
+  // Receiving
+
+  // Messages
+  void message(QString msg);
+
+  // Settings
+  void settingsOpenSwitchServerPopup();
+
+  // Ip Popup
+
+  // Switch Popup
+
+  // Footer
+  void log(QString logText);
 
 public slots:
-  void onSelectFile(QUrl url);
+  // Sending
+  void onSendingSelectFileButton(QUrl url);
+  void onSendingSendFileButton();
+
+  // Receiving
+
+  // Messages
+  void onMessagesSendButton(QString msg);
+
+  // Settings
+  void onSettingsSwitchServerButton();
+
+  // Ip Popup
+  void onIpPopupEnterIp(QString ip);
+
+  // Switch Popup
+  void onSwitchPopupEnterIp(QString ip);
 };
 
-#endif // CCATS_GUI_QMLHANDLER_H
+#endif // QMLHANDLER_H

gui/src/qtquickcontrols2.conf

@@ -7,7 +7,4 @@ Style=Material
 
 [Material]
 Theme=Dark
-;Accent=BlueGrey
-;Primary=BlueGray
-;Foreground=Brown
-;Background=Grey
+Accent=Blue