@chat21/chat21-web-widget 5.1.32-rc4 → 5.1.33

package/src/launch_template.js

@@ -219,67 +219,76 @@ function loadIframe(tiledeskScriptBaseLocation) {
     iDiv.appendChild(ifrm);
 
     // Funzione helper per caricare iframe con fallback per compatibilità CSP (Wix, etc.)
-    // Usa Blob URL come metodo principale (più compatibile con CSP) con fallback a srcdoc e document.write
-    function loadIframeContent(iframe, htmlContent, baseLocation) {
-        var isLocalhost = baseLocation.includes('localhost');
+    // Priorità: document.write / srcdoc prima della Blob URL. Le Blob URL spesso danno origine opaca
+    // (blob:null): l'iframe non può leggere window.parent.tiledeskSettings → projectid mancante.
+    function loadIframeContent(iframe, htmlContent) {
         var blobUrl = null;
-        
-        // Metodo 1: Blob URL (più compatibile con CSP di Wix e altre piattaforme)
-        // Usa Blob URL come metodo principale perché è meno spesso bloccato da CSP rispetto a srcdoc
+
+        // 1) document.write: iframe stessa origine della pagina host → tiledeskSettings sul parent accessibile
+        try {
+            var cw = iframe.contentWindow;
+            if (cw && cw.document) {
+                cw.document.open();
+                cw.document.write(htmlContent);
+                cw.document.close();
+                return;
+            }
+        } catch (e) {
+            console.warn('[Tiledesk] iframe document.write failed, trying srcdoc/blob:', e);
+        }
+
+        // 2) srcdoc: stessa origine del parent (HTML5); utile se document.write è bloccato
+        if ('srcdoc' in iframe) {
+            try {
+                iframe.srcdoc = htmlContent;
+                return;
+            } catch (e) {
+                console.warn('[Tiledesk] iframe srcdoc failed, trying blob:', e);
+            }
+        }
+
+        // 3) Blob URL (spesso permesso da CSP dove srcdoc/write no; può rompere lettura parent.tiledeskSettings)
         if (typeof Blob !== 'undefined' && typeof URL !== 'undefined' && URL.createObjectURL) {
             try {
                 var blob = new Blob([htmlContent], { type: 'text/html;charset=utf-8' });
                 blobUrl = URL.createObjectURL(blob);
                 iframe.src = blobUrl;
-                
-                // Cleanup del blob URL dopo il caricamento per liberare memoria
+
                 var originalOnload = iframe.onload;
                 iframe.onload = function() {
-                    // Revoca il blob URL dopo un delay per assicurarsi che tutto sia caricato
                     setTimeout(function() {
                         if (blobUrl) {
                             try {
                                 URL.revokeObjectURL(blobUrl);
                                 blobUrl = null;
-                            } catch(e) {
-                                console.warn('Error revoking blob URL:', e);
+                            } catch (err) {
+                                console.warn('Error revoking blob URL:', err);
                             }
                         }
                     }, 1000);
                     if (originalOnload) originalOnload.call(this);
                 };
-                return; // Blob URL impostato con successo
-            } catch(e) {
-                console.warn('Blob URL not available, trying srcdoc:', e);
-            }
-        }
-        
-        // Metodo 2: srcdoc (fallback se Blob URL non disponibile)
-        // Skip per localhost (usa document.write per compatibilità sviluppo)
-        if (!isLocalhost && 'srcdoc' in iframe) {
-            try {
-                iframe.srcdoc = htmlContent;
-                return; // srcdoc impostato
-            } catch(e) {
-                console.warn('srcdoc not allowed, trying document.write:', e);
+                return;
+            } catch (e) {
+                console.warn('Blob URL not available:', e);
             }
         }
-        
-        // Metodo 3: document.write (fallback finale, funziona su localhost e browser vecchi)
-        if (isLocalhost || (iframe.contentWindow && iframe.contentWindow.document)) {
+
+        // 4) Ultimo tentativo document.write (iframe magari non pronto al primo passo)
+        if (iframe.contentWindow && iframe.contentWindow.document) {
             try {
                 iframe.contentWindow.document.open();
                 iframe.contentWindow.document.write(htmlContent);
                 iframe.contentWindow.document.close();
-                return; // document.write completato
-            } catch(e) {
-                console.error('All iframe loading methods failed:', e);
+                return;
+            } catch (e) {
+                console.error('[Tiledesk] All iframe loading methods failed:', e);
             }
         }
     }
     
     // Carica il contenuto dell'iframe con fallback automatico
-    loadIframeContent(ifrm, srcTileDesk, tiledeskScriptBaseLocation);
+    loadIframeContent(ifrm, srcTileDesk);
 
 
 }

package/tsconfig.json

@@ -23,11 +23,6 @@
       "dom"
     ],
     "resolveJsonModule": true,
-    "paths": {
-      "onnxruntime-web/wasm": [
-        "src/app/shims/onnxruntime-web-wasm.ts"
-      ]
-    }
   },
   "skipLibCheck": true,
   "angularCompilerOptions": {

package/src/app/component/message/audio-sync/audio-sync.component.html

@@ -1,19 +0,0 @@
-<div class="lyrics-container">
-
-    <audio
-      #audioPlayer
-      [src]="message?.metadata?.src"
-      (timeupdate)="onTimeUpdate()"
-      style="display:none">
-    </audio>
-  
-    <p class="lyrics message_innerhtml marked" #transcriptBox [style.color]="color">
-      <span
-        *ngFor="let w of words; let i = index; trackBy: trackByIndex"
-        class="word"
-        [ngClass]="w.state">
-        {{ w.text }}
-      </span>
-    </p>
-  
-</div>

package/src/app/component/message/audio-sync/audio-sync.component.scss

@@ -1,65 +0,0 @@
-:host {
-  display: block;
-  font-size: var(--font-size-bubble-message, 14px);
-}
-
-/* Allineato a text.component.scss (.message_innerhtml, p) */
-.message_innerhtml {
-  margin: 0;
-
-  &.marked {
-    padding: 12px 16px;
-    margin-block-start: 0em !important;
-    margin-block-end: 0em !important;
-  }
-}
-
-.lyrics {
-  font-size: inherit;
-  margin: 0;
-  line-height: 1.4em;
-  font-style: normal;
-  letter-spacing: normal;
-  font-stretch: normal;
-  font-variant: normal;
-  font-weight: 300;
-  overflow: hidden;
-
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-  /* Colore bubble: da [style.color] / @Input() color — ereditato dalle .word */
-}
-
-/* base word */
-.word {
-  transition:
-    transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1),
-    color 0.3s ease,
-    opacity 0.3s ease,
-    filter 0.3s ease;
-
-  will-change: transform;
-}
-
-/* FUTURE */
-.word.future {
-  opacity: 0;
-  transform: scale(0.98);
-}
-
-/* PAST: stesso colore del testo bubble (@Input color sul <p>) */
-.word.past {
-  opacity: 1;
-  color: inherit;
-  transform: scale(1);
-}
-
-/* ACTIVE (solo momentaneo, tipo “karaoke flash”) */
-.word.active {
-  opacity: 1;
-  color: #00c3ff;
-  font-weight: 700;
-  transform: scale(1.18);
-  text-shadow: 0 0 10px rgba(0, 195, 255, 0.35);
-}

package/src/app/component/message/audio-sync/audio-sync.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AudioSyncComponent } from './audio-sync.component';
-
-describe('AudioSyncComponent', () => {
-  let component: AudioSyncComponent;
-  let fixture: ComponentFixture<AudioSyncComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AudioSyncComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(AudioSyncComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/app/component/message/audio-sync/audio-sync.component.ts

@@ -1,197 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  Input,
-  OnChanges,
-  OnDestroy,
-  SimpleChanges,
-  ViewChild,
-} from '@angular/core';
-import { MessageModel } from 'src/chat21-core/models/message';
-
-/** HAVE_METADATA: metadati già disponibili (tipico audio servito da cache). */
-const HAVE_METADATA = 1;
-
-@Component({
-  selector: 'chat-audio-sync',
-  templateUrl: './audio-sync.component.html',
-  styleUrl: './audio-sync.component.scss',
-})
-export class AudioSyncComponent implements AfterViewInit, OnChanges, OnDestroy {
-  @Input() message: MessageModel | null = null;
-  @Input() color?: string;
-
-  @ViewChild('audioPlayer') audioRef!: ElementRef<HTMLAudioElement>;
-  @ViewChild('transcriptBox') transcriptBox!: ElementRef<HTMLElement>;
-
-  words: {
-    text: string;
-    start: number;
-    end: number;
-    state: 'future' | 'active' | 'past';
-  }[] = [];
-
-  currentTime = 0;
-  duration = 1;
-  activeIndex = -1;
-
-  private timingReady = false;
-  private onMetadataLoaded: () => void;
-  private onPlaybackEnded: () => void;
-
-  constructor(private readonly cdr: ChangeDetectorRef) {}
-
-  /** `false` = messaggio già in storico: niente autoplay / karaoke. Da `message.isJustRecived`. */
-  private get skipSyncAnimation(): boolean {
-    return this.message?.isJustRecived === false;
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (!changes['message']) {
-      return;
-    }
-    if (this.audioRef?.nativeElement && this.timingReady) {
-      this.duration = this.audioRef.nativeElement.duration || 1;
-      this.buildFakeTiming();
-      if (this.skipSyncAnimation) {
-        this.markAllWordsPast();
-      } else {
-        this.syncStatesFromCurrentTime();
-      }
-    }
-  }
-
-  ngAfterViewInit(): void {
-    const audio = this.audioRef.nativeElement;
-
-    this.onPlaybackEnded = () => {
-      if (this.skipSyncAnimation) {
-        return;
-      }
-      this.markAllWordsPast();
-      if (this.message) {
-        this.message.isJustRecived = false;
-      }
-      this.cdr.detectChanges();
-    };
-
-    this.onMetadataLoaded = () => {
-      if (this.timingReady) {
-        return;
-      }
-      this.timingReady = true;
-      this.duration = audio.duration || 1;
-      this.buildFakeTiming();
-      if (this.skipSyncAnimation) {
-        this.markAllWordsPast();
-        this.cdr.detectChanges();
-        return;
-      }
-      this.syncStatesFromCurrentTime();
-      this.cdr.detectChanges();
-
-      setTimeout(() => {
-        audio.play().catch(() => {
-          this.syncStatesFromCurrentTime();
-          this.cdr.detectChanges();
-        });
-      }, 200);
-    };
-
-    audio.addEventListener('loadedmetadata', this.onMetadataLoaded);
-    audio.addEventListener('ended', this.onPlaybackEnded);
-
-    if (audio.readyState >= HAVE_METADATA) {
-      this.onMetadataLoaded();
-    }
-  }
-
-  ngOnDestroy(): void {
-    const audio = this.audioRef?.nativeElement;
-    if (!audio) {
-      return;
-    }
-    if (this.onMetadataLoaded) {
-      audio.removeEventListener('loadedmetadata', this.onMetadataLoaded);
-    }
-    if (this.onPlaybackEnded) {
-      audio.removeEventListener('ended', this.onPlaybackEnded);
-    }
-  }
-
-  private markAllWordsPast(): void {
-    this.words.forEach((w) => {
-      w.state = 'past';
-    });
-    this.activeIndex = -1;
-  }
-
-  buildFakeTiming(): void {
-    const rawWords = (this.message?.text || '')
-      .trim()
-      .split(/\s+/)
-      .filter((w) => w.length > 0);
-    if (rawWords.length === 0) {
-      this.words = [];
-      return;
-    }
-    const step = this.duration / rawWords.length;
-
-    this.words = rawWords.map((w, i) => ({
-      text: w,
-      start: i * step,
-      end: (i + 1) * step,
-      state: 'future' as const,
-    }));
-  }
-
-  syncStatesFromCurrentTime(): void {
-    if (this.skipSyncAnimation) {
-      return;
-    }
-    const audio = this.audioRef?.nativeElement;
-    if (!audio || this.words.length === 0) {
-      return;
-    }
-    this.currentTime = audio.currentTime;
-    let newActiveIndex = -1;
-
-    this.words.forEach((w, i) => {
-      if (this.currentTime >= w.end) {
-        w.state = 'past';
-      } else if (this.currentTime >= w.start && this.currentTime < w.end) {
-        w.state = 'active';
-        newActiveIndex = i;
-      } else {
-        w.state = 'future';
-      }
-    });
-
-    if (newActiveIndex !== this.activeIndex) {
-      this.activeIndex = newActiveIndex;
-      this.scrollToActive();
-    }
-  }
-
-  onTimeUpdate(): void {
-    this.syncStatesFromCurrentTime();
-  }
-
-  scrollToActive(): void {
-    const container = this.transcriptBox?.nativeElement;
-    const active = container?.querySelector('.active') as HTMLElement;
-
-    if (active) {
-      active.scrollIntoView({
-        behavior: 'smooth',
-        block: 'center',
-      });
-    }
-  }
-
-  trackByIndex(index: number): number {
-    return index;
-  }
-}

package/src/app/providers/voice/STT&TTS/openai-voice.config.ts

@@ -1,12 +0,0 @@
-/**
- * Configurazione opzionale per i servizi voce OpenAI (da `environment` o runtime).
- */
-export interface OpenAiVoiceEnvironmentConfig {
-  /** Obbligatoria per chiamate API reali; se assente, STT/TTS non inviano richieste. */
-  apiKey?: string;
-  baseUrl?: string;
-  transcriptionModel?: string;
-  ttsModel?: string;
-  /** Voce predefinita TTS (es. `alloy`). */
-  ttsVoice?: string;
-}

package/src/app/providers/voice/STT&TTS/openai-voice.provider.ts

@@ -1,171 +0,0 @@
-import { HttpClient, HttpErrorResponse, HttpHeaders } from '@angular/common/http';
-import { Injectable } from '@angular/core';
-import { firstValueFrom } from 'rxjs';
-import { environment } from 'src/environments/environment';
-
-import type { OpenAiVoiceEnvironmentConfig } from './openai-voice.config';
-import {
-  SpeechToTextProvider,
-  TextToSpeechProvider,
-  type SpeechToTextRequest,
-  type SpeechToTextResult,
-  type TextToSpeechRequest,
-  type TextToSpeechResult,
-} from './speech-provider.abstract';
-import { AppConfigService } from '../../app-config.service';
-
-const DEFAULT_BASE = 'https://api.openai.com/v1';
-const DEFAULT_TRANSCRIPTION_MODEL = 'whisper-1';
-const DEFAULT_TTS_MODEL = 'tts-1';
-const DEFAULT_VOICE = 'alloy';
-const DEFAULT_FORMAT = 'mp3';
-
-/**
- * Provider OpenAI unico: STT (Whisper) + TTS, entrambi via {@link HttpClient}.
- */
-@Injectable({ providedIn: 'root' })
-export class OpenAiVoiceProviderService extends SpeechToTextProvider implements TextToSpeechProvider {
-  constructor(
-    private readonly httpClient: HttpClient,
-    private readonly appConfig: AppConfigService
-  ) {
-    super();
-  }
-
-  async transcribe(request: SpeechToTextRequest): Promise<SpeechToTextResult> {
-    const cfg = this.getConfig();
-    const apiKey = cfg.apiKey?.trim();
-    if (!apiKey) {
-      return { text: '' };
-    }
-
-    const base = (cfg.baseUrl ?? DEFAULT_BASE).replace(/\/$/, '');
-    const model = cfg.transcriptionModel ?? DEFAULT_TRANSCRIPTION_MODEL;
-    const url = `${base}/audio/transcriptions`;
-
-    const ext = this.extensionForMime(request.mimeType);
-    const file = new File([request.audio], `segment.${ext}`, { type: request.mimeType });
-
-    const form = new FormData();
-    form.append('file', file);
-    form.append('model', model);
-    if (request.language) {
-      form.append('language', request.language);
-    }
-
-    const headers = new HttpHeaders({
-      Authorization: `Bearer ${apiKey}`,
-    });
-
-    try {
-      const data = await firstValueFrom(
-        this.httpClient.post<{ text?: string }>(url, form, { headers }),
-      );
-      return { text: (data.text ?? '').trim() };
-    } catch (e) {
-      if (e instanceof HttpErrorResponse && e.error instanceof Blob) {
-        const errText = await e.error.text();
-        throw new Error(`OpenAI transcription ${e.status}: ${errText || e.statusText}`);
-      }
-      throw this.mapOpenAiHttpError(e);
-    }
-  }
-
-  async synthesize(request: TextToSpeechRequest): Promise<TextToSpeechResult> {
-    const cfg = this.getConfig();
-    const apiKey = cfg.apiKey?.trim();
-    if (!apiKey) {
-      throw new Error('OpenAI API key not configured (environment.openAiVoice.apiKey)');
-    }
-
-    const base = (cfg.baseUrl ?? DEFAULT_BASE).replace(/\/$/, '');
-    const model = cfg.ttsModel ?? DEFAULT_TTS_MODEL;
-    const voice = request.voice ?? cfg.ttsVoice ?? DEFAULT_VOICE;
-    const responseFormat =
-      (request.responseFormat as 'mp3' | 'opus' | 'aac' | 'flac' | undefined) ?? DEFAULT_FORMAT;
-    const url = `${base}/audio/speech`;
-
-    const body = {
-      model,
-      voice,
-      input: request.text,
-      response_format: responseFormat,
-    };
-
-    const headers = new HttpHeaders({
-      Authorization: `Bearer ${apiKey}`,
-      'Content-Type': 'application/json',
-    });
-
-    try {
-      const blob = await firstValueFrom(
-        this.httpClient.post(url, body, {
-          headers,
-          responseType: 'blob',
-        }),
-      );
-      return { audio: blob, mimeType: this.mimeForFormat(responseFormat) };
-    } catch (e) {
-      if (e instanceof HttpErrorResponse && e.error instanceof Blob) {
-        const errText = await e.error.text();
-        throw new Error(`OpenAI TTS ${e.status}: ${errText || e.statusText}`);
-      }
-      if (e instanceof HttpErrorResponse) {
-        throw new Error(`OpenAI TTS ${e.status}: ${e.message || e.statusText}`);
-      }
-      throw e;
-    }
-  }
-
-  private getConfig(): OpenAiVoiceEnvironmentConfig {
-    return this.appConfig.getConfig().openAiKey ?? {};
-  }
-
-  private mapOpenAiHttpError(e: unknown): Error {
-    if (!(e instanceof HttpErrorResponse)) {
-      return e instanceof Error ? e : new Error(String(e));
-    }
-    const label = 'OpenAI transcription';
-    if (e.error instanceof Blob) {
-      return new Error(`${label} ${e.status}: ${e.statusText}`);
-    }
-    if (typeof e.error === 'object' && e.error !== null && 'error' in e.error) {
-      const err = (e.error as { error?: { message?: string } }).error;
-      return new Error(`${label} ${e.status}: ${err?.message ?? JSON.stringify(e.error)}`);
-    }
-    if (typeof e.error === 'string') {
-      return new Error(`${label} ${e.status}: ${e.error}`);
-    }
-    return new Error(`${label} ${e.status}: ${e.message || e.statusText}`);
-  }
-
-  private extensionForMime(mime: string): string {
-    if (mime.includes('webm')) {
-      return 'webm';
-    }
-    if (mime.includes('mp4') || mime.includes('m4a')) {
-      return 'm4a';
-    }
-    if (mime.includes('wav')) {
-      return 'wav';
-    }
-    if (mime.includes('mpeg') || mime.includes('mp3')) {
-      return 'mp3';
-    }
-    return 'webm';
-  }
-
-  private mimeForFormat(fmt: string): string {
-    switch (fmt) {
-      case 'opus':
-        return 'audio/opus';
-      case 'aac':
-        return 'audio/aac';
-      case 'flac':
-        return 'audio/flac';
-      case 'mp3':
-      default:
-        return 'audio/mpeg';
-    }
-  }
-}

package/src/app/providers/voice/STT&TTS/speech-provider.abstract.ts

@@ -1,39 +0,0 @@
-/**
- * Contratti astratti per Speech-to-Text e Text-to-Speech.
- * Implementazione OpenAI unificata: `OpenAiVoiceProviderService` (`openai-voice.provider.ts`).
- */
-
-/** Input per la trascrizione di un segmento audio. */
-export interface SpeechToTextRequest {
-  audio: Blob;
-  mimeType: string;
-  /** ISO 639-1 opzionale (es. `it`, `en`). */
-  language?: string;
-}
-
-export interface SpeechToTextResult {
-  text: string;
-}
-
-/** Input per la sintesi vocale. */
-export interface TextToSpeechRequest {
-  text: string;
-  /** Voce provider-specific (es. OpenAI: `alloy`, `echo`, …). */
-  voice?: string;
-  language?: string;
-  /** Formato audio desiderato (dipende dal provider). */
-  responseFormat?: string;
-}
-
-export interface TextToSpeechResult {
-  audio: Blob;
-  mimeType: string;
-}
-
-export abstract class SpeechToTextProvider {
-  abstract transcribe(request: SpeechToTextRequest): Promise<SpeechToTextResult>;
-}
-
-export abstract class TextToSpeechProvider {
-  abstract synthesize(request: TextToSpeechRequest): Promise<TextToSpeechResult>;
-}

package/src/app/providers/voice/audio.types.ts

@@ -1,34 +0,0 @@
-/**
- * Tipi condivisi per cattura microfono, VAD e registrazione (WebM).
- */
-
-export const DEFAULT_VOICE_AUDIO_CONSTRAINTS: MediaTrackConstraints = {
-  echoCancellation: true,
-  noiseSuppression: true,
-  autoGainControl: true,
-};
-
-export const DEFAULT_VOICE_MEDIA_STREAM_CONSTRAINTS: MediaStreamConstraints = {
-  audio: DEFAULT_VOICE_AUDIO_CONSTRAINTS,
-};
-
-export interface VoiceRecordedBlob {
-  blob: Blob;
-  mimeType: string;
-}
-
-/**
- * Segmento audio dopo VAD; può includere `transcript` se STT è configurato e abilitato.
- */
-export interface VoiceSegmentPayload extends VoiceRecordedBlob {
-  transcript?: string;
-  transcriptionError?: string;
-}
-
-export interface VoiceSessionStartOptions {
-  /** Opzionale se usi solo {@link VoiceService.audioSegment$}. */
-  onRecordingComplete?: (result: VoiceSegmentPayload) => void;
-  constraints?: MediaStreamConstraints;
-  /** Default `true`. Se `false`, non viene chiamato lo STT sul segmento. */
-  enableTranscription?: boolean;
-}