# 10th July Report

## Progress

**08:55** Entering the lab

---

### Using the Dispenser API into all pages in project

Time : **13:38**
From the Dispenser API service which has created yesterday, now we import it into the pages that needed. Before use, we need to import the service and implement to constructor.

import { DispenserAPIService } from '../../../services/DispenserAPI/dispenser-api.service';

    ...

export class ... {
    
    constructor(
        private api: DispenserAPIService
        ) { }
        
    ...
    
}

Below here is the pages that importing and screenshot provided to prove.

- Login page

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-02.JPG" style="max-height:600px" />
</center>
<br>

- In login page, it call the `loginUser` function to do the login process.
- The return value is boolean so we store the in `resultData` and use it to check in next function.

- Register page

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-01.JPG" style="max-height:600px" />
</center>
<br>

- In register page, it call the `registerNewUser` function to do the register process.
- It return boolean value which stored in `result` variable to use in next function.

- Nearby Dispenser page

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-03.JPG" style="max-height:600px" />
</center>
<br>

- This page has many function that called the API so every of them has different functions to call from service.
- Example: In the `getDetails` function it call the `getDispenserDetail` from the service.

- Maintenance Progress

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-04.JPG" style="max-height:600px" />
</center>
<br>

- Same as above explanation.

---

Time : **14:54**
- Now my local project has syncronized with my partners using Github, it can be seen [here](https://github.com/ianjoseph2204/NTUST_SmartDispenser).
- Below here is the figure that shown my project has merged with Ian and Thariq.

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-05.JPG" style="max-height:600px" />
</center>
<br>

- Testing run in my localhost

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-06.JPG" style="max-height:600px" />
</center>
<br>

- From figure above, the project can be run in my localhost smoothly.
- Next I can contribute to Github and integrate my code with team partners.
- The **errors** in log shown that the connection has disconnected, this occured because I have terminated my localhost.

---

### Giving comment to documented

- Giving the comment to Dispenser API service to get easy when using the function.

/**
   * This function is for get the token from API.
   * 
   * @returns   token   This return the token value
   * 
   * @example   
   * 
   * eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE1NTE5NjU1NzksImlhdCI6MTU1MTk2MTk3OSwidXNlciI6InB3YV91c2VyMDAxIn0.PXnfohRsONkwct08w3mV00lHOjeb6JtK2Sje6Ofc16o
   */
  async getToken () {
    let url = this.urlGetToken;

    const postDataToken = {
      "UserName": "pwa_user001",
      "Password": "password"
    };

    let getToken = await this.http.post(url, postDataToken).toPromise();
    return getToken['token'];
  }

  /**
   * This function is for registering new user using
   * email and password. The password should be input
   * again in the page to confirm password is same and
   * no mistake.
   * 
   * @param     email       Email address of the user
   * @param     password    Password of the user
   * @param     repassword  Re type the password
   * 
   * @returns   boolean     Return true if success and false if failed
   */
  async registerNewUser (email, password, repassword) {
    let url = this.urlCreateUser;

    let token = await this.getToken();

    const postDataRegister = {
      "Email" : email,
      "Password" : password
    }
    
    if (password !== repassword) {
      console.log("Password not match!");
    } else {
      let httpOption = await {
        headers: new HttpHeaders({
          'Content-Type': 'application/json',
          'Authorization': token
        })
      };
      console.log(httpOption);
    
      return await this.http.post(url, postDataRegister, httpOption).subscribe(() => {
        return true;
      }, error => {
        return false
      });
    }

  }

  /**
   * This function is for login the user with email and password.
   * Before do login, the email should be verified after register,
   * the server will send the verification email to user email
   * address.
   * 
   * @param     email     Email address of the user
   * @param     password  Password of the user
   * 
   * @returns   respond   Boolean value with true if success, and
   *                      false if failed
   */
  async loginUser (email, password) {
    let url = this.urlUserLogin;
    let respond = false;

    const postBody = {
      "Email": email,
      "Password": password
    };

    let value = await this.http.post(url, postBody).toPromise();

    if (value['code'] === 200) {
      respond = true;
    }
    
    return respond;
  }

  /**
   * This function is to get the list of device ID from 
   * all dispensers exist from the API.
   * 
   * @returns   value   The json array of data
   * 
   * @example
   * 
   * [
   *  {
   *    "Device_ID": "MA_B1_01"
   *  },
   *  {
   *    "Device_ID": "MA_05_01"
   *  },
   *  ...
   * ]
   */
  async getDispenserList () {
    let url = this.urlDispenserList;
    let value = await this.http.get(url).toPromise();
    return value['Data'];
  }

  /**
   * This function is to get list of nearby dispensers from the
   * target dispenser. It generate data from the API.
   * 
   * @param     device_id   The device ID of target dispenser
   * 
   * @returns   value       The json array of data
   * 
   * @example
   * 
   * [
   *  {
   *    "Device_ID": "MA_02_01",
   *    "UploadTime": "2019-05-02 22:50:26",
   *    "Status": 1,
   *    "HotTemp": 98,
   *    "WarmTemp": 34,
   *    "ColdTemp": 7
   *  },
   *  {
   *    "Device_ID": "MA_04_01",
   *    "UploadTime": "2019-05-02 22:51:09",
   *    "Status": 1,
   *    "HotTemp": 99,
   *    "WarmTemp": 37,
   *    "ColdTemp": 9
   *  },
   *  ...
   * ]
   */
  async getNearbyDispenser (device_id) {
    let url = this.urlNearbyDispenser + device_id;
    let value = await this.http.get(url).toPromise();
    return value['Data'];
  }

  /**
   * This function is to get picture of the dispenser from
   * the target dispenser. It return the picture of the
   * dispenser that stored in server.
   * 
   * @param     device_id   The device ID of target dispenser
   * 
   * @returns   value       The figure of the dispenser
   */
  async getDispenserPicture (device_id) {
    let url = this.urlDispenserPicture + device_id;
    let value = await this.http.get(url).toPromise();
    return value;
  }

  /**
   * This function is to get the url of the picture requested.
   * Different from the getDispenserPicture function it returns
   * the URL instead the figure.
   * 
   * @param     device_id   The device ID of target dispenser
   * 
   * @returns   value       The url of dispenser picture
   * 
   * @example
   * 
   * https://smartcampus.et.ntust.edu.tw:5425/Dispenser/Image?Device_ID=MA_04_01
   */
  async getDispenserPictureUrlOnly (device_id) {
    return this.urlDispenserPicture + device_id;
  }

  /**
   * This function is to get details of the target dispenser from
   * the API. It returns the json format.
   * 
   * @param     device_id   The device ID of target dispenser
   * 
   * @returns   value       The json object of data
   * 
   * @example
   *
   * {
   *   "Device_ID": "EE_07_01",
   *   "Building": "Electrical and Computer Engineering Building 7F",
   *   "Position": "Next to the elevator",
   *   "Type": "UW-9615AG-1"
   * }
   */
  async getDispenserDetail (device_id) {
    let url = this.urlDispenserDetail + device_id;
    let value = await this.http.get(url).toPromise();
    return value['Data'];
  }

  /**
   * This function is to get list of dispenser maintenance info 
   * from the target dispenser from the API. This function is used
   * to get the data about the track of occured problem of a 
   * dispenser. It returns the json format.
   * 
   * @param     device_id   The device ID of target dispenser
   * 
   * @returns   value       The json array of data
   * 
   * @example
   * 
   * [
   *  {
   *    "Device_ID": "T4_04_01",
   *    "ErrorType": 3,
   *    "Description": "Leaking water",
   *    "CompleteTime": "2019-01-02 24:00:00"
   *  },
   *  {
   *    "Device_ID": "T4_04_01",
   *    "ErrorType": 5,
   *    "Description": "Broken",
   *    "CompleteTime": "2019-01-09 24:00:00"
   *  },
   *  ...
   * ]
   */
  async getDispenserMaintenance (device_id) {
    let url = this.urlDispenserMaintenance + device_id;
    let value = await this.http.get(url).toPromise();
    return value['Data'];
  }
  
  ...
  
}

- When the function is called it would be displayed like this

<center>
<img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/23-07.jpg" style="max-height:600px" />
</center>
<br>

- Some of the functions are finished, I still not finished the rest of them, will be continue tomorrow.

---

**18:04** Leaving the lab

###### tags: `on-intern`