Merge branch 'create-account-login-widget'

14 files changed, 130 insertions, 95 deletions

diff --git a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/LoginFragment.kt b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/LoginFragment.kt
index ec8da11abb..0deaff3ed8 100644
--- a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/LoginFragment.kt
+++ b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/LoginFragment.kt
@@ -13,6 +13,7 @@ import kotlinx.coroutines.delay
 import net.mullvad.mullvadvpn.R
 import net.mullvad.mullvadvpn.model.GetAccountDataResult
 import net.mullvad.mullvadvpn.service.AccountCache
+import net.mullvad.mullvadvpn.ui.widget.AccountLogin
 import net.mullvad.mullvadvpn.ui.widget.Button
 import org.joda.time.DateTime
 
@@ -28,7 +29,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
     private lateinit var loggingInStatus: View
     private lateinit var loggedInStatus: View
     private lateinit var loginFailStatus: View
-    private lateinit var accountInput: AccountInputController
+    private lateinit var accountLogin: AccountLogin
     private lateinit var scrollArea: ScrollView
 
     private val loggedIn = CompletableDeferred<LoginResult>()
@@ -46,8 +47,8 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         loggedInStatus = view.findViewById(R.id.logged_in_status)
         loginFailStatus = view.findViewById(R.id.login_fail_status)
 
-        accountInput = AccountInputController(view, parentActivity)
-        accountInput.onLogin = { accountToken -> login(accountToken) }
+        accountLogin = view.findViewById(R.id.account_login)
+        accountLogin.onLogin = { accountToken -> login(accountToken) }
 
         view.findViewById<Button>(R.id.create_account)
             .setOnClickAction("createAccount", jobTracker) { createAccount() }
@@ -55,7 +56,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         scrollArea = view.findViewById(R.id.scroll_area)
 
         fetchHistory()
-        scrollToShow(accountInput.input)
+        scrollToShow(accountLogin)
 
         return view
     }
@@ -90,7 +91,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         loginFailStatus.visibility = View.GONE
         loggedInStatus.visibility = View.GONE
 
-        accountInput.state = LoginState.InProgress
+        accountLogin.state = LoginState.InProgress
 
         scrollToShow(loggingInStatus)
 
@@ -113,7 +114,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         loginFailStatus.visibility = View.GONE
         loggedInStatus.visibility = View.GONE
 
-        accountInput.state = LoginState.InProgress
+        accountLogin.state = LoginState.InProgress
 
         scrollToShow(loggingInStatus)
 
@@ -122,7 +123,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
 
     private fun fetchHistory() {
         jobTracker.newUiJob("fetchHistory") {
-            accountInput.accountHistory = jobTracker.runOnBackground() {
+            accountLogin.accountHistory = jobTracker.runOnBackground() {
                 daemon.getAccountHistory()
             }
         }
@@ -176,7 +177,7 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         loginFailStatus.visibility = View.GONE
         loggedInStatus.visibility = View.VISIBLE
 
-        accountInput.state = LoginState.Success
+        accountLogin.state = LoginState.Success
 
         scrollToShow(loggedInStatus)
     }
@@ -196,8 +197,8 @@ class LoginFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         loginFailStatus.visibility = View.VISIBLE
         loggedInStatus.visibility = View.GONE
 
-        accountInput.state = LoginState.Failure
+        accountLogin.state = LoginState.Failure
 
-        scrollToShow(accountInput.input)
+        scrollToShow(accountLogin)
     }
 }
diff --git a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/AccountInputController.kt b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/widget/AccountLogin.kt
index 4c690537ba..c2acd6a924 100644
--- a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/AccountInputController.kt
+++ b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/widget/AccountLogin.kt
@@ -1,15 +1,37 @@
-package net.mullvad.mullvadvpn.ui
+package net.mullvad.mullvadvpn.ui.widget
 
 import android.content.Context
+import android.util.AttributeSet
+import android.view.LayoutInflater
 import android.view.View
 import android.widget.ArrayAdapter
 import android.widget.ListView
+import android.widget.RelativeLayout
 import kotlin.properties.Delegates.observable
 import net.mullvad.mullvadvpn.R
-import net.mullvad.mullvadvpn.ui.AccountInputContainer.BorderState
-import net.mullvad.mullvadvpn.ui.widget.AccountInput
+import net.mullvad.mullvadvpn.ui.LoginState
+import net.mullvad.mullvadvpn.ui.widget.AccountLoginBorder.BorderState
+
+class AccountLogin : RelativeLayout {
+    private val container =
+        context.getSystemService(Context.LAYOUT_INFLATER_SERVICE).let { service ->
+            val inflater = service as LayoutInflater
+
+            inflater.inflate(R.layout.account_login, this)
+        }
+
+    private val border: AccountLoginBorder = container.findViewById(R.id.border)
+    private val accountHistoryList: ListView = container.findViewById(R.id.history)
+    private val input: AccountInput = container.findViewById(R.id.input)
+
+    private var shouldShowAccountHistory = false
+        set(value) {
+            synchronized(this) {
+                field = value
+                updateAccountHistory()
+            }
+        }
 
-class AccountInputController(val parentView: View, context: Context) {
     private var inputHasFocus by observable(false) { _, _, hasFocus ->
         updateBorder()
 
@@ -18,6 +40,14 @@ class AccountInputController(val parentView: View, context: Context) {
         }
     }
 
+    var accountHistory: ArrayList<String>? = null
+        set(value) {
+            synchronized(this) {
+                field = value
+                updateAccountHistory()
+            }
+        }
+
     var state: LoginState by observable(LoginState.Initial) { _, _, newState ->
         input.loginState = newState
 
@@ -31,40 +61,38 @@ class AccountInputController(val parentView: View, context: Context) {
         }
     }
 
-    val container: AccountInputContainer = parentView.findViewById(R.id.account_input_container)
-    val accountHistoryList: ListView = parentView.findViewById(R.id.account_history_list)
+    var onLogin: ((String) -> Unit)?
+        get() = input.onLogin
+        set(value) { input.onLogin = value }
 
-    val input = parentView.findViewById<AccountInput>(R.id.account_input).apply {
-        onFocusChanged.subscribe(this) { hasFocus ->
-            inputHasFocus = hasFocus
-        }
+    constructor(context: Context) : super(context) {}
 
-        onTextChanged.subscribe(this) { _ ->
-            if (state == LoginState.Failure) {
-                state = LoginState.Initial
-            }
-        }
+    constructor(context: Context, attributes: AttributeSet) : super(context, attributes) {}
+
+    constructor(context: Context, attributes: AttributeSet, defaultStyleAttribute: Int) :
+        super(context, attributes, defaultStyleAttribute) {}
+
+    constructor(
+        context: Context,
+        attributes: AttributeSet,
+        defaultStyleAttribute: Int,
+        defaultStyleResource: Int
+    ) : super(context, attributes, defaultStyleAttribute, defaultStyleResource) {
     }
 
-    var accountHistory: ArrayList<String>? = null
-        set(value) {
-            synchronized(this) {
-                field = value
-                updateAccountHistory()
+    init {
+        input.apply {
+            onFocusChanged.subscribe(this) { hasFocus ->
+                inputHasFocus = hasFocus
             }
-        }
 
-    private var shouldShowAccountHistory = false
-        set(value) {
-            synchronized(this) {
-                field = value
-                updateAccountHistory()
+            onTextChanged.subscribe(this) { _ ->
+                if (state == LoginState.Failure) {
+                    state = LoginState.Initial
+                }
             }
         }
-
-    var onLogin: ((String) -> Unit)?
-        get() = input.onLogin
-        set(value) { input.onLogin = value }
+    }
 
     fun onDestroy() {
         input.onFocusChanged.unsubscribe(this)
@@ -76,7 +104,7 @@ class AccountInputController(val parentView: View, context: Context) {
     }
 
     private fun successState() {
-        container.visibility = View.INVISIBLE
+        visibility = View.INVISIBLE
     }
 
     private fun updateAccountHistory() {
@@ -93,7 +121,6 @@ class AccountInputController(val parentView: View, context: Context) {
 
                 setOnItemClickListener { _, _, idx, _ ->
                     input.loginWith(history[idx])
-                    accountHistoryList.visibility = View.GONE
                 }
             }
 
@@ -107,11 +134,11 @@ class AccountInputController(val parentView: View, context: Context) {
 
     private fun updateBorder() {
         if (state == LoginState.Failure) {
-            container.borderState = BorderState.ERROR
+            border.borderState = BorderState.ERROR
         } else if (inputHasFocus) {
-            container.borderState = BorderState.FOCUSED
+            border.borderState = BorderState.FOCUSED
         } else {
-            container.borderState = BorderState.UNFOCUSED
+            border.borderState = BorderState.UNFOCUSED
         }
     }
 }
diff --git a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/AccountInputContainer.kt b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/widget/AccountLoginBorder.kt
index 4ef365e876..ee29ef9be0 100644
--- a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/AccountInputContainer.kt
+++ b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/widget/AccountLoginBorder.kt
@@ -1,4 +1,4 @@
-package net.mullvad.mullvadvpn.ui
+package net.mullvad.mullvadvpn.ui.widget
 
 import android.content.Context
 import android.graphics.drawable.Drawable
@@ -8,7 +8,7 @@ import android.widget.ImageView
 import android.widget.RelativeLayout
 import net.mullvad.mullvadvpn.R
 
-class AccountInputContainer : RelativeLayout {
+class AccountLoginBorder : RelativeLayout {
     enum class BorderState {
         UNFOCUSED,
         FOCUSED,
@@ -27,28 +27,28 @@ class AccountInputContainer : RelativeLayout {
     )
 
     private val unfocusedDrawables = StateDrawables(
-        resources.getDrawable(R.drawable.account_input_corner, null),
-        resources.getDrawable(R.drawable.account_input_border, null),
-        resources.getDrawable(R.drawable.account_input_border, null)
+        resources.getDrawable(R.drawable.account_login_corner, null),
+        resources.getDrawable(R.drawable.account_login_border, null),
+        resources.getDrawable(R.drawable.account_login_border, null)
     )
 
     private val focusedDrawables = StateDrawables(
-        resources.getDrawable(R.drawable.account_input_corner_focused, null),
-        resources.getDrawable(R.drawable.account_input_border_focused, null),
-        resources.getDrawable(R.drawable.account_input_border_focused, null)
+        resources.getDrawable(R.drawable.account_login_corner_focused, null),
+        resources.getDrawable(R.drawable.account_login_border_focused, null),
+        resources.getDrawable(R.drawable.account_login_border_focused, null)
     )
 
     private val errorDrawables = StateDrawables(
-        resources.getDrawable(R.drawable.account_input_corner_error, null),
-        resources.getDrawable(R.drawable.account_input_border_error, null),
-        resources.getDrawable(R.drawable.account_input_border_error, null)
+        resources.getDrawable(R.drawable.account_login_corner_error, null),
+        resources.getDrawable(R.drawable.account_login_border_error, null),
+        resources.getDrawable(R.drawable.account_login_border_error, null)
     )
 
     private val container =
         context.getSystemService(Context.LAYOUT_INFLATER_SERVICE).let { service ->
             val inflater = service as LayoutInflater
 
-            inflater.inflate(R.layout.account_input_container, this)
+            inflater.inflate(R.layout.account_login_border, this)
         }
 
     private val topLeftCorner: ImageView = container.findViewById(R.id.top_left_corner)
diff --git a/android/src/main/res/drawable/account_history_background.xml b/android/src/main/res/drawable/account_history_background.xml
index b596284ace..596eb2d43d 100644
--- a/android/src/main/res/drawable/account_history_background.xml
+++ b/android/src/main/res/drawable/account_history_background.xml
@@ -2,7 +2,7 @@
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
     <item>
         <shape xmlns:android="http://schemas.android.com/apk/res/android">
-            <corners android:radius="@dimen/account_input_corner_radius" />
+            <corners android:radius="@dimen/account_login_corner_radius" />
             <solid android:color="@color/darkBlue" />
         </shape>
     </item>
@@ -11,7 +11,7 @@
           android:bottom="1dp"
           android:left="1dp">
         <shape xmlns:android="http://schemas.android.com/apk/res/android">
-            <corners android:radius="@dimen/account_input_corner_radius" />
+            <corners android:radius="@dimen/account_login_corner_radius" />
             <solid android:color="@color/white" />
         </shape>
     </item>
diff --git a/android/src/main/res/drawable/account_input_border.xml b/android/src/main/res/drawable/account_login_border.xml
index 7aa3362f35..7aa3362f35 100644
--- a/android/src/main/res/drawable/account_input_border.xml
+++ b/android/src/main/res/drawable/account_login_border.xml
diff --git a/android/src/main/res/drawable/account_input_border_error.xml b/android/src/main/res/drawable/account_login_border_error.xml
index 7b0b225c85..7b0b225c85 100644
--- a/android/src/main/res/drawable/account_input_border_error.xml
+++ b/android/src/main/res/drawable/account_login_border_error.xml
diff --git a/android/src/main/res/drawable/account_input_border_focused.xml b/android/src/main/res/drawable/account_login_border_focused.xml
index fa32039e1d..fa32039e1d 100644
--- a/android/src/main/res/drawable/account_input_border_focused.xml
+++ b/android/src/main/res/drawable/account_login_border_focused.xml
diff --git a/android/src/main/res/drawable/account_input_corner.xml b/android/src/main/res/drawable/account_login_corner.xml
index aed002b4ec..e4640e498d 100644
--- a/android/src/main/res/drawable/account_input_corner.xml
+++ b/android/src/main/res/drawable/account_login_corner.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
-        android:width="@dimen/account_input_corner_radius"
-        android:height="@dimen/account_input_corner_radius"
+        android:width="@dimen/account_login_corner_radius"
+        android:height="@dimen/account_login_corner_radius"
         android:viewportWidth="4.0"
         android:viewportHeight="4.0">
     <path android:fillColor="@color/blue"
diff --git a/android/src/main/res/drawable/account_input_corner_error.xml b/android/src/main/res/drawable/account_login_corner_error.xml
index c3acb16404..c19e1be609 100644
--- a/android/src/main/res/drawable/account_input_corner_error.xml
+++ b/android/src/main/res/drawable/account_login_corner_error.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
-        android:width="@dimen/account_input_corner_radius"
-        android:height="@dimen/account_input_corner_radius"
+        android:width="@dimen/account_login_corner_radius"
+        android:height="@dimen/account_login_corner_radius"
         android:viewportWidth="4.0"
         android:viewportHeight="4.0">
     <path android:fillColor="@color/blue"
diff --git a/android/src/main/res/drawable/account_input_corner_focused.xml b/android/src/main/res/drawable/account_login_corner_focused.xml
index 1370463d49..a02110b51d 100644
--- a/android/src/main/res/drawable/account_input_corner_focused.xml
+++ b/android/src/main/res/drawable/account_login_corner_focused.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
-        android:width="@dimen/account_input_corner_radius"
-        android:height="@dimen/account_input_corner_radius"
+        android:width="@dimen/account_login_corner_radius"
+        android:height="@dimen/account_login_corner_radius"
         android:viewportWidth="4.0"
         android:viewportHeight="4.0">
     <path android:fillColor="@color/blue"
diff --git a/android/src/main/res/layout/account_login.xml b/android/src/main/res/layout/account_login.xml
new file mode 100644
index 0000000000..b64a52d6e6
--- /dev/null
+++ b/android/src/main/res/layout/account_login.xml
@@ -0,0 +1,20 @@
+<merge xmlns:android="http://schemas.android.com/apk/res/android">
+    <net.mullvad.mullvadvpn.ui.widget.AccountLoginBorder android:id="@+id/border"
+                                                         android:layout_width="match_parent"
+                                                         android:layout_height="48dp"
+                                                         android:layout_alignParentTop="true">
+        <net.mullvad.mullvadvpn.ui.widget.AccountInput android:id="@+id/input"
+                                                       android:layout_width="match_parent"
+                                                       android:layout_height="48dp"
+                                                       android:layout_alignParentTop="true"
+                                                       android:orientation="horizontal" />
+    </net.mullvad.mullvadvpn.ui.widget.AccountLoginBorder>
+    <ListView android:id="@+id/history"
+              android:layout_width="fill_parent"
+              android:layout_height="wrap_content"
+              android:layout_below="@id/border"
+              android:divider="@drawable/account_history_list_divider"
+              android:dividerHeight="1dp"
+              android:visibility="invisible"
+              android:background="@drawable/account_history_background" />
+</merge>
diff --git a/android/src/main/res/layout/account_input_container.xml b/android/src/main/res/layout/account_login_border.xml
index 43e0fbea8b..73f17980e3 100644
--- a/android/src/main/res/layout/account_input_container.xml
+++ b/android/src/main/res/layout/account_login_border.xml
@@ -5,55 +5,55 @@
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_alignParentLeft="true"
-               android:src="@drawable/account_input_corner" />
+               android:src="@drawable/account_login_corner" />
     <ImageView android:id="@+id/top_right_corner"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_alignParentRight="true"
                android:rotation="90"
-               android:src="@drawable/account_input_corner" />
+               android:src="@drawable/account_login_corner" />
     <ImageView android:id="@+id/bottom_right_corner"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_alignParentRight="true"
                android:rotation="180"
-               android:src="@drawable/account_input_corner" />
+               android:src="@drawable/account_login_corner" />
     <ImageView android:id="@+id/bottom_left_corner"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_alignParentLeft="true"
                android:rotation="270"
-               android:src="@drawable/account_input_corner" />
+               android:src="@drawable/account_login_corner" />
     <!-- sides -->
     <ImageView android:id="@+id/left_border"
-               android:layout_width="@dimen/account_input_border_width"
+               android:layout_width="@dimen/account_login_border_width"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@id/top_left_corner"
                android:layout_above="@id/bottom_left_corner"
-               android:src="@drawable/account_input_border" />
+               android:src="@drawable/account_login_border" />
     <ImageView android:id="@+id/right_border"
-               android:layout_width="@dimen/account_input_border_width"
+               android:layout_width="@dimen/account_login_border_width"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_below="@id/top_right_corner"
                android:layout_above="@id/bottom_right_corner"
-               android:src="@drawable/account_input_border" />
+               android:src="@drawable/account_login_border" />
     <ImageView android:id="@+id/top_border"
                android:layout_width="wrap_content"
-               android:layout_height="@dimen/account_input_border_width"
+               android:layout_height="@dimen/account_login_border_width"
                android:layout_toLeftOf="@id/top_right_corner"
                android:layout_toRightOf="@id/top_left_corner"
                android:layout_alignParentTop="true"
-               android:src="@drawable/account_input_border" />
+               android:src="@drawable/account_login_border" />
     <ImageView android:id="@+id/bottom_border"
                android:layout_width="wrap_content"
-               android:layout_height="@dimen/account_input_border_width"
+               android:layout_height="@dimen/account_login_border_width"
                android:layout_toLeftOf="@id/bottom_right_corner"
                android:layout_toRightOf="@id/bottom_left_corner"
                android:layout_alignParentBottom="true"
-               android:src="@drawable/account_input_border" />
+               android:src="@drawable/account_login_border" />
 </merge>
diff --git a/android/src/main/res/layout/login.xml b/android/src/main/res/layout/login.xml
index de5f6d0f2d..4510d0c627 100644
--- a/android/src/main/res/layout/login.xml
+++ b/android/src/main/res/layout/login.xml
@@ -64,22 +64,9 @@
                       android:textColor="@color/white80"
                       android:textSize="@dimen/text_small"
                       android:text="@string/login_description" />
-            <net.mullvad.mullvadvpn.ui.AccountInputContainer android:id="@+id/account_input_container"
-                                                             android:layout_width="match_parent"
-                                                             android:layout_height="48dp">
-                <net.mullvad.mullvadvpn.ui.widget.AccountInput android:id="@+id/account_input"
-                                                               android:layout_width="match_parent"
-                                                               android:layout_height="48dp"
-                                                               android:layout_alignParentTop="true"
-                                                               android:orientation="horizontal" />
-            </net.mullvad.mullvadvpn.ui.AccountInputContainer>
-            <ListView android:id="@+id/account_history_list"
-                      android:layout_width="fill_parent"
-                      android:layout_height="wrap_content"
-                      android:divider="@drawable/account_history_list_divider"
-                      android:dividerHeight="1dp"
-                      android:visibility="invisible"
-                      android:background="@drawable/account_history_background" />
+            <net.mullvad.mullvadvpn.ui.widget.AccountLogin android:id="@+id/account_login"
+                                                           android:layout_width="match_parent"
+                                                           android:layout_height="wrap_content" />
             <Space android:layout_width="match_parent"
                    android:layout_height="0dp"
                    android:layout_weight="3" />
diff --git a/android/src/main/res/values/dimensions.xml b/android/src/main/res/values/dimensions.xml
index 0e4240ef36..692fba86e4 100644
--- a/android/src/main/res/values/dimensions.xml
+++ b/android/src/main/res/values/dimensions.xml
@@ -4,8 +4,8 @@
     <dimen name="relay_row_padding">50dp</dimen>
     <dimen name="list_item_divider">1dp</dimen>
     <dimen name="dialog_margin">14dp</dimen>
-    <dimen name="account_input_corner_radius">4dp</dimen>
-    <dimen name="account_input_border_width">2dp</dimen>
+    <dimen name="account_login_corner_radius">4dp</dimen>
+    <dimen name="account_login_border_width">2dp</dimen>
     <dimen name="edit_text_corner_radius">4dp</dimen>
     <dimen name="button_height">44dp</dimen>
     <dimen name="cell_switch_border_radius">16dp</dimen>