Skip to content

Commit 1daabdc

Browse files
trailhead-loristrailhead-loris
authored
Aggiunta event listner lingua
1 parent 1d995a9 commit 1daabdc

File tree

1 file changed

+139
-102
lines changed

1 file changed

+139
-102
lines changed

‎index.html‎

Lines changed: 139 additions & 102 deletions
Original file line numberDiff line numberDiff line change
@@ -1,102 +1,139 @@
1-
<!DOCTYPE html>
2-
<html lang="it">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<meta name="viewport" content="width=device-width, initial-scale=1" />
6-
<title>Demo Salesforce - Auto Load Fixed</title>
7-
<style>
8-
body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #ffffff; margin: 0; }
9-
.box { background: #fff; padding: 24px; border: 1px solid #eee; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); text-align: left; width: 350px; }
10-
h1 { margin: 0 0 20px; font-size: 24px; text-align: center; color: #333; }
11-
.info-row { margin-bottom: 10px; font-size: 16px; color: #555; border-bottom: 1px solid #f0f0f0; padding-bottom: 5px; }
12-
.info-row strong { color: #000; display: inline-block; width: 100px; }
13-
.status { font-size: 12px; text-align: center; color: #0969da; margin-top: 15px; font-weight: bold; }
14-
</style>
15-
</head>
16-
<body>
17-
18-
<div class="box">
19-
<h1>Dati Utente</h1>
20-
21-
<div class="info-row"><strong>fullname:</strong> <span id="disp-name">...</span></div>
22-
<div class="info-row"><strong>userType:</strong> <span id="disp-type">...</span></div>
23-
<div class="info-row"><strong>nationality:</strong> <span id="disp-nat">...</span></div>
24-
<div class="info-row"><strong>userId:</strong> <span id="disp-id">...</span></div>
25-
26-
<div id="status-msg" class="status">In attesa di inizializzazione...</div>
27-
28-
<p style="text-align:center; color:#999; font-size:12px; margin-top:20px;">
29-
Chogan
30-
</p>
31-
</div>
32-
33-
<script type='text/javascript'>
34-
function initEmbeddedMessaging() {
35-
console.log("--> INIT SALESFORCE START <--");
36-
37-
try {
38-
// 1. DEFINIZIONE VARIABILI
39-
//
40-
const userData = {
41-
fullname: "Mario Rossi",
42-
userType: "consultant",
43-
nationality: "IT",
44-
userId: "12345"
45-
};
46-
47-
// 2. AGGIORNAMENTO INTERFACCIA Per vedere cosa stiamo per inviare all'agente )
48-
document.getElementById('disp-name').innerText = userData.fullname;
49-
document.getElementById('disp-type').innerText = userData.userType;
50-
document.getElementById('disp-nat').innerText = userData.nationality;
51-
document.getElementById('disp-id').innerText = userData.userId;
52-
53-
// --- IMPOSTAZIONI SALESFORCE ---
54-
embeddedservice_bootstrap.settings.language = 'it';
55-
// Impedisce all'utente di scrivere mentre l'agente sta scrivendo
56-
embeddedservice_bootstrap.settings.enableUserInputForConversationWithBot = false;
57-
58-
// 3. GESTIONE EVENTO
59-
window.addEventListener("onEmbeddedMessagingReady", () => {
60-
console.log(">>> EVENTO: Messaging Ready. Invio parametri...");
61-
62-
try {
63-
// Qui usiamo le variabili definite poche righe sopra (Closure corretta)
64-
embeddedservice_bootstrap.prechatAPI.setHiddenPrechatFields({
65-
"fullname": userData.fullname,
66-
"userType": userData.userType,
67-
"nationality": userData.nationality,
68-
"userId": userData.userId
69-
});
70-
//
71-
console.log(">>> Parametri Hidden impostati con successo:", userData);
72-
document.getElementById('status-msg').innerText = "Chat Pronta";
73-
document.getElementById('status-msg').style.color = "green";
74-
75-
} catch (e) {
76-
console.error("Errore nel settare i campi hidden:", e);
77-
document.getElementById('status-msg').innerText = "Errore Parametri";
78-
document.getElementById('status-msg').style.color = "red";
79-
}
80-
});
81-
82-
83-
// ID specifici dell'agente
84-
embeddedservice_bootstrap.init(
85-
'00DUA000003hFV7',
86-
'ai_chogangroupspa_com',
87-
'https://chogangroup--devai2.sandbox.my.site.com/ESWaichogangroupspacom1764335835157',
88-
{
89-
scrt2URL: 'https://chogangroup--devai2.sandbox.my.salesforce-scrt.com'
90-
}
91-
);
92-
93-
} catch (err) {
94-
console.error('Errore critico durante Init:', err);
95-
}
96-
};
97-
</script>
98-
99-
<script type='text/javascript' src='https://chogangroup--devai2.sandbox.my.site.com/ESWaichogangroupspacom1764335835157/assets/js/bootstrap.min.js' onload='initEmbeddedMessaging()'></script>
100-
101-
</body>
102-
</html>
1+
<!DOCTYPE html>
2+
<html lang="it">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>Demo Salesforce - Multi-Language Test</title>
7+
<style>
8+
body { font-family: 'Segoe UI', Arial, sans-serif; display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #f4f6f9; margin: 0; }
9+
.box { background: #fff; padding: 30px; border: 1px solid #e0e0e0; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.08); text-align: left; width: 380px; }
10+
h1 { margin: 0 0 25px; font-size: 26px; text-align: center; color: #1a1a1a; }
11+
.info-row { margin-bottom: 12px; font-size: 15px; color: #555; border-bottom: 1px solid #f0f0f0; padding-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }
12+
.info-row strong { color: #333; }
13+
14+
/* Stile per il selettore e bottone */
15+
select { padding: 5px; border-radius: 4px; border: 1px solid #ccc; font-size: 14px; }
16+
.btn-start { display: block; width: 100%; padding: 12px; background-color: #0070d2; color: white; border: none; border-radius: 6px; font-size: 16px; cursor: pointer; margin-top: 20px; transition: background 0.3s; }
17+
.btn-start:hover { background-color: #005fb2; }
18+
.btn-start:disabled { background-color: #ccc; cursor: not-allowed; }
19+
20+
.status { font-size: 13px; text-align: center; color: #0969da; margin-top: 15px; font-weight: 600; min-height: 20px;}
21+
</style>
22+
</head>
23+
<body>
24+
25+
<div class="box">
26+
<h1>Test Agentforce</h1>
27+
28+
<div class="info-row" style="background-color: #fafffa; border: 1px solid #cce5cc; padding: 10px; border-radius: 6px;">
29+
<strong>Lingua Chat:</strong>
30+
<select id="language-picker">
31+
<option value="it">Italiano (IT)</option>
32+
<option value="en_US">English (US)</option>
33+
<option value="es">Español (ES)</option>
34+
<option value="fr">Français (FR)</option>
35+
</select>
36+
</div>
37+
38+
<div class="info-row"><strong>Nome:</strong> <span id="disp-name">...</span></div>
39+
<div class="info-row"><strong>Tipo Utente:</strong> <span id="disp-type">...</span></div>
40+
<div class="info-row"><strong>ID Utente:</strong> <span id="disp-id">...</span></div>
41+
42+
<button id="start-btn" class="btn-start" onclick="startChatSession()">Inizializza Chat</button>
43+
44+
<div id="status-msg" class="status">Seleziona lingua e clicca Inizializza</div>
45+
46+
<p style="text-align:center; color:#999; font-size:11px; margin-top:25px;">
47+
Chogan Demo Environment
48+
</p>
49+
</div>
50+
51+
<script type='text/javascript'>
52+
// Dati utente simulati
53+
const userData = {
54+
fullname: "Mario Rossi",
55+
userType: "consultant",
56+
nationality: "IT",
57+
userId: "12345"
58+
};
59+
60+
// Popola UI
61+
document.getElementById('disp-name').innerText = userData.fullname;
62+
document.getElementById('disp-type').innerText = userData.userType;
63+
document.getElementById('disp-id').innerText = userData.userId;
64+
65+
function startChatSession() {
66+
// Disabilita il bottone per evitare doppi click
67+
const btn = document.getElementById('start-btn');
68+
btn.disabled = true;
69+
btn.innerText = "Caricamento...";
70+
71+
// Recupera la lingua scelta dalla Select
72+
const selectedLang = document.getElementById('language-picker').value;
73+
console.log("--> LINGUA SELEZIONATA:", selectedLang);
74+
75+
initEmbeddedMessaging(selectedLang);
76+
}
77+
78+
function initEmbeddedMessaging(langCode) {
79+
console.log("--> INIT SALESFORCE START <--");
80+
81+
try {
82+
// 1. IMPOSTAZIONI DEL CANALE (UI del Widget)
83+
// Questo imposta la lingua dei pulsanti standard ("Invia", "Chiudi", ecc.)
84+
embeddedservice_bootstrap.settings.language = langCode;
85+
86+
embeddedservice_bootstrap.settings.enableUserInputForConversationWithBot = false;
87+
88+
// 2. GESTIONE EVENTO PRE-CHAT (Per Agentforce)
89+
window.addEventListener("onEmbeddedMessagingReady", () => {
90+
console.log(">>> EVENTO: Messaging Ready. Invio parametri...");
91+
92+
try {
93+
// Costruiamo l'oggetto con i dati utente + LA LINGUA
94+
const hiddenFields = {
95+
"fullname": userData.fullname,
96+
"userType": userData.userType,
97+
"nationality": userData.nationality,
98+
"userId": userData.userId,
99+
// ECCO IL PUNTO CRUCIALE DALLA DOCUMENTAZIONE:
100+
// Passiamo la lingua come parametro nascosto per il Flow Omni-Channel
101+
"Language": langCode
102+
};
103+
104+
embeddedservice_bootstrap.prechatAPI.setHiddenPrechatFields(hiddenFields);
105+
106+
console.log(">>> Parametri Hidden inviati:", hiddenFields);
107+
108+
document.getElementById('status-msg').innerText = "Chat Pronta in: " + langCode;
109+
document.getElementById('status-msg').style.color = "green";
110+
document.getElementById('start-btn').style.display = 'none'; // Nascondi bottone
111+
112+
} catch (e) {
113+
console.error("Errore hidden fields:", e);
114+
document.getElementById('status-msg').innerText = "Errore Parametri";
115+
document.getElementById('status-msg').style.color = "red";
116+
}
117+
});
118+
119+
// 3. INIZIALIZZAZIONE EFFETTIVA
120+
embeddedservice_bootstrap.init(
121+
'00DUA000003hFV7',
122+
'ai_chogangroupspa_com',
123+
'https://chogangroup--devai2.sandbox.my.site.com/ESWaichogangroupspacom1764335835157',
124+
{
125+
scrt2URL: 'https://chogangroup--devai2.sandbox.my.salesforce-scrt.com'
126+
}
127+
);
128+
129+
} catch (err) {
130+
console.error('Errore critico durante Init:', err);
131+
document.getElementById('status-msg').innerText = "Errore Init";
132+
}
133+
};
134+
</script>
135+
136+
<script type='text/javascript' src='https://chogangroup--devai2.sandbox.my.site.com/ESWaichogangroupspacom1764335835157/assets/js/bootstrap.min.js'></script>
137+
138+
</body>
139+
</html>

0 commit comments

Comments
 (0)