Create Out Of Time screen

3 files changed, 107 insertions, 0 deletions

diff --git a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/OutOfTimeFragment.kt b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/OutOfTimeFragment.kt
new file mode 100644
index 0000000000..140b10ef18
--- /dev/null
+++ b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/OutOfTimeFragment.kt
@@ -0,0 +1,14 @@
+package net.mullvad.mullvadvpn.ui
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import net.mullvad.mullvadvpn.R
+
+class OutOfTimeFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
+    override fun onSafelyCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ) = inflater.inflate(R.layout.out_of_time, container, false)
+}
diff --git a/android/src/main/res/layout/out_of_time.xml b/android/src/main/res/layout/out_of_time.xml
new file mode 100644
index 0000000000..f1ae5b06a6
--- /dev/null
+++ b/android/src/main/res/layout/out_of_time.xml
@@ -0,0 +1,90 @@
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+              xmlns:mullvad="http://schemas.android.com/apk/res-auto"
+              android:id="@+id/main_fragment"
+              android:layout_width="match_parent"
+              android:layout_height="match_parent"
+              android:orientation="vertical">
+    <LinearLayout android:id="@+id/header_bar"
+                  android:layout_width="match_parent"
+                  android:layout_height="wrap_content"
+                  android:layout_weight="0"
+                  android:orientation="horizontal"
+                  android:gravity="center_vertical"
+                  android:background="@color/red"
+                  android:elevation="0.5dp">
+        <ImageView android:layout_width="50dp"
+                   android:layout_height="50dp"
+                   android:layout_marginLeft="12dp"
+                   android:layout_marginVertical="12dp"
+                   android:layout_weight="0"
+                   android:src="@drawable/logo_icon" />
+        <TextView android:layout_width="wrap_content"
+                  android:layout_height="wrap_content"
+                  android:layout_marginHorizontal="8dp"
+                  android:layout_marginVertical="12dp"
+                  android:layout_weight="1"
+                  android:textColor="@color/white80"
+                  android:textSize="24sp"
+                  android:textStyle="bold"
+                  android:text="@string/app_name"
+                  android:textAllCaps="true" />
+        <ImageButton android:id="@+id/settings"
+                     android:layout_width="wrap_content"
+                     android:layout_height="match_parent"
+                     android:layout_weight="0"
+                     android:paddingHorizontal="12dp"
+                     android:background="?android:attr/selectableItemBackground"
+                     android:src="@drawable/icon_settings" />
+    </LinearLayout>
+    <ImageView android:layout_width="60dp"
+               android:layout_height="60dp"
+               android:layout_gravity="center"
+               android:layout_marginTop="24dp"
+               android:layout_marginBottom="18dp"
+               android:src="@drawable/icon_fail" />
+    <TextView android:layout_width="wrap_content"
+              android:layout_height="wrap_content"
+              android:layout_marginHorizontal="24dp"
+              android:textColor="@color/white"
+              android:textSize="32sp"
+              android:textStyle="bold"
+              android:text="@string/out_of_time" />
+    <TextView android:layout_width="wrap_content"
+              android:layout_height="wrap_content"
+              android:layout_marginHorizontal="24dp"
+              android:layout_marginTop="8dp"
+              android:layout_marginBottom="11dp"
+              android:textColor="@color/white"
+              android:textSize="13sp"
+              android:text="@string/no_more_vpn_time_left" />
+    <Space android:layout_width="match_parent"
+           android:layout_height="0dp"
+           android:layout_weight="1" />
+    <LinearLayout android:layout_width="match_parent"
+                  android:layout_height="wrap_content"
+                  android:layout_weight="0"
+                  android:orientation="vertical"
+                  android:padding="24dp"
+                  android:background="@color/darkBlue">
+        <net.mullvad.mullvadvpn.ui.widget.Button android:id="@+id/disconnect"
+                                                 android:layout_width="match_parent"
+                                                 android:layout_height="wrap_content"
+                                                 android:layout_marginBottom="24dp"
+                                                 android:visibility="gone"
+                                                 mullvad:buttonColor="red"
+                                                 mullvad:text="@string/disconnect" />
+        <net.mullvad.mullvadvpn.ui.widget.UrlButton android:id="@+id/buy_credit"
+                                                    android:layout_width="match_parent"
+                                                    android:layout_height="wrap_content"
+                                                    mullvad:buttonColor="green"
+                                                    mullvad:text="@string/buy_more_credit"
+                                                    mullvad:url="@string/account_url"
+                                                    mullvad:withToken="true" />
+        <net.mullvad.mullvadvpn.ui.widget.Button android:id="@+id/redeem_voucher"
+                                                 android:layout_width="match_parent"
+                                                 android:layout_height="wrap_content"
+                                                 android:layout_marginTop="24dp"
+                                                 mullvad:buttonColor="green"
+                                                 mullvad:text="@string/redeem_voucher" />
+    </LinearLayout>
+</LinearLayout>
diff --git a/android/src/main/res/values/strings.xml b/android/src/main/res/values/strings.xml
index 27d7350a0c..86cca30416 100644
--- a/android/src/main/res/values/strings.xml
+++ b/android/src/main/res/values/strings.xml
@@ -29,6 +29,7 @@
     <string name="pay_to_start_using">To start using the app, you first need to add time to your
     account. Either buy credit on our website or redeem a voucher.</string>
     <string name="buy_credit">Buy credit</string>
+    <string name="buy_more_credit">Buy more credit</string>
     <string name="redeem_voucher">Redeem voucher</string>
     <string name="enter_voucher_code">Enter voucher code</string>
     <string name="voucher_hint">XXXX-XXXX-XXXX-XXXX</string>
@@ -41,6 +42,8 @@
     <string name="less_than_a_day_left">less than a day left</string>
     <string name="less_than_a_minute_ago">less than a minute ago</string>
     <string name="out_of_time">Out of time</string>
+    <string name="no_more_vpn_time_left">You have no more VPN time left on this account. Either buy
+    credit on our website or redeem a voucher.</string>
     <string name="settings_preferences">Preferences</string>
     <string name="settings_advanced">Advanced</string>
     <string name="app_version">App version</string>