frassidavid/canti
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: autoscroll standard, visualizzazione tag/date e OCR spaziale avanzato

Browse Source 
- Aggiunto autoscroll standard con controllo velocità (V1-V10) e relativo toggle in settings.
- Implementata la visualizzazione opzionale di tag e data aggiornamento nella lista canti.
- Rinnovata la pagina 'Proponi Canto' con tastiera accordi (fondamentale + variazioni) e OCR spaziale potenziato per l'allineamento automatico degli accordi con il testo.
- Ottimizzata la persistenza della modalità schermo intero.
This commit is contained in:
David Frassi
2026-05-20 11:26:59 +02:00
parent af12a1f2da
commit 21c9c206e1
15 changed files with 970 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/home/home.page.html
+12 -1
View File
@@ -271,6 +271,10 @@
</h2>
<p style="color: rgba(255,255,255,0.6); margin-bottom: 2px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
<span>{{ canto.autore || 'Autore sconosciuto' }}</span>
<span *ngIf="settingsService.showUpdateDate() && canto.data_update" class="update-date-badge" style="font-size: 0.7rem; color: rgba(255, 255, 255, 0.45); font-weight: 400; display: inline-flex; align-items: center; gap: 3px;">
<ion-icon name="calendar-outline" style="font-size: 0.75rem; color: rgba(255,255,255,0.45);"></ion-icon>
agg. {{ cantiService.formatUpdateDate(canto.data_update) }}
</span>
<span *ngIf="showTopTen() && getEsecuzioniCount(canto.id) !== null" class="esecuzioni-badge" style="color: var(--ion-color-secondary); font-size: 0.75rem; background: rgba(var(--ion-color-secondary-rgb), 0.12); padding: 2px 6px; border-radius: 6px; display: inline-flex; align-items: center; gap: 4px; border: 1px solid rgba(var(--ion-color-secondary-rgb), 0.2);">
<ion-icon name="stats-chart-outline" style="font-size: 0.75rem; color: var(--ion-color-secondary);"></ion-icon>
{{ getEsecuzioniCount(canto.id) }} esecuzioni
@@ -280,10 +284,17 @@
Attinenza {{ getMassSuggestionWeight(canto.id_canti) }}%
</span>
</p>
<!-- Visualizza tag sotto autore -->
<div *ngIf="settingsService.showTagsInList() && cantiService.getSongTags(canto).length > 0" class="song-tags-list">
<span *ngFor="let tag of cantiService.getSongTags(canto)" class="song-tag-badge">
{{ tag }}
</span>
</div>
</ion-label>
<!-- Video Thumbnail Section -->
<div *ngIf="canto.link_youtube && canto.link_youtube.length > 5" class="thumb-section" (click)="$event.stopPropagation()">
<div *ngIf="cantiService.getYoutubeId(canto.link_youtube)" class="thumb-section" (click)="$event.stopPropagation()">
<div class="thumb-container compact">
<ng-container *ngIf="youtubePlayerService.isPlayerSupported(); else noPlayerThumb">
<div class="thumb-wrapper" (click)="playVideo($event, canto.id)">
src/app/home/home.page.scss
+33
View File
@@ -888,3 +888,36 @@ ion-title {
color: rgba(0, 0, 0, 0.6) !important;
}
}
.song-tags-list {
display: flex;
flex-wrap: wrap;
gap: 4px;
margin-top: 4px;
}
.song-tag-badge {
font-size: 0.65rem;
background: rgba(255, 255, 255, 0.08);
color: rgba(255, 255, 255, 0.7);
padding: 1px 5px;
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.12);
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.3px;
}
/* High Contrast mode overrides */
:host-context(body.high-contrast) .song-tag-badge {
background: rgba(0, 0, 0, 0.05) !important;
color: rgba(0, 0, 0, 0.7) !important;
border: 1px solid rgba(0, 0, 0, 0.15) !important;
}
:host-context(body.high-contrast) .update-date-badge {
color: rgba(0, 0, 0, 0.5) !important;
ion-icon {
color: rgba(0, 0, 0, 0.5) !important;
}
}