closes #45

LederCards · May 9, 2024 · 25cfdd7 · 25cfdd7
1 parent f8ab199
commit 25cfdd7
Show file tree

Hide file tree

Showing 7 changed files with 79 additions and 13 deletions.
diff --git a/src/app/_shared/components/below-the-fold/below-the-fold.component.html b/src/app/_shared/components/below-the-fold/below-the-fold.component.html
@@ -40,12 +40,15 @@
         <ion-col [sizeMd]="3" [sizeXs]="12">
           <div class="map-title">{{ 'Components.BelowTheFold.CategoryCards' | translate }}</div>
           <hr>
+
           <div class="map-item">
             <a routerLink="/advanced">{{ 'Common.Actions.AdvancedLong' | translate }}</a>
           </div>
+
           <div class="map-item">
             <a routerLink="/syntax">{{ 'Common.Actions.SyntaxLong' | translate }}</a>
           </div>
+
           <div class="map-item">
             <a routerLink="/products">{{ 'Common.Actions.ProductsLong' | translate }}</a>
           </div>
@@ -54,29 +57,42 @@
         <ion-col [sizeMd]="3" [sizeXs]="12">
           <div class="map-title">{{ 'Components.BelowTheFold.CategorySupport' | translate }}</div>
           <hr>
+
           <div class="map-item">
             <a routerLink="/faq">{{ 'Components.BelowTheFold.FAQ' | translate }}</a>
           </div>
+
           <div class="map-item">
             <a routerLink="/changelog">{{ 'Components.BelowTheFold.Changelog' | translate }}</a>
           </div>
+
+          @if(metaService.getSiteConfigProperty('features.askaquestion')) {
           <div class="map-item">
-            <a target="_blank" href="https://ledergames.com/pages/contact">{{ 'Components.BelowTheFold.Ask' | translate
+            <a target="_blank" [href]="metaService.getSiteConfigProperty('links.askaquestion')">{{
+              'Components.BelowTheFold.Ask' | translate
               }}</a>
           </div>
+          }
         </ion-col>
 
         <ion-col [sizeMd]="3" [sizeXs]="12">
           <div class="map-title">{{ 'Components.BelowTheFold.CategoryMore' | translate }}</div>
           <hr>
+
+          @if(metaService.getSiteConfigProperty('features.github')) {
           <div class="map-item">
-            <a target="_blank" href="https://github.com/LederCards">{{ 'Components.BelowTheFold.GitHub' | translate
+            <a target="_blank" [href]="metaService.getSiteConfigProperty('links.github')">{{
+              'Components.BelowTheFold.GitHub' | translate
               }}</a>
           </div>
+          }
+
+          @if(metaService.getSiteConfigProperty('features.discord')) {
           <div class="map-item">
-            <a target="_blank" href="https://discord.com/servers/woodland-warriors-476234833572397056">{{
+            <a target="_blank" [href]="metaService.getSiteConfigProperty('links.discord')">{{
               'Components.BelowTheFold.Discord' | translate }}</a>
           </div>
+          }
         </ion-col>
       </ion-row>
     </ion-grid>
@@ -85,4 +101,11 @@
   <div class="legal">
     {{ 'Components.BelowTheFold.Copyright' | translate }}
   </div>
+
+  <br>
+  <div class="creator">
+    {{ 'Components.BelowTheFold.CreatedText' | translate }} <a target="_blank"
+      [href]="metaService.getSiteConfigProperty('links.creator')">{{ 'Components.BelowTheFold.CreatedBy' | translate
+      }}</a>.
+  </div>
 </div>
diff --git a/src/app/_shared/components/below-the-fold/below-the-fold.component.scss b/src/app/_shared/components/below-the-fold/below-the-fold.component.scss
@@ -34,7 +34,8 @@
     }
   }
 
-  .legal {
+  .legal,
+  .creator {
     color: #444;
     font-size: 0.75em;
   }

diff --git a/src/app/_shared/components/below-the-fold/below-the-fold.component.ts b/src/app/_shared/components/below-the-fold/below-the-fold.component.ts
@@ -1,13 +1,15 @@
 import { Component, inject, type OnInit } from '@angular/core';
 import { LocalStorage } from 'ngx-webstorage';
 import { LocaleService } from '../../../locale.service';
+import { MetaService } from '../../../meta.service';
 
 @Component({
   selector: 'app-below-the-fold',
   templateUrl: './below-the-fold.component.html',
   styleUrls: ['./below-the-fold.component.scss'],
 })
 export class BelowTheFoldComponent implements OnInit {
+  public metaService = inject(MetaService);
   public localeService = inject(LocaleService);
 
   @LocalStorage() visualMode!: string;

diff --git a/src/app/_shared/components/topbar/topbar.component.html b/src/app/_shared/components/topbar/topbar.component.html
@@ -36,18 +36,28 @@
 
                   @if(!buttonsMobile.hasChildNodes()) {
                   <ng-container>
-                    <ion-item [routerLink]="['/advanced']" detail="false">
-                      <ion-icon slot="start" name="funnel-outline"></ion-icon>
+                    <ion-item [routerLink]="['/advanced']"
+                      detail="false">@if(metaService.getSiteConfigProperty('icons.topbar.advanced')) {
+                      <ion-icon slot="start"
+                        [name]="metaService.getSiteConfigProperty('icons.topbar.advanced')"></ion-icon>
+                      }
                       {{ 'Common.Actions.AdvancedShort' | translate }}
                     </ion-item>
 
                     <ion-item [routerLink]="['/syntax']" detail="false">
-                      <ion-icon slot="start" name="help-circle-outline"></ion-icon>
+                      @if(metaService.getSiteConfigProperty('icons.topbar.syntax')) {
+                      <ion-icon slot="start"
+                        [name]="metaService.getSiteConfigProperty('icons.topbar.syntax')"></ion-icon>
+                      }
                       {{ 'Common.Actions.SyntaxShort' | translate }}
                     </ion-item>
 
                     <ion-item [routerLink]="['/products']" detail="false">
-                      <ion-icon slot="start" name="file-tray-full-outline"></ion-icon>
+
+                      @if(metaService.getSiteConfigProperty('icons.topbar.products')) {
+                      <ion-icon slot="start"
+                        [name]="metaService.getSiteConfigProperty('icons.topbar.products')"></ion-icon>
+                      }
                       {{ 'Common.Actions.ProductsShort' | translate }}
                     </ion-item>
                   </ng-container>

diff --git a/src/app/_shared/components/topbar/topbar.component.ts b/src/app/_shared/components/topbar/topbar.component.ts
@@ -1,5 +1,6 @@
 import { Component, inject, input } from '@angular/core';
 import { Router } from '@angular/router';
+import { MetaService } from '../../../meta.service';
 import { SearchService } from '../../../search.service';
 
 @Component({
@@ -8,6 +9,8 @@ import { SearchService } from '../../../search.service';
   styleUrls: ['./topbar.component.scss'],
 })
 export class TopbarComponent {
+  public metaService = inject(MetaService);
+
   private router = inject(Router);
   private searchService = inject(SearchService);
 

diff --git a/src/app/advanced/advanced.page.html b/src/app/advanced/advanced.page.html
@@ -10,7 +10,10 @@
       <!-- card name -->
       <ion-row>
         <ion-col class="criteria" [sizeXs]="12" [sizeMd]="2" [offsetMd]="2">
-          <ion-icon name="person-outline" color="primary"></ion-icon>
+
+          @if(metaService.getSiteConfigProperty('icons.advanced.CardName')) {
+          <ion-icon [name]="metaService.getSiteConfigProperty('icons.advanced.CardName')" color="primary"></ion-icon>
+          }
           <span>{{ 'Pages.AdvancedSearch.CardNameLabel' | translate }}</span>
         </ion-col>
 
@@ -23,7 +26,10 @@
       <!-- product -->
       <ion-row>
         <ion-col class="criteria" [sizeXs]="12" [sizeMd]="2" [offsetMd]="2">
-          <ion-icon name="game-controller-outline" color="primary"></ion-icon>
+
+          @if(metaService.getSiteConfigProperty('icons.advanced.Product')) {
+          <ion-icon [name]="metaService.getSiteConfigProperty('icons.advanced.Product')" color="primary"></ion-icon>
+          }
           <span>{{ 'Pages.AdvancedSearch.ProductLabel' | translate }}</span>
         </ion-col>
 
@@ -39,7 +45,11 @@
       <!-- subproducts -->
       <ion-row>
         <ion-col class="criteria" [sizeXs]="12" [sizeMd]="2" [offsetMd]="2">
-          <ion-icon name="hardware-chip-outline" color="primary"></ion-icon>
+
+          @if(metaService.getSiteConfigProperty('icons.advanced.Subproducts')) {
+          <ion-icon [name]="metaService.getSiteConfigProperty('icons.advanced.Subproducts')" color="primary"></ion-icon>
+          }
+
           <span>{{ 'Pages.AdvancedSearch.SubproductsLabel' | translate }}</span>
         </ion-col>
 
@@ -54,7 +64,10 @@
       <!-- tags -->
       <ion-row>
         <ion-col class="criteria" [sizeXs]="12" [sizeMd]="2" [offsetMd]="2">
-          <ion-icon name="pricetags-outline" color="primary"></ion-icon>
+
+          @if(metaService.getSiteConfigProperty('icons.advanced.Tags')) {
+          <ion-icon [name]="metaService.getSiteConfigProperty('icons.advanced.Tags')" color="primary"></ion-icon>
+          }
           <span>{{ 'Pages.AdvancedSearch.TagsLabel' | translate }}</span>
         </ion-col>
 
@@ -99,7 +112,11 @@
 
 <ng-template #number let-filter="filter">
   <ion-col class="criteria" [sizeXs]="12" [sizeMd]="2" [offsetMd]="2">
-    <ion-icon name="bookmark-outline" color="primary"></ion-icon>
+
+    @if(metaService.getSiteConfigProperty('icons.advanced.' + filter.name | stripspaces)) {
+    <ion-icon [name]="metaService.getSiteConfigProperty('icons.advanced.' + filter.name | stripspaces)"
+      color="primary"></ion-icon>
+    }
     <span>{{ 'Pages.AdvancedSearch.' + (filter.name | stripspaces) + 'Label' | translate }}</span>
   </ion-col>
 

diff --git a/src/app/meta.service.ts b/src/app/meta.service.ts
@@ -1,5 +1,6 @@
 import { inject, Injectable } from '@angular/core';
 
+import { get } from 'lodash';
 import type { IProduct, IProductFilter } from '../../interfaces';
 import { environment } from '../environments/environment';
 import { LocaleService } from './locale.service';
@@ -10,6 +11,9 @@ import { LocaleService } from './locale.service';
 export class MetaService {
   private localeService = inject(LocaleService);
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  private siteConfig: any = {};
+
   private allProducts: IProduct[] = [];
 
   private productNamesByProductId: Record<string, string> = {};
@@ -26,6 +30,8 @@ export class MetaService {
     const metaData = await fetch(`${environment.baseUrl}/meta.json`);
     const realData = await metaData.json();
 
+    this.siteConfig = realData.config;
+
     this.allProducts = realData.products;
 
     this.localeService.setLocales(realData.locales);
@@ -67,4 +73,8 @@ export class MetaService {
   public getAllFilters(): IProductFilter[] {
     return Object.values(this.filtersByProductId).flat();
   }
+
+  public getSiteConfigProperty(prop: string): string | undefined {
+    return get(this.siteConfig, prop);
+  }
 }