@flower-city-online/itinerary-lib 0.0.32 → 0.0.34

package/src/lib/itinerary-app/shared/custom-heading-with-button/custom-heading-with-button.component.ts

@@ -1,22 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  Input,
-  Output,
-} from '@angular/core';
-
-@Component({
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    selector: 'app-custom-heading-with-button',
-    templateUrl: './custom-heading-with-button.component.html',
-    styleUrl: './custom-heading-with-button.component.scss',
-    standalone: false
-})
-export class CustomHeadingWithButtonComponent {
-  @Input() heading!: string;
-  @Input() buttonText!: string;
-  @Input() buttonIcon!: string;
-  @Input() cssClass!: string;
-  @Output() buttonClick = new EventEmitter<MouseEvent>();
-}

package/src/lib/itinerary-app/shared/custom-story-card/custom-story-card.component.html

@@ -1,113 +0,0 @@
-<div class="carousel-container w-full bg-transparent">
-  <div class="carousel">
-    <div
-      class="card active bg-cover bg-center bg-no-repeat story-img bg-transparent m-0"
-      [style.background-image]="'url(' + image + ')'"
-    >
-      <div class="flex h-[50px] items-center">
-        <button (click)="goBack()">
-          <img loading="lazy" [src]="ICONS['back']" alt="Back" class="p-[13px]"/>
-        </button>
-        <h5 class="text-secondary text-[10px] xs:text-[9px] flex gap-[6px] items-center mx-[8px]">
-          <img loading="lazy" [src]="ICONS['userReal']" alt="User" />
-          <span>{{ processedCardData?.userName }} </span>
-          <img loading="lazy" [src]="ICONS['king']" alt="Favorite" />
-        </h5>
-        <lib-menu-btn (select)="handleMenueItemSelect()" (click)="handleMenuClick()" (change)="handleMenuItemChange()"
-          class="lib-menu-custom-class lib-menu-bg-none ms-auto" [disableTextShadow]="true" [menuItems]="libMenuItem">
-          <img loading="lazy" [src]="ICONS['horizontalWhite']" alt="tricolon" class="p-[6px]" />
-        </lib-menu-btn>
-      </div>
-
-      <div class="flex px-[12px]">
-        <div class="progress-bar"></div>
-        <div class="progress-bar"></div>
-        <div class="progress-bar"></div>
-      </div>
-
-      <div class="p-[12px]">
-        <div class="flex items-start story-content mb-[30px] p-[12px]"  *ngFor="let item of [1, 2, 3]" style="height: 91.9px;">
-          <div class="items-center sm:text-[10px] xs:text-[9px] flex flex-col gap-y-[0px] px-1">
-            <img loading="lazy" [src]="ICONS['upvote']" alt="Upvote" />
-            <span [class]="!isDraft ? 'text-primary' : 'drah-voter-header'">
-              {{ processedCardData?.upVotes }}
-            </span>
-            <img loading="lazy" [src]="ICONS['downvote']" alt="Downvote" />
-          </div>
-          <div class="py-[8px] px-[4px]">
-            <h5 class="text-secondary mb-2 opacity-80 text-[20px] xs:text-[15px] flex gap-[6px] items-center">
-              <img loading="lazy" class="story-avatar" [src]="ICONS['userReal']" alt="User" width="20" height="20"/>
-              <span class="story-author">{{ processedCardData?.userName }} </span>
-              <img loading="lazy" [src]="ICONS['king']" alt="Favorite" />
-            </h5>
-            <div class="relative">
-              <p class="story-text">
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt and also other texts
-                <span class="read-more-text">Read More</span>
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="flex items-start justify-end absolute story-right-info">
-        <div>
-          <div class="mb-[26px] flex flex-col items-center">
-            <img loading="lazy" [src]="ICONS['upvoteWhite']" alt="Upvote" />
-            <span class="votes-Count">
-              {{ processedCardData?.upVotes }}
-            </span>
-            <img loading="lazy" [src]="ICONS['downvoteWhite']" alt="Downvote" />
-          </div>
-
-          <div class="mb-[26px] flex flex-col items-center">
-            <img loading="lazy" class="mb-[4px]" [src]="ICONS['message']" alt="Message" />
-            <span class="votes-Count"> 23 </span>
-          </div>
-
-          <div class="mb-[16px] flex flex-col items-center">
-            <img loading="lazy" class="mb-[4px]" [src]="ICONS['forward']" alt="Forward" />
-            <span class="votes-Count"> Share </span>
-          </div>
-          <div class="flex flex-col items-center">
-            <img loading="lazy" class="mb-[4px]" [src]="ICONS['badge_check']" alt="Check" />
-          </div>
-        </div>
-      </div>
-      <div class="text-white absolute w-full story-bottom-info">
-        <div class="flex-1">
-          <h2 class="text-2xl font-bold story-title mb-[8px]">Adventure Tour</h2>
-          <div class="mb-[12px]">
-            <h5 class="text-secondary opacity-80 text-[10px] xs:text-[9px] flex gap-[6px] items-center">
-              <img loading="lazy" [src]="ICONS['userReal']" alt="User" width="12px" height="12px" />
-              <span>{{ processedCardData?.userName }} - {{ processedCardData?.timeAgo }}</span>
-            </h5>
-          </div>
-        </div>
-        <div class="flex items-center justify-between w-full">
-          <!-- Left-aligned div -->
-          <div class="flex space-x-1 justify-start">
-            <span class="story-bottom-info-badge ellipsis story-bottom-buttons-pink"><img loading="lazy" [src]="ICONS['temp']" alt="Place" />
-              Palace</span>
-            <span class="story-bottom-info-badge ellipsis story-bottom-buttons-white"><img loading="lazy" [src]="ICONS['coffee']" alt="Coffee" />
-              Coffee</span>
-            <span class="story-bottom-info-badge ellipsis story-bottom-buttons-white"><img loading="lazy" [src]="ICONS['template']" alt="Temple" />
-              Temple</span>
-            <span class="story-bottom-info-badge font-bold story-bottom-buttons-white">More +6</span>
-          </div>
-          <!-- Right-aligned div -->
-          <div class="flex justify-end items-end">
-            <div class="flex">
-              <div class="flex items-end gap-x-2">
-                <span class="text-xs user-text text-nowrap">
-                  {{ processedCardData?.users }}
-                  <span *ngIf="processedCardData && processedCardData!.users > 0">Users</span>
-                </span>
-                <img loading="lazy" [src]="processedCardData?.userimageSrc" alt="UserPic" />
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

package/src/lib/itinerary-app/shared/custom-story-card/custom-story-card.component.scss

@@ -1,286 +0,0 @@
-@use "../../_styles/colors" as *;
-
-.card-component {
-  --width: auto;
-  background: $background-color-1;
-  padding: 0px;
-  box-sizing: border-box;
-}
-
-.carousel-container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 82.5vh;
-  overflow: hidden;
-  padding: 0px;
-  box-sizing: border-box;
-}
-
-.carousel {
-  position: relative;
-  width: 90%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.card {
-  background-color: gray;
-  position: relative;
-  width: 100%;
-  border-radius: 6.56px;
-  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-  overflow: hidden;
-  align-items: center;
-  font-size: 1.5rem;
-  font-weight: bold;
-  transition: transform 0.5s ease-in-out, opacity 0.3s ease;
-  transform: translateY(100%); // Default starting state
-
-
-  &.above {
-    transform: translateY(-100%);
-    border-radius: 0px 0px 6.56px 6.56px;
-    opacity: 0.5;
-    z-index: 1;
-    height: 10%;
-    width: 90%;
-  }
-
-  &.active {
-    transform: translateY(0);
-    opacity: 1;
-    z-index: 2;
-    height: 100%;
-  }
-
-  &.below {
-    transform: translateY(100%);
-    border-radius: 6.56px 6.56px 0px 0px;
-    opacity: 0.5;
-    z-index: 1;
-    height: 10%;
-    width: 90%;
-  }
-
-  &.slide-up {
-    animation: slideUpIn 0.5s ease-out forwards;
-  }
-
-  &.slide-down {
-    animation: slideDownOut 0.5s ease-in forwards;
-  }
-}
-
-@keyframes slideUpIn {
-  0% {
-    transform: translateY(100%);
-    opacity: 0;
-  }
-  100% {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-@keyframes slideDownOut {
-  0% {
-    transform: translateY(0);
-    opacity: 1;
-  }
-  100% {
-    transform: translateY(-100%);
-    opacity: 0;
-  }
-}
-
-.header-container {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 10px 16px;
-  background: #1a1a1a;
-  border-radius: 12px 12px 0 0;
-
-  .back-btn,
-  .menu-btn {
-    background: none;
-    border: none;
-    font-size: 20px;
-    color: white;
-    cursor: pointer;
-  }
-
-  .user-info {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-
-    .avatar {
-      width: 32px;
-      height: 32px;
-      border-radius: 50%;
-    }
-
-    .username {
-      color: white;
-      font-size: 18px;
-      font-weight: 600;
-    }
-
-    .icon-crown {
-      color: gold;
-      font-size: 18px;
-    }
-  }
-}
-
-.progress-bar {
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(to right, #eaeaea80, #eaeaea80);
-  margin-top: 4px;
-  border-radius: 2px;
-  margin-left: 2px;
-}
-
-.story-content {
-  background: #27242c;
-  box-shadow:
-    9.0255px 8.205px 22.1535px rgba(17, 16, 20, 0.65),
-    -4.1025px -4.1025px 13.128px rgba(203, 199, 209, 0.25);
-  border-radius: 6.564px;
-}
-
-.votes-Count {
-  font-weight: 600;
-  font-size: 9.846px;
-  color: #ffffff;
-  text-shadow: 0px 1.06548px 2.13097px rgba(0, 0, 0, 0.5);
-  line-height: 100%;
-}
-
-.story-title {
-  font-weight: 500;
-  font-size: 19.692px;
-  line-height: 100%;
-  display: flex;
-  align-items: center;
-  color: #ffffff;
-  text-shadow: 0px 1.07px 2.13px 0px #00000080;
-}
-
-.story-bottom-info-badge {
-  font-family: "Gilroy";
-  font-style: normal;
-  font-weight: 500;
-  font-size: 8.205px;
-  line-height: 100%;
-  display: flex;
-  align-items: center;
-  text-wrap: nowrap;
-}
-
-.ellipsis {
-  white-space: nowrap;      /* keep text on one line */
-  overflow: hidden;         /* hide extra text */
-  text-overflow: ellipsis;
-}
-
-.story-bottom-buttons-pink {
-  color: #fe3c72;
-}
-
-.story-bottom-buttons-white {
-  color: white;
-}
-
-.story-text {
-  font-weight: 400;
-  font-size: 9.846px;
-  line-height: 150%;
-  text-align: start;
-  letter-spacing: -0.011em;
-  color: rgba(255, 255, 255, 0.8);
-  display: -webkit-box;
-  -webkit-line-clamp: 2;   /* limit to 2 lines */
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.read-more-text {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  font-weight: 400;
-  font-size: 9.846px;
-  line-height: 150%;
-  letter-spacing: -0.011em;
-  color: #fe3c72;
-  padding-left: 4px;
-  background-color: #27242c;
-}
-
-.story-avatar{
-  width: 20px;
-  height: 20px;
-}
-
-.story-author {
-  font-weight: 500;
-  font-style: Medium;
-  font-size: 13.13px;
-  line-height: 160%;
-  letter-spacing: 0%;
-}
-
-.story-img {
-  position: relative;
-  z-index: 0;
-}
-
-.story-img::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background: linear-gradient(
-    180deg,
-    rgba(0, 0, 0, 0.25) 0%,
-    rgba(0, 0, 0, 0.1) 21.35%,
-    rgba(0, 0, 0, 0) 51.04%,
-    rgba(0, 0, 0, 0.22) 69.27%,
-    rgba(0, 0, 0, 0.35) 100%
-  );
-  z-index: 1;
-  pointer-events: none;
-}
-
-.story-img > * {
-  z-index: 2;
-}
-
-.pic-switch-bar {
-  z-index: 100;
-}
-
-.custom-padding {
-  padding-top: 130px;
-}
-.story-bottom-info {
-  bottom: 16px;
-  padding: 0 12px;
-}
-.story-right-info {
-  top: 260px;
-  right: 8px;
-}
-.user-text {
-  font-size: 9.85px;
-  font-weight: 600;
-}

package/src/lib/itinerary-app/shared/custom-story-card/custom-story-card.component.ts

@@ -1,183 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  HostListener,
-  Input,
-  OnInit
-} from '@angular/core';
-import { Router } from '@angular/router';
-import { LibMenuItem } from '@naniteninja/ionic-lib';   
-import { ICONS } from '../../_constants/constants';
-import { ItinerariesRoutesEnum } from '../../_enums/ItenariesRoutes.enum';
-import { ICardData } from '../../_interface/cardData';
-import { Iicon } from '../../_interface/icon';
-import { ApiService } from '../../_services/api.service';
-import { Location } from '@angular/common';
-
-@Component({
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    selector: 'app-custom-story-card',
-    templateUrl: './custom-story-card.component.html',
-    styleUrl: './custom-story-card.component.scss',
-    standalone: false
-})
-export class CustomStoryCardComponent implements OnInit {
-  @Input() libMenuItem!: LibMenuItem[];
-  @Input() isDraft!: boolean;
-  cardData: ICardData | undefined;
-  private scrollTimeout: number | undefined;
-  private isScrolling = false;
-  processedCardData: ICardData | undefined;
-  ICONS: Iicon = ICONS;
-  cardDataForLocations = {
-    locationColumn1: [
-      { icon: ICONS['temp'], name: 'Palace' },
-      { icon: ICONS['palace2'], name: 'Template' },
-      { icon: ICONS['palace2'], name: 'Optional' },
-      { icon: ICONS['palace2'], name: 'Optional' },
-    ],
-    locationColumn2: [
-      { icon: ICONS['coffee'], name: 'Coffee shop' },
-      { icon: ICONS['template'], name: 'Optional' },
-      { icon: ICONS['template'], name: 'Optional' },
-      { icon: ICONS['template'], name: 'Optional' },
-    ],
-  };
-
-  images: string[] = [
-    "https://static.gopro.com/assets/blta2b8522e5372af40/blt2d5eb5852c683074/671a428c24f2274281f1fb1a/02_HP_H13CE_375.jpg",
-    "https://static.gopro.com/assets/blta2b8522e5372af40/blt2d5eb5852c683074/671a428c24f2274281f1fb1a/02_HP_H13CE_375.jpg",
-    "https://static.gopro.com/assets/blta2b8522e5372af40/blt2d5eb5852c683074/671a428c24f2274281f1fb1a/02_HP_H13CE_375.jpg"
-  ]
-  image: string = "https://static.gopro.com/assets/blta2b8522e5372af40/blt2d5eb5852c683074/671a428c24f2274281f1fb1a/02_HP_H13CE_375.jpg";
-
-  constructor(
-    private apiService: ApiService,
-    private router: Router,
-    private cdr: ChangeDetectorRef,
-    private location: Location
-  ) { }
-
-  @HostListener('window:wheel', ['$event'])
-  onWheel(event: WheelEvent) {
-    if (!this.isScrolling) {
-      this.isScrolling = true;
-
-      if (event.deltaY > 0) {
-        // Trigger your "next video" or content change here
-      } else if (event.deltaY < 0) {
-        // Trigger your "previous video" or content change here
-      }
-
-      // Wait until the gesture is finished
-      this.scrollTimeout = window.setTimeout(() => {
-        this.isScrolling = false;
-      }, 500); // Adjust this duration to feel smoother or stricter
-    }
-
-    // Optional: reset timeout if new scroll comes before timeout ends
-    clearTimeout(this.scrollTimeout);
-    this.scrollTimeout = window.setTimeout(() => {
-      this.isScrolling = false;
-    }, 500);
-  }
-
-  ngOnInit(): void {
-    this.loadCardData();
-    this.libMenuItem = this.libMenuItem.map((val) => {
-      if (val.title === 'EDIT_COMMENT') {
-        return {
-          ...val,
-          command: () => {
-            this.navToUpdateComment();
-          },
-        };
-      }
-      return val;
-    });
-  }
-
-  private InvalidDataCheck(data: string | number | null | undefined): boolean {
-    return (
-      data?.toString().length == 0 ||
-      data == null ||
-      data == undefined ||
-      data == '0' ||
-      data == 0 ||
-      data == '-'
-    );
-  }
-
-  private processCardData(data: ICardData): ICardData {
-    return {
-      ...data,
-      id: data.id ?? '0',
-      upVotes: this.InvalidDataCheck(data.upVotes) ? '00' : data.upVotes,
-      title: this.InvalidDataCheck(data.title)
-        ? 'Untitled Itinerary'
-        : data.title,
-      userName: this.InvalidDataCheck(data.userName) ? 'You' : data.userName,
-      timeAgo: this.InvalidDataCheck(data.timeAgo) ? '' : data.timeAgo,
-      users: this.InvalidDataCheck(data.users) ? 0 : data.users,
-      views: this.InvalidDataCheck(data.views) ? 0 : data.views,
-      comments: this.InvalidDataCheck(data.comments) ? 0 : data.comments,
-      shares: this.InvalidDataCheck(data.shares) ? 0 : data.shares,
-      imageSrc: this.InvalidDataCheck(data.imageSrc)
-        ? ICONS['untitled']
-        : data.imageSrc,
-      userimageSrc: this.InvalidDataCheck(data.userimageSrc)
-        ? ICONS['notSpecified']
-        : data.userimageSrc,
-      location: this.InvalidDataCheck(data.location)
-        ? 'Not Specified'
-        : data.location,
-    };
-  }
-
-  loadCardData() {
-    if (!this.isDraft) {
-      this.apiService.get('/assets/data.json').subscribe((data) => {
-        this.cardData = data as ICardData;
-        this.processedCardData = this.processCardData(this.cardData);
-        this.cdr.detectChanges();
-      });
-    } else {
-      this.cardData = this.createDummyCard();
-      this.processedCardData = this.processCardData(this.cardData);
-    }
-  }
-  createDummyCard(): ICardData {
-    let card: ICardData;
-    card = {
-      id: '1',
-      upVotes: '',
-      downVotes: 5,
-      title: '',
-      userName: '',
-      timeAgo: '',
-      location: '',
-      views: 0,
-      comments: 0,
-      shares: 0,
-      users: 0,
-      imageSrc: '',
-      userimageSrc: '',
-      isDraft: true,
-    };
-
-    return card;
-  }
-  handleMenueItemSelect(): void { }
-  handleMenuItemChange(): void { }
-  handleMenuClick(): void { }
-
-  goBack() {
-    this.location.back();
-  }
-
-  //NAVIGATION
-  navToUpdateComment(): void {
-    this.router.navigate([ItinerariesRoutesEnum.COMMENTS, this.cardData?.id]);
-  }
-}