Merge branch 'muhsin' into 'master'

src/app/address/address.page.scss

 .address-wrapper {
   padding: 15px;
+  padding-bottom: 11%;
   .address-radio {
-        background-image: url("../../assets/radio.png");
+    background-image: url('../../assets/radio.png');
     -webkit-appearance: none;
     background-repeat: no-repeat;
     background-position: center;
@@ -10,12 +11,12 @@
     padding: 15px;
     border-radius: 5px;
     outline: none;
-        transition: all .6s ease-in-out;
+    transition: all 0.6s ease-in-out;
   }
   .address-radio:checked {
-        background-image: url("../../assets/radio-checked.png");
+    background-image: url('../../assets/radio-checked.png');
   }
-    .address-radio:checked+.show-btn {
+  .address-radio:checked + .show-btn {
     opacity: 1;
   }
   h1 {
@@ -26,7 +27,7 @@
   p {
     margin-top: 20px;
     padding-left: 10px;
-        color: #B0AEC7;
+    color: #b0aec7;
   }
   button {
     background: none;
@@ -39,8 +40,11 @@
 
 .address-btn-wrapper {
   padding: 15px;
-    position: absolute;
-    bottom: 50px;
+  padding-top: 0;
+  padding-bottom: 10px;
+  background-color: #fff;
+  position: fixed;
+  bottom: 0px;
   left: 0;
   right: 0;
   button {

src/app/cart/cart.page.html

@@ -139,34 +139,59 @@
                   <p>COD</p>
                 </label>
               </div>
-              <!-- <div class="payment_method">
-                                <input type="radio" name="payments" id="paypal" name="radio-group" checked (click)="getwaypaypal()">
+              <div class="payment_method">
+                <input
+                  type="radio"
+                  name="payments"
+                  id="paypal"
+                  name="radio-group"
+                  checked
+                  (click)="getwaypaypal()"
+                />
                 <label for="test1">
                   <p>PayPal</p>
                 </label>
               </div>
               <div class="card_div" [hidden]="gateway !=1">
-                                <input class="card_no borderNone widthFull" placeholder="PayPal ID">
+                <input
+                  class="card_no borderNone widthFull"
+                  placeholder="PayPal ID"
+                />
               </div>
               <div class="payment_method">
-                                <input type="radio" name="payments" id="afterpay" name="radio-group" (click)="getwayafterpay()">
+                <input
+                  type="radio"
+                  name="payments"
+                  id="afterpay"
+                  name="radio-group"
+                  (click)="getwayafterpay()"
+                />
                 <label for="test2">
                   <p>AfterPay</p>
                 </label>
               </div>
               <div class="card_div" [hidden]="gateway !=2">
-                                <input class="card_no" placeholder="**** **** **** 1458">
-                                <input class="cv_number" placeholder="CVV">
+                <input class="card_no" placeholder="**** **** **** 1458" />
+                <input class="cv_number" placeholder="CVV" />
               </div>
               <div class="payment_method">
-                                <input type="radio" name="payments" id="payk" name="radio-group" (click)="getwaypayk()">
+                <input
+                  type="radio"
+                  name="payments"
+                  id="payk"
+                  name="radio-group"
+                  (click)="getwaypayk()"
+                />
                 <label for="test3">
                   <p>PayK</p>
                 </label>
               </div>
               <div class="card_div" [hidden]="gateway !=3">
-                                <input class="card_no borderNone widthFull" placeholder="PafyK ID">
-                            </div> -->
+                <input
+                  class="card_no borderNone widthFull"
+                  placeholder="PafyK ID"
+                />
+              </div>
               <!-- <div class="delivery_time">
                                 <ul>
                                     <li>
@@ -262,7 +287,7 @@
     [hidden]="currentIndex != 0"
   >
     <div class="continue" (click)="goToPage('productlist')">
-      CONTINUE SHOPING
+      CONTINUE SHOPPING
     </div>
     <div class="checkout" (click)="next(1)">CHECKOUT</div>
   </div>

src/app/catagory/catagory.page.scss

@@ -18,7 +18,7 @@
       p {
         margin: 0px;
         text-align: right;
-                background-image: url("../../assets/Path 55_2.png");
+        background-image: url('../../assets/Path 55_2.png');
         background-position: left;
         background-repeat: no-repeat;
         background-size: 12px;
@@ -173,6 +173,7 @@
   }
   .featured_catagory_list {
     padding: 10px;
+    padding-bottom: 14%;
     ul {
       margin: 0px;
       padding: 0px;
@@ -278,14 +279,14 @@
         .styled-checkbox {
           position: absolute; // take it out of document flow
           opacity: 0; // hide it
-                    &+label {
+          & + label {
             position: relative;
             cursor: pointer;
             padding: 0;
             width: 100%;
           }
           // Box.
-                    &+label:before {
+          & + label:before {
             content: '';
             margin-right: 10px;
             display: inline-block;
@@ -296,21 +297,21 @@
             background: white;
             border: 1px solid rgba(215, 213, 228, 1);
           }
-                    &:checked+label:before {
+          &:checked + label:before {
             background: #29285b;
           }
           // Disabled state label.
-                    &:disabled+label {
+          &:disabled + label {
             color: #b8b8b8;
             cursor: auto;
           }
           // Disabled box.
-                    &:disabled+label:before {
+          &:disabled + label:before {
             box-shadow: none;
             background: #ddd;
           }
           // Checkmark. Could be replaced with an image
-                    &:checked+label:after {
+          &:checked + label:after {
             content: '';
             position: absolute;
             left: 6px;
@@ -318,7 +319,8 @@
             background: white;
             width: 2px;
             height: 2px;
-                        box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
+            box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white,
+              4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
             transform: rotate(45deg);
           }
         }

src/app/changedetails/changedetails.page.html

@@ -21,7 +21,7 @@
           class=""
           type="text"
           [(ngModel)]="userData && userData.name"
-          [(placeholder)]="userData && userData.name"
+          placeholder="Change your Name"
           #name="ngModel"
         />
         <div
@@ -39,7 +39,7 @@
           class=""
           name="emailId"
           type="mail"
-          [(placeholder)]="userData && userData.emailId"
+          placeholder="email cannot be changed"
         />
       </div>
 
@@ -53,7 +53,7 @@
           pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}"
           maxlength="10"
           [(ngModel)]="userData && userData.phone"
-          [(placeholder)]="userData && userData.phone"
+          placeholder="Change your Phone Number"
           #phone="ngModel"
         />
         <div
@@ -72,9 +72,22 @@
         <div class="row">
           <h6>Change Password</h6>
         </div>
-        <!-- <div class="row">
-        <input class="" type="password" placeholder="Current Password" />
-      </div> -->
+        <div class="row">
+          <input
+            class=""
+            type="password"
+            minlength="6"
+            #currentPassword="ngModel"
+            [(ngModel)]="updatePassword.currentPassword"
+            name="currentPassword"
+            placeholder="Current Password"
+          />
+          <div
+            *ngIf="currentPassword.errors && currentPassword.errors.minlength"
+          >
+            Password must be at least 6 characters
+          </div>
+        </div>
         <div class="row">
           <input
             class=""
@@ -83,6 +96,7 @@
             type="password"
             placeholder="New Password"
             minlength="6"
+            [required]="currentPassword ? true: false"
             #password="ngModel"
           />
           <div *ngIf="password.errors && password.errors.minlength">
@@ -96,10 +110,11 @@
             [(ngModel)]="updatePassword.confirmPassword"
             name="confirmPassword"
             type="password"
+            [required]="currentPassword ? true: false"
             placeholder="Confirm Password"
           />
-          <div *ngIf="">
-            Password should match
+          <div *ngIf="confirmPassword.errors">
+            {{confPasswordErr}}
           </div>
         </div>
       </div>
@@ -112,3 +127,10 @@
     </form>
   </div>
 </ion-content>
+
+<div class="loader" *ngIf="register.loader">
+  <div class="lds-ripple">
+    <div></div>
+    <div></div>
+  </div>
+</div>

src/app/changedetails/changedetails.page.ts

@@ -17,6 +17,7 @@ export class ChangedetailsPage implements OnInit {
     name: '',
     phone: ''
   };
+  confPasswordErr: string;
 
   updatePassword: UpdatePassword = {
     password: '',
@@ -32,10 +33,18 @@ export class ChangedetailsPage implements OnInit {
     private service: ServiceService
   ) {
     // Gets userdata
-    this.service.get('params').then(val => {
-      this.userData = val;
-      console.log(val);
+    this.service.get('userData').then(val => {
+      console.log(JSON.parse(val));
+      this.userData = JSON.parse(val);
+      console.log(this.userData);
     });
+
+    // this.service.get('user').then(data => {
+    //   if (data) {
+    //     this.userData = JSON.parse(data);
+    //     console.log(this.userData);
+    //   }
+    // });
   }
 
   ngOnInit() {}
@@ -54,18 +63,28 @@ export class ChangedetailsPage implements OnInit {
     console.log(form.value);
     if (form.valid) {
       // Change Password
+      if (form.value.currentPassword && form.value.password) {
         if (
           form.value.password &&
-        form.value.password != form.value.confirmPassword
+          form.value.password === form.value.confirmPassword
         ) {
-        // this.register.updatePassword(form.value.password);
+          // this.register.updateData(form.value, this.userData.uid);
+          this.register.updatePassword(
+            form.value.currentPassword,
+            form.value.password
+          );
+          console.log('Password Changed and profile updated'), form.value;
         } else {
-        alert('Password should match');
+          console.log('Password should match');
+          this.confPasswordErr = 'Password should match';
         }
-
-      // Calls update user data fn
-      // this.register.updateData(form.value, this.userData.uid);
-      console.log('valid form values', form.value);
+      } else {
+        // this.register.updateData(form.value, this.userData);
+        console.log('profile updated', form.value);
+      }
+      // console.log('valid form values', form.value);
+    } else {
+      console.log(form);
     }
   }
 }

src/app/productlist/productlist.page.scss

@@ -108,7 +108,7 @@
         img {
           width: 100%;
           height: 100%;
-          object-fit: cover;
+          object-fit: contain;
           object-position: center;
         }
       }

src/app/profile/profile.page.html

@@ -71,20 +71,20 @@
         </ion-row>
       </div>
       <hr />
-      <ion-row>
+      <ion-row (click)="goToPage('wishlist')">
         <ion-col class="textLeft p0">
           <p>Wishlist</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('wishlist')">
+        <ion-col class="textRight p0">
           <h6>(0)</h6>
         </ion-col>
       </ion-row>
       <hr />
-      <ion-row>
+      <ion-row (click)="goToPage('address')">
         <ion-col class="textLeft p0">
           <p>Address</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('address')">
+        <ion-col class="textRight p0">
           <h6 *ngIf="addressService.addList">
             ({{addressService.addressList.length}})
           </h6>
@@ -102,11 +102,11 @@
         </ion-col>
       </ion-row>
       <hr /> -->
-      <ion-row>
+      <ion-row (click)="goToPage('myorder')">
         <ion-col class="textLeft p0">
           <p>My Order</p>
         </ion-col>
-        <ion-col class="textRight p0" (click)="goToPage('myorder')">
+        <ion-col class="textRight p0">
           <h6>
             <ion-icon name="arrow-forward"></ion-icon>
           </h6>

src/app/profile/profile.page.ts

@@ -41,6 +41,7 @@ export class ProfilePage implements OnInit {
   downloadURL;
 
   constructor(
+    private route: ActivatedRoute,
     private router: Router,
     private storage: AngularFireStorage,
     private useService: UserService,
@@ -56,11 +57,15 @@ export class ProfilePage implements OnInit {
       }
     });
 
+    // Listens to url
+    route.params.subscribe(val => {
+      // Get user Data
       this.service.get('userData').then(data => {
         if (data) {
           this.loggedUser = JSON.parse(data);
         }
       });
+    });
   }
 
   goToPage(path, data = null) {
@@ -69,6 +74,7 @@ export class ProfilePage implements OnInit {
   }
 
   ngOnInit() {
+    console.log('profile page');
     const This = this;
     setTimeout(() => {
       this.user = this.useService.users;

src/app/wishlist/wishlist.page.html

@@ -9,15 +9,15 @@
 </div>
 
 <ion-content>
-  <!-- <div class="wishlist-wrapper">
+  <div class="wishlist-wrapper">
     <ul>
       <li>
         <div class="wishlist_image">
-                    <img src="../../assets/img-list.png">
+          <img src="../../assets/img-list.png" />
         </div>
         <div class="wishlist_detail">
           <p class="floatLeft">European Style V Neck</p>
-                    <span class="floatRight"><img src="../../assets/heart.png"></span>
+          <span class="floatRight"><img src="../../assets/heart.png"/></span>
           <div class="clear"></div>
           <p>Green, Small</p>
           <h1>AU$88.00</h1>
@@ -26,11 +26,11 @@
       </li>
       <li>
         <div class="wishlist_image">
-                    <img src="../../assets/img-list.png">
+          <img src="../../assets/img-list.png" />
         </div>
         <div class="wishlist_detail">
           <p class="floatLeft">European Style V Neck</p>
-                    <span class="floatRight"><img src="../../assets/heart.png"></span>
+          <span class="floatRight"><img src="../../assets/heart.png"/></span>
           <div class="clear"></div>
           <p>Green, Small</p>
           <h1>AU$88.00</h1>
@@ -38,13 +38,13 @@
         <div class="clear"></div>
       </li>
     </ul>
-    </div> -->
-
+  </div>
+  <!-- 
   <div class="empty-wishlist-wrapper">
     <img src="../../assets/wishlist.png" />
     <h1>There is no products added</h1>
     <button (click)="goToPage('home')">shop now</button>
-  </div>
+  </div> -->
 
   <div class="footer-btns-wrapper">
     <button class="btn-clear">Clear All</button>

src/config/services/wishlist.ts

+export interface Wishlist {
+  amount: string;
+  bookDate: any;
+  pickupLocation: any;
+  deliveryLocation: any;
+  deliveryAddress: any;
+  status: number;
+  orderStatus: number;
+  riderName: string;
+  orderId: string;
+  time: string;
+  product: any;
+  orderCode: string;
+}

src/config/update.service.ts

@@ -21,6 +21,7 @@ export class UpdateService {
   type: number;
   userPostData: any;
   updateStatus: number;
+  loader: boolean;
 
   constructor(
     public afs: AngularFirestore,
@@ -47,25 +48,88 @@ export class UpdateService {
     // });
   }
 
-  updateData(userData: UpdateUserDetails, uid: string) {
+  // Update User Data
+  updateData(userData: UpdateUserDetails, oldData: User) {
+    this.loader = true;
     this.type = 2;
 
     const postData: UpdateUserDetails = {
       phone: userData.phone,
       name: userData.name
     };
+    const updateOldData = {
+      ...oldData,
+      phone: userData.phone,
+      name: userData.name
+    };
     this.userPostData = postData;
 
     this.afs
       .collection('customers')
-      .doc(uid)
+      .doc(oldData.uid)
       .update(postData)
       .then(() => {
-        console.log('success');
+        this.service
+          .set('userData', JSON.stringify(updateOldData))
+          .then(res => {
+            console.log('success', updateOldData, res);
+            this.service
+              .showToast('Profile updated!', 'top', 'my-toast', 1000)
+              .then(res => {
                 this.router.navigateByUrl('profile');
+                this.loader = false;
+              });
+          })
+          .catch(err => console.log(err));
       })
       .catch(error => {
         console.log(error);
       });
   }
+
+  // Change user password
+  updatePassword(currentPassword: string, newPasswd: string) {
+    this.loader = true;
+
+    let currentUser = this.afAuth.auth.currentUser; // Gets current user
+    // Credential is required for re-authentication
+    const credential = auth.EmailAuthProvider.credential(
+      currentUser.email,
+      currentPassword
+    );
+
+    // Re-authenticate user
+    currentUser
+      .reauthenticateWithCredential(credential)
+      .then(() => {
+        currentUser
+          .updatePassword(newPasswd) // Update password
+          .then(success => {
+            console.log('password changed');
+            this.loader = false;
+            this.service
+              .showToast('Password Changed!', 'top', 'my-toast', 1000) //success toast
+              .then(res => {
+                this.router.navigateByUrl('profile');
+                this.loader = false;
+              });
+          })
+          .catch(error => {
+            console.log('something fishy');
+            this.service
+              .showToast('Something went wrong', 'top', 'my-toast', 1000) //failure toast
+              .then(res => {
+                this.loader = false;
+              });
+          });
+      })
+      .catch(error => {
+        console.log(error);
+        this.service
+          .showToast(error.message, 'top', 'my-error', 3000) //failure toast
+          .then(res => {
+            this.loader = false;
+          });
+      });
+  }
 }