//Service
// Service for handling Hero-related API calls
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { map, Observable, Subject } from 'rxjs';
import { Hero } from '../shared/hero';

@Injectable({
  providedIn: 'root'
})
export class HeroService {

  // Base URL for the API
  apiUrl = 'http://localhost:5116/api/'

  // HTTP options with headers
  httpOptions = {
    headers: new HttpHeaders({
      ContentType: 'application/json'
    })
  }

  constructor(private _httpClient: HttpClient) { }

  // Method to get all heroes from the API
  getHeroes(): Observable<Hero[]> {
    return this._httpClient.get<Hero[]>(`${this.apiUrl}Hero/GetAllHeroes`)
    .pipe(map(result => result))
  }

  // Method to get a specific hero by ID from the API
  getHero(heroId: number) {
    return this._httpClient.get(`${this.apiUrl}Hero/GetHero` + "/" + heroId)
    .pipe(map(result => result))
  }
}


//Home page
//HTML
<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
      Home
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  //Display skeleton loading cards if Heroes data is not available -->
  <div *ngIf="!Heroes">
    <ion-card>
      <ion-skeleton-text style="height:200px;" animated></ion-skeleton-text>
      <ion-card-header></ion-card-header>
    </ion-card>

    //Repeated skeleton cards for loading state -->
    <ion-card>
      <ion-skeleton-text style="height:200px;" animated></ion-skeleton-text>
      <ion-card-header></ion-card-header>
    </ion-card>

    <ion-card>
      <ion-skeleton-text style="height:200px;" animated></ion-skeleton-text>
      <ion-card-header></ion-card-header>
    </ion-card>

    <ion-card>
      <ion-skeleton-text style="height:200px;" animated></ion-skeleton-text>
      <ion-card-header>
        
      </ion-card-header>
    </ion-card>
  </div>

  //Pull-to-refresh functionality -->
  <ion-refresher slot="fixed" (ionRefresh)="refreshHeroes($event)">
    <ion-refresher-content refreshingText="Loading Heroes..."></ion-refresher-content>
  </ion-refresher>
  
  //Display hero cards when Heroes data is available -->
  <ion-card button *ngFor="let hero of (Heroes | async)" [routerLink]="['hero-detail', hero.heroId]">
    <ion-img [src]="hero.imageBase64"></ion-img>
  </ion-card>
</ion-content>

//TS
import { Component } from '@angular/core';
import { IonicModule, ToastController } from '@ionic/angular';
import { ExploreContainerComponent } from '../explore-container/explore-container.component';
import { Hero } from '../shared/hero';
import { HeroService } from '../services/hero.service';
import { AppModule } from '../app.module';
import { CommonModule } from '@angular/common';
import { Observable } from 'rxjs';
import { RouterLink } from '@angular/router';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: true,
  imports: [IonicModule, ExploreContainerComponent, AppModule, CommonModule, RouterLink],
})
export class Tab1Page {
  // Observable to hold the list of heroes
  Heroes: Observable<Hero[]>;

  constructor(private _toastController: ToastController, private _heroService: HeroService) {
    // Fetching heroes from the service
    this.Heroes = this._heroService.getHeroes();
  }

  ngOnInit() { }

  // Method to refresh the list of heroes
  refreshHeroes(event:any){
    this.Heroes = this._heroService.getHeroes();

    // Complete the refresh event
    event.target.complete();
    
    // Show a toast notification
    const toast = this._toastController.create({
      message: "Heroes are refreshed",
      duration: 3000,
      position: "bottom"
    })

    toast.then((toastMessage) => {
      toastMessage.present();
    })
  }
}



//hero detail page
//HTML
<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title></ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  //Display hero image -->
  <ion-img src={{heroDetail?.imageBase64}}></ion-img>
  
  //Hero details card -->
  <ion-card no-margin>
    <ion-card-header>
      <ion-card-title>
        {{heroDetail?.name}}
      </ion-card-title>
    </ion-card-header>
  </ion-card>

  <ion-card>
    <ion-list lines="none">

      //Display hero's age -->
      <ion-item>
        <ion-label>Age</ion-label>
        <ion-chip color="primary">{{heroDetail?.age}}</ion-chip>
      </ion-item>

      //Display hero's height -->
      <ion-item>
        <ion-label>Height</ion-label>
        <ion-chip color="secondary">{{heroDetail?.height}}</ion-chip>
      </ion-item>

      //Display hero's birthday -->
      <ion-item>
        <ion-label>Birthday</ion-label>
        <ion-chip>{{heroDetail?.birthday}}</ion-chip>
      </ion-item>

    </ion-list>
  </ion-card>

  //Floating action button to open modal for hero status -->
  <ion-fab vertical="top" horizontal="end" slot="fixed">
    <ion-fab-button (click)="openModal(heroDetail?.isAlive)">
      <ion-icon name="eye"></ion-icon>
    </ion-fab-button>
  </ion-fab>
</ion-content>

//TS
import { Component, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule, ModalController, ToastController } from '@ionic/angular';
import { HeroService } from '../services/hero.service';
import { ActivatedRoute } from '@angular/router';
import { HerostatusPage } from '../herostatus/herostatus.page';

@Component({
  selector: 'app-hero-detail',
  templateUrl: './hero-detail.page.html',
  styleUrls: ['./hero-detail.page.scss'],
  standalone: true,
  imports: [IonicModule, CommonModule, FormsModule]
})
export class HeroDetailPage implements OnInit {
  // Variable to hold the hero details
  heroDetail: any;

  constructor(
    private _toastController: ToastController, 
    private _heroService: HeroService, 
    private _modal: ModalController, 
    private route: ActivatedRoute
  ) {
    // Fetch the hero details based on the hero ID from the route parameters
    this._heroService.getHero(+this.route.snapshot.params['heroId']).subscribe(result => {
      this.heroDetail = result 
      
      // Show a toast notification
      const toast = this._toastController.create({
        message: "Hero " + this.heroDetail.name + " is viewable",
        duration: 3000,
        position: "bottom"
      })

      toast.then((toastMessage) => {
        toastMessage.present();
      })
    })
  }

  ngOnInit(): void { }

  // Method to open a modal showing the hero's status (alive or dead)
  async openModal(status: boolean) {
    const statusModal = await this._modal.create({
      component: HerostatusPage,
      componentProps: {
        value: status
      }
    })

    return await statusModal.present()
  }
}

//Hero status page
//HTML
<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>Hero Status</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-fab vertical="center" horizontal="center">
    <ion-fab-button *ngIf="value"> 
      <ion-icon name="happy-outline" *ngIf="value"> </ion-icon>
      Alive
    </ion-fab-button>
    <ion-fab-button *ngIf="!value"> 
      <ion-icon name="sad-outline" *ngIf="!value"></ion-icon>
      Dead
    </ion-fab-button>
  </ion-fab>

 <ion-button (click)="closeModal()" class="container" color="danger">
  <ion-icon name="close-circle-outline" size="large"></ion-icon>
 </ion-button>
</ion-content>

//TS
import { Component, Input, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule, ModalController } from '@ionic/angular';

@Component({
  selector: 'app-herostatus',
  templateUrl: './herostatus.page.html',
  styleUrls: ['./herostatus.page.scss'],
  standalone: true,
  imports: [IonicModule, CommonModule, FormsModule]
})
export class HerostatusPage implements OnInit {
  // Input property to receive the hero's status (alive or dead)
  @Input() value: any;

  constructor(private _modal: ModalController) { }

  ngOnInit() { }

  // Method to close the modal
  closeModal() {
    this._modal.dismiss()
  }
}

//HTML
<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title mode="md"> 
      <!-- md=material design -->
     <span>Home</span> 
     <ion-icon name="chevron-down-outline"></ion-icon>
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div class="borderBottom">
  <swiper-container [modules]="swiperModules"
  [slidesPerView]="1.2"
  [CenteredSlides]="true"
  [autoplay]="true"
  [pagination]="{clickable:true, dynamicBullets: true}"
  [spaceBetween]="20">
    
    <swiper-slide>
      <img src="assets/jollof1.jpeg"></swiper-slide>
    <swiper-slide>
      <img src="assets/Shisayanma.jpg">
    </swiper-slide>
    <swiper-slide>
      <img src="assets/Briyani.jpeg">
    </swiper-slide>
    
  </swiper-container>
</div>

<ion-list>
  <ion-list-header class="ion-margin-bottom">
    <ion-label>
      <h4>Restaurants Nearby</h4>
      <p>Explore exclusive flavors available near you</p>
    </ion-label>
  </ion-list-header>
  <ion-item lines="none">
    <ion-thumbnail slot="start">
      <img src="assets/jollof1.jpeg" />
    </ion-thumbnail>
    <ion-label>
      <h4>Jollof of Africa</h4>
      <ion-text color="medium">
        <p class="pStyle">
         African Cuisine
        </p>
      </ion-text>
      <span>
        5
        <ion-icon name="star"></ion-icon>
        .
      </span>
      25 mins . R100 for two
      <ion-text color="tertiary">
        <p class="distance">
          2.59 kms away
        </p>
      </ion-text>
    </ion-label>
  </ion-item>

  <ion-item lines="none">
    <ion-thumbnail slot="start">
      <img src="assets/Shisayanma.jpg" />
    </ion-thumbnail>
    <ion-label>
      <h4>Ayoba Cafe Shisanyama</h4>
      <ion-text color="medium">
        <p class="pStyle">
         African Cuisine
        </p>
      </ion-text>
      <span>
        4.4
        <ion-icon name="star"></ion-icon>
        .
      </span>
      15 mins . R120 
      <ion-text color="tertiary">
        <p class="distance">
          1.83 kms away
        </p>
      </ion-text>
    </ion-label>
  </ion-item>

  <ion-item lines="none">
    <ion-thumbnail slot="start">
      <img src="assets/Briyani.jpeg" />
    </ion-thumbnail>
    <ion-label>
      <h4>Spice-The Indian Kitchen</h4>
      <ion-text color="medium">
        <p class="pStyle">
         Asian Cuisine
        </p>
      </ion-text>
      <span>
        4.1
        <ion-icon name="star"></ion-icon>
        .
      </span>
      5 mins . R80 
      <ion-text color="tertiary">
        <p class="distance">
          0.9 km away
        </p>
      </ion-text>
    </ion-label>
  </ion-item>
</ion-list>
</ion-content>

//TS
import { Component, OnInit } from '@angular/core';
import { IonicSlides } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: './home.page.html',
  styleUrls: ['./home.page.scss'],
})
export class HomePage implements OnInit {
  
  swiperModules = [IonicSlides];
  constructor() { }

  ngOnInit() {
  }
}

//Services
//FakeSubscriptionDataService
import { Injectable } from "@angular/core";
import { Subscription } from "../tabs/Model/subscriptionModel";


@Injectable({
    providedIn: 'root'
})
export class FakeSubscriptionDataService {
    subscriptions : Subscription[];

    constructor () {
        this.subscriptions = [
            {
              id: 1,
              name: "Netflix",
              description:  "At Netflix, we want to entertain the world. Whatever your taste, and no matter where you live, we give you access to best-in-class TV series, documentaries, feature films and mobile games.",
              price : 199
            },
            {
              id: 2,
              name: "Showmax",
              description: "Showmax is an internet TV service. What sets Showmax apart is a unique combination of hit African content, first and exclusive international series, movies, the best kids’ shows, and live sport.",
              price : 349
            },
            {
              id: 3,
              name: "Amazon Prime Video",
              description: "Amazon Prime Video, or simply Prime Video, is an American subscription video on-demand over-the-top streaming and rental service of Amazon offered as a standalone service or as part of Amazon's Prime subscription.",
              price : 79
            },
            {
              id: 4,
              name: "Hulu",
              description: "Hulu is an American subscription streaming service majority-owned by The Walt Disney Company, with Comcast's NBCUniversal holding a minority stake that is pending sale to Disney; which will make Hulu into a wholly owned subsidiary of Disney.",
              price : 225
            },
            {
              id: 5,
              name: "Disney+",
              description: "Disney+ is an American subscription video on-demand over-the-top streaming service owned and operated by the Disney Entertainment division of The Walt Disney Company.",
              price : 119
            },
          ];
    }

    getOfferedSubscriptions () {
        return this.subscriptions;
    }
}
//SubscriptionCartOrganiserService
import { Injectable } from "@angular/core";
import { Subject } from "rxjs";
import { Subscription } from "../tabs/Model/subscriptionModel";
import { CartSubScription } from "../tabs/Model/cartSubscription";


@Injectable({
    providedIn: 'root'
})
export class SubscriptionCartOrganiserService {
    static tmpSubscriptionsCartName : string = "ls-cart-subscriptions";
    cartProductsNumberDS = new Subject<number>();
    cartItemsOrderName : string = "Subs Order @ ";

    notifyOnNewItemInCart() {
        this.cartProductsNumberDS.next(this.getNumberOfItemsInCart());
    }

    getLocalStorageSubscriptions(): Subscription[] {
        let storedSubString = localStorage.getItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName)
        let cartSubscriptions = [];
        if (storedSubString) {
          cartSubscriptions = JSON.parse(storedSubString)
        }
        return cartSubscriptions;
    }
    getNumberOfItemsInCart() : number {
        return this.getLocalStorageSubscriptions().length
    }

    getSubscriptionsInCart() : CartSubScription[] {
        let localStorageSubs = this.getLocalStorageSubscriptions();
        let cartSubscriptions : CartSubScription[] = [];

        let subCounts = new Map<Number, Number>(); //temporary storage
        localStorageSubs.forEach(sub => {
            if (!subCounts.has(sub.id)) {
                let count = localStorageSubs.filter(currSub => currSub.id == sub.id).length;
                subCounts.set(sub.id, count)
                let cartSub = new CartSubScription(sub, count);
                cartSubscriptions.push(cartSub);
            }
        });
        return cartSubscriptions;
    }

    getTotalCostOfSubcriptionsInCart() : number {
        let totalCost = 0;
        
        let cartSubs = this.getSubscriptionsInCart();
        cartSubs.forEach(cartSub => {
            totalCost += (cartSub.subscription.price * cartSub.quantity);
        });

        return totalCost;
    }

    getCartOrderName() {
        return this.cartItemsOrderName + Date.now();
    }

    addSubscriptionToCart(product : Subscription) {
        let storedSubString = localStorage.getItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName)
    
        let cartSubscriptions = [];
        if (storedSubString) {
          cartSubscriptions = JSON.parse(storedSubString)
        }
        cartSubscriptions.push(product);
        localStorage.setItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName, JSON.stringify(cartSubscriptions))
    
        this.notifyOnNewItemInCart();
      }
    

    removeProdFromCart(subscr : Subscription) {
        let storedSubString = localStorage.getItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName)
    
        let cartSubscriptions = [];
        if (storedSubString) {
          cartSubscriptions = JSON.parse(storedSubString)
        }
        for (var idx = 0; idx < cartSubscriptions.length; idx++) {
            if (cartSubscriptions[idx].id == subscr.id) {
                cartSubscriptions.splice(idx, 1);
                break;
            }
        }

        localStorage.setItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName, JSON.stringify(cartSubscriptions))

        this.notifyOnNewItemInCart();
    }

    addProdFromCart(subscr : Subscription) {
        this.addSubscriptionToCart(subscr);
        this.notifyOnNewItemInCart();   
    }

    clearCart () {
        localStorage.removeItem(SubscriptionCartOrganiserService.tmpSubscriptionsCartName);
        this.notifyOnNewItemInCart();
    }
}

//HTML
<ion-header>
  <ion-toolbar>
    <ion-searchbar
      #searchInput      
      placeholder="Search Resturant Name" 
      (ionInput)="onSearchChange($event)" 
      [(ngModel)]="query"
      ></ion-searchbar>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-list-header *ngIf="!isLoading && query && restaurants.length > 0">
      <ion-label>
        <h4>Search results for "{{query}}"</h4>
      </ion-label>
    </ion-list-header>
    <ion-item lines="none" *ngFor="let restaurant of restaurants" 
    [routerLink]="['/', 'tabs', 'restaurants', restaurant.uid]">
      <ion-thumbnail slot="start">
        <img [src]="restaurant?.cover ? restaurant.cover : 'assets/imgs/1.jpeg'" />
      </ion-thumbnail>
      <ion-label>
        <h4>{{restaurant?.name}}</h4>
        <ion-text color="medium">
          <p class="pStyle">
            {{getCuisine(restaurant?.cuisines)}}
          </p>
        </ion-text>
        <span>
          <ion-icon name="star"></ion-icon>
          {{restaurant?.rating}} .
        </span>
        {{restaurant?.delivery_time}} mins . R{{restaurant?.price}}
        <ion-text color="tertiary" *ngIf="restaurant?.distance && restaurant?.distance != 0">
          <p class="distance">
            {{restaurant?.distance | number: '0.0-2'}} kms away
          </p>
        </ion-text>
      </ion-label>
    </ion-item>
  </ion-list>
</ion-content>

//TS
import { Component, Input, OnInit, ViewChild } from '@angular/core';
import { Restaurant } from 'src/app/models/restaurant.model';
import { DataService } from 'src/app/services/data/data.service';

@Component({
  selector: 'app-search',
  templateUrl: './search.page.html',
  styleUrls: ['./search.page.scss'],
})
export class SearchPage implements OnInit {

  @Input() restaurant: Restaurant
  @ViewChild('searchInput') Input;
  isLoading: boolean;
  query: any;
  allPlaces: Restaurant[] = [];
  restaurants: Restaurant[] = [];

  constructor(private data: DataService) { }

  ngOnInit() {
    this.allPlaces = this.data.allPlaces;
    this.restaurants = this.allPlaces;
  }

  getCuisine(cuisine) {
    return cuisine.join(', ');
  }

  async onSearchChange(event) {
    this.query = event.detail.value.toLowerCase();
    this.restaurants = [];
    if(this.query.length > 0) {
      this.restaurants = await this.allPlaces.filter((element: any) => {
        return element.name.toLowerCase().includes(this.query);
      });
    }
    else{
      this.restaurants = this.allPlaces;
    };
  }
}

//HTML
<ion-header>
  <ion-toolbar mode="md">
    <ion-title>
      <span>Home</span>
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  
  <div class="borderBottom">
    <swiper-container [modules]="swiperModules"
    [slidesPerView]="1.2"
    [CenteredSlides]="true"
    [autoplay]="true"
    [pagination]="{clickable:true, dynamicBullets: true}"
    [spaceBetween]="20">
      
      <swiper-slide>
        <img src="assets/imgs/1.jpeg" style="width: 100%; height: 100%;">
      </swiper-slide>
      <swiper-slide>
        <img src="assets/imgs/2.jpeg" style="width: 100%; height: 100%;">
      </swiper-slide>
      <swiper-slide>
        <img src="assets/imgs/3.jpeg" style="width: 100%; height: 100%;">
      </swiper-slide>
      <swiper-slide>
        <img src="assets/imgs/4.jpeg" style="width: 100%; height: 100%;">
      </swiper-slide>
    </swiper-container>
  </div>

  <ion-list>
    <ion-list-header class="ion-margin-bottom">
      <ion-label>
        <h4>Restaurants Nearby</h4>
        <p>Explore distinctive flavors in your vicinity</p>
      </ion-label>
    </ion-list-header>
    <ion-item-group>
      <ion-item lines="none" *ngFor="let restaurant of restaurants" 
      [routerLink]="['/', 'tabs', 'restaurants', restaurant.uid]">
        <ion-thumbnail slot="start">
          <img [src]="restaurant?.cover ? restaurant.cover : 'assets/imgs/1.jpeg'" />
        </ion-thumbnail>
        <ion-label>
          <h4>{{restaurant?.name}}</h4>
          <ion-text color="medium">
            <p class="pStyle">
              {{getCuisine(restaurant?.cuisines)}}
            </p>
          </ion-text>
          <span>
            <ion-icon name="star"></ion-icon>
            {{restaurant?.rating}} .
          </span>
          {{restaurant?.delivery_time}} mins . R{{restaurant?.price}}
          <ion-text color="tertiary" *ngIf="restaurant?.distance && restaurant?.distance != 0">
            <p class="distance">
              {{restaurant?.distance | number: '0.0-2'}} kms away
            </p>
          </ion-text>
        </ion-label>
      </ion-item>
    </ion-item-group>
  </ion-list>
</ion-content>

//TS
import { Component, Input, OnInit } from '@angular/core';
import { IonicSlides } from '@ionic/angular';
import { Restaurant } from 'src/app/models/restaurant.model';
import { DataService } from 'src/app/services/data/data.service';

@Component({
  selector: 'app-home',
  templateUrl: './home.page.html',
  styleUrls: ['./home.page.scss'],
})
export class HomePage implements OnInit {

  swiperModules = [IonicSlides];
  @Input() restaurant: Restaurant
  restaurants: Restaurant[] = [];

  constructor(
    private data: DataService
  ) { }

  ngOnInit() {
      this.restaurants = this.data.restaurants;
  }

  getCuisine(cuisine) {
    return cuisine.join(', ');
  }
}

//HTML
<ion-tabs>
  <ion-tab-bar slot="bottom">
    <ion-tab-button tab="home">
      <ion-icon name="home-outline"></ion-icon>
      <ion-label>Home</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="search">
      <ion-icon name="search-outline"></ion-icon>
      <ion-label>Search</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="cart">
      <ion-icon name="cart-outline"></ion-icon>
      <ion-label>Cart</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="account">
      <ion-icon name="person-outline"></ion-icon>
      <ion-label>Account</ion-label>
    </ion-tab-button>
  </ion-tab-bar>
</ion-tabs>

//TS
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { TabsPage } from './tabs.page';

const routes: Routes = [
  {
    path: '',
    component: TabsPage,
    children: [
      {
        path: 'home',
        loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)
      },
      {
        path: 'search',
        loadChildren: () => import('./search/search.module').then( m => m.SearchPageModule)
      },
      {
        path: 'cart',
        loadChildren: () => import('./cart/cart.module').then( m => m.CartPageModule)
      },
      {
        path: 'account',
        loadChildren: () => import('./account/account.module').then( m => m.AccountPageModule)
      },
      {
        path: '',
        redirectTo: '/tabs/home',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: 'restaurants/:restaurantId',
    loadChildren: () => import('./items/items.module').then( m => m.ItemsPageModule)
  },
  {
    path: 'profile',
    loadChildren: () => import('./profile/profile.module').then( m => m.ProfilePageModule)
  },
  
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class TabsPageRoutingModule {}

{
  "eventId": 0,
  "associationId": 16,
  "eventTypeId": 2,
  "title": "International Conference on Artificial Intelligence",
  "description": "Join us for the largest gathering of AI experts and enthusiasts.",
  "cityId": 148013,
  "stateId": 32,
  "countryId": 1,
  "eventModeId": 45,
  "registrationStartDate": "2024-06-17T06:32:21.324Z",
  "registrationEndDate": "2024-06-18T06:32:21.324Z",
  "eventStartDate": "2024-06-18T06:32:21.324Z",
  "eventEndDate": "2024-06-23T06:32:21.324Z",
  "broucherUrl": "",
  "address": "Kondapur",
  "videoUrl": "https://youtube.com/shorts/t6SLjTQbPh0?si=gJ9_eiYVqS3JFsGJ",
  "eventStatusId": 0,
  "phoneCode": "+91",
  "contactNumber": "7894561235",
  "contactEmail": "info@exampleconference.com",
  "webSite": "https://exampleconference.com",
  "geolocation": {
    "x": 17.419791987251436,
    "y": 78.32488111758651
  },
  "isFreeEvent": true,
  "bannerUrls": [
    "https://conference.ebai.org/wp-content/uploads/2023/07/slide-conf23.jpg"
  ],
  "organizingGroups": [
    64
  ],
  "eventRegistrationDetails": [
    {
      "eventRegistrationDetailId": 0,
      "eventId": 0,
      "isFoodProvided": true,
      "isAccommodationProvided": true,
      "isTransportProvided": true,
      "title": "Full Conference Pass",
      "applicableTillDate": "2024-06-18T06:32:21.324Z",
      "applicableRegistrationFee": 5000,
      "applicableCurrencyCode": "INR",
      "onspotCurrencyCode": "INR",
      "onSpotRegistrationFee": 2500,
      "registeredMembers": 0
    }
  ],
  "agenda": [
    {
      "eventAgendaId": 0,
      "eventId": 0,
      "title": "Keynote Address: Future Trends in AI",
     "description": "A look into the future of artificial intelligence and its impact on society.",
     "agendaDate": "2024-06-01T12:42:32.972Z",
     "startTime": "10:00:00",
     "endTime": "16:00:00",
     "presenters": [
    267,160
   ],
 "presentersDetails": ""
 }
  ],
  "eventGuidelines": {
    "eventGuidelineId": 0,
    "eventId": 0,
    "registrationGuidelines": "Participants are encouraged to pre-register for the event",
    "cancellationGuidelines": "Clearly communicate the reason for the cancellation",
    "importantGuidelines": "Prioritize the safety and wellbeing of attendees"
  },
  "eventAccountInfo": {
    "eventAccountInfoId": 0,
    "eventId": 0,
    "name": "Conference Organizing Committee",
    "bankName": "Canara Bank",
    "bankAccountNumber": "85986263456",
    "bankRoutingTypeId": 46,
    "bankRoutingType": "IFSC",
    "bankRoutingCode": "Canara123456",
    "isOrgAccount": true
  },
  "hasRegistered": true,
  "bannerUrlsString": "string",
  "eventType": "Workshop",
  "eventMode": "Hybrid"
}

<ion-header>
  <ion-toolbar color="primary">
    <ion-title>Items in Cart</ion-title>
    <ion-buttons slot="end">
      <ion-button fill="clear">
        <ion-icon name="power-outline" color="white" slot="icon-only"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content class="ion-margin">
  <ion-grid class="ion-margin">
    <ion-row>
      <ion-col><b>Subscription</b></ion-col>
      <ion-col><b>Price</b></ion-col>
      <ion-col><b>Quantity</b></ion-col>
      <ion-col><b>Total Cost</b></ion-col>
    </ion-row>

    <ion-row *ngFor="let cartSub of subscriptionsInCart">
      <ion-col>{{cartSub.subscription.name}}</ion-col>
      <ion-col>R{{cartSub.subscription.price}}</ion-col>
      <ion-col>{{cartSub.quantity}}</ion-col>
      
      <ion-icon name="caret-back-outline" (click)="reduceProdCount(cartSub.subscription)"></ion-icon>
      <ion-icon name="caret-forward-outline" (click)="increaseProdCount(cartSub.subscription)"></ion-icon>
      <ion-col>{{cartSub.totalCost}}</ion-col>

    </ion-row>
  </ion-grid>

  <ion-col size="6">
    <ion-button fill="outline" expand="block" color="primary"><b>Total: R{{totalCostOfSubcriptionsInCart}}</b></ion-button>    
  </ion-col>

  <ion-col size="6">
    <ion-button expand="block" (click)="setOpen(true)">Checkout</ion-button>
    <ion-modal [isOpen]="isModalOpen">
      <ng-template>
        <ion-header>
          <ion-toolbar>
            <ion-title></ion-title>
            <ion-buttons slot="end">
              <ion-button (click)="setOpen(false)">Close</ion-button>
            </ion-buttons>
          </ion-toolbar>
        </ion-header>
        
        <ion-content class="ion-padding">
          <p>
            Payment Successful
          </p>
        </ion-content>
      </ng-template>
    </ion-modal> 
  </ion-col>
</ion-content>

//Additional code
//TS
import { Component, OnInit } from '@angular/core';

import { CartSubScription } from '../Model/cartSubscription';
import { Subscription } from '../Model/subscriptionModel';
import { SubscriptionCartOrganiserService } from '../../services/SubscriptionCartOrganiserService';

@Component({
  selector: 'app-cart',
  templateUrl: './cart.page.html',
  styleUrls: ['./cart.page.scss'],
})
export class CartPage implements OnInit {
  subscriptionsInCart : CartSubScription [] = [];
  totalCostOfSubcriptionsInCart :number = 0;
  isModalOpen = false;
  constructor(private cartManager : SubscriptionCartOrganiserService) {
    this.loadSubscriptions();
    cartManager.cartProductsNumberDS.subscribe(num => {
        this.loadSubscriptions();
    });
  }
  
  ngOnInit(): void {
  }
  setOpen(isOpen: boolean) {
    this.isModalOpen = isOpen;
  }

  loadSubscriptions() {
    this.subscriptionsInCart = this.cartManager.getSubscriptionsInCart();
    this.totalCostOfSubcriptionsInCart = this.cartManager.getTotalCostOfSubcriptionsInCart();
  }

  increaseProdCount (sub : Subscription) {
    for (var idx = 0; idx < this.subscriptionsInCart.length; idx++) {
      if (this.subscriptionsInCart[idx].subscription.id == sub.id) {
        this.cartManager.addProdFromCart(this.subscriptionsInCart[idx].subscription);
      }
    }
  }

  reduceProdCount (sub : Subscription) {
    for (var idx = 0; idx < this.subscriptionsInCart.length; idx++) {
      if (this.subscriptionsInCart[idx].subscription.id == sub.id) {
         this.cartManager.removeProdFromCart(this.subscriptionsInCart[idx].subscription);
      }
    }
  }
}

<ion-header>
  <ion-toolbar color="primary">
    <ion-title>Streaming Providers</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>    
    <div class="card m-3" style="width: 20rem;" *ngFor="let prod of products"> 
      <ion-card>
        <ion-card-header>
          <ion-card-title> {{prod.name}} </ion-card-title>
        </ion-card-header>

        <ion-card-content> {{prod.description}} </ion-card-content>            
                  
        <ion-button (click)="addSubscriptionToCart(prod)">Add to cart</ion-button>
        
      </ion-card>      
    </div>      
  </ion-list>
</ion-content>


//Additional Code
//TS
import { Component, OnInit } from '@angular/core';

import { Subscription } from '../Model/subscriptionModel';
import { FakeSubscriptionDataService } from '../../services/FakeSubscriptionDataService';
import { SubscriptionCartOrganiserService } from '../../services/SubscriptionCartOrganiserService';
import { InfiniteScrollCustomEvent } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: './home.page.html',
  styleUrls: ['./home.page.scss'],
})
export class HomePage implements OnInit {
  products : Subscription[] | undefined;
  items = [];
  constructor(private fakeDataProvider : FakeSubscriptionDataService, private cartSubscriptionService : SubscriptionCartOrganiserService) {
    this.products = fakeDataProvider.getOfferedSubscriptions();
  }
  ngOnInit() {}

addSubscriptionToCart(product : Subscription) {
  this.cartSubscriptionService.addProdFromCart(product);
}
}

//tabs page html
<ion-tabs>
    <ion-tab-bar slot="bottom">
        <ion-tab-button tab="home">
            <ion-icon name="home-outline"></ion-icon>
            <ion-label>Home</ion-label>
        </ion-tab-button>
        <ion-tab-button tab="cart">
            <ion-fab>{{numCartItems}}</ion-fab>
                <ion-icon name="cart-outline"></ion-icon>
            <ion-label>Cart</ion-label>
        </ion-tab-button>        
    </ion-tab-bar>
</ion-tabs>

//tabs routing module ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { TabsPage } from './tabs.page';

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children:[
      {
        path: 'home',
        loadChildren: () => import('./home/home.module').then(m=> m.HomePageModule)
      },
      {
        path: 'cart',
        loadChildren: () => import('./cart/cart.module').then( m => m.CartPageModule)
      }
    ]
  },
  {
    path: '',
    redirectTo: '/tabs/home',
    pathMatch: 'full'
  },
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class TabsPageRoutingModule {}


//Additional code
//tabs page ts
import { Component, OnInit } from '@angular/core';
import { SubscriptionCartOrganiserService } from '../services/SubscriptionCartOrganiserService';

@Component({
  selector: 'app-tabs',
  templateUrl: './tabs.page.html',
  styleUrls: ['./tabs.page.scss'],
})
export class TabsPage implements OnInit {

  numCartItems : number = 0;
  constructor(private cartManager : SubscriptionCartOrganiserService) {
    this.numCartItems = cartManager.getNumberOfItemsInCart();
    
    cartManager.cartProductsNumberDS.subscribe(num => {
      this.numCartItems = num;
    });
   }

  ngOnInit() {
  }
}

int main() {
   /* printf() function to write Hello, World! */
   printf( "Hello, World!" );
}

int main() {
   /* printf() function to write Hello, World! */
   printf( "Hello, World!" );
}

//TS
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { Chart, registerables } from 'chart.js';
import { RegionModel } from '../Models/regionModel';
import { RegionService } from '../service/region.service';


Chart.register(...registerables);

@Component({
  selector: 'app-charts',
  standalone: true,
  imports: [],
  templateUrl: './charts.component.html',
  styleUrl: './charts.component.scss'
})
export class ChartsComponent implements OnInit{
  data: any;
  @ViewChild('myTemp')
  myTempRef!: ElementRef;

 
  constructor(private regionService : RegionService) {}
  
  ngOnInit(): void {
    this.regionService.getRegions().subscribe(response => {
      let regionList = response;

      this.data = response.$values;
      
      this.populateChartData(this.data);
      console.log('data',regionList)
      return regionList
    });
  }

  populateChartData(data: RegionModel[]) {
    
    let labelsData: string [] = [];
    let labelsPopulation: number [] = [];
    
    data.forEach((element: any) => {
      labelsData.push(element.code);
      labelsPopulation.push(element.population)
    });


    new Chart("barchart", {
      type: 'bar',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
        }]
      },
      
      options: {
        scales: {
          y: {
            beginAtZero: true
          },
        }
      
      }
    });
    

    new Chart("piechart", {
      type: 'pie',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
        }]
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

    new Chart("dochart", {
      type: 'doughnut',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
        }]
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

    new Chart("pochart", {
      type: 'polarArea',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
        }]
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

    new Chart("rochart", {
      type: 'radar',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
        }]
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

    new Chart("linechart", {
      type: 'line',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
          
        }]
        
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

    new Chart("bubchart", {
      type: 'bubble',
      data: {
        labels: labelsData,
        datasets: [{
          label: '# of Population',
          data: labelsPopulation,
          borderWidth: 1
          
        }]
        
      },
      options: {
        scales: {
          y: {
            beginAtZero: true
          }
        }
      }
    });

  }

}
//HTML
<div class="row">
    <div class="col-lg-6">
        <h2>Line Chart</h2>
        <canvas id="linechart"></canvas>
    </div>
    <div class="col-lg-6">
        <h2>Bar Chart</h2>
        <canvas id="barchart"></canvas>
    
    </div>
    <div class="col-lg-6">
        <h2>Pie Chart</h2>
        <canvas id="piechart"></canvas>
        
    </div>
    <div class="col-lg-6">
        <h2>Doughnut Chart</h2>
        <canvas id="dochart"></canvas>
    </div>
    <div class="col-lg-6">
        <h2>polarArea Chart</h2>
        <canvas id="pochart"></canvas>
    </div>

    <div class="col-lg-6">
        <h2>Radar Chart</h2>
        <canvas id="rochart"></canvas>
    </div>
</div>

from human_readable.files import file_size
import os

print(file_size(value = os.stat('test.txt').st_size))

{
  "associationAccountInfoId": 0,
  "associationId": 16,
  "name": "",
  "bankName": "",
  "bankAccountNumber": "",
  "bankRoutingTypeId": 0,
  "bankRoutingCode": "",
  "upiId": "Helpageindia@IndianBank",
  "bankingPaymentTypeId": 171,
  "isDefault": true,
  "kycTypeId": 115,
  "kycType": "PANU",
  "kycDocumentUrl": "https://s3.ap-south-1.amazonaws.com/myassociation-dev-objects/Kyc Document2/drylab.pdf",
  "kycVerificationStatusId": 131,
  "kycVerificationStatus": "Accepted"
}

<div class="container-fluid">
			<div class="progress" style="height: 30px;">
				<div class="progress-bar bg-secondary" role="progressbar" style="width: 95%; height: 30px;">95%</div>
			</div>
			<div class="progress mt-4" style="height: 30px;">
				<div class="progress-bar bg-secondary" role="progressbar" style="width: 85%; height: 30px;">85%</div>
			</div>
			<div class="progress mt-4" style="height: 30px;">
				<div class="progress-bar bg-secondary" role="progressbar" style="width: 80%; height: 30px;">80%</div>
			</div>
			<button class="mt-3"><i class="fa-solid fa-download"></i> Download Resume</button>
		</div>
		<div class="container">
			<h5 class="mt-5">How much I charge</h5>
		</div>

public class GenericApp {

    public static void main(String[] args) {
        
        MyGeneric<String> single = new MyGeneric<>("Ichwan");
        generate(single);

    }

    public static void generate(MyGeneric<? extends Object> data){
        System.out.println(data.getData());
    }
}

ArrayList<Number> numbers = new ArrayList<Number>();
// Ini akan menghasilkan kesalahan kompilasi
ArrayList<Integer> integers = numbers;

def divide(a, b):
    assert b != 0
    print(f"{a} / {b} = {a/ b}")

divide(10, 2)
divide(10, 0)

#the break statement, causes the loop to immediately terminate.

seq = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

for i in seq:
    #define the condition
    if i == 5:
        break
    print(i)

print('after the loop')

#import the random module
import random

#The sequence to choose from
L = ['Python', 'Javascript', 'Ruby', 'Java', 'PHP', 'C++', 'C#', 'HTML', 'CSS']

#Choose random items from the list
print(random.choices(L, k = 3))

class Person:
    def __init__(self, name, age):
       self.name = name
       self.age = age

class Student(Person):
     def __init__(self, name, age, school):
        super().__init__(name, age)
        self.school = school

#Check whethe a class is a  subclass of another
print(issubclass(Student, Person))

#an exception to be raised by an empty stack
class EmptyStack(Exception):
    pass

class Stack:
    
    def __init__(self):
        self._items = [] #non-public list for storing stack elements

    def __len__(self):
        return len(self._items)

    def isEmpty(self):
        return len(self) == 0 

    def push(self, e):
        self._items.append(e) #add the element at the end of the list

    def top(self):
        if self.isEmpty():
            raise EmptyStack("Stack Is Empty.")
        return self._items[-1] #Return the last element in list

    def pop(self):
        if self.isEmpty():
            raise EmptyStack("Stack Is Empty.")
        return self._items.pop() #pop the last item from the list

# test the stack
S = Stack()

S.push("A")
S.push("B")
S.push("C")
print(S.pop())
print(S.pop())
print(S.pop())
print(S.pop())

#merge sort

#the merge algorithm
def merge(L1, L2, L):
  i = 0
  j = 0
  while i+j < len(L):
    if j == len(L2) or (i < len(L1) and L1[i] < L2[j]):
       L[i+j] = L1[i]
       i += 1
    else:
       L[i+j] = L2[j]
       j += 1

#main function
def merge_sort(L):

  n = len(L)
  if n < 2:
     return # list is already sorted

  # divide
  mid = n // 2 #midpoint
  L1 = L[0:mid] # the first half
  L2 = L[mid:n] # the second half
 
  # conquer with recursion
  merge_sort(L1) # sort first sub-list
  merge_sort(L2) # sort second sub-list

  # merge result
  merge(L1, L2, L) 

#example
L = [7, 5, 1, 4, 2, 8, 0, 9, 3, 6]
print('Before: ', L)
merge_sort(L)
print('After: ', L)

def insertion_sort(lst):
   for i in range(1, len(lst)):
      j = i
      while (j > 0) and lst[j-1] > lst[j]:
         lst[j-1], lst[j] = lst[j], lst[j-1] #swap the elements
         j -=1

#sort a list
L = [5, 2, 9, 3, 6, 1, 0, 7, 4, 8]
insertion_sort(L)
print("The sorted list is: ", L)

#descending selection sort
def selection_sort(lst):
  for i in range(len(lst)):
    smallest = i

    for j in range(i + 1, len(lst)):
      if lst[j] > lst[smallest]:
        smallest = j

    lst[i], lst[smallest] = lst[smallest], lst[i] #swap the elements

#sort a list
L = [99, 9, 0, 2, 1, 0, 1, 100, -2, 8, 7, 4, 3, 2]
selection_sort(L)

print("The sorted list is: ", L)

def selection_sort(lst):
  for i in range(len(lst)):
    smallest = i

    for j in range(i + 1, len(lst)):
      if lst[j] < lst[smallest]:
        smallest = j

    lst[i], lst[smallest] = lst[smallest], lst[i] #swap the elements

#sort a list
L = [99, 9, 0, 2, 1, 0, 1, 100, -2, 8, 7, 4, 3, 2]
selection_sort(L)

print("The sorted list is: ", L)

#Optimized bubble sort
def bubble_sort(lst):

  swapped = True
  while swapped == True:
    swapped = False
    for j in range(len(lst)-1):  
      
      if(lst[j]>lst[j+1]):
        lst[j], lst[j + 1] = lst[j + 1], lst[j] #swap the elements
        swapped = True

#sort a list
L = [9, 0, 2, 1, 0, 1, 100, -2, 8, 7, 4, 3, 2]

bubble_sort(L)  
print("The sorted list is: ", L)

#import the random module
import random

#The list to shuffle
my_list = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

#shuffle the list in-place
random.shuffle(my_list)

print(my_list)

#import the random module
import random

#The sequence to sample
my_seq = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

#get a sample of 4 elements
print(random.sample(my_seq, 4))

myset = {1, 3, 5, 7, 9, 11}

#remove an arbitrary element
print(myset.pop())
print(myset.pop())
print(myset.pop())
print(myset.pop())

print(myset)

#raises a KeyError if the element does not exist

myset = {0, 2, 3, 4, 6, 7, 8, 9}
myset.remove(3)
myset.remove(7)
myset.remove(9)

print(myset)

#unlike set.remove(), If the target element does not exist, set.discard method does not raise a KeyError, it returns None instead.

myset = {1, 3, 4, 5, 7, 8, 9}

#remove elements
myset.discard(4)
myset.discard(8)

print(myset)

myset = {'Python', 'Java', 'C++'}

#add elements to the set
myset.add('PHP')
myset.add('HTML')
myset.add('Javascript')

print(myset)

import functools

def power(a, b):
    return a ** b

square = functools.partial(power, b = 2)
cube = functools.partial(power, b = 3)

print(square(5))
print(cube(5))

#finally block always gets executed
#else block is only executed if no exception was raised

import math

try:
   print("Hello, World!")
   print(10/ 5)
   print(math.sqrt(-9))

except ValueError:
   print("a ValueError has occurred")

except IndexError:
    print("IndexError has occurred")

else:
    print("No Exception was raised.")
finally:
    print("This block always gets executed")

#The else block only gets executed if the try block terminates successfully i.e  no exception was raised inside the block.


import math

try:
   print("Hello, World!")
   print(10/ 2)
   print(math.sqrt(9))

except ValueError:
   print("a valu error has occurred")

except IndexError:
    print("IndexError has occurred")

else:
    print("No Exception was raised.")

import math

try:
   
   #This will raise a TypeError
   print( 3 + 'hello' )

   #This will raise a ValueError
   math.sqrt(-16)

   #This will raise a NameError
   print(a)
   
   #This will raise a zeroDivisionError
   print(10 / 0)

except NameError:
    print("A NameError occurred")

except ValueError: 
    print("A ValueError occurred")

except ZeroDivisionError:
    print("A ZeroDivisionError occurred")

except TypeError:
    print("A TypeError occurred")

try:
   
    print(1 / 0)

except ZeroDivisionError:
    print("You divided a number by 0.")

#import the ChainMap class
from collections import ChainMap

d1 = {'one': 1, 'two': 2, 'three': 3}
d2 = {'four': 4, 'five': 5, 'six': 6}
d3 = {'seven': 7, 'eight': 8, 'nine': 9}

chain = ChainMap(d1, d2, d3)

print(chain)

#a list of strings
languages = ['Python', 'Java']

#append an element
languages.append('PHP')
print(languages)

languages.append('C++')
print(languages)

languages.append('Javascript')
print(languages)

def add(a, b):
    print(f'{a} + {b} = {a + b}')

a = 10
b = 20
add(a, b)