# 12th July Report ## Progress Time: **08:57** Event: Entering the lab --- ### Troubleshooting the manifest for PWA Time: **09:46** - For Ionic project, `manifest.json` cannot be created alone or manually from explorer. It should be created from Angular command to add PWA module into the project. Input this from command line, or command prompt (cmd): 1. Install Angular CLI if not installed, after this you can use `ng` command. `npm install @angular/cli@latest --save -g` 2. Install Angular PWA if not installed, this is PWA module. `npm install @angular/pwa@latest --save -g` 3. Add Angular PWA module into the project, after this Angular will add some files. `ng add @angular/pwa` - Make sure that your command line directory to your project, otherelse it won't works. - For example your project in `C:\myProject` then in command line it should look like this `C:\myProject> ng add @angular/pwa` - After doing step above, I try again to deploy to Netlify using Github. - Result: <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-01.JPG" style="max-height: 400px" /> </center> <br> - We can refer the `manifest.json` code from previous report [here](https://hackmd.io/@muhamadaldy/ByajoZNbr) --- ### Testing on Dispenser API service Time: **10:00** Pre-defined: ```typescript= import { DispenserAPIService } from '../../services/DispenserAPI/dispenser-api.service'; export class testingPage { constructor(private api: DispenserAPIService) { this.main(); } async main () { let myString: string = ""; let myNumber: number = -1; let myBoolean: boolean = false; let myJson: any; ... } } ``` Items to testing: - **Get token** - Code for test ```typescript= console.log("Testing on getToken"); myString = await this.api.getToken(); console.log(myString); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-02.JPG" style="max-height:300px" /> </center> - Notes - Getting token success. --- - **Creating new user, or register** - Code for test ```typescript= console.log("Testing on createUser"); let email1 = "muhamad_aldy17@yahoo.com"; let email2 = "muhamad_aldy17@hotmail.com"; let email3 = "muhamad.aldy@ui.ac.id"; let password = "password"; myBoolean = await this.api.registerNewUser(email1, password, password); console.log("With " + email1); console.log(myBoolean); myBoolean = await this.api.registerNewUser(email2, password, password); console.log("With " + email2); console.log(myBoolean); myBoolean = await this.api.registerNewUser(email3, password, password); console.log("With " + email3); console.log(myBoolean); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-03.JPG" style="max-height:300px" /> </center> - Notes: - Email from gmail (already tested before this), yahoo, and hotmail domain is success but not from ui.ac.id which is school domain. - Return value from service is blank, need to fix this. - From email address inbox - Yahoo mailbox <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-04.JPG" style="max-height:300px" /> </center> - Outlook (hotmail) mailbox <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-05.JPG" style="max-height:300px" /> </center> --- - **Login** - Code for test ```typescript= console.log("Testing on loginUser"); let email1 = "muhamadaldy17@gmail.com"; let email2 = "muhamad_aldy17@yahoo.com"; let email3 = "muhamad_aldy17@hotmail.com"; let password = "password"; myBoolean = await this.api.loginUser(email1, password); console.log("With " + email1); console.log(myBoolean); myBoolean = await this.api.loginUser(email2, password); console.log("With " + email2); console.log(myBoolean); console.log("With \"then\" from Promise"); await this.api.loginUser(email3, password).then((result) => { myBoolean = result; }) console.log("With " + email3); console.log(myBoolean); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-06.JPG" style="max-height:300px" /> </center> - Notes: - Three emails success. --- - **Dispenser list** - Code for test ```typescript= console.log("Test get dispenser list"); this.myJson = await this.api.getDispenserList(); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-07.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Nearby dispenser** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get nearby dispenser"); this.myJson = await this.api.getNearbyDispenser(device_id); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-08.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Dispenser picture** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser figure"); this.myImage = await this.api.getDispenserPicture(device_id); console.log(this.myImage); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-09.JPG" style="max-height:300px" /> </center> - Notes: - Cannot get the picture, return promise rejected and null value. - Entering the URL using browser will display the picture means no problem with API. - Need to fix this. --- - **Dispenser picture URL only** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser figure url only"); this.myString = await this.api.getDispenserPictureUrlOnly(device_id); console.log(this.myString); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-10.JPG" style="max-height:300px" /> </center> - Notes: - Return done. --- - **Dispenser detail** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser detail"); this.myJson = await this.api.getDispenserDetail(device_id); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-11.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Dispenser maintenance info** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser maintenance info"); this.myJson = await this.api.getDispenserMaintenance(device_id); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-12.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Dispenser raw data** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser raw data"); this.myJson = await this.api.getDispenserRawData(device_id); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-13.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Dispenser repair condition** - Code for test ```typescript= let device_id = "MA_05_01"; console.log("Test get dispenser repair condition"); this.myJson = await this.api.getDispenserRepairCondition(device_id); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-14.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Reporting a problem** - Code for test ```typescript= let file : any = []; let device_id = "MA_04_03"; let email = "muhamad_aldy17@hotmail.com"; let errorType = 4; let description = ""; console.log("Test reporting a problem"); this.myBoolean = await this.api.reportProblem(file, device_id, email, errorType, description); console.log(this.myBoolean); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-15.JPG" style="max-height:300px" /> </center> - Notes: - Can send report as long the email address and error type is valid. - Still need validation from Report Problem page for real experience. --- - **Want to update track** - Code for test ```typescript= let device_id = "MA_04_01"; let email = "muhamad_aldy17@hotmail.com"; let status = true; console.log("Test update track status = true"); this.myBoolean = await this.api.wantUpdateTrack(device_id, email, status); console.log(this.myBoolean); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-16.JPG" style="max-height:300px" /> </center> - Notes: - Return true, done. --- - **Get track status (after function before)** - Code for test ```typescript= let device_id = "MA_05_01"; let email = "muhamadaldy17@gmail.com"; console.log("Test get track status"); this.myJson = await this.api.checkTrackStatus(device_id, email); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-17.JPG" style="max-height:300px" /> </center> - Notes: - Done --- - **Get repair condition Thingworx based on status** - Code for test ```typescript= let status = 3; console.log("Test repair info from Thingworx"); this.myJson = await this.api.getRepairThingworx(status); console.log(this.myJson); console.log("Done!"); ``` - Result in console <center> <img src="https://raw.githubusercontent.com/aru1702/images/master/ntust-documentation/25-18.JPG" style="max-height:300px" /> </center> - Notes: - Done --- ## Conclusion - Manifest for Ionic project cannot be add manually instead must be added via Angular command - Fix some code on dispenser API service and testing them - Integrating with teams project to my local project --- Time: **18:05** Event: Leaving the lab ###### tags: `on-intern`