Skip to content

Commit 12edbb1

Browse files
FrondorFrondor
committed
Re-lease v1.2.2
1 parent 51dc2b3 commit 12edbb1

File tree

3 files changed

+84
-63
lines changed

3 files changed

+84
-63
lines changed

‎dist/vue-line-clamp.cjs.js‎

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,25 @@
33
const css = 'display:block;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis';
44
const currentValueProp = "vLineClampValue";
55

6-
const truncateText = function (el, bindings, needsFallback) {
6+
function defaultFallbackFunc(el, bindings, lines) {
7+
if(lines){
8+
let lineHeight = parseInt(bindings.arg);
9+
if (isNaN(lineHeight)) {
10+
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
11+
lineHeight = 16;
12+
}
13+
14+
let maxHeight = lineHeight * lines;
15+
16+
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
17+
el.style.overflowX = 'hidden';
18+
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
19+
} else {
20+
el.style.maxHeight = el.style.overflowX = '';
21+
}
22+
}
23+
24+
const truncateText = function (el, bindings, useFallbackFunc) {
725
let lines = parseInt(bindings.value);
826
if (isNaN(lines)) {
927
console.error('Parameter for vue-line-clamp must be a number');
@@ -12,22 +30,8 @@ const truncateText = function (el, bindings, needsFallback) {
1230
else if (lines !== el[currentValueProp]) {
1331
el[currentValueProp] = lines;
1432

15-
if (needsFallback) {
16-
if (lines) {
17-
let lineHeight = parseInt(bindings.arg);
18-
if (isNaN(lineHeight)) {
19-
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
20-
lineHeight = 16;
21-
}
22-
23-
let maxHeight = lineHeight * lines;
24-
25-
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
26-
el.style.overflowX = 'hidden';
27-
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
28-
} else {
29-
el.style.maxHeight = el.style.overflowX = '';
30-
}
33+
if (useFallbackFunc) {
34+
useFallbackFunc(el, bindings, lines);
3135
}
3236
else {
3337
el.style.webkitLineClamp = lines ? lines : '';
@@ -54,7 +58,10 @@ const VueLineClamp = {
5458
}
5559
}
5660

57-
const needsFallback = 'webkitLineClamp' in document.body.style ? false : true;
61+
const useFallbackFunc =
62+
"webkitLineClamp" in document.body.style
63+
? undefined
64+
: options.fallbackFunc || defaultFallbackFunc;
5865

5966
Vue.directive('line-clamp', {
6067
currentValue: 0,
@@ -67,9 +74,9 @@ const VueLineClamp = {
6774
}
6875

6976
},
70-
inserted: (el, bindings) => truncateText(el, bindings, needsFallback),
71-
updated: (el, bindings) => truncateText(el, bindings, needsFallback),
72-
componentUpdated: (el, bindings) => truncateText(el, bindings, needsFallback)
77+
inserted: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
78+
updated: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
79+
componentUpdated: (el, bindings) => truncateText(el, bindings, useFallbackFunc)
7380
});
7481
}
7582
};

‎dist/vue-line-clamp.esm.js‎

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,25 @@
11
const css = 'display:block;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis';
22
const currentValueProp = "vLineClampValue";
33

4-
const truncateText = function (el, bindings, needsFallback) {
4+
function defaultFallbackFunc(el, bindings, lines) {
5+
if(lines){
6+
let lineHeight = parseInt(bindings.arg);
7+
if (isNaN(lineHeight)) {
8+
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
9+
lineHeight = 16;
10+
}
11+
12+
let maxHeight = lineHeight * lines;
13+
14+
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
15+
el.style.overflowX = 'hidden';
16+
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
17+
} else {
18+
el.style.maxHeight = el.style.overflowX = '';
19+
}
20+
}
21+
22+
const truncateText = function (el, bindings, useFallbackFunc) {
523
let lines = parseInt(bindings.value);
624
if (isNaN(lines)) {
725
console.error('Parameter for vue-line-clamp must be a number');
@@ -10,22 +28,8 @@ const truncateText = function (el, bindings, needsFallback) {
1028
else if (lines !== el[currentValueProp]) {
1129
el[currentValueProp] = lines;
1230

13-
if (needsFallback) {
14-
if (lines) {
15-
let lineHeight = parseInt(bindings.arg);
16-
if (isNaN(lineHeight)) {
17-
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
18-
lineHeight = 16;
19-
}
20-
21-
let maxHeight = lineHeight * lines;
22-
23-
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
24-
el.style.overflowX = 'hidden';
25-
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
26-
} else {
27-
el.style.maxHeight = el.style.overflowX = '';
28-
}
31+
if (useFallbackFunc) {
32+
useFallbackFunc(el, bindings, lines);
2933
}
3034
else {
3135
el.style.webkitLineClamp = lines ? lines : '';
@@ -52,7 +56,10 @@ const VueLineClamp = {
5256
}
5357
}
5458

55-
const needsFallback = 'webkitLineClamp' in document.body.style ? false : true;
59+
const useFallbackFunc =
60+
"webkitLineClamp" in document.body.style
61+
? undefined
62+
: options.fallbackFunc || defaultFallbackFunc;
5663

5764
Vue.directive('line-clamp', {
5865
currentValue: 0,
@@ -65,9 +72,9 @@ const VueLineClamp = {
6572
}
6673

6774
},
68-
inserted: (el, bindings) => truncateText(el, bindings, needsFallback),
69-
updated: (el, bindings) => truncateText(el, bindings, needsFallback),
70-
componentUpdated: (el, bindings) => truncateText(el, bindings, needsFallback)
75+
inserted: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
76+
updated: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
77+
componentUpdated: (el, bindings) => truncateText(el, bindings, useFallbackFunc)
7178
});
7279
}
7380
};

‎dist/vue-line-clamp.umd.js‎

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,25 @@
77
const css = 'display:block;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis';
88
const currentValueProp = "vLineClampValue";
99

10-
const truncateText = function (el, bindings, needsFallback) {
10+
function defaultFallbackFunc(el, bindings, lines) {
11+
if(lines){
12+
let lineHeight = parseInt(bindings.arg);
13+
if (isNaN(lineHeight)) {
14+
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
15+
lineHeight = 16;
16+
}
17+
18+
let maxHeight = lineHeight * lines;
19+
20+
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
21+
el.style.overflowX = 'hidden';
22+
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
23+
} else {
24+
el.style.maxHeight = el.style.overflowX = '';
25+
}
26+
}
27+
28+
const truncateText = function (el, bindings, useFallbackFunc) {
1129
let lines = parseInt(bindings.value);
1230
if (isNaN(lines)) {
1331
console.error('Parameter for vue-line-clamp must be a number');
@@ -16,22 +34,8 @@ const truncateText = function (el, bindings, needsFallback) {
1634
else if (lines !== el[currentValueProp]) {
1735
el[currentValueProp] = lines;
1836

19-
if (needsFallback) {
20-
if (lines) {
21-
let lineHeight = parseInt(bindings.arg);
22-
if (isNaN(lineHeight)) {
23-
console.warn('line-height argument for vue-line-clamp must be a number (of pixels), falling back to 16px');
24-
lineHeight = 16;
25-
}
26-
27-
let maxHeight = lineHeight * lines;
28-
29-
el.style.maxHeight = maxHeight ? maxHeight+'px' : '';
30-
el.style.overflowX = 'hidden';
31-
el.style.lineHeight = lineHeight+'px'; // to ensure consistency
32-
} else {
33-
el.style.maxHeight = el.style.overflowX = '';
34-
}
37+
if (useFallbackFunc) {
38+
useFallbackFunc(el, bindings, lines);
3539
}
3640
else {
3741
el.style.webkitLineClamp = lines ? lines : '';
@@ -58,7 +62,10 @@ const VueLineClamp = {
5862
}
5963
}
6064

61-
const needsFallback = 'webkitLineClamp' in document.body.style ? false : true;
65+
const useFallbackFunc =
66+
"webkitLineClamp" in document.body.style
67+
? undefined
68+
: options.fallbackFunc || defaultFallbackFunc;
6269

6370
Vue.directive('line-clamp', {
6471
currentValue: 0,
@@ -71,9 +78,9 @@ const VueLineClamp = {
7178
}
7279

7380
},
74-
inserted: (el, bindings) => truncateText(el, bindings, needsFallback),
75-
updated: (el, bindings) => truncateText(el, bindings, needsFallback),
76-
componentUpdated: (el, bindings) => truncateText(el, bindings, needsFallback)
81+
inserted: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
82+
updated: (el, bindings) => truncateText(el, bindings, useFallbackFunc),
83+
componentUpdated: (el, bindings) => truncateText(el, bindings, useFallbackFunc)
7784
});
7885
}
7986
};

0 commit comments

Comments
 (0)