Add in more sets

src/app/app.component.html

@@ -1,24 +1,24 @@
-<app-top-bar [sets]="sets" class="fixed-top-bar"></app-top-bar>
+<app-top-bar [sets]="sets" [selected]="selectedSet"class="fixed-top-bar"></app-top-bar>
 
 <div class="main">
     <mat-tab-group>
         <mat-tab label="Normal">
             <div class="card-container">
-                @for(card of cards; track cards) {
+                @for(card of cardService.cardsInCurrentSet; track card) {
                     <app-card-display [card]="card" [set]="selectedSet" [displayHyperspace]="false"></app-card-display>
                 }
             </div>
         </mat-tab>
         <mat-tab label="Hyperspace">
             <div class="card-container">
-                @for(card of cards; track cards) {
+                @for(card of cardService.cardsInCurrentSet;; track card) {
                     <app-card-display [card]="card" [set]="selectedSet" [displayHyperspace]="true"></app-card-display>
                 }
             </div>
         </mat-tab>
         <mat-tab label="Showcase"> 
             <div class="card-container">
-                @for(card of cards; track cards) {
+                @for(card of cardService.cardsInCurrentSet;; track card) {
                     <app-card-display [card]="card" [set]="selectedSet" [displayShowcase]="true"></app-card-display>
                 }
             </div>

src/app/app.component.ts

@@ -28,8 +28,7 @@ export class AppComponent {
   constructor(
     private sheets: googleSheetService,
     private setService: SetService,
-    private cardService: CardService,
+    public cardService: CardService,
-    private httpClient: HttpClient,
     @Inject(DOCUMENT) private document: Document
   )
   {}
@@ -41,7 +40,8 @@ export class AppComponent {
 
   windowScrolled = false;
 
-  ngOnInit() {
+  ngOnInit() 
+  {
     window.addEventListener('scroll', () => {
       this.windowScrolled = window.scrollY !== 0;
     });
@@ -52,7 +52,7 @@ export class AppComponent {
       if(this.sets != undefined)
       {
         this.selectedSet = this.sets[0]
-        this.sheets.getSet(this.sets[0]).subscribe( values => {
+        this.sheets.getSet(this.selectedSet).subscribe( values => {
           let bob = values as any;
           this.selectedSet.total = bob.values.length;
           this.cards = this.cardService.convertToCardInfo(this.selectedSet, bob.values as Array<Object>)
@@ -60,8 +60,14 @@ export class AppComponent {
       }
     });
   }
-  
+
-  scrollToTop(): void {
+  ngOnChanges()
+  {
+    console.log(this.selectedSet);
+  }
+
+  scrollToTop(): void 
+  {
     this.document.body.scrollIntoView({
       behavior: 'smooth',
       block: 'start',

src/app/components/card-display/card-display.component.ts

@@ -44,6 +44,11 @@ export class CardDisplayComponent {
     
     if(this.displayHyperspace)
     {
+      if(this.card.hyperspaceSetNumber == undefined)
+      {
+        return false;
+      }
+      
       if(this.set.noHypers.includes(this.card.setNumber))
       {
         return false;

src/app/components/top-bar/top-bar.component.html

@@ -2,9 +2,9 @@
     @if(sets)
     {
         <mat-form-field>
-            <mat-select [(value)]="selected.name">
+            <mat-select [(value)]="selected" (selectionChange)="onSetSelectionChanged($event)">
                 @for(set of sets; track set) {
-                    <mat-option value="{{set}}">{{set.name}}</mat-option>
+                    <mat-option [value]="set">{{set.name}}</mat-option>
                 }
             </mat-select>
         </mat-form-field>

src/app/components/top-bar/top-bar.component.ts

@@ -1,7 +1,7 @@
 import { Component, Input, OnChanges } from '@angular/core';
 
 import { MatToolbarModule } from '@angular/material/toolbar';
-import { MatSelectModule } from '@angular/material/select';
+import { MatSelectChange, MatSelectModule } from '@angular/material/select';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatButtonModule } from '@angular/material/button';
@@ -10,6 +10,8 @@ import { MatIconModule } from '@angular/material/icon';
 
 import { SetInfo } from '../../models/setInfo.model';
 import { FilterService } from '../../services/filter.service';
+import { CardService } from '../../services/card.service';
+import { googleSheetService } from '../../services/googleSheets.service';
 
 @Component({
   selector: 'app-top-bar',
@@ -27,11 +29,13 @@ import { FilterService } from '../../services/filter.service';
   styleUrl: './top-bar.component.scss'
 })
 export class TopBarComponent {
-  selected!: SetInfo;
+  @Input() selected!: SetInfo;
   @Input() sets!: Array<SetInfo>;
 
   constructor(
     private filterService: FilterService,
+    private sheets: googleSheetService,
+    private cardService: CardService,
   )
   {}
 
@@ -39,8 +43,7 @@ export class TopBarComponent {
   {
     if(this.sets)
     {
-      this.selected = this.sets[0]
+      this.selected = Object.assign(this.sets[0]);
-      console.log("onInit")  
     }
   }
 
@@ -63,4 +66,15 @@ export class TopBarComponent {
   {
     this.filterService.setFilter(true, false, false, false);
   }
+
+  onSetSelectionChanged(data: MatSelectChange) 
+  {
+    this.selected = data.value;
+    this.sheets.getSet(this.selected).subscribe( values => {
+      let bob = values as any;
+      this.selected.total = bob.values.length;
+      this.cardService.convertToCardInfo(this.selected, bob.values as Array<Object>)
+    })
+    console.log(data)
+  }
 }

src/app/services/card.service.ts

@@ -8,8 +8,10 @@ import { CardInfo } from '../models/card.model';
 
 export class CardService {
 
+    cardsInCurrentSet!: Array<CardInfo>;
+
     convertToCardInfo(set: SetInfo, data : Array<Object>) : Array<CardInfo> {
-        let cards = new Array<CardInfo>;
+        this.cardsInCurrentSet = new Array<CardInfo>;
     
         let hypercount = 0;
         for (let index in data)
@@ -30,10 +32,10 @@ export class CardService {
             }
           }
     
-          cards.push(info);
+          this.cardsInCurrentSet.push(info);
         }
     
-        return cards;
+        return this.cardsInCurrentSet;
     }
 
     convertStandardCard(set: SetInfo, data : Array<Object>, hypercount: number) : CardInfo {
@@ -81,7 +83,7 @@ export class CardService {
         info.isBase = types.includes("Base");
         info.standardQuantity = data[1] ? parseInt(data[1].toString()) : 0;
 
-        info.name = data[10] as string;
+        info.name = data[7] as string;
 
         return info;
     }

src/app/services/googleSheets.service.ts

@@ -16,6 +16,8 @@ export class googleSheetService {
         private http: HttpClient
     ) {}
 
+    
+
     getSet(setToFetch: SetInfo)
     {
         let bottom_right = setToFetch.typesColumn + setToFetch.sheetRange[1].slice(1);

src/assets/sets.json

@@ -19,7 +19,7 @@
         "sheetRange": ["A4", "D5"],
         "typesColumn" : "N",
         "isPromo": true,
-        "code": "SOR",
+        "code": "GC23",
         "total": 2,
         "leaders": 2,
         "bases": 0,
@@ -33,26 +33,26 @@
         "sheetRange": ["A6", "D7"],
         "typesColumn" : "N",
         "isPromo": true,
-        "code": "SOR",
+        "code": "SORPR",
         "total": 2,
         "leaders": 2,
         "bases": 0,
         "showcaseStart": -1,
         "numShowcase": 0,
-        "noHypers" : [1,2]
+        "noHypers" : []
     },
     {
         "name": "OP Promo Set 1",
         "sheetName": "Promo Cards",
-        "sheetRange": ["A11", "D32"],
+        "sheetRange": ["A13", "D32"],
         "typesColumn" : "N",
         "isPromo": true,
-        "code": "SOR",
+        "code": "SOROP",
         "total": 2,
         "leaders": 2,
         "bases": 0,
         "showcaseStart": -1,
         "numShowcase": 0,
-        "noHypers" : [1,2]
+        "noHypers" : []
     }
 ]