@flower-city-online/itinerary-lib 0.0.9 → 0.0.10

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-members/user-list/user-list.component.html

@@ -0,0 +1,59 @@
+<div class="relative min-h-screen">
+  <div class="z-auto">
+    <div class="pb-10">
+      <ng-container *ngIf="loading">
+        <lib-info-card-placeholder
+          [avatar]="true"
+          [count]="5"
+        ></lib-info-card-placeholder>
+      </ng-container>
+
+      <ng-template #actions>
+        <lib-menu-btn
+          (select)="handleMenueItemSelect()"
+          (click)="handleMenuClick()"
+          (change)="handleMenuItemChange()"
+          class="lib-menu-custom-class lib-menu-bg-none"
+          [disableTextShadow]="true"
+        >
+          <img [src]="ICONS['horizontalWhite']" alt="Horizontal divider" />
+        </lib-menu-btn>
+      </ng-template>
+
+      <ng-container *ngIf="!loading">
+        <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-4">
+          <ng-container *ngFor="let i of usersList">
+            <div [class]="'comment-card text-white rounded-xl ' + class">
+              <div class="flex items-center justify-between">
+                <div class="rounded-full overflow-hidden me-2">
+                  <img
+                    [src]="i.memberPic"
+                    alt="User"
+                    loading="lazy"
+                    class="w-10 h-10 object-cover"
+                  />
+                </div>
+                <div class="me-2">
+                  <h4 class="text-sm font-semibold">{{ i.memberName }}</h4>
+                  <!-- <p class="text-xs text-gray-300">{{ i.memberEmail }}</p> -->
+                </div>
+                <div class="ml-auto ms-auto flex items-center" (click) = "viewProfile()">
+                  <span class="pink-btn ml-auto me-1">View Profile</span>
+                  <img [src]="ICONS['angleRight']" alt="angle right" width="8" height="16">
+                </div>
+              </div>
+            </div>
+
+            <!-- <app-user-tile
+              [name]="i.memberName"
+              [email]="i.memberEmail"
+              [image]="i.memberPic"
+              [sufixTemplate]="actions"
+            ></app-user-tile> -->
+          </ng-container>
+        </div>
+      </ng-container>
+
+    </div>
+  </div>
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-members/user-list/user-list.component.scss

@@ -0,0 +1,15 @@
+.commonInterests {
+  font-family: "Calistoga";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 19.692px;
+  line-height: 160%;
+  text-transform: capitalize;
+  color: #ffffff;
+}
+
+.pink-btn {
+  color: #FE3C72;
+  font-size: 9.85px;
+  letter-spacing: 0%;
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-members/user-list/user-list.component.ts

@@ -0,0 +1,81 @@
+import { Location } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  Input,
+  OnDestroy,
+  OnInit,
+} from '@angular/core';
+import { Router } from '@angular/router';
+import { SelectOption } from '@naniteninja/ionic-lib';
+import { Subscription } from 'rxjs';
+import { ItinerariesRoutesEnum } from '../../../../../_enums/ItenariesRoutes.enum';
+import { Iicon } from '../../../../../_interface/icon';
+import { IItineraryMember } from '../../../../../_models/itineraryMember';
+import { ICONS } from '../../../../../_constants/constants';
+import { AssetsService } from '../../../../../_services/assets.service';
+
+@Component({
+  selector: 'app-user-list',
+  templateUrl: './user-list.component.html',
+  styleUrl: './user-list.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class UserList implements OnInit, OnDestroy {
+  @Input() usersList: IItineraryMember[] | undefined;
+  @Input() class: string = '';
+  ICONS: Iicon = ICONS;
+  itineraryMembers: IItineraryMember[] | undefined;
+  loading: boolean = false;
+  subscription!: Subscription;
+  options: SelectOption<string>[] = [
+    {
+      image: ICONS['food'],
+      label: 'Viynasa',
+      value: 'Viynasa',
+      selected: true,
+    },
+  ];
+
+  constructor(
+    private router: Router,
+    private _location: Location,
+    private assetService: AssetsService,
+    private cdr: ChangeDetectorRef,
+  ) { }
+
+  //UI LOGIC
+
+  ngOnInit(): void {
+    this.loading = true;
+    this.subscription = this.assetService.getMembers().subscribe((data) => {
+      this.itineraryMembers = data;
+      this.loading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+  handleMenueItemSelect(): void { }
+  handleMenuItemChange(): void { }
+  handleMenuClick(): void { }
+
+  //NAVIGATIONS
+  backButton(): void {
+    this._location.back();
+  }
+  navToAllPeople(): void {
+    this.router.navigate([
+      ItinerariesRoutesEnum.ITINERARY,
+      ItinerariesRoutesEnum.All_PEOPLE,
+    ]);
+  }
+
+  viewProfile(): void {
+    this.router.navigate([ItinerariesRoutesEnum.PROFILE]).then(() => { });
+  }
+
+  ngOnDestroy(): void {
+    this.subscription.unsubscribe();
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-upvote-users/itinerary-upvote-users.component.html

@@ -0,0 +1,15 @@
+<div>
+    <div class="z-auto">
+        <div class="pb-10 p-4">
+            <div>
+              <app-header [heading]="'Upvotes('+ upvotesUsers.length + ')'" (firstButton)="backButton()"></app-header>
+            </div>
+            <div class="mb-2"> 
+                <span class="p-2 mb-5">See who liked this itinerary <span class="text-pink-600">Adventure Tour</span> </span>
+            </div>
+            <div>
+              <app-user-list [usersList]="upvotesUsers"></app-user-list>
+            </div>
+        </div>
+    </div>
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-upvote-users/itinerary-upvote-users.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ItineraryUpvoteUsersComponent } from './itinerary-upvote-users.component';
+
+describe('ItineraryUpvoteUsersComponent', () => {
+  let component: ItineraryUpvoteUsersComponent;
+  let fixture: ComponentFixture<ItineraryUpvoteUsersComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ItineraryUpvoteUsersComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(ItineraryUpvoteUsersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-upvote-users/itinerary-upvote-users.component.ts

@@ -0,0 +1,47 @@
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { ICONS } from '../../../../_constants/constants';
+import { Iicon } from '../../../../_interface/icon';
+import { IItineraryMember } from '../../../../_models/itineraryMember';
+import { Subscription } from 'rxjs/internal/Subscription';
+import { AssetsService } from '../../../../_services/assets.service';
+import { Location } from '@angular/common';
+import { SelectOption } from '@naniteninja/ionic-lib';
+
+@Component({
+  selector: 'app-itinerary-upvote-users',
+  templateUrl: './itinerary-upvote-users.component.html',
+  styleUrl: './itinerary-upvote-users.component.css'
+})
+export class ItineraryUpvoteUsersComponent implements OnInit {
+  ICONS: Iicon = ICONS;
+  upvotesUsers: IItineraryMember[] = [];
+  loading: boolean = false;
+  subscription!: Subscription;
+  options: SelectOption<string>[] = [
+    {
+      image: ICONS['food'],
+      label: 'Viynasa',
+      value: 'Viynasa',
+      selected: true,
+    },
+  ];
+
+  constructor(
+    private assetService: AssetsService,
+    private cdr: ChangeDetectorRef,
+    private location: Location
+  ) { }
+
+  ngOnInit(): void {
+    this.loading = true;
+    this.subscription = this.assetService.getMembers().subscribe((data) => {
+      this.upvotesUsers = data;
+      this.loading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+  backButton() {
+    this.location.back();
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-users/itinerary-users.component.css

@@ -0,0 +1,3 @@
+.light-grey{
+    color: #bdb2b2;
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-users/itinerary-users.component.html

@@ -0,0 +1,11 @@
+<div>
+    <div class="z-auto">
+        <div class="pb-10 p-4">
+            <app-header heading="Total Members(4)" (firstButton)="backButton()"></app-header>
+             <span class="p-2 mb-5 text-sm text-gray-300 light-grey" >
+  Total users of this itinerary <span class="text-pink-600 ml-1">Adventure Tour</span>
+</span>
+            <app-itinerary-member [itineraryUsersType]="'members'"></app-itinerary-member>
+        </div>
+    </div>
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-users/itinerary-users.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ItineraryUsersComponent } from './itinerary-users.component';
+
+describe('ItineraryUsersComponent', () => {
+  let component: ItineraryUsersComponent;
+  let fixture: ComponentFixture<ItineraryUsersComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ItineraryUsersComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(ItineraryUsersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-users/itinerary-users.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-itinerary-users',
+  templateUrl: './itinerary-users.component.html',
+  styleUrl: './itinerary-users.component.css'
+})
+export class ItineraryUsersComponent {
+  backButton(){
+    window.history.back();
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-watching-users/itinerary-watching-users.component.css

@@ -0,0 +1,8 @@
+.light-grey{
+    color: #bdb2b2;
+
+}
+
+.page-description {
+  font-size: 12px;
+}

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-watching-users/itinerary-watching-users.component.html

@@ -0,0 +1,24 @@
+<div>
+  <div class="z-auto">
+    <div class="pb-10 p-4">
+      <div>
+        <app-header
+          class="mb-4"
+          [heading]="'Watching(' + watchingMembers?.length + ')'"
+          (firstButton)="backButton()"
+        ></app-header>
+      </div>
+      <div class="mb-2">
+        <span class="text-sm text-gray-300 light-grey page-description pb-3">
+          See who is watching this itinerary<span class="text-pink-600 ml-1"
+            >Adventure Tour</span
+          >
+        </span>
+      </div>
+      <div>
+        <app-user-list [usersList]="watchingMembers"></app-user-list>
+      </div>
+      <!-- <app-itinerary-member [itineraryUsersType]="'watching'"></app-itinerary-member> -->
+    </div>
+  </div>
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-watching-users/itinerary-watching-users.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ItineraryWatchingUsersComponent } from './itinerary-watching-users.component';
+
+describe('ItineraryWatchingUsersComponent', () => {
+  let component: ItineraryWatchingUsersComponent;
+  let fixture: ComponentFixture<ItineraryWatchingUsersComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ItineraryWatchingUsersComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(ItineraryWatchingUsersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/pages/itinerary-watching-users/itinerary-watching-users.component.ts

@@ -0,0 +1,48 @@
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { ICONS } from '../../../../_constants/constants';
+import { Iicon } from '../../../../_interface/icon';
+import { IItineraryMember } from '../../../../_models/itineraryMember';
+import { Subscription } from 'rxjs/internal/Subscription';
+import { SelectOption } from '@naniteninja/ionic-lib';
+import { AssetsService } from '../../../../_services/assets.service';
+import { Location } from '@angular/common'; 
+
+@Component({
+  selector: 'app-itinerary-watching-users',
+  templateUrl: './itinerary-watching-users.component.html',
+  styleUrl: './itinerary-watching-users.component.css'
+})
+export class ItineraryWatchingUsersComponent implements OnInit {
+  ICONS: Iicon = ICONS;
+  watchingMembers: IItineraryMember[] | undefined;
+  loading: boolean = false;
+  subscription!: Subscription;
+  options: SelectOption<string>[] = [
+    {
+      image: ICONS['food'],
+      label: 'Viynasa',
+      value: 'Viynasa',
+      selected: true,
+    },
+  ];
+
+  constructor(
+    private assetService: AssetsService,
+    private cdr: ChangeDetectorRef,
+    private location: Location
+  ) { }
+
+  ngOnInit(): void {
+    this.loading = true;
+    this.subscription = this.assetService.getMembers().subscribe((data) => {
+      this.watchingMembers = data;
+      this.loading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+
+  backButton() {
+    this.location.back();
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/pages/notifications/notifications.component.html

@@ -0,0 +1,11 @@
+<div class="z-auto">
+  <div class="pb-10">
+    <app-header heading="Notifications" (firstButton)="backButton()"></app-header>
+
+    <ng-container *ngFor="let n of notifications">
+      <app-notification-tile [content]="n.notification.notificationContent" [isBtnVisible]="n.needReview"
+        [notificationAttended]="n.notification.attended" btnText="Review Now"
+        (btnClick)="navToCommentApproval()"></app-notification-tile>
+    </ng-container>
+  </div>
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/notifications/notifications.component.ts

@@ -0,0 +1,64 @@
+import { Location } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  OnInit,
+} from '@angular/core';
+import { Router } from '@angular/router';
+import { INotification } from '../../../../_interface/notification';
+import { ItinerariesRoutesEnum } from '../../../../_enums/ItenariesRoutes.enum';
+import { AssetsService } from '../../../../_services/assets.service';
+ 
+interface ItineraryNotification {
+  notification: INotification;
+  needReview: boolean;
+  callback: () => void;
+}
+
+@Component({
+  selector: 'app-notifications',
+  templateUrl: './notifications.component.html',
+  styleUrl: './notifications.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class NotificationsComponent implements OnInit {
+  notifications: ItineraryNotification[] = [];
+  loading: boolean = false;
+
+  //LIFE CYCLE
+  constructor(
+    private _location: Location,
+    private router: Router,
+    private assetService: AssetsService,
+    private cdr: ChangeDetectorRef,
+  ) {}
+  ngOnInit(): void {
+    this.loading = true;
+    this.assetService.getNotifications().subscribe((res) => {
+      this.notifications = res.map(
+        (x) =>
+          <ItineraryNotification>{
+            notification: x,
+            needReview: false,
+            callback: () => {},
+          },
+      );
+      this.notifications[0].needReview = true;
+      this.loading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+  //NAVIGATIONS
+  backButton(): void {
+    this._location.back();
+  }
+
+  navToCommentApproval() {
+    this.router.navigate([
+      'itineraries',
+      ItinerariesRoutesEnum.COMMENT_UPDATE_REQUEST,
+    ]);
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/pages/stories/story.component.css

@@ -0,0 +1,46 @@
+:host {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  overflow: auto;
+  align-items: center;
+}
+.scrollable-content {
+  max-width: 100%;
+  /* max-height: 600px; */
+  position: relative;
+  display: flex;
+  overflow: hidden !important;
+  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
+  div.slides {
+    text-align: center;
+    min-width: 40px;
+    min-height: 40px;
+    background: #222;
+    overflow: hidden;
+    padding-top: 10px;
+  }
+}
+@media (max-width: 600px) {
+  .scrollable-content {
+    /* max-height: 700px; */
+  }
+  .scrollable-content div.slides {
+    min-width: 30px;
+    ;
+  }
+  .scrollable-content div.slides img {
+    max-width: 100%;
+    height: 800px !important;
+  }
+  .scrollable-content::after, .scrollable-content::before {
+    display: none;
+  }
+}
+.swiper-slide {
+  transition: transform 0.3s ease;
+}
+.scale-down {
+  transform: scale(0.85);
+  opacity: 0.6;
+}

package/src/lib/itinerary-app/modules/itineraries/pages/stories/story.component.html

@@ -0,0 +1,16 @@
+<div class="draggable-scroll-container w-full ">
+  <div class="scrollable-content " [ngStyle]="{ height: windowHeight + 'px' }" libDraggableScroll
+    [direction]="direction" [includeSidePadding]="false">
+    <div class="slides m-0 " *ngFor="let item of [1, 2, 3]">
+      <div class="z-auto ">
+        <div class="p-0 m-0">
+          <app-custom-story-card [libMenuItem]="libMenuItem"> </app-custom-story-card>
+        </div>
+        <lib-popup [isOpen]="modalService.toggleModal">
+          <app-report-itinerary-modal [popupTitle]="'Report Media'"></app-report-itinerary-modal>
+        </lib-popup>
+      </div>
+    </div>
+  </div>
+
+</div>

package/src/lib/itinerary-app/modules/itineraries/pages/stories/story.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StoryComponent } from './story.component';
+
+describe('StoryComponent', () => {
+  let component: StoryComponent;
+  let fixture: ComponentFixture<StoryComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [StoryComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(StoryComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/pages/stories/story.component.ts

@@ -0,0 +1,40 @@
+import { ChangeDetectionStrategy, Component, ElementRef, OnInit, QueryList, ViewChild, ViewChildren } from '@angular/core';
+import { LibMenuItem } from '@naniteninja/ionic-lib'; 
+import { CustomDropdownMenuService } from '../../../../_services/custom-dropdown-menu.service';
+import { ModalService } from '../../../../_services/modal.service';
+
+@Component({
+  selector: 'app-story',
+  templateUrl: './story.component.html',
+  styleUrl: './story.component.css',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class StoryComponent implements OnInit {
+  libMenuItem: LibMenuItem[] = [];
+  @ViewChildren('slide') slideElements!: QueryList<ElementRef>;
+  @ViewChild('scrollable-content') scrollableContentRef!: ElementRef;
+  direction :any = 'vertical'
+  transition :boolean =true
+  slidesPerView :number = 1
+  freeMode :boolean = false
+  includeSidePadding : boolean = true
+  centeredSlides: boolean= true
+ windowHeight :any
+  Pagination :any  = {
+    el: '.swiper-pagination',
+    clickable: true,
+  }
+  activeSlideIndex = 0;
+  constructor(
+    public modalService: ModalService,
+    public customMenuList: CustomDropdownMenuService,
+  ) {}
+  ngOnInit(): void {
+    this.libMenuItem = this.customMenuList.getMenuList('stories');
+    this.windowHeight = window.screen.height;}
+  ngAfterViewInit() {
+  }
+  onSlideChange(event: any) {
+    this.activeSlideIndex = event.realIndex || event.activeIndex || 0;
+  }
+}

package/src/lib/itinerary-app/modules/pathway/components/googlemap/googlemap.component.html

@@ -0,0 +1,10 @@
+<lib-map
+  #googleMap
+  height="85vh"
+  width="100vw"
+  [center]="center"
+  [zoom]="zoom"
+  [options]="mapOptions"
+  (mapInitialized)="onMapInitialized($event)"
+>
+</lib-map>

package/src/lib/itinerary-app/modules/pathway/components/googlemap/googlemap.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { GooglemapComponent } from './googlemap.component';
+
+describe('GooglemapComponent', () => {
+  let component: GooglemapComponent;
+  let fixture: ComponentFixture<GooglemapComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [GooglemapComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(GooglemapComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});