@@ -19,19 +19,16 @@ import Ubuntu.Components 0.1
1919import Ubuntu.Components.ListItems 0.1
2020import "../Components"
2121
22−Column {
22+Item {
2323 id: root
24− y: units.gu(4)
25− spacing: units.gu(2)
2624
2725 property string infoText
2826 property string retryText
2927 property string errorText
30− property int padWidth: units.gu(34)
31− property int padHeight: units.gu(28)
3228 property int minPinLength: -1
3329 property int maxPinLength: -1
3430 property bool showCancelButton: true
31+ property color foregroundColor: "#000000"
3532
3633 readonly property string passphrase: pinentryField.text
3734
@@ -49,180 +46,195 @@ Column {
4946 }
5047
5148 Column {
52− id: shakeContainer
53− anchors.horizontalCenter: parent.horizontalCenter
54− width: parent.width
55− spacing: units.gu(1)
56−
57− Label {
58− id: infoField
59− objectName: "infoTextLabel"
60− fontSize: "large"
61− color: "#f3f3e7"
62− anchors.horizontalCenter: parent.horizontalCenter
63− text: root.infoText
49+ anchors {
50+ left: parent.left;
51+ right: parent.right;
52+ verticalCenter: parent.verticalCenter;
53+ verticalCenterOffset: Math.max(-units.gu(10), -(root.height - height) / 2) + units.gu(4)
6454 }
55+ spacing: units.gu(2)
6556
66− Item {
67− id: pinContainer
68− anchors { left: parent.left; right: parent.right; margins: units.gu(2) }
69− height: units.gu(4)
57+ Column {
58+ id: shakeContainer
59+ anchors.horizontalCenter: parent.horizontalCenter
60+ width: parent.width
61+ spacing: units.gu(1)
7062
71− Row {
72− id: pinentryField
73− objectName: "pinentryField"
63+ Label {
64+ id: infoField
65+ objectName: "infoTextLabel"
66+ fontSize: "large"
67+ color: root.foregroundColor
7468 anchors.horizontalCenter: parent.horizontalCenter
75− anchors.verticalCenter: parent.verticalCenter
76− spacing: Math.max(0, Math.min(units.gu(3), (parent.width / root.maxPinLength) - units.gu(3)))
77−
78− property string text
79− property bool incorrectOverride: false
80−
81− Repeater {
82− model: pinentryField.text.length
83− delegate: Rectangle {
84− color: "#f3f3e7"
85− width: Math.min(units.gu(2), (pinContainer.width - pinContainer.height*2 ) / (root.maxPinLength >= 0 ? root.maxPinLength : 16))
86− height: width
87− radius: width / 2
88− }
89− }
69+ text: root.infoText
70+ }
9071
91− function appendNumber(number) {
92− if (incorrectOverride) {
93− incorrectOverride = false;
72+ Item {
73+ id: pinContainer
74+ anchors { left: parent.left; right: parent.right; margins: units.gu(2) }
75+ height: units.gu(4)
76+
77+ Row {
78+ id: pinentryField
79+ objectName: "pinentryField"
80+ anchors.horizontalCenter: parent.horizontalCenter
81+ anchors.verticalCenter: parent.verticalCenter
82+ spacing: Math.max(0, Math.min(units.gu(3), (parent.width / root.maxPinLength) - units.gu(3)))
83+
84+ property string text
85+ property bool incorrectOverride: false
86+
87+ Repeater {
88+ model: pinentryField.text.length
89+ delegate: Rectangle {
90+ color: root.foregroundColor
91+ width: Math.min(units.gu(2), (pinContainer.width - pinContainer.height*2 ) / (root.maxPinLength >= 0 ? root.maxPinLength : 16))
92+ height: width
93+ radius: width / 2
94+ }
9495 }
9596
96− pinentryField.text = pinentryField.text + number
97+ function appendNumber(number) {
98+ if (incorrectOverride) {
99+ incorrectOverride = false;
100+ }
97101
98− if (root.minPinLength > 0 && root.maxPinLength > 0
99− && root.minPinLength == root.maxPinLength && pinentryField.text.length == root.minPinLength) {
100− root.entered(pinentryField.text)
102+ pinentryField.text = pinentryField.text + number
103+
104+ if (root.minPinLength > 0 && root.maxPinLength > 0
105+ && root.minPinLength == root.maxPinLength && pinentryField.text.length == root.minPinLength) {
106+ root.entered(pinentryField.text)
107+ }
101108 }
102− }
103109
104− function backspace() {
105− pinentryField.text = pinentryField.text.substring(0, pinentryField.text.length-1)
110+ function backspace() {
111+ pinentryField.text = pinentryField.text.substring(0, pinentryField.text.length-1)
112+ }
113+ }
114+ Label {
115+ id: wrongNoticeLabel
116+ objectName: "wrongNoticeLabel"
117+ fontSize: "x-large"
118+ color: root.foregroundColor
119+ anchors.horizontalCenter: parent.horizontalCenter
120+ horizontalAlignment: Text.AlignHCenter
121+ text: root.errorText
122+ visible: pinentryField.incorrectOverride
123+ scale: Math.min(1, parent.width / width)
106124 }
107− }
108− Label {
109− id: wrongNoticeLabel
110− objectName: "wrongNoticeLabel"
111− fontSize: "x-large"
112− color: "#f3f3e7"
113− anchors.horizontalCenter: parent.horizontalCenter
114− horizontalAlignment: Text.AlignHCenter
115− text: root.errorText
116− visible: pinentryField.incorrectOverride
117− scale: Math.min(1, parent.width / width)
118− }
119125
120− AbstractButton {
121− objectName: "backspaceIcon"
122− anchors { right: parent.right; top: parent.top; bottom: parent.bottom }
123− width: height
124− enabled: root.entryEnabled
126+ AbstractButton {
127+ objectName: "backspaceIcon"
128+ anchors { right: parent.right; top: parent.top; bottom: parent.bottom }
129+ width: height
130+ enabled: root.entryEnabled
125131
126− Icon {
127− anchors.fill: parent
128− name: "erase"
129− color: "#f3f3e7"
130− }
132+ Icon {
133+ anchors.fill: parent
134+ name: "erase"
135+ color: root.foregroundColor
136+ }
131137
132− opacity: (pinentryField.text.length > 0 && !pinentryField.incorrectOverride) ? 1 : 0
138+ opacity: (pinentryField.text.length > 0 && !pinentryField.incorrectOverride) ? 1 : 0
133139
134− Behavior on opacity {
135− UbuntuNumberAnimation {}
140+ Behavior on opacity {
141+ UbuntuNumberAnimation {}
142+ }
143+
144+ onClicked: pinentryField.backspace()
136145 }
146+ }
137147
138− onClicked: pinentryField.backspace()
148+ Label {
149+ objectName: "retryLabel"
150+ fontSize: "x-small"
151+ color: root.foregroundColor
152+ anchors.horizontalCenter: parent.horizontalCenter
153+ text: root.retryText || " "
139154 }
140155 }
141156
142− Label {
143− objectName: "retryLabel"
144− fontSize: "x-small"
145− color: "#f3f3e7"
146− anchors.horizontalCenter: parent.horizontalCenter
147− text: root.retryText || " "
157+ ThinDivider {
158+ anchors { left: parent.left; right: parent.right; margins: units.gu(2) }
148159 }
149− }
150−
151− ThinDivider {
152− anchors { left: parent.left; right: parent.right; margins: units.gu(2) }
153− }
154−
155− Grid {
156− id: numbersGrid
157− anchors { horizontalCenter: parent.horizontalCenter }
158− columns: 3
159−
160− property int buttonHeight: units.gu(8)
161− property int buttonWidth: units.gu(12)
162−
163− Repeater {
164− model: 9
165160
161+ Grid {
162+ id: numbersGrid
163+ objectName: "numbersGrid"
164+ anchors { horizontalCenter: parent.horizontalCenter }
165+ columns: 3
166+
167+ property int maxWidth: Math.min(units.gu(50), root.width - units.gu(8))
168+ property int buttonWidth: maxWidth / 3
169+ property int buttonHeight: buttonWidth * 2 / 3
170+
171+ Repeater {
172+ model: 9
173+
174+ PinPadButton {
175+ objectName: "pinPadButton" + text
176+ text: index + 1
177+ height: numbersGrid.buttonHeight
178+ width: numbersGrid.buttonWidth
179+ foregroundColor: root.foregroundColor
180+ enabled: root.entryEnabled && (root.maxPinLength == -1 ||
181+ pinentryField.text.length < root.maxPinLength ||
182+ pinentryField.incorrectOverride)
183+
184+ onClicked: {
185+ pinentryField.appendNumber(index + 1)
186+ }
187+ }
188+ }
189+ Item {
190+ height: numbersGrid.buttonHeight
191+ width: numbersGrid.buttonWidth
192+ }
166193 PinPadButton {
167− objectName: "pinPadButton" + text
168− text: index + 1
194+ text: "0"
169195 height: numbersGrid.buttonHeight
170196 width: numbersGrid.buttonWidth
197+ foregroundColor: root.foregroundColor
171198 enabled: root.entryEnabled && (root.maxPinLength == -1 ||
172199 pinentryField.text.length < root.maxPinLength ||
173200 pinentryField.incorrectOverride)
174201
175202 onClicked: {
176− pinentryField.appendNumber(index + 1)
203+ pinentryField.appendNumber(0)
177204 }
178205 }
179− }
180− Item {
181− height: numbersGrid.buttonHeight
182− width: numbersGrid.buttonWidth
183− }
184− PinPadButton {
185− text: "0"
186− height: numbersGrid.buttonHeight
187− width: numbersGrid.buttonWidth
188− enabled: root.entryEnabled && (root.maxPinLength == -1 ||
189− pinentryField.text.length < root.maxPinLength ||
190− pinentryField.incorrectOverride)
191−
192− onClicked: {
193− pinentryField.appendNumber(0)
206+ Item {
207+ height: numbersGrid.buttonHeight
208+ width: numbersGrid.buttonWidth
194209 }
195− }
196− Item {
197− height: numbersGrid.buttonHeight
198− width: numbersGrid.buttonWidth
199− }
200− PinPadButton {
201− iconName: "close"
202− height: units.gu(5) // visual spec has this row a little closer in
203− width: numbersGrid.buttonWidth
210+ PinPadButton {
211+ iconName: "close"
212+ height: units.gu(5) // visual spec has this row a little closer in
213+ width: numbersGrid.buttonWidth
214+ foregroundColor: root.foregroundColor
215+ onClicked: root.cancel()
216+ visible: root.showCancelButton
217+ }
218+ Item {
219+ height: units.gu(5)
220+ width: numbersGrid.buttonWidth
221+ }
222+ PinPadButton {
223+ iconName: "tick"
224+ objectName: "confirmButton"
225+ height: units.gu(5)
226+ width: numbersGrid.buttonWidth
227+ foregroundColor: root.foregroundColor
228+ enabled: root.enabled && pinentryField.text.length >= root.minPinLength
229+ visible: root.minPinLength == -1 || root.minPinLength !== root.maxPinLength
204230
205− onClicked: root.cancel()
206− visible: root.showCancelButton
207− }
208− Item {
209− height: units.gu(5)
210− width: numbersGrid.buttonWidth
231+ onClicked: root.entered(pinentryField.text)
232+ }
211233 }
212− PinPadButton {
213− iconName: "tick"
214− objectName: "confirmButton"
215− height: units.gu(5)
216− width: numbersGrid.buttonWidth
217− enabled: root.enabled && pinentryField.text.length >= root.minPinLength
218− visible: root.minPinLength == -1 || root.minPinLength !== root.maxPinLength
219−
220− onClicked: root.entered(pinentryField.text)
234+ WrongPasswordAnimation {
235+ id: wrongPasswordAnimation
236+ objectName: "wrongPasswordAnimation"
237+ target: shakeContainer
221238 }
222239 }
223− WrongPasswordAnimation {
224− id: wrongPasswordAnimation
225− objectName: "wrongPasswordAnimation"
226− target: shakeContainer
227− }
228240}