sami.fix : fixing the registration issue and adding the team format a…

…nd then mixing with chat bot and eligiblity
RealEskalate · May 31, 2024 · 93eabec · 93eabec
1 parent 9e1a52b
commit 93eabec
Show file tree

Hide file tree

Showing 7 changed files with 108 additions and 50 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -1,34 +1,41 @@
-
 <!-- <app-privacy-consent></app-privacy-consent> -->
 
 <app-consent></app-consent>
 <ng-container *ngIf="isModalOpen">
   <div
-    class="fixed  top-0 left-0 z-50   w-full mt-5  pt-3  flex flex-col justify-end"
+    class="fixed top-0 left-0 z-50 w-full mt-5 pt-3 flex flex-col justify-end"
   >
     <div class="modal-overlay"></div>
     <div
-      class="border border-gray-600   modal-box w-11/12 max-sm:w-full max-sm:mx-2 max-w-5xl bg-gray-900 text-center flex flex-col mt-4  shadow-lg m-auto"
+      class="border border-gray-600 modal-box w-11/12 max-sm:w-full max-sm:mx-2 max-w-5xl bg-gray-900 text-center flex flex-col mt-4 shadow-lg m-auto"
     >
-      <app-what-we-provide ></app-what-we-provide>
+      <app-what-we-provide></app-what-we-provide>
     </div>
   </div>
 </ng-container>
 <div *ngIf="!modalOpen" class="relative z-41">
   <app-header [currentSection]="currentSection"></app-header>
 </div>
-<div *ngIf="isWinnerModalOpen" class="fixed h-full w-full border-red-500    pt-2  z-50">
+<div
+  *ngIf="isWinnerModalOpen"
+  class="fixed h-full w-full border-red-500 pt-2 z-50"
+>
   <app-winner_modal
-  [showModal]="isModalOpen"
-  [modalData]="modalData"
-  (closeModalEvent)="closeModal()"
-></app-winner_modal>
+    [showModal]="isModalOpen"
+    [modalData]="modalData"
+    (closeModalEvent)="closeModal()"
+  ></app-winner_modal>
 </div>
-
-<div *ngIf="showPartnerButton" style="position: fixed; top: 45vh; left: -40px; z-index: 1000">
-  <a href="https://form.typeform.com/to/opvWnrn7" target="_blank" (click)="openButton('partner', 'https://form.typeform.com/to/opvWnrn7')">
+<div
+  *ngIf="showPartnerButton"
+  style="position: fixed; top: 45vh; left: -40px; z-index: 1000"
+>
+  <a
+    href="https://form.typeform.com/to/opvWnrn7"
+    target="_blank"
+    (click)="openButton('partner', 'https://form.typeform.com/to/opvWnrn7')"
+  >
     <button
-
       class="px-4 py-3 rounded-md transition-transform duration-300 ease-in-out bg-gradient-to-r from-indigo-600 to-pink-500"
       style="transform: rotate(270deg)"
     >
@@ -45,7 +52,9 @@
   <app-info></app-info>
 </div>
 
-
+<div id="eligibility" class="relative z-40">
+  <app-eligibility (openChatEvent)="openChat()"></app-eligibility>
+</div>
 <div id="home" class="relative z-40">
   <app-home (toggleChatEvent)="changeChatState($event)"></app-home>
 </div>
@@ -63,13 +72,10 @@
   <app-workshop></app-workshop>
 </div> -->
 
-
 <!-- <div id="judges" class="relative z-40">
   <app-judges></app-judges>
 </div> -->
-<!-- <div id="eligibility" class="relative z-40">
-  <app-eligibility (openChatEvent)="openChat()"></app-eligibility>
-</div> -->
+
 <div id="about-us" class="relative z-40">
   <app-about-us></app-about-us>
 </div>
@@ -95,7 +101,9 @@
 <div id="footer" class="relative z-40">
   <app-footer></app-footer>
 </div>
-<!-- <div
+
+
+ <div
   *ngIf="!modalOpen"
   class="fixed {{
     showChat ? 'h-5/6 w-1/3' : 'h-auto w-auto'
@@ -122,13 +130,13 @@
         d="M312.54 415.38a165.32 165.32 0 01-23.26 2.05c-42.43 0-82.5-11.2-115-32.2a184.09 184.09 0 01-53.09-49.32c-26.08-34.57-40.3-78.51-40.3-124.49 0-3.13.11-6.14.22-9.16a4.34 4.34 0 00-7.54-3.12 158.76 158.76 0 00-14.86 195.24c2.47 3.77 3.87 6.68 3.44 8.62l-14.09 72.26a4 4 0 005.22 4.53l68-24.24a16.85 16.85 0 0112.92.22c20.35 8 42.86 12.92 65.37 12.92a169.45 169.45 0 00116.63-46 4.29 4.29 0 00-3.66-7.31z"
       />
     </svg>
-    <!-- <img
+     <!-- <img
       *ngIf="!showChat"
       src="assets/mingcute_message-4-fill.svg"
       alt="..."
       class="w-8 h-8"
-    /> -->
-     <!--<svg
+    />  -->
+<svg
       *ngIf="showChat"
       xmlns="http://www.w3.org/2000/svg"
       fill="none"

diff --git a/src/app/components/landing/landing.component.html b/src/app/components/landing/landing.component.html
@@ -1,6 +1,17 @@
-<div id="landing" class="min-h-screen pt-[0px] lg:pt-[0px] bg-blue-950 bg-opacity-50 relative">
-  <video autoplay [muted]="isMuted" loop class="w-full h-full object-cover absolute z-0">
-    <source src="https://res.cloudinary.com/eskalate/video/upload/v1716272816/Hackathon/Hackathon_2023_Highlights_RAW_V1.mp4" type="video/mp4">
+<div
+  id="landing"
+  class="min-h-screen pt-[0px] lg:pt-[0px] bg-blue-950 bg-opacity-50 relative"
+>
+  <video
+    autoplay
+    [muted]="isMuted"
+    loop
+    class="w-full h-full object-cover absolute z-0"
+  >
+    <source
+      src="https://res.cloudinary.com/eskalate/video/upload/v1716272816/Hackathon/Hackathon_2023_Highlights_RAW_V1.mp4"
+      type="video/mp4"
+    />
     Your browser does not support the video tag.
   </video>
   <app-registration [comingName]="individualName" [showModal]="showIndividualRegistrationModal" [registrationLink]="indivisualRegistrationLink" (closeModalEvent)="onHideModal()"></app-registration>
@@ -11,15 +22,16 @@
   <div
     class=" h-[100vh] lg:pt-[18vh] px:5 md:px-20 flex flex-col max-lg:justify-center justify-start items-start  z-1 relative drop-shadow-2xl bg-black bg-opacity-50"
   >
-
-    <div class=" text-white px-5">
-      <section  class=" left col-span-2  p-5 md:h-full flex flex-col items-center md:items-start justify-between ">
+    <div class="text-white px-5">
+      <section
+        class="left col-span-2 p-5 md:h-full flex flex-col items-center md:items-start justify-between"
+      >
         <div
           class="w-full flex flex-col max-md:items-center items-start leading-relaxed mb-5"
         >
           <!-- A2SV Hackathon, 2023 -->
           <h1
-            class=" text-left w-full max-md:text-center text-xl font-bold md:text-3xl lg:text-5xl"
+            class="text-left w-full max-md:text-center text-xl font-bold md:text-3xl lg:text-5xl"
           >
             A2SV Hackathon, 20244
           </h1>
@@ -30,10 +42,13 @@
           </h1>
         </div>
 
-        <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-down></h2>
+        <h2>
+          <app-count-down
+            class="inline-block pl-0 max-md:text-center"
+          ></app-count-down>
+        </h2>
 
-
-          <div
+        <div
           class="max-md:mt-8 flex flex-col md:flex-row justify-center max-md:items-center md:justify-start mt-3"
         >
 
@@ -74,12 +89,9 @@ <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-dow
 
 
         </div>
-
-
-
       </section>
       <!-- <section class="right col-span-1 md:col-span-6  md:h-full md:px-5 mb-10 "> -->
-        <!-- <p class="my-4 tracking-tight leading-a.5 text-justify justify-between">
+      <!-- <p class="my-4 tracking-tight leading-a.5 text-justify justify-between">
           Join Africa’s largest Hackathon in 2024, focused on creating social
           and economic solutions with AI. This is the largest hackathon in
           Africa, connecting students, mentors, and industry leaders to develop
@@ -91,10 +103,8 @@ <h2><app-count-down class="inline-block pl-0 max-md:text-center"></app-count-dow
           Take this chance to contribute, collaborate, and make a real
           difference. Be part of moving AI forward in Africa.
         </p> -->
-        <!-- <p></p> -->
-
-
-
+      <!-- <p></p> -->
+
       <!-- </section> -->
     </div>
     <!-- <div class="mx-[10] w-full overflow-hidden">

diff --git a/src/app/components/landing/landing.component.ts b/src/app/components/landing/landing.component.ts
@@ -19,6 +19,23 @@ export class LandingComponent {
 
   ];
   isMuted=true;
+  // showChat = false;
+  // showMentorsModal = false;
+  // showAdvisorsModal = false;
+  // mentorsRegistrationLink = 'https://form.typeform.com/to/UvayCDEJ';
+  // advisorsRegistrationLink = 'https://form.typeform.com/to/mMzeQ63l';
+  // showGetInvolvedModal = true;
+  // showTeamRegistrationModal = false;
+  // showIndividualRegistrationModal = false;
+  // showRegistrationModal = false;
+  // currentSection: string = 'home';
+  // registrationDeadline = new Date(2024, 5, 31, 23, 59, 59);
+  // registrationButtonVisible = false;
+  // countDownVisible = false;
+  // countDownDate = new Date('2024-5-15T20:59:00');
+  // animated: boolean = false;
+  // @Output() toggleChatEvent = new EventEmitter<boolean>();
+
   slickConfig = {
     slidesToShow: 3,
     slidesToScroll: 3,

diff --git a/src/app/pages/eligibility/eligibility.component.html b/src/app/pages/eligibility/eligibility.component.html
@@ -1,7 +1,7 @@
 <section id="eligibility" class=" max-sm:px-4 max-lg:px-12 sm:pb-16 pt-24 pb-32 px-20 overflow-x-hidden">
   <h2 class="sm:text-4xl text-center text-2xl font-medium  mb-4 text-white">Eligibility</h2>
-  <div class="flex flex-col lg:flex-row gap-x-12   items-center">
-    <div  class="lg:w-1/2 flex-none max-lg:my-6 sm:pb-8 md:mx-8 sm:mt-0   sm:text-left">
+  <div class=" p-2 grid grid-cols-1 lg:grid-cols-2 gap-x-12   items-center">
+    <div  class="  flex-none max-lg:my-6 sm:pb-8 md:mx-8 sm:mt-0   sm:text-left">
       <p class=" text-gray-300 leading-relaxed max-sm:text-start  ">The hackathon is open to all students located in Africa who are passionate about generative technology and eager to showcase their skills and creativity. To participate, you must meet the following eligibility requirements:</p>
        <ul>
         <li *ngFor="let criteria of criterieas">
@@ -18,6 +18,6 @@ <h2 class="sm:text-4xl text-center text-2xl font-medium  mb-4 text-white">Eligib
         <button onClick="register_modal.showModal()"  class="inline-flex disabled:bg-gray-500  text-black bg-white border-0 max-sm:px-4 py-2 px-6 focus:outline-none hover:drop-shadow-xl  hover:bg-gray-300 rounded max-sm:text-sm text-lg">Register Now</button>
       </div>
     </div>
-    <img src="assets/chat%20image.png" class="lg:w-1/2 flex-none max-md:hidden  w-full object-fill object-center rounded-3xl" alt="">
+    <img src="assets/chat%20image.png" class="  flex-none max-md:hidden  w-full object-cover object-center rounded-3xl" alt="">
   </div>
 </section>
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
@@ -186,8 +186,8 @@ <h1 class="w-full text-center flex flex-row justify-start items-center mb-2"><sp
                 class="inline-flex disabled:bg-gray-500 text-black bg-white border-0 max-sm:px-4 py-2 px-6 focus:outline-none hover:drop-shadow-xl hover:bg-gray-300 rounded max-sm:text-sm text-lg"
               >
                 Register Now
-              </button> -->
-              <!-- <dialog
+              </button>
+              <dialog
                 *ngIf="showRegistrationModal"
                 id="register_modal"
                 class="modal mt-4"

diff --git a/src/app/shared/bot/bot.component.ts b/src/app/shared/bot/bot.component.ts
@@ -4,6 +4,7 @@ import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/
 import {NgForOf, NgIf} from "@angular/common";
 import {LocalStorageService} from "../local-storage.service";
 import {takeUntil} from "rxjs";
+import { IpService } from '../ip.service';
 
 export interface Message{
   role: string,
@@ -15,7 +16,7 @@ export interface Message{
   styleUrls: ['./bot.component.css'],
 })
 export class BotComponent {
-  constructor( private chatService: ChatService, private localStorageService: LocalStorageService) {
+  constructor(private ipService: IpService, private chatService: ChatService, private localStorageService: LocalStorageService) {
     this.localStorageService.seedData()
     this.localStorageService._waitingResponse$.subscribe((waitingStatus)=>{
       this.isChatLoading = waitingStatus
@@ -24,12 +25,28 @@ export class BotComponent {
       this.messages = messages
     })
   }
+  ngOnInit() {
+    this.fetchIpAddress();
+  }
+
+  fetchIpAddress() {
+    this.ipService.getIpAddress().subscribe(
+      (response: any) => {
+        this.ipAddress = response.ip;
+        console.log('IP Address:', this.ipAddress); // Debug log
+      },
+      (error) => {
+        console.error('Failed to fetch IP address:', error);
+      }
+    );
+  }
 
   isChatLoading: boolean = false;
   messages: Message[] = [];
   chatForm = new FormGroup({
     message: new FormControl('', [Validators.required])
   })
+  ipAddress: string = '';
 
   @Output() closeChatEvent = new EventEmitter<void>()
   @ViewChild('scrollableContainer') private scrollableContainer: ElementRef | undefined;
@@ -46,9 +63,12 @@ export class BotComponent {
       content: this.chatForm.value.message!
     })
     this.localStorageService.setWaitingStatus( true )
+
+    const messageContent = this.chatForm.value.message!;
     try{
-      this.chatService.sendMessage( this.chatForm.value.message! ).subscribe((response:any)=>{
+      this.chatService.sendMessage( messageContent,this.ipAddress ).subscribe((response:any)=>{
         // console.log(response)
+        console.log("Response: ", response);
         this.isChatLoading = false;
         this.localStorageService.setWaitingStatus( false )
         this.localStorageService.addMessage({

diff --git a/src/app/shared/chat-service.service.ts b/src/app/shared/chat-service.service.ts
@@ -12,12 +12,15 @@ export class ChatService {
     private httpClient: HttpClient
   ) { }
 
-  sendMessage(message: string){
+  sendMessage(message: string, ipAddress: string){
     // console.log("message ", message)
+    console.log("Sending message: ", message);
+    console.log("Sending ipAddress: ", ipAddress);
 
     return this.httpClient.post(
-      'https://ifoki-lylswf275a-ew.a.run.app/api/chat',
-      {prompt: message},
+      // 'https://ifoki-lylswf275a-ew.a.run.app/api/chat',
+      ' https://a2sv-generative-ai-hackathon-lylswf275a-zf.a.run.app/api/v1',
+      { ip_address: ipAddress, query: message },
     ).pipe(
       catchError(error => {
         if (error.error instanceof ErrorEvent) {