feat: condivisione e importazione automatica del codice comunità nelle playlist con priorità tonalità e autoscroll e rifinitura UI

src/app/pages/player/player.page.ts

@@ -69,7 +69,7 @@ export class PlayerPage implements OnInit, AfterViewInit, OnDestroy {
     }
 
     // Apply transposition if in chords mode
-    if (this.showChords() && this.transposeAmount() !== 0) {
+    if (this.showChords()) {
       return this.lyricsParser.transposeSections(sections, this.transposeAmount());
     }
 
@@ -121,6 +121,12 @@ export class PlayerPage implements OnInit, AfterViewInit, OnDestroy {
   private songStartTime: number = 0;
 
   constructor() {
+    // Sync transposition automatically to display/projection page
+    effect(() => {
+      const amount = this.transposeAmount();
+      this.channel.postMessage({ type: 'SYNC_TRANSPOSE', amount });
+    });
+
     // Sync mode from global settings
     effect(() => {
       this.showChords.set(this.settingsService.showChordsDefault());
@@ -186,23 +192,52 @@ export class PlayerPage implements OnInit, AfterViewInit, OnDestroy {
             this.songStartTime = Date.now();
             this.cantiService.getStorage()?.set('last_song_id', id);
             this.channel.postMessage({ type: 'SYNC_CANTO', id: found.id });
-
-            // Set custom community transposition if active
-            if (this.comunitaService.comunitaCode() && this.comunitaService.isFilterActive()) {
-              const settings = this.comunitaService.comunitaCantiSettings();
-              const songSetting = settings.find(s => s.id_canti === found.id_canti || s.id_canti === Number(found.id));
-              if (songSetting && songSetting.tonalita !== undefined) {
-                this.transposeAmount.set(songSetting.tonalita);
-              } else {
-                this.transposeAmount.set(0);
-              }
-            } else {
-              this.transposeAmount.set(0);
-            }
           }
         }
       }
     }, { allowSignalWrites: true });
+
+    // Reactive transposition and speed determination based on canto, playlists, and community settings
+    effect(() => {
+      const c = this.canto();
+      if (!c) return;
+
+      const activePlaylistId = this.playlistService.activePlaylistId();
+      let playlistSongSetting: any = null;
+      if (activePlaylistId) {
+        const pl = this.playlistService.playlists().find(p => p.id === activePlaylistId);
+        if (pl && pl.songSettings && pl.songSettings[c.id]) {
+          playlistSongSetting = pl.songSettings[c.id];
+        }
+      }
+
+      if (playlistSongSetting) {
+        this.transposeAmount.set(playlistSongSetting.tonalita !== undefined ? playlistSongSetting.tonalita : 0);
+        this.autoscrollSpeed.set(playlistSongSetting.speed !== undefined ? playlistSongSetting.speed : 2);
+      } else if (this.comunitaService.comunitaCode() && this.comunitaService.isFilterActive()) {
+        const settings = this.comunitaService.comunitaCantiSettings();
+        const songSetting = settings.find(s => s.id_canti === c.id_canti || s.id_canti === Number(c.id));
+        if (songSetting) {
+          if (songSetting.tonalita !== undefined) {
+            this.transposeAmount.set(songSetting.tonalita);
+          } else {
+            this.transposeAmount.set(0);
+          }
+          if (songSetting.speed !== undefined && songSetting.speed > 0) {
+            const mappedSpeed = Math.max(1, Math.min(10, Math.round(songSetting.speed / 100)));
+            this.autoscrollSpeed.set(mappedSpeed);
+          } else {
+            this.autoscrollSpeed.set(2);
+          }
+        } else {
+          this.transposeAmount.set(0);
+          this.autoscrollSpeed.set(2);
+        }
+      } else {
+        this.transposeAmount.set(0);
+        this.autoscrollSpeed.set(2);
+      }
+    }, { allowSignalWrites: true });
   }
 
   ngAfterViewInit() {
@@ -304,21 +339,31 @@ export class PlayerPage implements OnInit, AfterViewInit, OnDestroy {
 
   transposeUp() {
     this.transposeAmount.update(v => v + 1);
-    this.channel.postMessage({ type: 'SYNC_TRANSPOSE', amount: this.transposeAmount() });
 
     const c = this.canto();
     if (c) {
-      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount());
+      const dbSpeed = this.autoscrollSpeed() * 100;
+      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount(), dbSpeed);
+      
+      const activePlaylistId = this.playlistService.activePlaylistId();
+      if (activePlaylistId) {
+        this.playlistService.updatePlaylistSongSettings(activePlaylistId, c.id, this.transposeAmount(), this.autoscrollSpeed());
+      }
     }
   }
 
   transposeDown() {
     this.transposeAmount.update(v => v - 1);
-    this.channel.postMessage({ type: 'SYNC_TRANSPOSE', amount: this.transposeAmount() });
 
     const c = this.canto();
     if (c) {
-      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount());
+      const dbSpeed = this.autoscrollSpeed() * 100;
+      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount(), dbSpeed);
+      
+      const activePlaylistId = this.playlistService.activePlaylistId();
+      if (activePlaylistId) {
+        this.playlistService.updatePlaylistSongSettings(activePlaylistId, c.id, this.transposeAmount(), this.autoscrollSpeed());
+      }
     }
   }
 
@@ -600,10 +645,30 @@ export class PlayerPage implements OnInit, AfterViewInit, OnDestroy {
 
   increaseAutoscrollSpeed() {
     this.autoscrollSpeed.update(s => Math.min(10, s + 1));
+    const c = this.canto();
+    if (c) {
+      const dbSpeed = this.autoscrollSpeed() * 100;
+      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount(), dbSpeed);
+      
+      const activePlaylistId = this.playlistService.activePlaylistId();
+      if (activePlaylistId) {
+        this.playlistService.updatePlaylistSongSettings(activePlaylistId, c.id, this.transposeAmount(), this.autoscrollSpeed());
+      }
+    }
   }
 
   decreaseAutoscrollSpeed() {
     this.autoscrollSpeed.update(s => Math.max(1, s - 1));
+    const c = this.canto();
+    if (c) {
+      const dbSpeed = this.autoscrollSpeed() * 100;
+      this.statsService.updateSongSettings(c.id_canti, this.transposeAmount(), dbSpeed);
+      
+      const activePlaylistId = this.playlistService.activePlaylistId();
+      if (activePlaylistId) {
+        this.playlistService.updatePlaylistSongSettings(activePlaylistId, c.id, this.transposeAmount(), this.autoscrollSpeed());
+      }
+    }
   }
 
   private logPreviousSongTime() {