@chat21/chat21-web-widget 5.0.80 → 5.0.81
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/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,14 @@
|
|
|
5
5
|
*Dario De Pascalis*
|
|
6
6
|
### **Copyrigth**: *Tiledesk SRL*
|
|
7
7
|
|
|
8
|
+
### 5.0.81 in PROD
|
|
9
|
+
|
|
10
|
+
### 5.0.81-rc.2
|
|
11
|
+
- added: blank.html page to integrate widget on webview
|
|
12
|
+
|
|
13
|
+
### 5.0.81-rc.1
|
|
14
|
+
- added: updateLeadInfo function in messageAdded subscription
|
|
15
|
+
|
|
8
16
|
### 5.0.80 in PROD
|
|
9
17
|
|
|
10
18
|
### 5.0.80-rc.2
|
package/package.json
CHANGED
|
@@ -733,6 +733,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
|
|
|
733
733
|
this.onNewMessageCreated.emit(msg)
|
|
734
734
|
this.checkMessagesLegntForTranscriptDownloadMenuOption();
|
|
735
735
|
this.resetTimeout();
|
|
736
|
+
// this.updateLeadInfo(msg);
|
|
736
737
|
}
|
|
737
738
|
});
|
|
738
739
|
const subscribe = {key: subscribtionKey, value: subscribtion };
|
|
@@ -0,0 +1,317 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
|
|
3
|
+
<html lang="en">
|
|
4
|
+
<head>
|
|
5
|
+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
6
|
+
<meta charset="utf-8">
|
|
7
|
+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
8
|
+
|
|
9
|
+
<title>Widget test page </title>
|
|
10
|
+
<style>
|
|
11
|
+
|
|
12
|
+
@-moz-keyframes blink {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}} /* Firefox */
|
|
13
|
+
@-webkit-keyframes blink {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}} /* Webkit */
|
|
14
|
+
@-ms-keyframes blink {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}} /* IE */
|
|
15
|
+
@keyframes blink {0%{opacity:1;} 50%{opacity:0;} 100%{opacity:1;}} /* Opera and prob css3 final iteration */
|
|
16
|
+
|
|
17
|
+
body{
|
|
18
|
+
--font-family-poppins: 'Poppins', 'Roboto', Arial, sans-serif;
|
|
19
|
+
--blu: #506493;
|
|
20
|
+
--gray-light-02: rgb(223, 227, 237);
|
|
21
|
+
--base-company-logo: rgb(224,106,88);
|
|
22
|
+
--header-height: 80px;
|
|
23
|
+
--footer-height: 80px;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
#preloader {
|
|
27
|
+
background: #fff;
|
|
28
|
+
position: absolute;
|
|
29
|
+
top: 0;
|
|
30
|
+
left: 0;
|
|
31
|
+
bottom: 0;
|
|
32
|
+
right: 0;
|
|
33
|
+
height: 100%;
|
|
34
|
+
width: 100%;
|
|
35
|
+
z-index: 999999;
|
|
36
|
+
opacity: 1;
|
|
37
|
+
filter: alpha(opacity=100);
|
|
38
|
+
-webkit-transition: opacity 500ms ease;
|
|
39
|
+
transition: opacity 500ms ease, display 500ms;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
#preloader .logo {
|
|
43
|
+
display: block;
|
|
44
|
+
width: 109px;
|
|
45
|
+
height: 39px;
|
|
46
|
+
background-repeat: no-repeat;
|
|
47
|
+
background-image: url(./tiledesk_widget_files/logo@2x-black.png);
|
|
48
|
+
background-size: contain;
|
|
49
|
+
position: absolute;
|
|
50
|
+
top: 50%;
|
|
51
|
+
left: 50%;
|
|
52
|
+
margin: -20px 0 0 -55px;
|
|
53
|
+
-moz-transition:all 1s ease-in-out;
|
|
54
|
+
-webkit-transition:all 1s ease-in-out;
|
|
55
|
+
-o-transition:all 1s ease-in-out;
|
|
56
|
+
-ms-transition:all 1s ease-in-out;
|
|
57
|
+
transition:all 1s ease-in-out;
|
|
58
|
+
/* order: name, direction, duration, iteration-count, timing-function */
|
|
59
|
+
-moz-animation:blink normal 2s infinite ease-in-out; /* Firefox */
|
|
60
|
+
-webkit-animation:blink normal 2s infinite ease-in-out; /* Webkit */
|
|
61
|
+
-ms-animation:blink normal 2s infinite ease-in-out; /* IE */
|
|
62
|
+
animation:blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.loader{
|
|
66
|
+
display: block;
|
|
67
|
+
z-index: 99;
|
|
68
|
+
position: absolute;
|
|
69
|
+
top: calc( 50% - 50px);
|
|
70
|
+
left: calc( 50% - 50px);
|
|
71
|
+
width: 100px;
|
|
72
|
+
height: 100px;
|
|
73
|
+
border: 3px solid var(--base-company-logo);
|
|
74
|
+
border-radius: 50%;
|
|
75
|
+
|
|
76
|
+
animation: spin 7s ease-in-out;
|
|
77
|
+
animation-iteration-count: infinite;
|
|
78
|
+
transition-duration: 0.1s;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.loader:hover {
|
|
82
|
+
scale: 0.95;
|
|
83
|
+
/*Loader on hover effect*/
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.loader:active {
|
|
87
|
+
scale: 1.2;
|
|
88
|
+
/*Loader on click effect*/
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
@keyframes spin {
|
|
92
|
+
0% {
|
|
93
|
+
transform: rotate(0deg);
|
|
94
|
+
border-bottom: solid 3px transparent;
|
|
95
|
+
border-top: solid 3px transparent;
|
|
96
|
+
}
|
|
97
|
+
50% {
|
|
98
|
+
transform: rotate(1800deg);
|
|
99
|
+
border: 3px solid white;
|
|
100
|
+
border-left: solid 3px transparent;
|
|
101
|
+
border-right: solid 3px transparent;
|
|
102
|
+
}
|
|
103
|
+
100% {
|
|
104
|
+
/*Reversed spinning*/
|
|
105
|
+
transform: rotate(0deg);
|
|
106
|
+
border-bottom: solid 3px transparent;
|
|
107
|
+
border-top: solid 3px transparent;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
#deferred-styles {
|
|
112
|
+
display: none;
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
body {
|
|
116
|
+
background-color: #ffffff !important; /*#f4f5f5 !important;*/
|
|
117
|
+
font-family: Roboto, "Helvetica Neue", sans-serif;
|
|
118
|
+
font-weight: 300;
|
|
119
|
+
overflow: hidden;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
h1 {
|
|
123
|
+
font-weight: 300;
|
|
124
|
+
padding: 0;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
html, body {
|
|
128
|
+
height: 100%;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
.container{
|
|
133
|
+
display: flex;
|
|
134
|
+
align-items: center;
|
|
135
|
+
width: 100% !important;
|
|
136
|
+
justify-content: space-around;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.row {
|
|
140
|
+
margin-left: 0 !important;
|
|
141
|
+
margin-right: 0 !important;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
</style>
|
|
145
|
+
|
|
146
|
+
<meta property="og:title" content="Try Tiledesk now!" />
|
|
147
|
+
<meta property="og:description" content="Qualify your leads to increase your sales faster. It's really easy to do it with the Tiledesk conversational form builder" />
|
|
148
|
+
<meta property="og:image" content="https://tiledesk.com/wp-content/uploads/2022/12/6029654-02-min.png" />
|
|
149
|
+
<meta property="og:locale" content="en">
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
<script type="application/javascript">
|
|
153
|
+
window.tiledeskSettings = {
|
|
154
|
+
marginX: "100px",
|
|
155
|
+
marginY: "50px",
|
|
156
|
+
// calloutTimer: 1
|
|
157
|
+
// autostart: false
|
|
158
|
+
|
|
159
|
+
};
|
|
160
|
+
|
|
161
|
+
(function(d, s, id) {
|
|
162
|
+
var w=window; var d=document;
|
|
163
|
+
var i=function() {
|
|
164
|
+
i.c(arguments);
|
|
165
|
+
};
|
|
166
|
+
i.q=[];
|
|
167
|
+
i.c=function(args){
|
|
168
|
+
i.q.push(args);
|
|
169
|
+
};
|
|
170
|
+
w.Tiledesk=i;
|
|
171
|
+
var js, fjs = d.getElementsByTagName(s)[0];
|
|
172
|
+
if (d.getElementById(id)) return;
|
|
173
|
+
js = d.createElement(s);
|
|
174
|
+
js.id = id; js.async = true; js.src = "../../launch.js";
|
|
175
|
+
fjs.parentNode.insertBefore(js, fjs);
|
|
176
|
+
}(document, 'script', 'tiledesk-jssdk'));
|
|
177
|
+
|
|
178
|
+
window.addEventListener('load', (event)=> {
|
|
179
|
+
document.dispatchEvent(new Event('mousemove'))
|
|
180
|
+
})
|
|
181
|
+
|
|
182
|
+
window.Tiledesk('onLoadParams', function(event_data) {
|
|
183
|
+
console.log("onLoadParams Tiledesk FN", event_data);
|
|
184
|
+
// window.Tiledesk('signInWithCustomToken', 'JWT eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI2MDliOGVmYTg3MzJlYjAwMTQxNzYzZDlfNWU0ZWNiOThiNzhlZTQwMDE3NDA2MTEwIiwiZmlyc3RuYW1lIjoiS2VsbHkiLCJsYXN0bmFtZSI6IkdyYWNlIiwiZW1haWwiOiJncmFjZUBlbWFpbG5hLmNvIiwic3ViIjoidXNlcmV4dGVybmFsIiwiYXVkIjoiaHR0cHM6Ly90aWxlZGVzay5jb20vcHJvamVjdHMvNjA5YjhlZmE4NzMyZWIwMDE0MTc2M2Q5IiwiaWF0IjoxNjQxODAzODk0fQ.p0reTwd25p93CsDTyQa8tkihgFxThAI4DXloNc6vbXw')
|
|
185
|
+
// .then(response => console.log('signInWithCustomToken: user_logged -> ', response))
|
|
186
|
+
// .catch((error)=> console.error('signInWithCustomToken: error', error))
|
|
187
|
+
});
|
|
188
|
+
|
|
189
|
+
window.Tiledesk('onBeforeInit', function(event_data) {
|
|
190
|
+
console.log("onBeforeInit Tiledesk FN", event_data);
|
|
191
|
+
|
|
192
|
+
var brandSrc = event_data.detail.appConfigs.brandSrc? getBrandResources(event_data.detail.appConfigs.brandSrc) : null;
|
|
193
|
+
|
|
194
|
+
setTimeout(() => {
|
|
195
|
+
document.getElementById("preloader").style.display = "none";
|
|
196
|
+
}, 1000);
|
|
197
|
+
|
|
198
|
+
});
|
|
199
|
+
|
|
200
|
+
window.Tiledesk('onInit', function(event_data) {
|
|
201
|
+
console.log("onInit Tiledesk FN", event_data);
|
|
202
|
+
//open widget after 3s if is closed
|
|
203
|
+
setTimeout(() => {
|
|
204
|
+
if(event_data && event_data.detail && event_data.detail.global && !event_data.detail.global.isOpen){
|
|
205
|
+
window.Tiledesk('open')
|
|
206
|
+
}
|
|
207
|
+
}, 3000);
|
|
208
|
+
});
|
|
209
|
+
|
|
210
|
+
window.Tiledesk('onAuthStateChanged', function(event_data) {
|
|
211
|
+
console.log("onAuthStateChanged Tiledesk FN!", event_data);
|
|
212
|
+
});
|
|
213
|
+
|
|
214
|
+
window.Tiledesk('onMessageCreated', function(event_data) {
|
|
215
|
+
// console.log("onMessageCreated!", event_data);
|
|
216
|
+
window.parent.postMessage(event_data.detail, '*')
|
|
217
|
+
// if(event_data.detail.isLogged){
|
|
218
|
+
// console.log("isLogged!!!!", event_data);
|
|
219
|
+
// window.Tiledesk('show')
|
|
220
|
+
// }
|
|
221
|
+
});
|
|
222
|
+
|
|
223
|
+
window.addEventListener('message', (event_data)=> {
|
|
224
|
+
if(event_data && event_data.data && event_data.data.action === 'restart'){
|
|
225
|
+
window.Tiledesk('startConversation', event_data.data.intentName)
|
|
226
|
+
}
|
|
227
|
+
})
|
|
228
|
+
</script>
|
|
229
|
+
|
|
230
|
+
<script type="application/javascript">
|
|
231
|
+
|
|
232
|
+
var queryString = window.location.search;
|
|
233
|
+
var urlParams = new URLSearchParams(queryString);
|
|
234
|
+
|
|
235
|
+
var currentUrl = window.location.href
|
|
236
|
+
var baseUrl = window.location.origin
|
|
237
|
+
|
|
238
|
+
|
|
239
|
+
function getBrandResources(url) {
|
|
240
|
+
var xhr = new XMLHttpRequest();
|
|
241
|
+
xhr.onreadystatechange = function () {
|
|
242
|
+
if (xhr.readyState === 4) {
|
|
243
|
+
var brandJson = JSON.parse(xhr.response)
|
|
244
|
+
if(brandJson){
|
|
245
|
+
/** TITLE AND FAVICON **/
|
|
246
|
+
brandJson['WIDGET'].META_TITLE? document.body.title = brandJson['WIDGET'].META_TITLE : null;
|
|
247
|
+
brandJson['WIDGET'].FAVICON_URL? document.querySelector("link[rel~='icon']").setAttribute('href', brandJson['WIDGET'].FAVICON_URL) : null;
|
|
248
|
+
/** FOOTER-LOGO **/
|
|
249
|
+
brandJson['COMMON'].COMPANY_LOGO? document.getElementById('footer-logo').src = brandJson['COMMON'].COMPANY_LOGO : null;
|
|
250
|
+
brandJson['COMMON'].COMPANY_SITE_NAME? document.getElementById('footer-logo').alt = brandJson['COMMON'].COMPANY_SITE_NAME : null;
|
|
251
|
+
brandJson['COMMON'].COMPANY_SITE_URL? document.getElementById('footer-link').href = brandJson['COMMON'].COMPANY_SITE_URL : null;
|
|
252
|
+
/** HEADER-LOGO **/
|
|
253
|
+
brandJson['COMMON'].BASE_LOGO_WHITE? document.getElementById('header-logo').src = brandJson['COMMON'].BASE_LOGO_WHITE : null;
|
|
254
|
+
/** HEADER-DOCS RESOURCES **/
|
|
255
|
+
document.getElementsByClassName('docs')[0].style.display = 'none'
|
|
256
|
+
brandJson['COMMON'].DOCS? null: document.getElementById('share').style.display = 'none'
|
|
257
|
+
/** IFRAME TITLE**/
|
|
258
|
+
brandJson['COMMON'].COMPANY_LOGO? document.getElementById('tiledeskiframe').title = brandJson['COMMON'].COMPANY_NAME + ' Widget' : null;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
xhr.open('GET', url, true);
|
|
264
|
+
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
|
|
265
|
+
xhr.send();
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
var url = new URL(currentUrl);
|
|
269
|
+
var tiledesk_projectid = url.searchParams.get("tiledesk_projectid");
|
|
270
|
+
var project_name = url.searchParams.get("project_name");
|
|
271
|
+
// console.log('tiledesk_projectid: ', tiledesk_projectid);
|
|
272
|
+
// console.log('project_name: ', project_name);
|
|
273
|
+
|
|
274
|
+
|
|
275
|
+
// window.tileDeskAsyncInit = function() {
|
|
276
|
+
// window.tiledesk.on('onLoadParams', function(event_data) {
|
|
277
|
+
// // console.log('onLoadParams: ')
|
|
278
|
+
// window.tiledesk.open();
|
|
279
|
+
// });
|
|
280
|
+
|
|
281
|
+
// window.tiledesk.on('onInit', function(event_data) {
|
|
282
|
+
// setTimeout(() => {
|
|
283
|
+
// document.getElementById("preloader").style.display = "none";
|
|
284
|
+
// }, 1000);
|
|
285
|
+
|
|
286
|
+
// });
|
|
287
|
+
// };
|
|
288
|
+
|
|
289
|
+
function getQueryVariable(variable) {
|
|
290
|
+
var query = window.location.search.substring(1);
|
|
291
|
+
var vars = query.split("&");
|
|
292
|
+
for (var i=0;i<vars.length;i++) {
|
|
293
|
+
var pair = vars[i].split("=");
|
|
294
|
+
if(pair[0] == variable){return pair[1];}
|
|
295
|
+
}
|
|
296
|
+
return(false);
|
|
297
|
+
}
|
|
298
|
+
</script>
|
|
299
|
+
|
|
300
|
+
</head>
|
|
301
|
+
|
|
302
|
+
<body class="website white" >
|
|
303
|
+
<!-- <div id="preloader">
|
|
304
|
+
<div class="logo"></div>
|
|
305
|
+
</div> -->
|
|
306
|
+
|
|
307
|
+
<div id="preloader">
|
|
308
|
+
<div class="loader"></div>
|
|
309
|
+
</div>
|
|
310
|
+
|
|
311
|
+
<div>
|
|
312
|
+
<link href="./tiledesk_widget_files/bootstrap.min.css" rel="stylesheet" type="text/css">
|
|
313
|
+
<!-- <link href="./tiledesk_widget_files/font-awesome.min.css" rel="stylesheet" type="text/css"> -->
|
|
314
|
+
<link href="./tiledesk_widget_files/website-poly.min.css" rel="stylesheet" type="text/css">
|
|
315
|
+
</div>
|
|
316
|
+
</body>
|
|
317
|
+
</html>
|