ui/qml/widgets/MyProfile.qml

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.3
import QtQuick.Window 2.11
import QtQuick.Controls 1.4

import "." as Widgets
import "../styles"
import "../theme"

Item {
    id: root
    anchors.fill: parent
    width: parent.width

    height: profile.height + searchAddText.height + 10
    implicitHeight: profile.height + searchAddText.height + 10

    property string image
    property string nick
    property string onion
    property string tag
    property bool dualPane: false

    property real logscale: 4 * Math.log10(gcd.themeScale + 1)

onDualPaneChanged: { realignProfile() }

    function realignProfile() {
        if (dualPane) {
            profile.height = 78 * logscale

            portrait.baseWidth = 78 * logscale
            portrait.height = 78 * logscale

            portrait.anchors.horizontalCenter = undefined
            portrait.anchors.left = profile.left
            portrait.anchors.leftMargin = 25 * logscale

            nameRect.anchors.horizontalCenter = undefined
            nameRect.anchors.left = portrait.right

            nameRect.anchors.top = undefined
            nameRect.anchors.verticalCenter = portrait.verticalCenter
        } else {
            profile.height = (150 * logscale)

            portrait.baseWidth = 100 * logscale
            portrait.height = 100 * logscale

            portrait.anchors.left =  undefined
            portrait.anchors.leftMargin = undefined
            portrait.anchors.horizontalCenter = profile.horizontalCenter

            nameRect.anchors.left =  undefined
            nameRect.anchors.horizontalCenter =  profile.horizontalCenter

            nameRect.anchors.verticalCenter = undefined
            nameRect.anchors.top = portrait.bottom
        }
    }

Component.onCompleted: { realignProfile() }



    Rectangle {

        anchors.left: parent.left
        anchors.right: parent.right
        width: parent.width
        id: profile
        color: Theme.backgroundMainColor

        Portrait {
            id: portrait

            source: root.image

            badgeColor: Theme.portraitProfileBadgeColor
            portraitBorderColor: Theme.portraitOnlineBorderColor
            portraitColor: Theme.portraitOnlineBackgroundColor

            badgeContent: Image {// Profle Type
                id: profiletype
                source: tag == "v1-userPassword" ? gcd.assetPath + "/fontawesome/solid/lock.svg" : gcd.assetPath + "/fontawesome/solid/lock-open.svg"
                height: Theme.badgeTextSize * gcd.themeScale
                width: height
            }
        }

        Rectangle {
            id: nameRect

            height: name.height
            width: name.width + addBtn.width

            EllipsisLabel {
                id: name

                anchors.right: undefined
                anchors.left: undefined

                color: Theme.portraitOnlineTextColor
                pixelSize: Theme.usernameSize * gcd.themeScale
                weight: Font.Bold
                text: nick
            }

            Widgets.Button { // Add Button
                id: addBtn

                anchors.left: name.right //name.left + name.textWidth
                anchors.top: name.top

                icon: "solid/plus"

                height: name.height
                width: height
                radius: width * 0.3
                onClicked: {

                }
            }
        }

    }

    // TODO Remove for new global topbar
    Widgets.Button {// BACK BUTTON
        id: btnBack
        icon: "solid/arrow-circle-left"
        anchors.left: parent.left
        anchors.leftMargin: 2
        anchors.top: parent.top
        anchors.topMargin: 2
        onClicked: function() {
            gcd.selectedProfile = "none"
            gcd.reloadProfileList()
            parentStack.pane = parentStack.managementPane
            theStack.pane = theStack.emptyPane
        }
    }


    TextField {
        id: searchAddText
        anchors.top: profile.bottom
        anchors.horizontalCenter: parent.horizontalCenter

    style: CwtchTextFieldStyle{  }
        width: parent.width - 30
        //: ex: "... paste an address here to add a contact ..."
        placeholderText: qsTr("paste-address-to-add-contact")
        horizontalAlignment: TextInput.AlignHCenter

        onTextChanged: {
            if (text != "") {
                gcd.importString(text)
                text = ""
            }
        }
    }

    Connections {
        target: gcd

        onUpdateMyProfile: function(_nick, _onion, _image, _tag) {
            nick = _nick
            onion = _onion
            image = _image
            tag = _tag
        }

        /*onTorStatus: function(code, str) {
        rectTorStatus.code = code
        rectTorStatus.message = str
        }*/
    }
}