Quests

src/app/app.component.ts

@@ -114,6 +114,7 @@ export class AppComponent {
                     PARAM_notifnbr: 'all',
                     NOTIF_shownpartners: [],
                 });
+                this.storage.set('APP_QUESTS', {});
             }
         });
         this.storage.get('WISHLIST').then((val) => {

src/app/app.scss

@@ -19,7 +19,7 @@
       }
     }
     h2 {
-        white-space: initial !important;
+      white-space: initial !important;
     }
   }
   .leaflet-popup-close-button {
@@ -37,7 +37,7 @@ div.start {
   display: flex;
   align-items: center;
   justify-content: center;
-  transition: .5s;
+  transition: 0.5s;
   ion-img {
     width: 20vw;
   }
@@ -45,9 +45,11 @@ div.start {
     transform: scale(3);
   }
 }
-ion-alert{
+ion-alert {
   --width: 90vw !important;
   --max-width: 90vw !important;
+  transition: 1s box-shadow;
+  box-shadow: 0 5px 35px 0px rgba(0, 0, 0, 0.1);
 }
 div.hide {
   display: none !important;
@@ -69,4 +71,35 @@ ion-modal .modal-wrapper {
   width: 90vw !important;
   max-height: 90vh !important;
   border-radius: 10px !important;
-}
+}
\ No newline at end of file
+
+ion-alert .alert-wrapper {
+  box-shadow: 0 0 0 rgba(249, 49, 41, 0.8);
+  animation: pulse 2s infinite;
+}
+
+@-webkit-keyframes pulse {
+  0% {
+    -webkit-box-shadow: 0 0 0 0 rgba(249, 49, 41, 0.8);
+  }
+  70% {
+    -webkit-box-shadow: 0 0 0 30px rgba(249, 49, 41, 0);
+  }
+  100% {
+    -webkit-box-shadow: 0 0 0 0 rgba(249, 49, 41, 0);
+  }
+}
+@keyframes pulse {
+  0% {
+    -moz-box-shadow: 0 0 0 0 rgba(249, 49, 41, 0.8);
+    box-shadow: 0 0 0 0 rgba(249, 49, 41, 0.8);
+  }
+  70% {
+    -moz-box-shadow: 0 0 0 30px rgba(249, 49, 41, 0);
+    box-shadow: 0 0 0 30px rgba(249, 49, 41, 0);
+  }
+  100% {
+    -moz-box-shadow: 0 0 0 0 rgba(249, 49, 41, 0);
+    box-shadow: 0 0 0 0 rgba(249, 49, 41, 0);
+  }
+}

src/app/modals/offres-carte-filters/offres-carte-filters.page.html

@@ -52,7 +52,7 @@
 </ion-content>
 <ion-footer>
   <ion-toolbar>
-    <ion-button slot="end" color="dark" size="small" (click)="_TRIP.resetData(); modalController.dismiss();">
+    <ion-button slot="end" color="dark" size="small" (click)="_TRIP.reinitialiserFiltres(); modalController.dismiss();">
       Réinitialiser</ion-button>
   </ion-toolbar>
 </ion-footer>
\ No newline at end of file

src/app/pages/offres/dashboard/dashboard.page.html

@@ -24,9 +24,9 @@
         </ion-grid> -->
         <ion-chip slot="end">
             <ion-icon name="trending-up" color="blue"></ion-icon>
-            <ion-label color="dark" class="ion-padding-end">10 542</ion-label>
+            <ion-label color="dark" class="ion-padding-end">{{ _QST.pointsExp }}</ion-label>
             <ion-icon name="ribbon" color="secondary"></ion-icon>
-            <ion-label color="dark">10 542</ion-label>
+            <ion-label color="dark">{{ _QST.pointsMerites }}</ion-label>
         </ion-chip>
         <!-- <ion-buttons slot="end">
             <ion-button (click)="showHideMoreFilters()">

src/app/pages/offres/dashboard/dashboard.page.ts

 import { Component, OnInit } from '@angular/core';
 import { TripService } from '../../../services/trip-service';
+import { QuestsService } from "../../../services/quests.service";
 
 @Component({
   selector: 'app-dashboard',
@@ -14,7 +15,8 @@ export class DashboardPage implements OnInit {
   public show_more_filters = false;
 
   constructor(
-    public _TRIP: TripService
+    public _TRIP: TripService,
+    public _QST: QuestsService
   ) {
   }
 

src/app/pages/offres/offres-tlm/offres-tlm.page.html

@@ -67,6 +67,55 @@
       </li>
     </ul>
   </div>
+  <ion-list-header>Nouvelles offres</ion-list-header>
+  <div class="app" *ngIf="_TRIP.products.length > 0">
+    <ul class="hs">
+      <li class="item" *ngFor="let trip of _TRIP.products">
+        <div class="badges ion-text-right">
+          <div class="bookmark" *ngIf="!_AUTH.isAnonymous">
+            <ion-button color="light" fill="solid" class="bookmark" (click)="_TRIP.wishList(trip, 'add')"
+              *ngIf="!trip.bookmarked" no-padding>
+              <ion-icon name="heart-empty"></ion-icon>
+            </ion-button>
+            <ion-button color="light" fill="solid" class="bookmark" (click)="_TRIP.wishList(trip, 'remove')"
+              *ngIf="trip.bookmarked" no-padding>
+              <ion-icon name="heart" color="danger"></ion-icon>
+            </ion-button>
+          </div>
+          <ion-badge color="blue">
+            <ion-icon name="trending-up"></ion-icon> 400
+          </ion-badge>
+          <ion-badge color="secondary" margin-left>
+            <ion-text color="light">
+              <ion-icon name="ribbon"></ion-icon> 200
+            </ion-text>
+          </ion-badge>
+        </div>
+        <div (click)="viewDetail(trip.id)"
+          [ngStyle]="{'background-image': 'url(' + trip.thumb + ')', 'background-repeat': 'no-repeat', 'background-size': 'cover', 'width': '100%', 'height': '100%', 'border-radius': '8px'}">
+          <div class="mask">
+            <ion-grid no-padding>
+              <ion-row>
+                <ion-col no-padding> {{trip.name}} </ion-col>
+              </ion-row>
+              <ion-row>
+                <ion-col no-padding>
+                  <ion-badge color="light">
+                    <ion-text color="primary">
+                      <ion-label>
+                        <ion-icon name="pin"></ion-icon> {{ trip.location }}
+                      </ion-label>
+                    </ion-text>
+                  </ion-badge>
+                </ion-col>
+              </ion-row>
+            </ion-grid>
+          </div>
+        </div>
+        <!-- <ion-img src="../../../../assets/img/avatar.jpeg"></ion-img> -->
+      </li>
+    </ul>
+  </div>
   <div padding>
     <div *ngIf="_TRIP.filtredProducts.length <= 0">
       <ion-card class="skeleton" tappable no-margin margin-bottom>

src/app/services/quests.service.ts

 import { AlertController } from '@ionic/angular';
 import { Injectable } from '@angular/core';
+import { Storage } from '@ionic/storage';
 
 @Injectable({
   providedIn: 'root'
 })
 export class QuestsService {
 
+  public pointsMerites = 0;
+  public pointsExp = 0;
+
   constructor(
-    private alertCtrl: AlertController
-  ) { }
+    private alertCtrl: AlertController,
+    private storage: Storage
+  ) {
+    // setTimeout(() => {
+    //   this.presentAlert('Congrats!', 'You are now ranked as a legendary tester!');
+    // }, 4000);
+    this._questFirstConnection();
+  }
 
   async presentAlert(title, message) {
     const alert = await this.alertCtrl.create({
@@ -24,4 +34,17 @@ export class QuestsService {
   showMsg() {
     setInterval(() => { console.log('Still here!'); }, 2000);
   }
+
+  _questFirstConnection() {
+    this.pointsExp = this.pointsExp + 200;
+    this.storage.get('APP_QUESTS').then((appQuests) => {
+      console.log(appQuests);
+      if (null === appQuests) {
+        appQuests = { firstConnection: true };
+        this.storage.set('APP_QUESTS', appQuests).then(() => {
+          this.presentAlert('Première connection', '+200 points d\'experience pour votre première connection');
+        });
+      }
+    });
+  }
 }

src/app/services/trip-service.ts

@@ -160,6 +160,16 @@ export class TripService {
         this.offersCardList = this.filtredProducts.slice(0, 2);
     }
 
+    reinitialiserFiltres() {
+        this.filters = {
+            cat: 'all',
+            type: 'all',
+            brand: 'all'
+        };
+
+        this.filterOffers();
+    }
+
     filterList(categoryId) {
         const category = this.getItemById('cats', categoryId);
         this.ga.trackEvent('Filtres', 'Tapped button', 'Catégorie : [' + categoryId + '] ' + category.label);