Name: Gayathree Natarajan Iyer

UMKC ID: 16227784

Class ID: 20

Lab Assignment 5::

---

Question 1: Create a basic login with 2 buttons “Login” and “Register”

 On clicking “Login” button, user should be navigated to “Home” page  On clicking “Register” button, user should be navigated to “Registration” page

---

Answer:

--> Ionic run android.

Ionic run android

---

--> Build Successful and Launching application.

Building and launching

---

--> Index page created using Ionic Framework.

Index Page

---

--> Login page created using Ionic Framework.

Login Page

---

--> Filled Login page using Ionic Framework.

Filled Login Page

---

--> Registration page created using Ionic Framework.

Registration Page

---

--> Filled Registration page using Ionic Framework.

Filled Registration Page

---

Question 2: Home page should have a Mashup using at least Two Web Services (refer to the web services from the following link). One of them should be from the list of knowledge services and they should be different from the two services you used in your Lab 3 assignment.

---

Answer:

--> Main Page: I have kept the application name as 'Find Fashion'. User will enter the city name and the cloth item they want to buy. They will receive a list of Boutiques from where they can chose one. Then using U-Classify GenderAnalyzer API the user can determine how many portion of males and females have already searched for this cloth item. In the 3rd assignment i had used: Speech to text API and Alchemy API. I using 2 different API this time.

Main Page-- FindFashion

---

##1st Example

--> If user enters the boutique location as Kansas city and the cloth item as 'Tshirts', user can receive a list of Tshirt boutiques in Kansas city.

Kansas City- Tshirt

---

--> Now, using U-Classify Gender Analyzer API, user can determine how many males and females have already searched for tshirts.

GenderAnalyzer

---

##2nd Example

--> If user enters the boutique location as Houston and the cloth item as 'Tops',

Houston- Tops

---

--> User can receive a list of Tops boutiques in Houston.

List of Boutiques

---

--> Now, using U-Classify Gender Analyzer API, user can determine how many males and females have already searched for Tops.

GenderAnalyzer

---

##3rd Example

--> If user enters the boutique location as Virginia and the cloth item as 'Shirts',

Virginia-Shirts

---

--> User can receive a list of Shirt boutiques in Virginia.

List of Boutiques

---

--> Now, using U-Classify Gender Analyzer API, user can determine how many males and females have already searched for Shirts.

GenderAnalyzer

---

---

Question 3: Design a good UI using a wireframe tool.

---

Answer:

WIREFRAMES

--> Index Page- Wireframe

Index page -Wireframe

---

--> Login Page- Wireframe

Login page- Wireframe

---

--> Registration Page- Wireframe

Registration page -Wireframe

---

--> MainPage -Wireframe

Main page-Wireframe

---

--> Detailed Main Page -Wireframe

Detailed Main Page -Wireframe

---

Question 4: Write at least 3 unit test cases related to your application.

---

Answer:

--> Unit Testing

Unit Test

---

--> PhantomJs

PhantonJs

---

-->Karma init

Karma init

---

--> Karma config

Karma config

---

--> 3 unit test cases.

1. **Test Case:**Successful User Authentication

   **DEscription:**The user should login with correct username and password.
   
   **Expected Outcome:**Successful Login
   
   **Result:**Pass
   

2. **Test Case:**Registration by new user

   **DEscription:**The user should register with a new username and password. Then, user should be able to login
                   with that credentials.   
                       
   **Expected Outcome:**Successful Registration
   
   **Result:**Pass
   

3. **Test Case:**Confirm Password

   **Description:**Confirm password should match earlier entered password in registration page. Then only user is 
                   allowed to proceed.    
                      
   **Expected Outcome:**Successful Registration
   
   **Result:**Pass
   

---

---