@chat21/chat21-web-widget 5.0.50 → 5.0.51-rc.2
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 +9 -0
- package/dist/assets/i18n/en.json +2 -1
- package/dist/assets/twp/chatbot-panel.html +11 -94
- package/dist/assets/twp/index-dev.html +8 -4
- package/dist/assets/twp/index.html +6 -2
- package/dist/main.js +1 -1
- package/package.json +1 -1
- package/src/app/app.component.ts +2 -2
- package/src/app/component/home/home.component.html +2 -1
- package/src/app/component/home/home.component.scss +8 -0
- package/src/app/component/home/home.component.ts +5 -1
- package/src/assets/i18n/en.json +2 -1
- package/src/assets/twp/chatbot-panel.html +11 -94
- package/src/assets/twp/index-dev.html +8 -4
- package/src/assets/twp/index.html +6 -2
package/package.json
CHANGED
package/src/app/app.component.ts
CHANGED
|
@@ -1270,13 +1270,13 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
1270
1270
|
/** close window chat */
|
|
1271
1271
|
windowContext['tiledesk'].close = function () {
|
|
1272
1272
|
ngZone.run(() => {
|
|
1273
|
-
windowContext['tiledesk']['angularcomponent'].component.
|
|
1273
|
+
windowContext['tiledesk']['angularcomponent'].component.onCloseWidget();
|
|
1274
1274
|
});
|
|
1275
1275
|
};
|
|
1276
1276
|
/** open window chat */
|
|
1277
1277
|
windowContext['tiledesk'].open = function () {
|
|
1278
1278
|
ngZone.run(() => {
|
|
1279
|
-
windowContext['tiledesk']['angularcomponent'].component.
|
|
1279
|
+
windowContext['tiledesk']['angularcomponent'].component.onOpenCloseWidget();
|
|
1280
1280
|
});
|
|
1281
1281
|
};
|
|
1282
1282
|
/** set state PreChatForm close/open */
|
|
@@ -68,7 +68,8 @@
|
|
|
68
68
|
</div>
|
|
69
69
|
|
|
70
70
|
<!-- FOOTER - CONTENT -->
|
|
71
|
-
<div class="c21-footer-content fade-in-bottom-footer" >
|
|
71
|
+
<div class="c21-footer-content fade-in-bottom-footer" *ngIf="g?.whatsappNumber || g?.telegramUsername || g?.messangerPageTitle">
|
|
72
|
+
<div class="label-item">{{translationMapFooter?.get('SWITCH_TO')}}</div>
|
|
72
73
|
<div id="c21-whatsapp" *ngIf="g?.whatsappNumber && g?.whatsappNumber.trim() !== ''">
|
|
73
74
|
<button tabindex="1040" aflistconv #aflistconv class="c21-button-primary" (click)="openConversationOnPlatform('whatsapp')">
|
|
74
75
|
<span class="v-align-center">
|
|
@@ -212,6 +212,14 @@
|
|
|
212
212
|
// box-shadow: 0 0px 10px 0px $trasp-light-gray;
|
|
213
213
|
z-index: 20;
|
|
214
214
|
gap: 10px;
|
|
215
|
+
|
|
216
|
+
.label-item{
|
|
217
|
+
line-height: 20px;
|
|
218
|
+
position: relative;
|
|
219
|
+
margin: 0 10px 0px 10px;
|
|
220
|
+
color: #777777;
|
|
221
|
+
font-size: 1.2em;
|
|
222
|
+
}
|
|
215
223
|
// border-top: 1px solid $trasp-light-gray;
|
|
216
224
|
#c21-whatsapp, #c21-telegram, #c21-messanger{
|
|
217
225
|
.c21-button-primary{
|
|
@@ -65,6 +65,10 @@ export class HomeComponent implements OnInit, AfterViewInit {
|
|
|
65
65
|
let keysHeader = [
|
|
66
66
|
'BUTTON_CLOSE_TO_ICON'
|
|
67
67
|
]
|
|
68
|
+
let keysFooter = [
|
|
69
|
+
'SWITCH_TO'
|
|
70
|
+
]
|
|
71
|
+
this.translationMapFooter = this.customTranslateService.translateLanguage(keysFooter)
|
|
68
72
|
this.translationMapHeader = this.customTranslateService.translateLanguage(keysHeader)
|
|
69
73
|
}
|
|
70
74
|
|
|
@@ -107,7 +111,7 @@ export class HomeComponent implements OnInit, AfterViewInit {
|
|
|
107
111
|
if(platform === 'telegram'){
|
|
108
112
|
window.open('https://telegram.me/'+this.g.telegramUsername, '_blank')
|
|
109
113
|
}else if(platform === 'whatsapp'){
|
|
110
|
-
window.open('https://wa.me/'+this.g.whatsappNumber, '_blank')
|
|
114
|
+
window.open('https://wa.me/'+this.g.whatsappNumber+'?text=/start', '_blank')
|
|
111
115
|
}else if(platform=== 'messanger'){
|
|
112
116
|
window.open('https://m.me/'+this.g.messangerPageTitle, '_blank')
|
|
113
117
|
}
|
package/src/assets/i18n/en.json
CHANGED
|
@@ -105,6 +105,9 @@
|
|
|
105
105
|
background-size: calc(100% - 40px);
|
|
106
106
|
/* background-position-x: 50px; */
|
|
107
107
|
/* background-position-y: 100px; */
|
|
108
|
+
background-position: inherit;
|
|
109
|
+
background-attachment: fixed;
|
|
110
|
+
background-size: cover;
|
|
108
111
|
}
|
|
109
112
|
|
|
110
113
|
.row {
|
|
@@ -158,10 +161,14 @@
|
|
|
158
161
|
background-color: white;
|
|
159
162
|
text-align: center;
|
|
160
163
|
|
|
161
|
-
position: relative;
|
|
162
|
-
margin-top: -100px;
|
|
164
|
+
/* position: relative;
|
|
165
|
+
margin-top: -100px; negative value of footer height */
|
|
163
166
|
height: 80px;
|
|
164
167
|
clear:both;
|
|
168
|
+
|
|
169
|
+
position: absolute;
|
|
170
|
+
bottom: 0px;
|
|
171
|
+
width: 100%;
|
|
165
172
|
}
|
|
166
173
|
|
|
167
174
|
.b-agent-demo_powered_by a {
|
|
@@ -447,102 +454,12 @@
|
|
|
447
454
|
|
|
448
455
|
</head>
|
|
449
456
|
|
|
450
|
-
<body class="website white
|
|
457
|
+
<body class="website white" >
|
|
451
458
|
<div id="preloader">
|
|
452
459
|
<div class="logo"></div>
|
|
453
460
|
</div>
|
|
454
461
|
|
|
455
|
-
<div id="wrapper">
|
|
456
|
-
</header>
|
|
457
|
-
|
|
458
|
-
<div id="main" class="container">
|
|
459
|
-
<!-- <div class="row">
|
|
460
|
-
<div class="col-md-6">
|
|
461
|
-
<h1 id="project_name" style="min-height: 39px;"></h1>
|
|
462
|
-
<h2></h2>
|
|
463
|
-
<div class="b_integrations_agent_links">
|
|
464
|
-
<a href="" data-toggle="modal" data-target="#embedModal" id="enbed" style="display: none;"><em class="fa-code fa"></em>Embed</a>
|
|
465
|
-
<a href="" data-toggle="modal" data-target="#shareModal"><em class="fa-reply fa"></em>Share</a>
|
|
466
|
-
</div>
|
|
467
|
-
</div>
|
|
468
|
-
<div class="col-md-6">
|
|
469
|
-
</div>
|
|
470
|
-
</div> -->
|
|
471
|
-
<div class="mockup"></div>
|
|
472
|
-
|
|
473
|
-
<div class="modal fade" tabindex="-1" id="embedModal" role="dialog">
|
|
474
|
-
<div class="modal-dialog">
|
|
475
|
-
<div class="modal-content">
|
|
476
|
-
<div class="modal-header">
|
|
477
|
-
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
|
478
|
-
<h4 class="modal-title">Use following code to integrate the widget into your site:</h4>
|
|
479
|
-
</div>
|
|
480
|
-
<div class="modal-body" style="font-family: monospace;font-size: 12px;">
|
|
481
|
-
<span style="margin-bottom: 0px; border:none !important">
|
|
482
|
-
<script type="application/javascript"> <br>
|
|
483
|
-
window.tiledeskSettings = <br>
|
|
484
|
-
{ <br>
|
|
485
|
-
projectid: </span>
|
|
486
|
-
<span id="project_id"> </span>
|
|
487
|
-
<span style="border:none !important">
|
|
488
|
-
<br>
|
|
489
|
-
}; <br>
|
|
490
|
-
(function(d, s, id) { <br>
|
|
491
|
-
var w=window; var d=document; var i=function() { i.c(arguments); };<br>
|
|
492
|
-
i.q=[]; i.c=function(args){ i.q.push(args); }; w.Tiledesk=i;<br>
|
|
493
|
-
var js, fjs=d.getElementsByTagName(s)[0];<br>
|
|
494
|
-
if (d.getElementById(id)) return;<br>
|
|
495
|
-
js=d.createElement(s); js.id=id; js.async=true;<br>
|
|
496
|
-
js.src="<span id="base_url"> </span>";<br>
|
|
497
|
-
fjs.parentNode.insertBefore(js, fjs);<br>
|
|
498
|
-
}(document, 'script', 'tiledesk-jssdk'));<br>
|
|
499
|
-
</script>
|
|
500
|
-
</span>
|
|
501
|
-
|
|
502
|
-
</div>
|
|
503
|
-
</div>
|
|
504
|
-
</div>
|
|
505
|
-
</div>
|
|
506
|
-
|
|
507
|
-
<div class="modal fade" tabindex="-1" id="shareModal" role="dialog" style="display: none;">
|
|
508
|
-
<div class="modal-dialog">
|
|
509
|
-
<div class="modal-content">
|
|
510
|
-
<div class="modal-header">
|
|
511
|
-
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
|
512
|
-
<h4 class="modal-title">Share this page via social networks:</h4>
|
|
513
|
-
</div>
|
|
514
|
-
<div class="modal-body">
|
|
515
|
-
|
|
516
|
-
<a onclick="shareOnFacebook()" style="cursor: pointer;text-decoration: none;">
|
|
517
|
-
|
|
518
|
-
<img src="./tiledesk_widget_files/facebook.png" alt="Facebook">
|
|
519
|
-
</a>
|
|
520
|
-
|
|
521
|
-
<!-- Twitter -->
|
|
522
|
-
<a onclick="shareOnTwitter()" style="cursor: pointer;text-decoration: none;">
|
|
523
|
-
<img src="./tiledesk_widget_files/twitter.png" alt="Twitter">
|
|
524
|
-
</a>
|
|
525
|
-
|
|
526
|
-
<!-- LinkedIn -->
|
|
527
|
-
<a onclick="shareOnLinkedin()" style="cursor: pointer;text-decoration: none;">
|
|
528
|
-
<img src="./tiledesk_widget_files/linkedin.png" alt="LinkedIn">
|
|
529
|
-
</a>
|
|
530
|
-
|
|
531
|
-
<!-- telegram -->
|
|
532
|
-
<a onclick="shareOnTelegram()" style="cursor: pointer;text-decoration: none;">
|
|
533
|
-
<img src="./tiledesk_widget_files/telegram.png" alt="Telegram">
|
|
534
|
-
</a>
|
|
535
|
-
|
|
536
|
-
<!-- whatsapp -->
|
|
537
|
-
<!-- <a onclick="shareOnWhatsapp()" style="cursor: pointer">
|
|
538
|
-
<img src="./tiledesk_widget_files/whatsapp.png" alt="Whatsapp">
|
|
539
|
-
</a> -->
|
|
540
|
-
|
|
541
|
-
</div>
|
|
542
|
-
</div>
|
|
543
|
-
</div>
|
|
544
|
-
</div>
|
|
545
|
-
</div>
|
|
462
|
+
<div id="wrapper" class="mockup">
|
|
546
463
|
</div>
|
|
547
464
|
|
|
548
465
|
<footer id="footer">
|
|
@@ -169,10 +169,14 @@
|
|
|
169
169
|
background-color: white;
|
|
170
170
|
text-align: center;
|
|
171
171
|
|
|
172
|
-
position: relative;
|
|
173
|
-
margin-top: -
|
|
172
|
+
/* position: relative;
|
|
173
|
+
margin-top: -100px; negative value of footer height */
|
|
174
174
|
height: 80px;
|
|
175
175
|
clear:both;
|
|
176
|
+
|
|
177
|
+
position: absolute;
|
|
178
|
+
bottom: 0px;
|
|
179
|
+
width: 100%;
|
|
176
180
|
}
|
|
177
181
|
|
|
178
182
|
.b-agent-demo_powered_by a {
|
|
@@ -2183,8 +2187,8 @@
|
|
|
2183
2187
|
<div class="row">
|
|
2184
2188
|
<div class="col-md-5 formElement"><span><em><strong>bubbleSentTextColor</strong></em></span></div>
|
|
2185
2189
|
<div class="col-md-5 formElement">
|
|
2186
|
-
<input class="form-control" type="color" id="bubbleSentTextColor" name="bubbleSentTextColor" value="ffffff" oninput="onChangeColor('bubbleSentTextColor')">
|
|
2187
|
-
<input class="form-control" type="text" id="bubbleSentTextColorText" name="bubbleSentTextColor" value="ffffff" oninput="onChangeColorText('bubbleSentTextColor')">
|
|
2190
|
+
<input class="form-control" type="color" id="bubbleSentTextColor" name="bubbleSentTextColor" value="#ffffff" oninput="onChangeColor('bubbleSentTextColor')">
|
|
2191
|
+
<input class="form-control" type="text" id="bubbleSentTextColorText" name="bubbleSentTextColor" value="#ffffff" oninput="onChangeColorText('bubbleSentTextColor')">
|
|
2188
2192
|
</div>
|
|
2189
2193
|
<div class="col-md-2">
|
|
2190
2194
|
<button class="btn btn-light" onclick="onClickColor('bubbleSentTextColor')">Test this setting <i class="fa fa-magic" aria-hidden="true"></i></button>
|
|
@@ -148,10 +148,14 @@
|
|
|
148
148
|
background-color: white;
|
|
149
149
|
text-align: center;
|
|
150
150
|
|
|
151
|
-
position: relative;
|
|
152
|
-
margin-top: -
|
|
151
|
+
/* position: relative;
|
|
152
|
+
margin-top: -100px; negative value of footer height */
|
|
153
153
|
height: 80px;
|
|
154
154
|
clear:both;
|
|
155
|
+
|
|
156
|
+
position: absolute;
|
|
157
|
+
bottom: 0px;
|
|
158
|
+
width: 100%;
|
|
155
159
|
}
|
|
156
160
|
|
|
157
161
|
.b-agent-demo_powered_by a {
|