130 lines
2.9 KiB
TypeScript
130 lines
2.9 KiB
TypeScript
// src/app/deck.service.ts
|
|
import { Injectable } from '@angular/core';
|
|
import { HttpClient } from '@angular/common/http';
|
|
import { map, Observable, switchMap } from 'rxjs';
|
|
|
|
export interface Deck {
|
|
name: string;
|
|
images: DeckImage[];
|
|
}
|
|
|
|
export interface DeckImage {
|
|
boxes: Box[];
|
|
name: string;
|
|
id:string;
|
|
}
|
|
|
|
export interface Box {
|
|
id?:number;
|
|
x1:number;
|
|
x2:number;
|
|
y1:number;
|
|
y2:number;
|
|
due?: number;
|
|
ivl?: number;
|
|
factor?: number;
|
|
reps?: number;
|
|
lapses?: number;
|
|
isGraduated?:boolean;
|
|
}
|
|
|
|
export interface BackendBox {
|
|
bildname: string;
|
|
deckid: number;
|
|
iconindex: number;
|
|
id: number;
|
|
x1: number;
|
|
x2: number;
|
|
y1: number;
|
|
y2: number;
|
|
}
|
|
|
|
// Definiert ein einzelnes Punktpaar [x, y]
|
|
type OcrPoint = [number, number];
|
|
|
|
// Definiert die Box als Array von vier Punkten
|
|
type OcrBox = [OcrPoint, OcrPoint, OcrPoint, OcrPoint];
|
|
|
|
// Interface für jedes JSON-Objekt
|
|
export interface OcrResult {
|
|
box: OcrBox;
|
|
confidence: number;
|
|
name: string;
|
|
text: string;
|
|
}
|
|
|
|
@Injectable({
|
|
providedIn: 'root'
|
|
})
|
|
export class DeckService {
|
|
private apiUrl = '/api/decks';
|
|
|
|
constructor(private http: HttpClient) { }
|
|
|
|
getDecks(): Observable<Deck[]> {
|
|
return this.http.get<any[]>(this.apiUrl).pipe(
|
|
map(decks => decks.map(deck => ({
|
|
name: deck.name,
|
|
images: this.groupImagesByName(deck.images)
|
|
})))
|
|
);
|
|
}
|
|
private groupImagesByName(images: any[]): DeckImage[] {
|
|
const imageMap: { [key: string]: DeckImage } = {};
|
|
|
|
images.forEach(image => {
|
|
if (!imageMap[image.id]) {
|
|
imageMap[image.id] = {
|
|
name: image.name,
|
|
id:image.id,
|
|
boxes: []
|
|
};
|
|
}
|
|
imageMap[image.id].boxes.push({
|
|
id: image.boxid,
|
|
x1: image.x1,
|
|
x2: image.x2,
|
|
y1: image.y1,
|
|
y2: image.y2,
|
|
due: image.due,
|
|
ivl:image.ivl,
|
|
factor:image.factor,
|
|
reps:image.reps,
|
|
lapses:image.lapses,
|
|
isGraduated:image.isGraduated?true:false
|
|
});
|
|
});
|
|
|
|
return Object.values(imageMap);
|
|
}
|
|
getDeck(deckname:string): Observable<Deck> {
|
|
return this.http.get<Deck>(`${this.apiUrl}/${deckname}/images`);
|
|
}
|
|
|
|
createDeck(deckname: string): Observable<any> {
|
|
return this.http.post(this.apiUrl, { deckname });
|
|
}
|
|
|
|
deleteDeck(deckName: string): Observable<any> {
|
|
return this.http.delete(`${this.apiUrl}/${encodeURIComponent(deckName)}`);
|
|
}
|
|
|
|
saveImageData(data:any): Observable<any> {
|
|
return this.http.post(`${this.apiUrl}/image`, data);
|
|
}
|
|
|
|
// Neue Methode zum Löschen eines Bildes
|
|
deleteImage(imageName: string): Observable<any> {
|
|
return this.http.delete(`${this.apiUrl}/image/${imageName}`);
|
|
}
|
|
|
|
// Neue Methode zum Verschieben eines Bildes
|
|
moveImage(imageId: string, targetDeckId: number): Observable<any> {
|
|
return this.http.post(`${this.apiUrl}/images/${imageId}/move`, { targetDeckId });
|
|
}
|
|
|
|
updateBox(box: Box): Observable<any> {
|
|
return this.http.put(`${this.apiUrl}/boxes/${box.id}`, box);
|
|
}
|
|
}
|