Verify Phone and Resend Code

Foodify/app/src/main/java/com/waterbase/foodify/SignUp.java

@@ -8,6 +8,7 @@ import android.text.TextUtils;
 import android.view.View;
 import android.widget.Button;
 import android.widget.EditText;
+import android.widget.ProgressBar;
 import android.widget.TextView;
 import android.widget.Toast;
 
@@ -16,7 +17,9 @@ import androidx.appcompat.app.AppCompatActivity;
 
 import com.google.android.gms.tasks.OnCompleteListener;
 import com.google.android.gms.tasks.Task;
+import com.google.firebase.FirebaseException;
 import com.google.firebase.auth.FirebaseAuth;
+import com.google.firebase.auth.PhoneAuthCredential;
 import com.google.firebase.auth.PhoneAuthProvider;
 import com.google.firebase.database.DataSnapshot;
 import com.google.firebase.database.DatabaseError;
@@ -26,12 +29,15 @@ import com.google.firebase.database.ValueEventListener;
 import com.waterbase.foodify.Common.Common;
 import com.waterbase.foodify.Model.User;
 
+import java.util.concurrent.TimeUnit;
+
 public class SignUp extends AppCompatActivity {
 
     EditText edtPhone, edtName, edtPassword;
     Button btnSignUp;
     TextView txtAppName;
 
+
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
@@ -42,6 +48,8 @@ public class SignUp extends AppCompatActivity {
         edtPhone = (EditText) findViewById(R.id.edtPhone);
         btnSignUp = (Button) findViewById(R.id.btnSignUp);
 
+        final ProgressBar progressBar = findViewById(R.id.progressBar);
+
         txtAppName = (TextView) findViewById(R.id.txtAppName);
 
         Typeface face = Typeface.createFromAsset(getAssets(), "fonts/NABILA.TTF");
@@ -57,29 +65,55 @@ public class SignUp extends AppCompatActivity {
                 if(!TextUtils.isEmpty(edtName.getText().toString()) && !TextUtils.isEmpty(edtPassword.getText().toString())
                         && !TextUtils.isEmpty(edtPhone.getText().toString()))    {
                     if (Common.isConnectedToInternet(getBaseContext())) {
-                        final ProgressDialog mDialog = new ProgressDialog(SignUp.this);
+                        progressBar.setVisibility(View.VISIBLE);
-                        mDialog.setMessage("Vui lòng chờ...");
+                        btnSignUp.setVisibility(View.GONE);
-                        mDialog.show();
-
                         table_user.addListenerForSingleValueEvent(new ValueEventListener() {
                             @Override
                             public void onDataChange(DataSnapshot dataSnapshot) {
                                 //Check if already user phone
                                 if (dataSnapshot.child(edtPhone.getText().toString()).exists()) {
-                                    mDialog.dismiss();
+                                    progressBar.setVisibility(View.GONE);
+                                    btnSignUp.setVisibility(View.VISIBLE);
                                     Toast.makeText(SignUp.this, "Số điện thoại đã được đăng ký!", Toast.LENGTH_SHORT).show();
                                     finish();
                                 } else {
-                                    mDialog.dismiss();
+                                    //Success
-                                    User user = new User(edtName.getText().toString(), edtPassword.getText().toString());
+
-                                    Intent intent = new Intent(SignUp.this, VerifyPhone.class);
+                                    PhoneAuthProvider.getInstance().verifyPhoneNumber(
-                                    intent.putExtra("user", user);
+                                            "+84" + edtPhone.getText().toString(),
-                                    intent.putExtra("phone", edtPhone.getText().toString());
+                                            60,
-                                    startActivity(intent);
+                                            TimeUnit.SECONDS,
-//                                    User user = new User(edtName.getText().toString(), edtPassword.getText().toString());
+                                            SignUp.this,
-//                                    table_user.child(edtPhone.getText().toString()).setValue(user);
+                                            new PhoneAuthProvider.OnVerificationStateChangedCallbacks() {
-//                                    Toast.makeText(SignUp.this, "Đăng ký thành công!", Toast.LENGTH_SHORT).show();
+                                                @Override
-//                                    finish();
+                                                public void onVerificationCompleted(PhoneAuthCredential phoneAuthCredential) {
+                                                    progressBar.setVisibility(View.GONE);
+                                                    btnSignUp.setVisibility(View.VISIBLE);
+                                                }
+
+                                                @Override
+                                                public void onVerificationFailed(FirebaseException e) {
+                                                    progressBar.setVisibility(View.GONE);
+                                                    btnSignUp.setVisibility(View.VISIBLE);
+                                                    Toast.makeText(SignUp.this, e.getMessage(), Toast.LENGTH_SHORT).show();
+                                                }
+
+                                                @Override
+                                                public void onCodeSent(String verificationId, PhoneAuthProvider.ForceResendingToken forceResendingToken) {
+                                                    progressBar.setVisibility(View.GONE);
+                                                    btnSignUp.setVisibility(View.VISIBLE);
+                                                    User user = new User(edtName.getText().toString(), edtPassword.getText().toString());
+                                                    Intent intent = new Intent(SignUp.this, VerifyPhone.class);
+                                                    intent.putExtra("user", user);
+                                                    intent.putExtra("phone", edtPhone.getText().toString());
+                                                    intent.putExtra("verificationId", verificationId);
+                                                    startActivity(intent);
+                                                }
+                                            }
+                                    );
+
+
+
                                 }
                             }
 

Foodify/app/src/main/java/com/waterbase/foodify/VerifyPhone.java

@@ -1,27 +1,191 @@
 package com.waterbase.foodify;
 
+import androidx.annotation.NonNull;
 import androidx.appcompat.app.AppCompatActivity;
 
+import android.content.Intent;
 import android.os.Bundle;
+import android.os.CountDownTimer;
 import android.text.Editable;
 import android.text.TextWatcher;
+import android.view.View;
+import android.widget.Button;
 import android.widget.EditText;
+import android.widget.ProgressBar;
+import android.widget.TextView;
+import android.widget.Toast;
+
+import com.google.android.gms.tasks.OnCompleteListener;
+import com.google.android.gms.tasks.Task;
+import com.google.firebase.FirebaseException;
+import com.google.firebase.auth.AuthResult;
+import com.google.firebase.auth.FirebaseAuth;
+import com.google.firebase.auth.PhoneAuthCredential;
+import com.google.firebase.auth.PhoneAuthProvider;
+import com.google.firebase.database.DataSnapshot;
+import com.google.firebase.database.DatabaseError;
+import com.google.firebase.database.DatabaseReference;
+import com.google.firebase.database.FirebaseDatabase;
+import com.google.firebase.database.ValueEventListener;
+import com.waterbase.foodify.Model.User;
+
+import java.util.concurrent.TimeUnit;
 
 public class VerifyPhone extends AppCompatActivity {
 
     private EditText inputCode1, inputCode2, inputCode3, inputCode4, inputCode5, inputCode6;
+    User user = null;
+    String verificationId, phone;
+    TextView resendCode, countdown;
 
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_verify_phone);
 
+        user = (User) getIntent().getSerializableExtra("user");
+        phone = getIntent().getStringExtra("phone");
+
+        TextView textView = findViewById(R.id.txtPhone);
+        textView.setText("Mã xác thực đã gửi đến số " + String.format("+84-%s", phone) + ". Vui lòng nhập mã OTP khi nhận được tin nhắn!");
+
         inputCode1 = findViewById(R.id.inputCode1);
         inputCode2 = findViewById(R.id.inputCode2);
         inputCode3 = findViewById(R.id.inputCode3);
         inputCode4 = findViewById(R.id.inputCode4);
         inputCode5 = findViewById(R.id.inputCode5);
         inputCode6 = findViewById(R.id.inputCode6);
+
+        resendCode = findViewById(R.id.resendCode);
+        countdown = findViewById(R.id.countdown);
+
+        resendCode.setVisibility(View.GONE);
+        countdown.setVisibility(View.VISIBLE);
+
+        CountDownTimer count = new CountDownTimer(60000, 1000) {
+            @Override
+            public void onTick(long millisUntilFinished) {
+                countdown.setText(millisUntilFinished / 1000 + " giây");
+            }
+
+            @Override
+            public void onFinish() {
+                resendCode.setVisibility(View.VISIBLE);
+                countdown.setVisibility(View.GONE);
+            }
+        };
+        count.start();
+
+        resendCode.setOnClickListener(new View.OnClickListener() {
+            @Override
+            public void onClick(View v) {
+                resendCode.setVisibility(View.GONE);
+                countdown.setVisibility(View.VISIBLE);
+                PhoneAuthProvider.getInstance().verifyPhoneNumber(
+                        "+84" + phone,
+                        60,
+                        TimeUnit.SECONDS,
+                        VerifyPhone.this,
+                        new PhoneAuthProvider.OnVerificationStateChangedCallbacks() {
+                            @Override
+                            public void onVerificationCompleted(PhoneAuthCredential phoneAuthCredential) {
+                            }
+
+                            @Override
+                            public void onVerificationFailed(FirebaseException e) {
+                                Toast.makeText(VerifyPhone.this, e.getMessage(), Toast.LENGTH_SHORT).show();
+                            }
+
+                            @Override
+                            public void onCodeSent(String newVerificationId, PhoneAuthProvider.ForceResendingToken forceResendingToken) {
+                                verificationId = newVerificationId;
+                                Toast.makeText(VerifyPhone.this, "Mã OTP đã được gửi!", Toast.LENGTH_SHORT).show();
+                            }
+                        }
+                );
+
+                count.start();
+            }
+        });
+
+        setupOTPInputs();
+
+        //Init Firebase
+        FirebaseDatabase database = FirebaseDatabase.getInstance();
+        final DatabaseReference table_user = database.getReference("User");
+
+        final ProgressBar progressBar = findViewById(R.id.progressBar);
+        final Button buttonVerify = findViewById(R.id.btnVerify);
+
+        verificationId = getIntent().getStringExtra("verificationId");
+
+        buttonVerify.setOnClickListener(new View.OnClickListener() {
+            @Override
+            public void onClick(View v) {
+                if(inputCode1.getText().toString().trim().isEmpty()
+                    || inputCode2.getText().toString().trim().isEmpty()
+                    || inputCode3.getText().toString().trim().isEmpty()
+                    || inputCode4.getText().toString().trim().isEmpty()
+                    || inputCode5.getText().toString().trim().isEmpty()
+                    || inputCode6.getText().toString().trim().isEmpty())    {
+                    Toast.makeText(VerifyPhone.this, "Mã code không đúng định dạng!", Toast.LENGTH_SHORT).show();
+                    return;
+                }
+
+                String code =
+                        inputCode1.getText().toString() +
+                                inputCode2.getText().toString() +
+                                inputCode3.getText().toString() +
+                                inputCode4.getText().toString() +
+                                inputCode5.getText().toString() +
+                                inputCode6.getText().toString();
+                if(verificationId != null) {
+                    progressBar.setVisibility(View.VISIBLE);
+                    buttonVerify.setVisibility(View.GONE);
+                    PhoneAuthCredential phoneAuthCredential = PhoneAuthProvider.getCredential(
+                            verificationId,
+                            code
+                    );
+                    FirebaseAuth.getInstance().signInWithCredential(phoneAuthCredential)
+                            .addOnCompleteListener(new OnCompleteListener<AuthResult>() {
+                                @Override
+                                public void onComplete(@NonNull Task<AuthResult> task) {
+                                    progressBar.setVisibility(View.GONE);
+                                    buttonVerify.setVisibility(View.VISIBLE);
+                                    if(task.isSuccessful()) {
+
+                                        table_user.addListenerForSingleValueEvent(new ValueEventListener() {
+                                            @Override
+                                            public void onDataChange(DataSnapshot dataSnapshot) {
+                                                table_user.child(getIntent().getStringExtra("phone")).setValue(user);
+                                                Intent intent = new Intent(getApplicationContext(), SignIn.class);
+                                                intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK | Intent.FLAG_ACTIVITY_CLEAR_TASK);
+
+                                                Toast.makeText(VerifyPhone.this, "Tạo tài khoản thành công! Vui lòng đăng nhập lại để tiếp tục", Toast.LENGTH_SHORT).show();
+                                                startActivity(intent);
+                                            }
+
+                                            @Override
+                                            public void onCancelled(DatabaseError databaseError) {
+
+                                            }
+                                        });
+
+//                                        //-------------------------------------------------------
+//                                        User user = new User(edtName.getText().toString(), edtPassword.getText().toString());
+//                                        table_user.child(edtPhone.getText().toString()).setValue(user);
+//                                        Toast.makeText(SignUp.this, "Đăng ký thành công!", Toast.LENGTH_SHORT).show();
+//                                        finish();
+//                                        //--------------------------------------------------------
+                                    } else {
+                                        Toast.makeText(VerifyPhone.this, "Mã code không đúng. Vui lòng kiểm tra lại!", Toast.LENGTH_SHORT).show();
+                                    }
+                                }
+                            });
+                }
+            }
+        });
+
     }
 
     private void setupOTPInputs() {
@@ -41,6 +205,78 @@ public class VerifyPhone extends AppCompatActivity {
             @Override
             public void afterTextChanged(Editable s) {
 
+            }
+        });
+        inputCode2.addTextChangedListener(new TextWatcher() {
+            @Override
+            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
+
+            }
+
+            @Override
+            public void onTextChanged(CharSequence s, int start, int before, int count) {
+                if(!s.toString().trim().isEmpty()){
+                    inputCode3.requestFocus();
+                }
+            }
+
+            @Override
+            public void afterTextChanged(Editable s) {
+
+            }
+        });
+        inputCode3.addTextChangedListener(new TextWatcher() {
+            @Override
+            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
+
+            }
+
+            @Override
+            public void onTextChanged(CharSequence s, int start, int before, int count) {
+                if(!s.toString().trim().isEmpty()){
+                    inputCode4.requestFocus();
+                }
+            }
+
+            @Override
+            public void afterTextChanged(Editable s) {
+
+            }
+        });
+        inputCode4.addTextChangedListener(new TextWatcher() {
+            @Override
+            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
+
+            }
+
+            @Override
+            public void onTextChanged(CharSequence s, int start, int before, int count) {
+                if(!s.toString().trim().isEmpty()){
+                    inputCode5.requestFocus();
+                }
+            }
+
+            @Override
+            public void afterTextChanged(Editable s) {
+
+            }
+        });
+        inputCode5.addTextChangedListener(new TextWatcher() {
+            @Override
+            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
+
+            }
+
+            @Override
+            public void onTextChanged(CharSequence s, int start, int before, int count) {
+                if(!s.toString().trim().isEmpty()){
+                    inputCode6.requestFocus();
+                }
+            }
+
+            @Override
+            public void afterTextChanged(Editable s) {
+
             }
         });
     }

Foodify/app/src/main/res/drawable/progress_bg.xml

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--use rotate tag to rotate the drawable-->
+<rotate
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:fromDegrees="0"
+    android:pivotX="50%"
+    android:pivotY="50%"
+    android:toDegrees="360">
+
+    <!--shape tag is used to
+        build a shape in XML-->
+    <shape
+        android:innerRadiusRatio="3"
+        android:shape="ring"
+        android:thicknessRatio="8"
+        android:useLevel="false">
+
+        <!--set the size of the shape-->
+        <size
+            android:width="76dip"
+            android:height="76dip" />
+
+        <!--set the color gradients
+            of the shape-->
+        <gradient
+            android:angle="0"
+            android:endColor="#00ffffff"
+            android:startColor="#FF5353"
+            android:type="sweep"
+            android:useLevel="false" />
+    </shape>
+
+</rotate>

Foodify/app/src/main/res/layout/activity_sign_up.xml

@@ -94,21 +94,38 @@
         app:layout_constraintTop_toBottomOf="@+id/edtPhone"
         app:layout_constraintWidth_percent=".8" />
 
-    <Button
+    <FrameLayout
-        android:id="@+id/btnSignUp"
+        android:id="@+id/frameLayout"
-        android:layout_width="0dp"
+        android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:background="@drawable/btn_bg_design"
-        android:padding="10dp"
-        android:text="Đăng ký"
-        android:textAllCaps="false"
-        android:textStyle="bold"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/edtPassword"
+        app:layout_constraintTop_toBottomOf="@+id/edtPassword">
-        app:layout_constraintVertical_bias="0.7"
+
-        app:layout_constraintWidth_percent=".8" />
+        <Button
+            android:id="@+id/btnSignUp"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:background="@drawable/btn_bg_design"
+            android:padding="10dp"
+            android:text="Đăng ký"
+            android:textAllCaps="false"
+            android:textStyle="bold"
+            android:layout_marginStart="40dp"
+            android:layout_marginEnd="40dp"
+            />
+
+        <ProgressBar
+            android:id="@+id/progressBar"
+            android:layout_width="40dp"
+            android:layout_height="40dp"
+            android:layout_gravity="center"
+            android:indeterminate="true"
+            android:indeterminateDrawable="@drawable/progress_bg"
+            android:visibility="gone" />
+    </FrameLayout>
+
 
     <TextView
         android:id="@+id/textView"
@@ -122,7 +139,7 @@
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintHorizontal_bias=".3"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/btnSignUp" />
+        app:layout_constraintTop_toBottomOf="@+id/frameLayout" />
 
     <TextView
         android:layout_width="wrap_content"
@@ -137,5 +154,5 @@
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintHorizontal_bias="0"
         app:layout_constraintStart_toEndOf="@+id/textView"
-        app:layout_constraintTop_toBottomOf="@+id/btnSignUp" />
+        app:layout_constraintTop_toBottomOf="@+id/frameLayout" />
 </androidx.constraintlayout.widget.ConstraintLayout>

Foodify/app/src/main/res/layout/activity_verify_phone.xml

@@ -3,7 +3,6 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:overScrollMode="never"
     android:scrollbars="none"
     android:background="@drawable/bg4"
@@ -33,6 +32,7 @@
             android:textAllCaps="true"
             />
         <TextView
+            android:id="@+id/txtPhone"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_marginTop="5dp"
@@ -69,7 +69,7 @@
             <EditText
                 android:id="@+id/inputCode1"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -83,7 +83,7 @@
             <EditText
                 android:id="@+id/inputCode2"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -97,7 +97,7 @@
             <EditText
                 android:id="@+id/inputCode3"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -111,7 +111,7 @@
             <EditText
                 android:id="@+id/inputCode4"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -125,7 +125,7 @@
             <EditText
                 android:id="@+id/inputCode5"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -139,7 +139,7 @@
             <EditText
                 android:id="@+id/inputCode6"
                 android:layout_width="40dp"
-                android:layout_height="45dp"
+                android:layout_height="50dp"
                 android:gravity="center"
                 android:imeOptions="actionNext"
                 android:importantForAutofill="no"
@@ -163,13 +163,26 @@
             <TextView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:text="Không nhận được mã OTP?"
+                android:text="Không nhận được mã OTP? Hãy thử lại sau "
                 android:textSize="12dp"
                 android:textColor="@color/white"
                 android:textStyle="bold"
                 />
 
             <TextView
+                android:id="@+id/resendCode"
+                android:layout_marginLeft="5dp"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="Gửi lại"
+                android:textSize="12dp"
+                android:textColor="@color/purple_500"
+                android:textStyle="bold"
+                android:textAllCaps="true"
+                />
+
+            <TextView
+                android:id="@+id/countdown"
                 android:layout_marginLeft="5dp"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
@@ -183,18 +196,32 @@
 
         </LinearLayout>
 
-        <Button
+        <FrameLayout
-            android:id="@+id/btnVerify"
             android:layout_width="match_parent"
-            android:layout_height="wrap_content"
+            android:layout_height="wrap_content">
-            android:background="@drawable/btn_bg_design"
+
-            android:padding="10dp"
+            <Button
-            android:text="Xác thực"
+                android:id="@+id/btnVerify"
-            android:textAllCaps="true"
+                android:layout_width="match_parent"
-            android:textStyle="bold"
+                android:layout_height="wrap_content"
-            android:layout_marginTop="80dp"
+                android:background="@drawable/btn_bg_design"
-            android:layout_marginStart="30dp"
+                android:padding="10dp"
-            android:layout_marginEnd="30dp" />
+                android:text="Xác thực"
+                android:textAllCaps="true"
+                android:textStyle="bold"
+                android:layout_marginTop="80dp"
+                android:layout_marginStart="30dp"
+                android:layout_marginEnd="30dp" />
+
+            <ProgressBar
+                android:id="@+id/progressBar"
+                android:layout_width="40dp"
+                android:layout_height="40dp"
+                android:layout_gravity="center"
+                android:indeterminate="true"
+                android:indeterminateDrawable="@drawable/progress_bg"
+                android:visibility="gone" />
+        </FrameLayout>
 
 
     </LinearLayout>

Foodify/app/src/main/res/values/themes.xml

@@ -1,6 +1,6 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
     <!-- Base application theme. -->
-    <style name="Theme.Foodify" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
+    <style name="Theme.Foodify" parent="Theme.MaterialComponents.DayNight.NoActionBar">
         <!-- Primary brand color. -->
         <item name="colorPrimary">@color/purple_500</item>
         <item name="colorPrimaryVariant">@color/purple_700</item>