synapse-react-client
Version:
[](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [](https://badge.fury.io/js/synaps
54 lines • 2.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = (0, tslib_1.__importStar)(require("react"));
var CHAR_COUNT_CUTOFF = 400;
var ShowMore = /** @class */ (function (_super) {
(0, tslib_1.__extends)(ShowMore, _super);
function ShowMore(props) {
var _this = _super.call(this, props) || this;
_this.getCutoff = function (summary) {
var previewText = '';
if (!summary) {
return { previewText: previewText };
}
var hiddenText = '';
var summarySplit = summary.split(' ');
// find num words to join such that its >= char_count_cutoff
var i = 0;
while (previewText.length < CHAR_COUNT_CUTOFF && i < summarySplit.length) {
previewText += summarySplit[i] + " ";
i += 1;
}
if (i < summarySplit.length - 1) {
hiddenText = summarySplit.slice(i).join(' ');
}
return { previewText: previewText, hiddenText: hiddenText };
};
_this.state = {
showMore: false,
};
_this.toggleShowMore = _this.toggleShowMore.bind(_this);
return _this;
}
ShowMore.prototype.toggleShowMore = function (event) {
event.preventDefault();
this.setState({
showMore: true,
});
};
ShowMore.prototype.render = function () {
var summary = this.props.summary;
var meetsCharRequirements = summary && summary.length >= CHAR_COUNT_CUTOFF;
var _a = this.getCutoff(summary), previewText = _a.previewText, hiddenText = _a.hiddenText;
var showMoreButton = meetsCharRequirements && (React.createElement("a", { style: { fontSize: '14px', cursor: 'pointer', marginLeft: '5px' }, onClick: this.toggleShowMore, className: "highlight-link" }, "...Show More"));
return (React.createElement(React.Fragment, null,
React.createElement("span", null,
previewText,
React.createElement("span", { className: this.state.showMore ? '' : 'SRC-hidden' }, hiddenText)),
!this.state.showMore && showMoreButton));
};
return ShowMore;
}(React.Component));
exports.default = ShowMore;
//# sourceMappingURL=ShowMore.js.map