ttp-agent-sdk 2.39.0 → 2.43.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/agent-widget.dev.js +5002 -2914
- package/dist/agent-widget.dev.js.map +1 -1
- package/dist/agent-widget.esm.js +1 -1
- package/dist/agent-widget.esm.js.map +1 -1
- package/dist/agent-widget.js +1 -1
- package/dist/agent-widget.js.map +1 -1
- package/dist/audio-processor.js +4 -0
- package/dist/demos/index.html +45 -0
- package/dist/demos/test-ecommerce.html +34 -16
- package/dist/demos/test-tour.html +375 -0
- package/dist/demos/widget-customization-dev.html +8 -14
- package/dist/demos/widget-customization.html +1721 -608
- package/dist/examples/test-ecommerce.html +34 -16
- package/dist/examples/test-index.html +45 -0
- package/dist/examples/test-restaurant.html +373 -0
- package/dist/examples/test-text-chat.html +18 -9
- package/dist/examples/test-tour.html +375 -0
- package/dist/examples/widget-customization-dev.html +8 -14
- package/dist/examples/widget-customization.html +1721 -608
- package/examples/test-ecommerce.html +34 -16
- package/examples/test-index.html +45 -0
- package/examples/test-restaurant.html +373 -0
- package/examples/test-text-chat.html +18 -9
- package/examples/test-tour.html +375 -0
- package/examples/widget-customization-dev.html +8 -14
- package/examples/widget-customization.html +1721 -608
- package/package.json +1 -1
|
@@ -0,0 +1,375 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
6
|
+
<title>TTP Tour Flavor - Test</title>
|
|
7
|
+
<style>
|
|
8
|
+
body {
|
|
9
|
+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
10
|
+
max-width: 1200px;
|
|
11
|
+
margin: 40px auto;
|
|
12
|
+
padding: 20px;
|
|
13
|
+
background: #F9FAFB;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.container {
|
|
17
|
+
background: white;
|
|
18
|
+
padding: 30px;
|
|
19
|
+
border-radius: 12px;
|
|
20
|
+
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
h1 { color: #111827; margin-top: 0; }
|
|
24
|
+
h2 { color: #374151; border-bottom: 2px solid #E5E7EB; padding-bottom: 8px; margin-top: 30px; }
|
|
25
|
+
|
|
26
|
+
.info {
|
|
27
|
+
background: #EFF6FF;
|
|
28
|
+
border-left: 4px solid #3B82F6;
|
|
29
|
+
padding: 16px;
|
|
30
|
+
margin: 20px 0;
|
|
31
|
+
border-radius: 4px;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.status {
|
|
35
|
+
margin: 20px 0;
|
|
36
|
+
padding: 12px;
|
|
37
|
+
background: #F3F4F6;
|
|
38
|
+
border-radius: 6px;
|
|
39
|
+
font-family: monospace;
|
|
40
|
+
font-size: 14px;
|
|
41
|
+
}
|
|
42
|
+
.status.success { background: #D1FAE5; color: #065F46; }
|
|
43
|
+
.status.error { background: #FEE2E2; color: #991B1B; }
|
|
44
|
+
|
|
45
|
+
button {
|
|
46
|
+
background: #2563EB;
|
|
47
|
+
color: white;
|
|
48
|
+
border: none;
|
|
49
|
+
padding: 12px 24px;
|
|
50
|
+
border-radius: 6px;
|
|
51
|
+
cursor: pointer;
|
|
52
|
+
font-size: 16px;
|
|
53
|
+
margin: 10px 10px 10px 0;
|
|
54
|
+
}
|
|
55
|
+
button:hover { background: #1D4ED8; }
|
|
56
|
+
button.secondary { background: #6B7280; }
|
|
57
|
+
button.secondary:hover { background: #4B5563; }
|
|
58
|
+
button.success { background: #059669; }
|
|
59
|
+
button.success:hover { background: #047857; }
|
|
60
|
+
|
|
61
|
+
label {
|
|
62
|
+
display: flex;
|
|
63
|
+
flex-direction: column;
|
|
64
|
+
gap: 4px;
|
|
65
|
+
font-size: 14px;
|
|
66
|
+
color: #374151;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
select, input[type="text"] {
|
|
70
|
+
padding: 8px 12px;
|
|
71
|
+
border: 1px solid #D1D5DB;
|
|
72
|
+
border-radius: 6px;
|
|
73
|
+
font-size: 14px;
|
|
74
|
+
font-family: inherit;
|
|
75
|
+
background: white;
|
|
76
|
+
color: #111827;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.settings-grid {
|
|
80
|
+
display: grid;
|
|
81
|
+
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
82
|
+
gap: 16px;
|
|
83
|
+
margin: 16px 0;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.test-section {
|
|
87
|
+
border: 1px solid #E5E7EB;
|
|
88
|
+
border-radius: 8px;
|
|
89
|
+
padding: 20px;
|
|
90
|
+
margin: 16px 0;
|
|
91
|
+
background: #F9FAFB;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.test-section h3 {
|
|
95
|
+
margin: 0 0 12px 0;
|
|
96
|
+
color: #111827;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.code-block {
|
|
100
|
+
background: #1F2937;
|
|
101
|
+
color: #F9FAFB;
|
|
102
|
+
padding: 16px;
|
|
103
|
+
border-radius: 6px;
|
|
104
|
+
font-family: monospace;
|
|
105
|
+
font-size: 12px;
|
|
106
|
+
overflow-x: auto;
|
|
107
|
+
margin: 20px 0;
|
|
108
|
+
white-space: pre-wrap;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
@media (max-width: 768px) {
|
|
112
|
+
body { margin: 0; padding: 10px; }
|
|
113
|
+
.container { padding: 16px; border-radius: 8px; }
|
|
114
|
+
h1 { font-size: 24px; }
|
|
115
|
+
button { width: 100%; margin: 8px 0; }
|
|
116
|
+
.settings-grid { grid-template-columns: 1fr; }
|
|
117
|
+
}
|
|
118
|
+
</style>
|
|
119
|
+
</head>
|
|
120
|
+
<body>
|
|
121
|
+
<div class="container">
|
|
122
|
+
<h1>TTP Tour Flavor Test</h1>
|
|
123
|
+
|
|
124
|
+
<div class="info">
|
|
125
|
+
<strong>How it works:</strong>
|
|
126
|
+
<ul>
|
|
127
|
+
<li>Uses <code>TTPChatWidget</code> with <code>flavor: { type: 'tours', partnerId: 'mock-tour' }</code></li>
|
|
128
|
+
<li>The backend injects tour tools (<code>search_tours</code>, <code>book_tour</code>, <code>get_tour_booking</code>, <code>show_media</code>)</li>
|
|
129
|
+
<li>Tour cards display when the agent sends <code>show_items</code> messages</li>
|
|
130
|
+
<li>Booking summary updates on <code>cart_updated</code> messages</li>
|
|
131
|
+
<li>Gallery (<code>show_media</code>) opens fullscreen for tour photos, highlights, etc.</li>
|
|
132
|
+
</ul>
|
|
133
|
+
</div>
|
|
134
|
+
|
|
135
|
+
<div id="status" class="status">Loading SDK...</div>
|
|
136
|
+
|
|
137
|
+
<h2>Widget Configuration</h2>
|
|
138
|
+
<div class="settings-grid">
|
|
139
|
+
<label>Agent ID
|
|
140
|
+
<input id="agentId" type="text" value="agent_b8f001773" placeholder="agent_..." />
|
|
141
|
+
</label>
|
|
142
|
+
<label>App ID
|
|
143
|
+
<input id="appId" type="text" value="app_wNGQKiMUfUT5JdVIaxzXOJfdcgBegxGY5hZo" placeholder="app_..." />
|
|
144
|
+
</label>
|
|
145
|
+
<label>Language
|
|
146
|
+
<select id="languageSelect">
|
|
147
|
+
<option value="en" selected>English</option>
|
|
148
|
+
</select>
|
|
149
|
+
</label>
|
|
150
|
+
<label>STT Provider
|
|
151
|
+
<select id="sttSelect">
|
|
152
|
+
<option value="">Default (server)</option>
|
|
153
|
+
<option value="azure-stt" selected>Azure STT</option>
|
|
154
|
+
</select>
|
|
155
|
+
</label>
|
|
156
|
+
</div>
|
|
157
|
+
|
|
158
|
+
<div style="margin-top: 16px;">
|
|
159
|
+
<button id="createBtn">Create Widget</button>
|
|
160
|
+
<button id="destroyBtn" class="secondary">Destroy Widget</button>
|
|
161
|
+
</div>
|
|
162
|
+
|
|
163
|
+
<h2>Test Actions (Simulated Messages)</h2>
|
|
164
|
+
|
|
165
|
+
<div class="test-section">
|
|
166
|
+
<h3>Show Tour Items</h3>
|
|
167
|
+
<p style="color: #6B7280; font-size: 14px; margin-bottom: 12px;">
|
|
168
|
+
Injects a <code>show_items</code> message with mock tour packages.
|
|
169
|
+
</p>
|
|
170
|
+
<button id="showToursBtn" class="success">Show Tour Items</button>
|
|
171
|
+
</div>
|
|
172
|
+
|
|
173
|
+
<div class="test-section">
|
|
174
|
+
<h3>Show Gallery</h3>
|
|
175
|
+
<p style="color: #6B7280; font-size: 14px; margin-bottom: 12px;">
|
|
176
|
+
Injects a <code>show_media</code> message to test fullscreen gallery with tour photos.
|
|
177
|
+
</p>
|
|
178
|
+
<button id="showGalleryBtn" class="success">Show Gallery</button>
|
|
179
|
+
</div>
|
|
180
|
+
|
|
181
|
+
<div class="test-section">
|
|
182
|
+
<h3>Booking Updated</h3>
|
|
183
|
+
<p style="color: #6B7280; font-size: 14px; margin-bottom: 12px;">
|
|
184
|
+
Injects a <code>cart_updated</code> message to test the booking summary bar.
|
|
185
|
+
</p>
|
|
186
|
+
<button id="bookingBtn" class="success">Simulate Booking</button>
|
|
187
|
+
<button id="clearBookingBtn" class="secondary">Clear Booking</button>
|
|
188
|
+
</div>
|
|
189
|
+
|
|
190
|
+
<h2>Console Commands</h2>
|
|
191
|
+
<div class="code-block">// Access the widget instance
|
|
192
|
+
window.testWidget
|
|
193
|
+
|
|
194
|
+
// Inject messages manually
|
|
195
|
+
window.testWidget._flavor.messageHandlers['show_items']({
|
|
196
|
+
t: 'show_items',
|
|
197
|
+
items: [
|
|
198
|
+
{ id: 'TOUR-001', name: 'Old City Walking Tour', category: 'Walking Tours', price: 49.99, currency: 'USD', imageUrl: '...', available: true, tags: ['walking', 'history'], description: '3-hour guided walking tour' }
|
|
199
|
+
],
|
|
200
|
+
title: 'Available Tours'
|
|
201
|
+
});</div>
|
|
202
|
+
</div>
|
|
203
|
+
|
|
204
|
+
<script>
|
|
205
|
+
(function() {
|
|
206
|
+
var isNgrok = window.location.hostname.includes('ngrok');
|
|
207
|
+
if (isNgrok) {
|
|
208
|
+
var s = document.createElement('script');
|
|
209
|
+
s.type = 'text/javascript';
|
|
210
|
+
document.head.appendChild(s);
|
|
211
|
+
fetch('/agent-widget.js', { headers: { 'ngrok-skip-browser-warning': '1' } })
|
|
212
|
+
.then(function(r) { return r.text(); })
|
|
213
|
+
.then(function(code) { s.textContent = code; })
|
|
214
|
+
.catch(function(e) { console.error('SDK fetch failed:', e); });
|
|
215
|
+
} else {
|
|
216
|
+
var s = document.createElement('script');
|
|
217
|
+
s.src = '/agent-widget.js';
|
|
218
|
+
document.head.appendChild(s);
|
|
219
|
+
}
|
|
220
|
+
})();
|
|
221
|
+
</script>
|
|
222
|
+
|
|
223
|
+
<script>
|
|
224
|
+
let chatWidget = null;
|
|
225
|
+
|
|
226
|
+
function updateStatus(msg, type = '') {
|
|
227
|
+
const el = document.getElementById('status');
|
|
228
|
+
el.textContent = msg;
|
|
229
|
+
el.className = 'status ' + type;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
function createWidget() {
|
|
233
|
+
if (chatWidget) {
|
|
234
|
+
chatWidget.destroy();
|
|
235
|
+
chatWidget = null;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
const TTPAgentSDK = window.TTPAgentSDK;
|
|
239
|
+
if (!TTPAgentSDK || !TTPAgentSDK.TTPChatWidget) {
|
|
240
|
+
updateStatus('TTPChatWidget not available in SDK', 'error');
|
|
241
|
+
return;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
const agentId = document.getElementById('agentId').value;
|
|
245
|
+
const appId = document.getElementById('appId').value;
|
|
246
|
+
|
|
247
|
+
chatWidget = new TTPAgentSDK.TTPChatWidget({
|
|
248
|
+
agentId,
|
|
249
|
+
appId,
|
|
250
|
+
language: document.getElementById('languageSelect').value,
|
|
251
|
+
agentSettingsOverride: (() => {
|
|
252
|
+
const override = {};
|
|
253
|
+
const stt = document.getElementById('sttSelect').value;
|
|
254
|
+
if (stt) override.sttProvider = stt;
|
|
255
|
+
return override;
|
|
256
|
+
})(),
|
|
257
|
+
behavior: {
|
|
258
|
+
mode: 'unified',
|
|
259
|
+
startOpen: true
|
|
260
|
+
},
|
|
261
|
+
flavor: {
|
|
262
|
+
type: 'tours',
|
|
263
|
+
partnerId: 'mock-tour'
|
|
264
|
+
},
|
|
265
|
+
icon: {
|
|
266
|
+
type: 'custom',
|
|
267
|
+
size: 'medium',
|
|
268
|
+
backgroundColor: '#FFFFFF'
|
|
269
|
+
},
|
|
270
|
+
whatsapp: {
|
|
271
|
+
number: '+972508665824',
|
|
272
|
+
text: 'היי, אשמח אם תוכלי לעזור לי במשהו....'
|
|
273
|
+
}
|
|
274
|
+
});
|
|
275
|
+
|
|
276
|
+
window.testWidget = chatWidget;
|
|
277
|
+
updateStatus('TTPChatWidget created — tours flavor (mock-tour)', 'success');
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
document.getElementById('createBtn').onclick = createWidget;
|
|
281
|
+
|
|
282
|
+
document.getElementById('destroyBtn').onclick = () => {
|
|
283
|
+
if (chatWidget) {
|
|
284
|
+
chatWidget.destroy();
|
|
285
|
+
chatWidget = null;
|
|
286
|
+
updateStatus('Widget destroyed', '');
|
|
287
|
+
}
|
|
288
|
+
};
|
|
289
|
+
|
|
290
|
+
document.getElementById('showToursBtn').onclick = () => {
|
|
291
|
+
if (!chatWidget || !chatWidget._flavor) {
|
|
292
|
+
updateStatus('Create widget first', 'error');
|
|
293
|
+
return;
|
|
294
|
+
}
|
|
295
|
+
chatWidget._flavor.messageHandlers['show_items']({
|
|
296
|
+
t: 'show_items',
|
|
297
|
+
items: [
|
|
298
|
+
{ id: 'TOUR-001', name: 'Old City Walking Tour', category: 'Walking Tours', price: 49.99, currency: 'USD', imageUrl: 'https://images.unsplash.com/photo-1467269204594-9661b134dd2b?w=300&h=300&fit=crop', available: true, tags: ['walking', 'history', 'culture'], description: '3-hour guided tour through ancient streets and landmarks' },
|
|
299
|
+
{ id: 'TOUR-002', name: 'Sunset Kayak Adventure', category: 'Water Activities', price: 79.99, currency: 'USD', imageUrl: 'https://images.unsplash.com/photo-1472745942893-4b9f730c7668?w=300&h=300&fit=crop', available: true, tags: ['water', 'adventure', 'sunset'], description: '2-hour kayaking experience with stunning sunset views' },
|
|
300
|
+
{ id: 'TOUR-003', name: 'Mountain Hiking Expedition', category: 'Hiking', price: 89.99, currency: 'USD', imageUrl: 'https://images.unsplash.com/photo-1551632811-561732d1e306?w=300&h=300&fit=crop', available: true, tags: ['hiking', 'nature', 'mountain'], description: 'Full-day guided hike through scenic mountain trails' },
|
|
301
|
+
{ id: 'TOUR-004', name: 'Food & Wine Tasting Tour', category: 'Food Tours', price: 64.99, currency: 'USD', imageUrl: 'https://images.unsplash.com/photo-1414235077428-338989a2e8c0?w=300&h=300&fit=crop', available: true, tags: ['food', 'wine', 'tasting'], description: 'Sample local cuisine and wines at 5 curated stops' }
|
|
302
|
+
],
|
|
303
|
+
title: '4 tours found'
|
|
304
|
+
});
|
|
305
|
+
updateStatus('show_items injected with 4 tour packages', 'success');
|
|
306
|
+
};
|
|
307
|
+
|
|
308
|
+
document.getElementById('showGalleryBtn').onclick = () => {
|
|
309
|
+
if (!chatWidget || !chatWidget._flavor) {
|
|
310
|
+
updateStatus('Create widget first', 'error');
|
|
311
|
+
return;
|
|
312
|
+
}
|
|
313
|
+
chatWidget._flavor.messageHandlers['show_media']({
|
|
314
|
+
t: 'show_media',
|
|
315
|
+
images: [
|
|
316
|
+
{ url: 'https://images.unsplash.com/photo-1469854523086-cc02fe5d8800?w=800', caption: 'Scenic road trip through the countryside' },
|
|
317
|
+
{ url: 'https://images.unsplash.com/photo-1476514525535-07fb3b4ae5f1?w=800', caption: 'Crystal clear lake adventure' },
|
|
318
|
+
{ url: 'https://images.unsplash.com/photo-1530789253388-582c481c54b0?w=800', caption: 'Historic architecture tour' },
|
|
319
|
+
{ url: 'https://images.unsplash.com/photo-1501785888041-af3ef285b470?w=800', caption: 'Breathtaking mountain viewpoint' }
|
|
320
|
+
],
|
|
321
|
+
title: 'Tour Highlights'
|
|
322
|
+
});
|
|
323
|
+
updateStatus('show_media injected with 4 images (fullscreen gallery)', 'success');
|
|
324
|
+
};
|
|
325
|
+
|
|
326
|
+
document.getElementById('bookingBtn').onclick = () => {
|
|
327
|
+
if (!chatWidget || !chatWidget._flavor) {
|
|
328
|
+
updateStatus('Create widget first', 'error');
|
|
329
|
+
return;
|
|
330
|
+
}
|
|
331
|
+
chatWidget._flavor.messageHandlers['cart_updated']({
|
|
332
|
+
t: 'cart_updated',
|
|
333
|
+
cartItemCount: 2,
|
|
334
|
+
cartTotal: 129.98,
|
|
335
|
+
action: 'added',
|
|
336
|
+
product: { id: 'TOUR-001', name: 'Old City Walking Tour', price: 49.99 }
|
|
337
|
+
});
|
|
338
|
+
updateStatus('cart_updated injected (2 tours, $129.98)', 'success');
|
|
339
|
+
};
|
|
340
|
+
|
|
341
|
+
document.getElementById('clearBookingBtn').onclick = () => {
|
|
342
|
+
if (!chatWidget || !chatWidget._flavor) {
|
|
343
|
+
updateStatus('Create widget first', 'error');
|
|
344
|
+
return;
|
|
345
|
+
}
|
|
346
|
+
chatWidget._flavor.messageHandlers['cart_updated']({
|
|
347
|
+
t: 'cart_updated',
|
|
348
|
+
cartItemCount: 0,
|
|
349
|
+
cartTotal: 0,
|
|
350
|
+
action: 'refreshed'
|
|
351
|
+
});
|
|
352
|
+
updateStatus('Booking cleared', '');
|
|
353
|
+
};
|
|
354
|
+
|
|
355
|
+
function waitForSDK() {
|
|
356
|
+
return new Promise((resolve, reject) => {
|
|
357
|
+
if (window.TTPAgentSDK?.TTPChatWidget) { resolve(); return; }
|
|
358
|
+
let attempts = 0;
|
|
359
|
+
const iv = setInterval(() => {
|
|
360
|
+
attempts++;
|
|
361
|
+
if (window.TTPAgentSDK?.TTPChatWidget) { clearInterval(iv); resolve(); }
|
|
362
|
+
else if (attempts >= 150) { clearInterval(iv); reject(new Error('SDK failed to load')); }
|
|
363
|
+
}, 100);
|
|
364
|
+
});
|
|
365
|
+
}
|
|
366
|
+
|
|
367
|
+
waitForSDK().then(() => {
|
|
368
|
+
updateStatus('SDK loaded — creating widget...', '');
|
|
369
|
+
createWidget();
|
|
370
|
+
}).catch(e => {
|
|
371
|
+
updateStatus('SDK load failed: ' + e.message, 'error');
|
|
372
|
+
});
|
|
373
|
+
</script>
|
|
374
|
+
</body>
|
|
375
|
+
</html>
|
|
@@ -1366,7 +1366,6 @@
|
|
|
1366
1366
|
},
|
|
1367
1367
|
icon: {
|
|
1368
1368
|
type: 'custom',
|
|
1369
|
-
customImage: 'https://talktopc.com/logo192.png',
|
|
1370
1369
|
size: 'medium',
|
|
1371
1370
|
backgroundColor: '#FFFFFF'
|
|
1372
1371
|
},
|
|
@@ -1538,7 +1537,7 @@
|
|
|
1538
1537
|
const iconConfig = widgetConfig.icon;
|
|
1539
1538
|
button.innerHTML = ''; // Clear previous content
|
|
1540
1539
|
|
|
1541
|
-
if (iconConfig.type === 'custom' && iconConfig.customImage) {
|
|
1540
|
+
if (iconConfig.type === 'custom' && iconConfig.customImage != null && String(iconConfig.customImage).trim() !== '') {
|
|
1542
1541
|
const img = document.createElement('img');
|
|
1543
1542
|
img.src = iconConfig.customImage;
|
|
1544
1543
|
img.alt = 'Chat Assistant';
|
|
@@ -1559,15 +1558,12 @@
|
|
|
1559
1558
|
<path d="M17 11c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/>
|
|
1560
1559
|
</svg>`;
|
|
1561
1560
|
} else {
|
|
1562
|
-
|
|
1563
|
-
const
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
img.style.height = iconSize + 'px';
|
|
1569
|
-
img.style.objectFit = 'contain';
|
|
1570
|
-
button.appendChild(img);
|
|
1561
|
+
/* custom with no URL (or other types): match SDK — default mic icon for circle launcher */
|
|
1562
|
+
const iconSize = Math.floor(getSizeValue(config.size) * 0.5);
|
|
1563
|
+
button.innerHTML = `<svg viewBox="0 0 24 24" style="width: ${iconSize}px; height: ${iconSize}px; fill: #7C3AED;">
|
|
1564
|
+
<path d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3z"/>
|
|
1565
|
+
<path d="M17 11c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/>
|
|
1566
|
+
</svg>`;
|
|
1571
1567
|
}
|
|
1572
1568
|
|
|
1573
1569
|
// Make button highlightable
|
|
@@ -2453,7 +2449,7 @@
|
|
|
2453
2449
|
</div>
|
|
2454
2450
|
<div class="control-item" id="iconCustomImageControl" style="display: ${widgetConfig.icon.type === 'custom' ? 'block' : 'none'};">
|
|
2455
2451
|
<label>Image URL</label>
|
|
2456
|
-
<input type="text" id="iconCustomImage" value="${widgetConfig.icon.customImage || '
|
|
2452
|
+
<input type="text" id="iconCustomImage" value="${widgetConfig.icon.customImage || ''}" placeholder="Optional image URL (empty = default icon)">
|
|
2457
2453
|
</div>
|
|
2458
2454
|
<div class="control-item" id="iconEmojiControl" style="display: ${widgetConfig.icon.type === 'emoji' ? 'block' : 'none'};">
|
|
2459
2455
|
<label>Emoji</label>
|
|
@@ -3690,7 +3686,6 @@
|
|
|
3690
3686
|
},
|
|
3691
3687
|
icon: {
|
|
3692
3688
|
type: 'custom',
|
|
3693
|
-
customImage: 'https://talktopc.com/logo192.png',
|
|
3694
3689
|
size: 'medium',
|
|
3695
3690
|
backgroundColor: '#FFFFFF'
|
|
3696
3691
|
},
|
|
@@ -4192,7 +4187,6 @@
|
|
|
4192
4187
|
},
|
|
4193
4188
|
icon: {
|
|
4194
4189
|
type: 'custom',
|
|
4195
|
-
customImage: 'https://talktopc.com/logo192.png',
|
|
4196
4190
|
size: 'medium',
|
|
4197
4191
|
backgroundColor: '#FFFFFF'
|
|
4198
4192
|
},
|