implemented a basic full spellcard

.nx/cache/d/daemon.log

@@ -461078,3 +461078,183 @@ To fix this, set a unique name for each project in a project.json inside the pro
     at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
 [NX Daemon Server] - 2023-12-12T17:35:06.236Z - Time taken for 'hash changed files from watcher' 10.856200009584427ms
 [NX Daemon Server] - 2023-12-12T17:35:06.238Z - Done responding to the client null
+[NX Daemon Server] - 2023-12-13T06:36:25.242Z - Started listening on: \\.\pipe\nx\C:\Users\chris\AppData\Local\Temp\83d14e7134fc08a15480\d.sock
+[NX Daemon Server] - 2023-12-13T06:36:25.244Z - [WATCHER]: Subscribed to changes within: c:\Softwareprojekte\DnD (native)
+[NX Daemon Server] - 2023-12-13T06:36:25.257Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T06:36:25.259Z - Closed a connection. Number of open connections: 0
+[NX Daemon Server] - 2023-12-13T06:36:25.259Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T06:36:25.260Z - [REQUEST]: Client Request for Project Graph Received
+[NX Daemon Server] - 2023-12-13T06:36:26.180Z - Error detected when recomputing project file map: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+[NX Daemon Server] - 2023-12-13T06:36:26.180Z - [REQUEST]: Responding to the client with an error. Error when preparing serialized project graph. The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+Error: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+    at readProjectConfigurationsFromRootMap (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:97:15)
+    at buildProjectsConfigurationsFromProjectPathsAndPlugins (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:70:19)
+    at createProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:131:129)
+    at WorkspaceContext.<anonymous> (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:82:39)
+    at getProjectConfigurationsFromContext (c:\Softwareprojekte\DnD\node_modules\nx\src\utils\workspace-context.js:26:29)
+    at _retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:81:72)
+    at retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:58:12)
+    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
+    at async processCollectedUpdatedAndDeletedFiles (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:102:34)
+    at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
+[NX Daemon Server] - 2023-12-13T06:36:26.181Z - Time taken for 'hash changed files from watcher' 28.93369996547699ms
+[NX Daemon Server] - 2023-12-13T06:36:26.181Z - Done responding to the client null
+[NX Daemon Server] - 2023-12-13T14:16:23.005Z - Started listening on: \\.\pipe\nx\C:\Users\chris\AppData\Local\Temp\83d14e7134fc08a15480\d.sock
+[NX Daemon Server] - 2023-12-13T14:16:23.009Z - [WATCHER]: Subscribed to changes within: c:\Softwareprojekte\DnD (native)
+[NX Daemon Server] - 2023-12-13T14:16:23.020Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T14:16:23.023Z - Closed a connection. Number of open connections: 0
+[NX Daemon Server] - 2023-12-13T14:16:23.023Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T14:16:23.025Z - [REQUEST]: Client Request for Project Graph Received
+[NX Daemon Server] - 2023-12-13T14:16:23.837Z - Error detected when recomputing project file map: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+[NX Daemon Server] - 2023-12-13T14:16:23.837Z - [REQUEST]: Responding to the client with an error. Error when preparing serialized project graph. The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+Error: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+    at readProjectConfigurationsFromRootMap (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:97:15)
+    at buildProjectsConfigurationsFromProjectPathsAndPlugins (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:70:19)
+    at createProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:131:129)
+    at WorkspaceContext.<anonymous> (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:82:39)
+    at getProjectConfigurationsFromContext (c:\Softwareprojekte\DnD\node_modules\nx\src\utils\workspace-context.js:26:29)
+    at _retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:81:72)
+    at retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:58:12)
+    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
+    at async processCollectedUpdatedAndDeletedFiles (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:102:34)
+    at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
+[NX Daemon Server] - 2023-12-13T14:16:23.838Z - Time taken for 'hash changed files from watcher' 26.586399999912828ms
+[NX Daemon Server] - 2023-12-13T14:16:23.839Z - Done responding to the client null
+[NX Daemon Server] - 2023-12-13T15:51:42.880Z - Started listening on: \\.\pipe\nx\C:\Users\chris\AppData\Local\Temp\83d14e7134fc08a15480\d.sock
+[NX Daemon Server] - 2023-12-13T15:51:42.888Z - [WATCHER]: Subscribed to changes within: c:\Softwareprojekte\DnD (native)
+[NX Daemon Server] - 2023-12-13T15:51:42.895Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T15:51:42.897Z - Closed a connection. Number of open connections: 0
+[NX Daemon Server] - 2023-12-13T15:51:42.898Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-13T15:51:42.900Z - [REQUEST]: Client Request for Project Graph Received
+[NX Daemon Server] - 2023-12-13T15:51:43.045Z - Error detected when recomputing project file map: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+[NX Daemon Server] - 2023-12-13T15:51:43.046Z - [REQUEST]: Responding to the client with an error. Error when preparing serialized project graph. The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+Error: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+    at readProjectConfigurationsFromRootMap (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:97:15)
+    at buildProjectsConfigurationsFromProjectPathsAndPlugins (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:70:19)
+    at createProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:131:129)
+    at WorkspaceContext.<anonymous> (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:82:39)
+    at getProjectConfigurationsFromContext (c:\Softwareprojekte\DnD\node_modules\nx\src\utils\workspace-context.js:26:29)
+    at _retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:81:72)
+    at retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:58:12)
+    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
+    at async processCollectedUpdatedAndDeletedFiles (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:102:34)
+    at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
+[NX Daemon Server] - 2023-12-13T15:51:43.048Z - Time taken for 'hash changed files from watcher' 33.83769999910146ms
+[NX Daemon Server] - 2023-12-13T15:51:43.048Z - Done responding to the client null
+[NX Daemon Server] - 2023-12-14T07:47:18.276Z - Started listening on: \\.\pipe\nx\C:\Users\chris\AppData\Local\Temp\83d14e7134fc08a15480\d.sock
+[NX Daemon Server] - 2023-12-14T07:47:18.299Z - [WATCHER]: Subscribed to changes within: c:\Softwareprojekte\DnD (native)
+[NX Daemon Server] - 2023-12-14T07:47:18.302Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-14T07:47:18.307Z - Closed a connection. Number of open connections: 0
+[NX Daemon Server] - 2023-12-14T07:47:18.313Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-14T07:47:18.321Z - [REQUEST]: Client Request for Project Graph Received
+[NX Daemon Server] - 2023-12-14T07:47:18.618Z - Error detected when recomputing project file map: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+[NX Daemon Server] - 2023-12-14T07:47:18.618Z - [REQUEST]: Responding to the client with an error. Error when preparing serialized project graph. The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+Error: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+    at readProjectConfigurationsFromRootMap (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:97:15)
+    at buildProjectsConfigurationsFromProjectPathsAndPlugins (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:70:19)
+    at createProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:131:129)
+    at WorkspaceContext.<anonymous> (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:82:39)
+    at getProjectConfigurationsFromContext (c:\Softwareprojekte\DnD\node_modules\nx\src\utils\workspace-context.js:26:29)
+    at _retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:81:72)
+    at retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:58:12)
+    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
+    at async processCollectedUpdatedAndDeletedFiles (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:102:34)
+    at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
+[NX Daemon Server] - 2023-12-14T07:47:18.624Z - Time taken for 'hash changed files from watcher' 9.143399998545647ms
+[NX Daemon Server] - 2023-12-14T07:47:18.625Z - Done responding to the client null
+[NX Daemon Server] - 2023-12-14T07:55:31.264Z - Started listening on: \\.\pipe\nx\C:\Users\chris\AppData\Local\Temp\83d14e7134fc08a15480\d.sock
+[NX Daemon Server] - 2023-12-14T07:55:31.268Z - [WATCHER]: Subscribed to changes within: c:\Softwareprojekte\DnD (native)
+[NX Daemon Server] - 2023-12-14T07:55:31.270Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-14T07:55:31.272Z - Closed a connection. Number of open connections: 0
+[NX Daemon Server] - 2023-12-14T07:55:31.272Z - Established a connection. Number of open connections: 1
+[NX Daemon Server] - 2023-12-14T07:55:31.274Z - [REQUEST]: Client Request for Project Graph Received
+[NX Daemon Server] - 2023-12-14T07:55:32.278Z - Error detected when recomputing project file map: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+[NX Daemon Server] - 2023-12-14T07:55:32.278Z - [REQUEST]: Responding to the client with an error. Error when preparing serialized project graph. The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+Error: The following projects are defined in multiple locations:
+- DnDTools: 
+  - 
+  - .
+
+To fix this, set a unique name for each project in a project.json inside the project's root. If the project does not currently have a project.json, you can create one that contains only a name.
+    at readProjectConfigurationsFromRootMap (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:97:15)
+    at buildProjectsConfigurationsFromProjectPathsAndPlugins (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\project-configuration-utils.js:70:19)
+    at createProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:131:129)
+    at WorkspaceContext.<anonymous> (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:82:39)
+    at getProjectConfigurationsFromContext (c:\Softwareprojekte\DnD\node_modules\nx\src\utils\workspace-context.js:26:29)
+    at _retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:81:72)
+    at retrieveProjectConfigurations (c:\Softwareprojekte\DnD\node_modules\nx\src\project-graph\utils\retrieve-workspace-files.js:58:12)
+    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
+    at async processCollectedUpdatedAndDeletedFiles (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:102:34)
+    at async processFilesAndCreateAndSerializeProjectGraph (c:\Softwareprojekte\DnD\node_modules\nx\src\daemon\server\project-graph-incremental-recomputation.js:138:17)
+[NX Daemon Server] - 2023-12-14T07:55:32.279Z - Time taken for 'hash changed files from watcher' 11.233600000006845ms
+[NX Daemon Server] - 2023-12-14T07:55:32.280Z - Done responding to the client null

.nx/cache/d/server-process.json

@@ -1 +1 @@
-{"processId":19752}
+{"processId":19444}

src/app/journal/journal-spellcards/add-card/add-card.component.html

@@ -11,16 +11,16 @@
     class="slide-button add-card-button"
     (click)="continueToSpellSelection(false)"
   >
-    Auswählen
+    Offiziellen Zauber auswählen
   </button>
   <button
     class="slide-button add-card-button"
     (click)="continueToSpellSelection(true)"
   >
-    Bearbeiten
+    Offiziellen Zauber bearbeiten
   </button>
   <button class="slide-button add-card-button" (click)="emitNewSpell()">
-    Erstellen
+    Neuen Zauber erstellen
   </button>
   } @else {
 

src/app/journal/journal-spellcards/add-card/add-card.component.scss

@@ -35,12 +35,12 @@
 }
 
 .add-card-button {
-    height: 3rem;
+    // height: 3rem;
     background-color: var(--primary-color);
     border: 1px solid var(--border-color);
     border-radius: 10px;
     box-shadow: var(--shadow);
-    font-size: 1.25rem;
+    // font-size: 1.25rem;
     font-weight: 600;
     width: 90%;
     margin: 0 0.5rem;

src/app/journal/journal-spellcards/journal-spellcards.component.ts

@@ -67,7 +67,10 @@ export class JournalSpellcardsComponent {
     level: number,
     spellIndex: number
   ): void {
-    this.modalAccessor.openModal(FullSpellcardComponent, { spell: spell });
+    this.modalAccessor.openModal(FullSpellcardComponent, {
+      spell: spell,
+      isEditable: true,
+    });
     const resultSubscription = this.modalAccessor.result$.subscribe(
       (result) => {
         resultSubscription.unsubscribe();

src/app/journal/journal-spellcards/spellcard/spellcard.component.html

@@ -1,6 +1,5 @@
 <div class="spellcard" #spellcard>
   <div class="name">{{ spell.name }}</div>
   <div>{{ spell.cost }}</div>
-  <div>{{ spell.level }}</div>
   <div>{{ spell.school }}</div>
 </div>

src/app/journal/journal-stats/weapons-container/spell-table/spell-table.component.html

@@ -7,7 +7,7 @@
       <div>Bonus/</div>
       <div>Save</div>
     </div>
-    <div>Schaden</div>
+    <div>Schaden/ Heilung</div>
     <div>Reichweite</div>
   </div>
   <div
@@ -20,7 +20,7 @@
       class="example-box"
       *ngFor="let spell of spells; let index = index"
       cdkDrag
-      (click)="openDetailsPanel(index)"
+      (click)="showFullSpellcard(index)"
     >
       <!--  Range Icon -->
       <ng-container

src/app/journal/journal-stats/weapons-container/spell-table/spell-table.component.ts

@@ -6,6 +6,9 @@ import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
 import { Spell } from 'src/interfaces/spell';
 import { SpellDetailsComponent } from './spell-details/spell-details.component';
 import { SpellModalComponent } from 'src/app/journal/spell-modal/spell-modal.component';
+import { FullSpellcardComponent } from 'src/app/shared-components/full-spellcard/full-spellcard.component';
+import { Observable, OperatorFunction } from 'rxjs';
+import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
 
 @Component({
   selector: 'spell-table',
@@ -13,12 +16,6 @@ import { SpellModalComponent } from 'src/app/journal/spell-modal/spell-modal.com
   styleUrls: ['./spell-table.component.scss'],
 })
 export class SpellTableComponent {
-  public constructor(
-    public dataAccessor: DataService,
-    private modalAccessor: ModalService,
-    public detailsAccessor: DetailsService
-  ) {}
-
   public spellAttackBonus: string = '0';
   public spellSaveDC: number = 0;
   private spellcastingAttribute: string | undefined;
@@ -26,6 +23,8 @@ export class SpellTableComponent {
   private proficiencyBonus: number = 2;
 
   public spells!: Spell[];
+  private preparedSpells!: Spell[];
+  private preparedSpellsNames: string[] = [];
 
   public attributes: any = {
     strength: 'STR',
@@ -45,11 +44,39 @@ export class SpellTableComponent {
     cube: 'Würfel',
   };
 
+  public constructor(
+    public dataAccessor: DataService,
+    private modalAccessor: ModalService,
+    public detailsAccessor: DetailsService
+  ) {}
+
   public ngOnInit(): void {
     this.spells = this.dataAccessor.favoriteSpells;
+    this.preparedSpells = this.dataAccessor.getAllPreparedSpells();
+    this.preparedSpellsNames = this.preparedSpells.map((spell) => spell.name);
+    console.log(this.preparedSpellsNames);
     this.subscribeToData();
   }
 
+  public showFullSpellcard(spellIndex: number): void {
+    this.modalAccessor.openModal(FullSpellcardComponent, {
+      spell: this.spells[spellIndex],
+      isEditable: false,
+    });
+    const resultSubscription = this.modalAccessor.result$.subscribe(
+      (result) => {
+        resultSubscription.unsubscribe();
+        if (result.state === 'delete') {
+          this.spells.splice(spellIndex, 1);
+        } else if (result.state !== 'cancel') {
+          console.log(result.state);
+          throw new Error('Unexpected result state, please send a bug report.');
+        }
+      }
+    );
+  }
+
+  // LEGACY CODE
   public openDetailsPanel(index: number): void {
     this.detailsAccessor.openPanel(SpellDetailsComponent, {
       spell: this.spells[index],
@@ -70,6 +97,7 @@ export class SpellTableComponent {
       }
     );
   }
+  //
 
   public openModal(isUpdate: boolean, index?: number): void {
     this.modalAccessor.openModal(SpellModalComponent, {

src/app/journal/journal-stats/weapons-container/weapons-container.component.html

@@ -1,22 +1,3 @@
-<!-- <div class="weapon-spell-container">
-  <ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav-tabs">
-    <li [ngbNavItem]="1">
-      <button ngbNavLink>Waffen</button>
-      <ng-template ngbNavContent>
-        <weapon-table></weapon-table>
-      </ng-template>
-    </li>
-    <li [ngbNavItem]="2">
-      <button ngbNavLink>Zauber</button>
-      <ng-template ngbNavContent>
-        <spell-table></spell-table>
-      </ng-template>
-    </li>
-  </ul>
-
-  <div [ngbNavOutlet]="nav" class="mt-2"></div>
-</div> -->
-
 <div class="weapon-spell-container">
   <div class="tab-row">
     <button

src/app/shared-components/full-spellcard/full-spellcard.component.html

@@ -1,10 +1,118 @@
 <div class="full-spellcard-container">
   <div class="full-spellcard">
-    {{ spell | json }}
+    <h2 style="text-align: center; margin-top: 1rem">{{ spell.name }}</h2>
+
+    <table class="table table-striped" style="height: 20rem; overflow: auto">
+      <thead>
+        <tr>
+          <th scope="col">Property</th>
+          <th scope="col">Value</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>Benötigt verbale Komponente</td>
+          <td>{{ spell.needsVerbal }}</td>
+        </tr>
+        <tr>
+          <td>Benötigt Geste</td>
+          <td>{{ spell.needsSomatic }}</td>
+        </tr>
+        <tr>
+          <td>Benötigt materielle Komponente</td>
+          <td>{{ spell.needsMaterial }}</td>
+        </tr>
+
+        <tr>
+          <td>Stufe</td>
+          <td>{{ spell.level }}</td>
+        </tr>
+        <tr>
+          <td>Kosten</td>
+          <td>{{ spell.cost }}</td>
+        </tr>
+        <tr>
+          <td>Kann als Ritual gewirkt werden</td>
+          <td>{{ spell.canRitual }}</td>
+        </tr>
+        <!-- <tr>
+          <td>Wirkungsdauer</td>
+          <td>{{ spell.duration }}</td>
+        <tr> -->
+        <tr>
+          <td>Benötigt Konzentration</td>
+          <td>{{ spell.needsConcentration }}</td>
+        </tr>
+        <tr>
+          <td>Schule</td>
+          <td>{{ spell.school }}</td>
+        </tr>
+        <tr>
+          <td>Reichweite</td>
+          @if (spell.isRanged){
+          <td>{{ spell.range }}</td>
+          } @else {
+          <td>Berührung</td>
+          }
+        </tr>
+        @if (spell.hasAreaOfEffect){
+        <tr>
+          <td>Flächeneffekt</td>
+          <td>{{ spell.areaOfEffectType }}</td>
+        </tr>
+        <tr>
+          <td>Radius</td>
+          <td>{{ spell.radius }}</td>
+        </tr>
+        } @if (spell.needsAttackRoll){
+        <tr>
+          <td>Benötigt Angriffswurf</td>
+          <td>{{ spell.needsAttackRoll }}</td>
+        </tr>
+
+        } @if (spell.needsSavingThrow){
+        <tr>
+          <td>Benötigt Rettungswurf</td>
+          <td>{{ spell.needsSavingThrow }}</td>
+        </tr>
+        <tr>
+          <td>Rettungswurfattribut</td>
+          <td>{{ spell.savingThrowAttribute }}</td>
+        </tr>
+        } @if (spell.doesDamage){
+        <tr>
+          <td>Schaden</td>
+          <td>
+            @for(damage of spell.damage; track damage){
+            {{ damage.diceNumber }} {{ damage.diceType }}
+            {{ damage.damageType }} @if (damage.additionalDamage){ +
+            {{ damage.additionalDamage }}}
+
+            <br />
+            }
+          </td>
+        </tr>
+        } @if (spell.doesHeal){
+        <tr>
+          <td>Heilung</td>
+          <td>
+            {{ spell.heal.diceNumber }} {{ spell.heal.diceType }} @if
+            (spell.heal.additionalHeal){ + {{ spell.heal.additionalHeal }}}
+          </td>
+        </tr>
+        }
+        <h3>Beschreibung</h3>
+        <p>{{ spell.description }}</p>
+      </tbody>
+    </table>
   </div>
 
   <div class="delete-row">
-    <button class="delete-button" (click)="delete()">Löschen</button>
+    @if(isEditable){
     <button class="edit-button" (click)="update()">Anpassen</button>
+    <button class="delete-button" (click)="delete()">Löschen</button>
+    } @else {
+    <button class="delete-button" (click)="delete()">Entfernen</button>
+    }
   </div>
 </div>

src/app/shared-components/full-spellcard/full-spellcard.component.scss

@@ -17,6 +17,7 @@
     border-radius: 10px;
     box-shadow: var(--shadow);
     background: white;
+    overflow: auto;
 }
 
 .delete-row {

src/app/shared-components/full-spellcard/full-spellcard.component.ts

@@ -9,6 +9,7 @@ import { ModalService } from 'src/services/modal/modal.service';
 })
 export class FullSpellcardComponent {
   @Input() public spell!: Spell;
+  @Input() public isEditable!: boolean;
 
   public constructor(private modalAccessor: ModalService) {}
 

src/interfaces/spell.ts

@@ -25,6 +25,12 @@ export interface Spell {
   heal: Heal;
 }
 
+// Additions
+
+// Number of targets
+// duration
+//  Material
+
 interface Damage {
   diceNumber: string;
   diceType: string;
@@ -32,6 +38,8 @@ interface Damage {
   additionalDamage?: string;
 }
 
+// additions
+
 interface Heal {
   diceNumber: string;
   diceType: string;

src/services/data/data.service.ts

@@ -204,6 +204,8 @@ export class DataService {
     console.log('weapons updated from data service: ', this.weapons);
   }
 
+  // SPELLS
+
   private _favoriteSpells: Spell[] = [
     {
       name: 'Feuerball',
@@ -525,6 +527,98 @@ export class DataService {
     console.log('spells updated from data service: ', this._spellLevel2);
   }
 
+  private _spellLevel3: Spell[] = [];
+
+  public get spellLevel3(): Spell[] {
+    return this._spellLevel3;
+  }
+
+  public set spellLevel3(spells: Spell[]) {
+    this._spellLevel3 = spells;
+    console.log('spells updated from data service: ', this._spellLevel3);
+  }
+
+  private _spellLevel4: Spell[] = [];
+
+  public get spellLevel4(): Spell[] {
+    return this._spellLevel4;
+  }
+
+  public set spellLevel4(spells: Spell[]) {
+    this._spellLevel4 = spells;
+    console.log('spells updated from data service: ', this._spellLevel4);
+  }
+
+  private _spellLevel5: Spell[] = [];
+
+  public get spellLevel5(): Spell[] {
+    return this._spellLevel5;
+  }
+
+  public set spellLevel5(spells: Spell[]) {
+    this._spellLevel5 = spells;
+    console.log('spells updated from data service: ', this._spellLevel5);
+  }
+
+  private _spellLevel6: Spell[] = [];
+
+  public get spellLevel6(): Spell[] {
+    return this._spellLevel6;
+  }
+
+  public set spellLevel6(spells: Spell[]) {
+    this._spellLevel6 = spells;
+    console.log('spells updated from data service: ', this._spellLevel6);
+  }
+
+  private _spellLevel7: Spell[] = [];
+
+  public get spellLevel7(): Spell[] {
+    return this._spellLevel7;
+  }
+
+  public set spellLevel7(spells: Spell[]) {
+    this._spellLevel7 = spells;
+    console.log('spells updated from data service: ', this._spellLevel7);
+  }
+
+  private _spellLevel8: Spell[] = [];
+
+  public get spellLevel8(): Spell[] {
+    return this._spellLevel8;
+  }
+
+  public set spellLevel8(spells: Spell[]) {
+    this._spellLevel8 = spells;
+    console.log('spells updated from data service: ', this._spellLevel8);
+  }
+
+  private _spellLevel9: Spell[] = [];
+
+  public get spellLevel9(): Spell[] {
+    return this._spellLevel9;
+  }
+
+  public set spellLevel9(spells: Spell[]) {
+    this._spellLevel9 = spells;
+    console.log('spells updated from data service: ', this._spellLevel9);
+  }
+
+  public getAllPreparedSpells(): Spell[] {
+    return [
+      ...this._spellLevel0,
+      ...this._spellLevel1,
+      ...this._spellLevel2,
+      ...this._spellLevel3,
+      ...this._spellLevel4,
+      ...this._spellLevel5,
+      ...this._spellLevel6,
+      ...this._spellLevel7,
+      ...this._spellLevel8,
+      ...this._spellLevel9,
+    ];
+  }
+
   private abilities: Ability[] = [
     {
       name: 'Feenschritt',