@chat21/chat21-web-widget 5.0.57-rc.4 → 5.0.57-rc.5

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.
Files changed (8) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/package.json +1 -1
  3. package/src/app/component/conversation-detail/conversation-footer/conversation-footer.component.scss +15 -14
  4. package/src/app/component/home/home.component.scss +12 -10
  5. package/src/app/component/message/buttons/action-button/action-button.component.scss +1 -1
  6. package/src/app/component/message-attachment/message-attachment.component.scss +6 -2
  7. package/src/app/utils/globals.ts +1 -1
  8. package/src/assets/js/chat21client.js +7 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,9 @@
1
1
  # chat21-web-widget ver 5.0
2
2
 
3
+ ### 5.0.57-rc.5
4
+ - changed: chat21client.js to v0.1.12.5 (window scope fixed)
5
+ - changed: tiledesk logo in conversation and home components
6
+
3
7
  ### 5.0.57-rc.4
4
8
  - changed: set calloutStatus to false as default value
5
9
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@chat21/chat21-web-widget",
3
3
  "author": "Tiledesk SRL",
4
- "version": "5.0.57-rc.4",
4
+ "version": "5.0.57-rc.5",
5
5
  "license": "MIT",
6
6
  "homepage": "https://www.tiledesk.com",
7
7
  "repository": {
package/src/app/component/conversation-detail/conversation-footer/conversation-footer.component.scss CHANGED
@@ -248,7 +248,7 @@ textarea:active{
248
248
  // position: absolute;
249
249
  bottom: 100%;
250
250
  width: 100%;
251
- height: 22px;
251
+ // height: 22px;
252
252
  display: flex;
253
253
  align-items: center;
254
254
  justify-content: center;
@@ -265,7 +265,7 @@ textarea:active{
265
265
  // padding: 0;
266
266
  // margin: 5px 0;
267
267
  // position: absolute;
268
- color: var(--gray);
268
+ color: var(--dark-gray);
269
269
  // top: 0;
270
270
  // left: 20px; //60px;
271
271
  // right: 60px;
@@ -273,38 +273,39 @@ textarea:active{
273
273
  align-items: center;
274
274
  justify-content: center;
275
275
 
276
-
277
-
278
- // background: white;
279
- border-radius: 16px;
280
- padding: 1px 8px;
281
-
282
276
  &::ng-deep a {
283
277
  text-decoration: none;
284
278
  cursor: pointer;
285
279
  display: inline-block;
286
- color: var(--gray);
287
- font-size: 1.1em;
280
+ color: var(--dark-gray);
281
+ font-size: 1.2em;
288
282
  font-weight: 500;
289
283
  line-height: 22px;
290
284
 
291
285
  font-family: Mulish, sans-serif;
292
- letter-spacing: -0.24px;
286
+ letter-spacing: 0.24px;
293
287
  -webkit-font-smoothing: antialiased;
294
-
288
+ padding: 4px 12px;
289
+
290
+ &:hover{
291
+ background: rgb(245, 245, 245);
292
+ border-radius: 16px;
293
+ }
295
294
  span {
296
295
  display: inline-block;
297
296
  position: relative;
298
- top: 2px;
297
+ // top: 2px;
299
298
  }
300
299
 
301
300
  img {
302
- width: 60px; //60px;
301
+ width: 20px; //60px;
303
302
  height: auto;
304
303
  max-height: 40px;
305
304
  position: relative;
306
305
  vertical-align: middle;
307
306
  object-fit: contain;
307
+ filter: brightness(0) saturate(100%) invert(39%) sepia(12%) saturate(212%) hue-rotate(173deg) brightness(92%) contrast(88%);
308
+ padding-right: 8px;
308
309
  }
309
310
  }
310
311
  b{
package/src/app/component/home/home.component.scss CHANGED
@@ -258,13 +258,13 @@
258
258
  }
259
259
  .c21-powered-by {
260
260
  height: 40px;
261
- text-align: center;
262
- padding: 0;
261
+ // text-align: center;
262
+ padding: 0 15px;
263
263
  // margin: 5px 0;
264
- position: absolute;
265
- color: var(--gray);
264
+ // position: absolute;
265
+ color: var(--dark-gray);
266
266
  top: 0;
267
- left: 20px; //60px;
267
+ // left: 20px; //60px;
268
268
  // right: 60px;
269
269
  display: flex;
270
270
  align-items: center;
@@ -273,28 +273,30 @@
273
273
  text-decoration: none;
274
274
  cursor: pointer;
275
275
  display: inline-block;
276
- color: var(--gray);
277
- font-size: 1.1em;
276
+ color: var(--dark-gray);
277
+ font-size: 1.2em;
278
278
  font-weight: 500;
279
279
  line-height: 22px;
280
280
 
281
281
  font-family: Mulish, sans-serif;
282
- letter-spacing: -0.24px;
282
+ letter-spacing: 0.24px;
283
283
  -webkit-font-smoothing: antialiased;
284
284
 
285
285
  span {
286
286
  display: inline-block;
287
287
  position: relative;
288
- top: 2px;
288
+ // top: 2px;
289
289
  }
290
290
 
291
291
  img {
292
- width: 80px; //60px;
292
+ width: 20px; //60px;
293
293
  height: auto;
294
294
  max-height: 40px;
295
295
  position: relative;
296
296
  vertical-align: middle;
297
297
  object-fit: contain;
298
+ filter: brightness(0) saturate(100%) invert(39%) sepia(12%) saturate(212%) hue-rotate(173deg) brightness(92%) contrast(88%);
299
+ padding-right: 8px;
298
300
  }
299
301
  }
300
302
  b{
package/src/app/component/message/buttons/action-button/action-button.component.scss CHANGED
@@ -24,7 +24,7 @@
24
24
  font-size: var(--buttonFontSize);
25
25
  -o-text-overflow: ellipsis;
26
26
  text-overflow: ellipsis;
27
- // white-space: nowrap;
27
+ // // white-space: nowrap;
28
28
  word-wrap: break-word;
29
29
  letter-spacing: -0.24px;
30
30
  -webkit-font-smoothing: antialiased;
package/src/app/component/message-attachment/message-attachment.component.scss CHANGED
@@ -3,7 +3,8 @@
3
3
  display: block;
4
4
  margin-right: 16px; //align attachment-buttons to bubble sent message
5
5
  height: auto;
6
- width: 85%;
6
+ // width: 85%;
7
+ max-width: 95%;
7
8
  float: right;
8
9
 
9
10
  .buttons-wrapper {
@@ -17,7 +18,10 @@
17
18
  }
18
19
 
19
20
  .div-button {
20
- display: inline-block;
21
+ // display: inline-block;
22
+ // overflow: hidden;
23
+ // text-overflow: ellipsis;
24
+ // min-width: inherit;
21
25
  .button-in-msg {
22
26
  padding: 8px 16px!important;
23
27
  }
package/src/app/utils/globals.ts CHANGED
@@ -23,7 +23,7 @@ import { Rule } from 'src/models/rule';
23
23
  export class Globals {
24
24
 
25
25
  BASE_LOCATION = 'https://widget.tiledesk.com/v2';
26
- POWERED_BY ='<a tabindex="-1" target="_blank" href="http://www.tiledesk.com/?utm_source=widget"><img src="https://support-pre.tiledesk.com/dashboard/assets/img/logos/tiledesk-logo_new_gray.svg"/></a>'
26
+ POWERED_BY ='<a tabindex="-1" target="_blank" href="http://www.tiledesk.com/?utm_source=widget"><img src="https://support-pre.tiledesk.com/dashboard/assets/img/logos/tiledesk-solo_logo_new_gray.svg"/><span>Powered by Tiledesk</span></a>'
27
27
  DEFAULT_LOGO_CHAT = '/assets/images/tiledesk_logo_white_small.svg';
28
28
 
29
29
  // ============ BEGIN: SET FUNCTION BY UTILS ==============//
package/src/assets/js/chat21client.js CHANGED
@@ -1,9 +1,10 @@
1
1
  /*
2
2
  Chat21Client
3
3
 
4
- v0.1.12.4
4
+ v0.1.12.5
5
5
 
6
6
  @Author Andrea Sponziello
7
+ @Member Gabriele Panico
7
8
  (c) Tiledesk 2020
8
9
  */
9
10
 
@@ -24,13 +25,16 @@ class Chat21Client {
24
25
  this.reconnections = 0 // just to check how many reconnections
25
26
  this.client_id = this.uuidv4();
26
27
  this.log = options.log ? true : false;
27
-
28
+
28
29
  if (options && options.MQTTendpoint) {
29
30
  if (options.MQTTendpoint.startsWith('/')) {
30
31
  if (this.log) {
31
32
  console.log("MQTTendpoint relative url");
32
33
  }
33
- var loc = window.parent.location, new_uri;
34
+ var loc = window.location, new_uri;
35
+ if(window.frameElement && window.frameElement.getAttribute('tiledesk_context') === 'parent'){
36
+ loc = window.parent.location
37
+ }
34
38
  if (loc.protocol === "https:") {
35
39
  // new_uri = "wss:";
36
40
  new_uri = "mqtt:";
@@ -42,7 +46,6 @@ class Chat21Client {
42
46
  new_uri += "//" + loc.host;
43
47
  // new_uri += loc.pathname + "/to/ws";
44
48
  new_uri += options.MQTTendpoint;
45
- console.log('new_uriiiiiii', new_uri, loc, document.location, window.parent)
46
49
  this.endpoint = new_uri
47
50
  } else {
48
51
  this.endpoint = options.MQTTendpoint