ngx-truncate-text
Version:
This module is for shortening the text and also includes some useful features for text manipulation like finding hashtags, highlight words with favorite color and so on after version 1.0.0.
477 lines (470 loc) • 19.3 kB
JavaScript
import { __values } from 'tslib';
import { Injectable, Directive, ElementRef, Input, Renderer2, NgModule } from '@angular/core';
/**
* @fileoverview added by tsickle
* Generated from: lib/ngx-truncate.service.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NgxTruncateService = /** @class */ (function () {
function NgxTruncateService() {
}
/** check the word cut */
/**
* check the word cut
* @param {?} number
* @param {?} text
* @return {?}
*/
NgxTruncateService.prototype.checkWordCut = /**
* check the word cut
* @param {?} number
* @param {?} text
* @return {?}
*/
function (number, text) {
/** @type {?} */
var i = 0;
for (i = number; i < text.length; i++) {
if (text[i] == ' ')
break;
}
return text.substring(0, i);
};
/** find hashtag from text */
/**
* find hashtag from text
* @param {?} text
* @return {?}
*/
NgxTruncateService.prototype.findHashtag = /**
* find hashtag from text
* @param {?} text
* @return {?}
*/
function (text) {
//text = text.replace(new RegExp(pattern, 'ugmi'), match => {
text = text.replace(/(^|\s)(#[\p{Pc}\p{N}\p{L}\u200cÀ-ÖØ-öø-ʸ(_)]+)/ugmi, (/**
* @param {?} match
* @return {?}
*/
function (match) {
return "<span class=\"hashtag\" style=\"color:#1b95e0\">" + match + "</span>";
}));
return text;
};
/** check conditions and return text with them */
/**
* check conditions and return text with them
* @param {?} text
* @param {?} number
* @param {?=} completeWord
* @param {?=} hashtag
* @return {?}
*/
NgxTruncateService.prototype.applyCondition = /**
* check conditions and return text with them
* @param {?} text
* @param {?} number
* @param {?=} completeWord
* @param {?=} hashtag
* @return {?}
*/
function (text, number, completeWord, hashtag) {
if (completeWord === void 0) { completeWord = false; }
if (hashtag === void 0) { hashtag = false; }
/** @type {?} */
var manipulatedText = "";
if (completeWord && hashtag) {
/** @type {?} */
var temp = this.checkWordCut(number, text);
manipulatedText = this.findHashtag(temp);
}
else if (completeWord) {
manipulatedText = this.checkWordCut(number, text);
}
else if (hashtag) {
/** @type {?} */
var temp = text.substring(0, number);
manipulatedText = this.findHashtag(temp);
}
else {
manipulatedText = text.substring(0, number);
}
return manipulatedText;
};
/**
* رنگ کردن کلمات داده شده در متن
* @param content
*/
/**
* رنگ کردن کلمات داده شده در متن
* @param {?} content
* @param {?} highlightCondition
* @param {?} highlightQuery
* @return {?}
*/
NgxTruncateService.prototype.highlight = /**
* رنگ کردن کلمات داده شده در متن
* @param {?} content
* @param {?} highlightCondition
* @param {?} highlightQuery
* @return {?}
*/
function (content, highlightCondition, highlightQuery) {
var e_1, _a, e_2, _b, e_3, _c, e_4, _d;
//روی دایرکتیو تعریف نشود خود متن را بر می کرداند highlightList اگر ورودی
if (!highlightQuery.length) {
return content;
}
// دقیقا یافت می شود highlightList روی دایرکتیو تعریف نشود کلمات داده شده در highlightCondition اگر ورودی
if (highlightCondition == "exactly") {
var _loop_1 = function (q) {
/** @type {?} */
var pattern = '';
//به صورت آبجکت باشند highlightList اگر کلمات داده شده در
if (q.hasOwnProperty('name')) {
pattern = "(^|(?<!\\p{L}))(" + q.name + ")(?!(\\p{L}))";
content = content.replace(new RegExp(pattern, 'gmu'), (/**
* @param {?} match
* @return {?}
*/
function (match) {
return "<span style=\"background:" + q.color + "\">" + match + "</span>";
}));
}
//به صورت رشته باشند highlightList اگر کلمات داده شده در
else {
pattern = "(^|(?<!\\p{L}))(" + q + ")(?!(\\p{L}))";
content = content.replace(new RegExp(pattern, 'gmu'), (/**
* @param {?} match
* @return {?}
*/
function (match) {
return "<span style=\"background:yellow\">" + match + "</span>";
}));
}
};
try {
for (var highlightQuery_1 = __values(highlightQuery), highlightQuery_1_1 = highlightQuery_1.next(); !highlightQuery_1_1.done; highlightQuery_1_1 = highlightQuery_1.next()) {
var q = highlightQuery_1_1.value;
_loop_1(q);
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (highlightQuery_1_1 && !highlightQuery_1_1.done && (_a = highlightQuery_1.return)) _a.call(highlightQuery_1);
}
finally { if (e_1) throw e_1.error; }
}
return content;
}
//هر مشابهی از کلمات در متن پیدا شده و رنگ می شوند
else {
try {
for (var highlightQuery_2 = __values(highlightQuery), highlightQuery_2_1 = highlightQuery_2.next(); !highlightQuery_2_1.done; highlightQuery_2_1 = highlightQuery_2.next()) {
var q = highlightQuery_2_1.value;
//به صورت آبجکت باشند highlightList اگر کلمات داده شده در
if (q.hasOwnProperty('name')) {
/** @type {?} */
var words = content.match(new RegExp(q.name, "gmi"));
if (words)
try {
for (var words_1 = __values(words), words_1_1 = words_1.next(); !words_1_1.done; words_1_1 = words_1.next()) {
var word = words_1_1.value;
content = content.replace(new RegExp(q.name, "gmi"), "<span style=\"background-color:" + q.color + "\">" + word + "</span>");
}
}
catch (e_3_1) { e_3 = { error: e_3_1 }; }
finally {
try {
if (words_1_1 && !words_1_1.done && (_c = words_1.return)) _c.call(words_1);
}
finally { if (e_3) throw e_3.error; }
}
}
//به صورت رشته باشند highlightList اگر کلمات داده شده در
else {
/** @type {?} */
var words = content.match(new RegExp(q, "gmi"));
if (words)
try {
for (var words_2 = __values(words), words_2_1 = words_2.next(); !words_2_1.done; words_2_1 = words_2.next()) {
var word = words_2_1.value;
content = content.replace(new RegExp(q, "gmi"), "<span style=\"background-color:yellow\">" + word + "</span>");
}
}
catch (e_4_1) { e_4 = { error: e_4_1 }; }
finally {
try {
if (words_2_1 && !words_2_1.done && (_d = words_2.return)) _d.call(words_2);
}
finally { if (e_4) throw e_4.error; }
}
}
}
}
catch (e_2_1) { e_2 = { error: e_2_1 }; }
finally {
try {
if (highlightQuery_2_1 && !highlightQuery_2_1.done && (_b = highlightQuery_2.return)) _b.call(highlightQuery_2);
}
finally { if (e_2) throw e_2.error; }
}
return content;
}
};
NgxTruncateService.decorators = [
{ type: Injectable }
];
/** @nocollapse */
NgxTruncateService.ctorParameters = function () { return []; };
return NgxTruncateService;
}());
/**
* @fileoverview added by tsickle
* Generated from: lib/ngx-truncate-text.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NgxTruncateTextDirective = /** @class */ (function () {
function NgxTruncateTextDirective(elRef, renderer, trunService) {
this.elRef = elRef;
this.renderer = renderer;
this.trunService = trunService;
this._highlightQuery = [];
this.replace = false;
((/** @type {?} */ (window))).trun = this;
// elRef will get a reference to the element where
// the directive is placed
this.element = elRef.nativeElement;
}
Object.defineProperty(NgxTruncateTextDirective.prototype, "highlightList", {
set: /**
* @param {?} list
* @return {?}
*/
function (list) {
this._highlightQuery = JSON.parse(list);
},
enumerable: true,
configurable: true
});
/**
* @param {?} changes
* @return {?}
*/
NgxTruncateTextDirective.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
//. ارسال می شوند highlightList نزولی کردن کلمات بر اساس طول آنها، کلماتی که در
//.ابتدا باید کلمات با طول بیشتر را پیدا کند replace به دلیل اینکه تابع
this._highlightQuery.sort((/**
* @param {?} a
* @param {?} b
* @return {?}
*/
function (a, b) {
if (a.hasOwnProperty('name'))
return b.name.length - a.name.length;
}));
if ((changes && changes.content && changes.content.previousValue)) {
this.fill(changes.content.currentValue);
}
};
/**
* @return {?}
*/
NgxTruncateTextDirective.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this.fill(this.element.innerHTML);
};
/**
* @param {?} text
* @return {?}
*/
NgxTruncateTextDirective.prototype.fill = /**
* @param {?} text
* @return {?}
*/
function (text) {
var _this = this;
if (!this.hasLiteral)
text = text.replace(/(\r\n\t|\n|\r\t)/gm, ' ');
this.text = text;
/** @type {?} */
var remainText = "";
if (text.length > this.number) {
remainText = this.trunService.applyCondition(text, this.number, this.completeWord, this.hashtag);
remainText = this.trunService.highlight(remainText, this.highlightCondition, this._highlightQuery);
this.replace = true;
this.element.innerHTML = remainText + ' ... ';
/** @type {?} */
var span = this.renderer.createElement('span');
span.innerHTML = this.more;
this.renderer.setStyle(span, 'color', '#ff00ff');
this.renderer.setStyle(span, 'cursor', 'pointer');
this.renderer.addClass(span, 'toggleText');
this.element.innerHTML = remainText + "... ";
this.renderer.listen(span, 'click', (/**
* @param {?} event
* @return {?}
*/
function (event) { return _this.replace === true ? _this.showFullText(event) : _this.hideSomeText(event); }));
this.element.appendChild(span);
}
else {
text = this.hashtag ? this.trunService.findHashtag(text) : text;
text = this.trunService.highlight(text, this.highlightCondition, this._highlightQuery);
this.element.innerHTML = text;
}
//اعمال شود این کلاس قرار داده می شود html در \n برای اینکه کاراکتر های
if (this.hasLiteral)
this.element.style.whiteSpace = 'pre-line';
};
/*
* نمایش کامل متن
* @param mouseDown {mousedown} mouse event
*/
/*
* نمایش کامل متن
* @param mouseDown {mousedown} mouse event
*/
/**
* @param {?} mouseDown
* @return {?}
*/
NgxTruncateTextDirective.prototype.showFullText = /*
* نمایش کامل متن
* @param mouseDown {mousedown} mouse event
*/
/**
* @param {?} mouseDown
* @return {?}
*/
function (mouseDown) {
var _this = this;
/** @type {?} */
var span = this.renderer.createElement('span');
span.innerHTML = " " + this.less;
this.renderer.setStyle(span, 'color', '#ff00ff');
this.renderer.setStyle(span, 'cursor', 'pointer');
this.renderer.addClass(span, 'toggleText');
/** @type {?} */
var fullText = this.hashtag ? this.trunService.findHashtag(this.text) : this.text;
this.element.innerHTML = this.trunService.highlight(fullText, this.highlightCondition, this._highlightQuery);
//اعمال شود این کلاس قرار داده می شود html در \n برای اینکه کاراکتر های
if (this.hasLiteral)
this.element.style.whiteSpace = 'pre-line';
this.renderer.listen(span, 'click', (/**
* @param {?} event
* @return {?}
*/
function (event) { return _this.hideSomeText(event); }));
this.element.appendChild(span);
// جلوگیری از کلیک روی عنصر پدر
mouseDown.stopPropagation();
this.replace = false;
};
/*
* نمایش قسمتی از متن بر اساس تعداد کاراکتر خواسته شده
* @param mouseDown {mousedown} mouse event
*/
/*
* نمایش قسمتی از متن بر اساس تعداد کاراکتر خواسته شده
* @param mouseDown {mousedown} mouse event
*/
/**
* @param {?} mouseDown
* @return {?}
*/
NgxTruncateTextDirective.prototype.hideSomeText = /*
* نمایش قسمتی از متن بر اساس تعداد کاراکتر خواسته شده
* @param mouseDown {mousedown} mouse event
*/
/**
* @param {?} mouseDown
* @return {?}
*/
function (mouseDown) {
var _this = this;
/** @type {?} */
var temp = this.trunService.applyCondition(this.text, this.number, this.completeWord, this.hashtag);
/** @type {?} */
var remainText = this.trunService.highlight(temp, this.highlightCondition, this._highlightQuery);
/** @type {?} */
var span = this.renderer.createElement('span');
this.renderer.setStyle(span, 'color', '#ff00ff');
this.renderer.setStyle(span, 'cursor', 'pointer');
this.renderer.addClass(span, 'toggleText');
span.innerHTML = this.more;
this.element.innerHTML = remainText + ' ... ';
//اعمال شود این کلاس قرار داده میشود html در n \برای اینکه کاراکتر های
if (this.hasLiteral)
this.element.style.whiteSpace = 'pre-line';
this.renderer.listen(span, 'click', (/**
* @param {?} event
* @return {?}
*/
function (event) { return _this.showFullText(event); }));
this.element.appendChild(span);
// جلوگیری از کلیک روی عنصر پدر
mouseDown.stopPropagation();
this.replace = true;
};
NgxTruncateTextDirective.decorators = [
{ type: Directive, args: [{
selector: '[ngxTruncateText]'
},] }
];
/** @nocollapse */
NgxTruncateTextDirective.ctorParameters = function () { return [
{ type: ElementRef },
{ type: Renderer2 },
{ type: NgxTruncateService }
]; };
NgxTruncateTextDirective.propDecorators = {
more: [{ type: Input }],
less: [{ type: Input }],
number: [{ type: Input }],
completeWord: [{ type: Input }],
hashtag: [{ type: Input }],
hasLiteral: [{ type: Input }],
highlightCondition: [{ type: Input }],
highlightList: [{ type: Input }]
};
return NgxTruncateTextDirective;
}());
/**
* @fileoverview added by tsickle
* Generated from: lib/ngx-truncate-text.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NgxTruncateTextModule = /** @class */ (function () {
function NgxTruncateTextModule() {
}
NgxTruncateTextModule.decorators = [
{ type: NgModule, args: [{
declarations: [NgxTruncateTextDirective],
imports: [],
exports: [NgxTruncateTextDirective],
providers: [NgxTruncateService]
},] }
];
return NgxTruncateTextModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ngx-truncate-text.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { NgxTruncateTextModule, NgxTruncateTextDirective, NgxTruncateService as ɵa };
//# sourceMappingURL=ngx-truncate-text.js.map