"word mnemonic input" with clipboard button and hint is reusable

component;

4 files changed, 98 insertions, 71 deletions

diff --git a/wizard/WizardCreateWallet.qml b/wizard/WizardCreateWallet.qml
index 3b7bcf75..65e2e989 100644
--- a/wizard/WizardCreateWallet.qml
+++ b/wizard/WizardCreateWallet.qml
@@ -49,6 +49,10 @@ Item {
     WizardManageWalletUI {
         id: uiItem
         titleText: qsTr("A new wallet has been created for you")
-        wordsTextTitle: qsTr("This is the 24 word mnemonic for your wallet")
+        wordsTextTitle: qsTr("This is the 25 word mnemonic for your wallet")
+        wordsTextItem.clipboardButtonVisible: true
+        wordsTextItem.tipTextVisible: true
+        wordsTextItem.memoTextReadOnly: true
+
     }
 }
diff --git a/wizard/WizardManageWalletUI.qml b/wizard/WizardManageWalletUI.qml
index 242145a6..a00814a9 100644
--- a/wizard/WizardManageWalletUI.qml
+++ b/wizard/WizardManageWalletUI.qml
@@ -37,9 +37,8 @@ Item {
     property alias titleText: titleText.text
     property alias accountNameText: accountName.text
     property alias wordsTextTitle: frameHeader.text
-    property alias wordsText: wordsText.text
-    property alias wordsTextTip: tipRect
     property alias walletPath: fileUrlInput.text
+    property alias wordsTextItem : memoTextItem
 
 
     // TODO extend properties if needed
@@ -147,81 +146,21 @@ Item {
         //renderType: Text.NativeRendering
         color: "#4A4646"
         elide: Text.ElideRight
-
+        horizontalAlignment: Text.AlignHCenter
     }
 
-    Rectangle {
-        id: wordsRect
-        anchors.left: parent.left
-        anchors.right: parent.right
-        anchors.top: frameHeader.bottom
-        anchors.topMargin: 16
-        height: 182
-        border.width: 1
-        border.color: "#DBDBDB"
-
-        TextEdit {
-            id: wordsText
-            anchors.left: parent.left
-            anchors.right: parent.right
-            anchors.top: parent.top
-            anchors.bottom: tipRect.top
-            anchors.margins: 16
-            font.family: "Arial"
-            font.pixelSize: 24
-            wrapMode: Text.Wrap
-            selectByMouse: true
-            readOnly: true
-            color: "#3F3F3F"
-            text: "bound class paint gasp task soul forgot past pleasure physical circle appear shore bathroom glove women crap busy beauty bliss idea give needle burden"
-        }
-
-        Image {
-            anchors.right: parent.right
-            anchors.bottom: tipRect.top
-            source: "qrc:///images/greyTriangle.png"
-
-            Image {
-                anchors.centerIn: parent
-                source: "qrc:///images/copyToClipboard.png"
-            }
 
-            Clipboard { id: clipboard }
-            MouseArea {
-                anchors.fill: parent
-                cursorShape: Qt.PointingHandCursor
-                onClicked: clipboard.setText(wordsText.text)
-            }
-        }
-
-        Rectangle {
-            id: tipRect
-            anchors.left: parent.left
-            anchors.right: parent.right
-            anchors.bottom: parent.bottom
-            height: 65
-            color: "#DBDBDB"
-            property alias text: wordsTipText.text
-
-            Text {
-                id: wordsTipText
-                anchors.fill: parent
-                anchors.margins: 16
-                verticalAlignment: Text.AlignVCenter
-                horizontalAlignment: Text.AlignHCenter
-                font.family: "Arial"
-                font.pixelSize: 15
-                color: "#4A4646"
-                wrapMode: Text.Wrap
-                text: qsTr("It is very important to write it down as this is the only backup you will need for your wallet. You will be asked to confirm the seed in the next screen to ensure it has copied down correctly.")
-            }
-        }
+    WizardMemoTextInput {
+        id : memoTextItem
+        width: parent.width
+        anchors.top : frameHeader.bottom
+        anchors.topMargin: 16
     }
 
     Row {
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.top: wordsRect.bottom
+        anchors.top: memoTextItem.bottom
         anchors.topMargin: 24
         spacing: 16
 
diff --git a/wizard/WizardMemoTextInput.qml b/wizard/WizardMemoTextInput.qml
new file mode 100644
index 00000000..89eadb15
--- /dev/null
+++ b/wizard/WizardMemoTextInput.qml
@@ -0,0 +1,80 @@
+import QtQuick 2.0
+import moneroComponents 1.0
+
+Column {
+
+    property alias memoText : memoTextInput.text
+    property alias tipText: wordsTipText.text
+    property alias tipTextVisible: tipRect.visible
+    property alias memoTextReadOnly : memoTextInput.readOnly
+    property alias clipboardButtonVisible: clipboardButton.visible
+
+
+    Rectangle {
+        id: memoTextRect
+        width: parent.width
+        height:  {
+            memoTextInput.height
+                    // to have less gap between button and text input we reduce overall height by button height
+                    //+ (clipboardButton.visible ? clipboardButton.height : 0)
+                    + (tipRect.visible ? tipRect.height : 0)
+        }
+        border.width: 1
+        border.color: "#DBDBDB"
+
+        TextEdit {
+            id: memoTextInput
+            textMargin: 8
+            text: "bound class paint gasp task soul forgot past pleasure physical circle appear shore bathroom glove women crap busy beauty bliss idea give needle burden"
+            font.family: "Arial"
+            font.pointSize: 16
+            wrapMode: TextInput.Wrap
+            width: parent.width
+            selectByMouse: true
+            property int minimumHeight: 100
+            height: contentHeight > minimumHeight ? contentHeight : minimumHeight
+        }
+        Image {
+            id : clipboardButton
+            anchors.right: parent.right
+            anchors.bottom: tipRect.top
+            source: "qrc:///images/greyTriangle.png"
+            Image {
+                anchors.centerIn: parent
+                source: "qrc:///images/copyToClipboard.png"
+            }
+            Clipboard { id: clipboard }
+            MouseArea {
+                anchors.fill: parent
+                cursorShape: Qt.PointingHandCursor
+                onClicked: clipboard.setText(memoTextInput.text)
+            }
+        }
+        Rectangle {
+            id: tipRect
+            visible: true
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.bottom: memoTextRect.bottom
+            height: wordsTipText.contentHeight + wordsTipText.anchors.topMargin
+            color: "#DBDBDB"
+            property alias text: wordsTipText.text
+
+            Text {
+                id: wordsTipText
+                anchors.fill: parent
+                anchors.topMargin : 16
+                anchors.bottomMargin: 16
+                anchors.leftMargin: 16
+                anchors.rightMargin: 16
+                verticalAlignment: Text.AlignVCenter
+                horizontalAlignment: Text.AlignHCenter
+                font.family: "Arial"
+                font.pixelSize: 15
+                color: "#4A4646"
+                wrapMode: Text.Wrap
+                text: qsTr("It is very important to write it down as this is the only backup you will need for your wallet. You will be asked to confirm the seed in the next screen to ensure it has copied down correctly.")
+            }
+        }
+    }
+}
diff --git a/wizard/WizardRecoveryWallet.qml b/wizard/WizardRecoveryWallet.qml
index 0eee3491..46af302b 100644
--- a/wizard/WizardRecoveryWallet.qml
+++ b/wizard/WizardRecoveryWallet.qml
@@ -50,6 +50,10 @@ Item {
         id: uiItem
         accountNameText: qsTr("My account name")
         titleText: qsTr("We're ready to recover your account")
-        wordsTextTitle: qsTr("This is the 25 word mnemonic for your wallet")
+        wordsTextTitle: qsTr("Please enter your 25 word private key")
+        wordsTextItem.clipboardButtonVisible: false
+        wordsTextItem.tipTextVisible: false
+        wordsTextItem.memoTextReadOnly: false
+        wordsTextItem.memoText: ""
     }
 }