opds-web-client
Version:
87 lines (86 loc) • 3.55 kB
JavaScript
;
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var React = require("react");
var seedrandom = require("seedrandom");
var BookCover = (function (_super) {
__extends(BookCover, _super);
function BookCover(props) {
_super.call(this, props);
this.state = { error: false };
this.handleError = this.handleError.bind(this);
}
BookCover.prototype.handleError = function (event) {
this.setState({ error: true });
};
BookCover.prototype.componentWillReceiveProps = function (nextProps) {
if (this.state.error) {
this.setState({ error: false });
}
};
BookCover.prototype.render = function () {
var bookCoverStyle = {
width: "150px",
height: "200px",
float: "left",
border: "1px solid #ccc"
};
if (this.props.book.imageUrl && !this.state.error) {
return (React.createElement("img", {src: this.props.book.imageUrl, onError: this.handleError, style: bookCoverStyle, alt: ""}));
}
var _a = this.props.book, title = _a.title, authors = _a.authors;
var titleStyle = Object.assign({
display: "table-cell",
height: "120px",
width: "150px",
verticalAlign: "bottom",
color: "#444",
backgroundColor: "#eee",
fontWeight: "normal",
padding: "10px",
}, this.computeFontStyle(title, 40));
var authorStyle = Object.assign({
paddingTop: "10px",
color: "#fff",
padding: "10px"
}, this.computeFontStyle(authors.join(", "), 25));
var hue = this.seededRandomHue(title);
var bgColor = "hsla(" + hue + ", 40%, 60%, 1)";
var cellStyle = {
float: "left",
width: "150px",
height: "200px",
backgroundColor: bgColor,
border: "1px solid #888",
fontWeight: "normal",
fontFamily: "Georgia, serif",
position: "relative",
textAlign: "left"
};
return (React.createElement("div", {className: "autoBookCover", style: cellStyle}, React.createElement("div", {style: titleStyle}, title), React.createElement("div", {style: authorStyle}, authors.join(", "))));
};
BookCover.prototype.computeFontStyle = function (text, baseFontSize, minFontSize) {
if (baseFontSize === void 0) { baseFontSize = 40; }
if (minFontSize === void 0) { minFontSize = 15; }
// decrease size as max word length increases
// decrease size as word count grows beyond 3
var words = text.split(/\s/);
var wordCount = words.length;
var maxLength = Math.max.apply(Math, words.map(function (word) { return word.length; }));
var fontSize = Math.max(minFontSize, baseFontSize - maxLength * 2 - Math.max(0, wordCount - 3) * 2);
var lineHeight = fontSize + 5;
return {
fontSize: (fontSize / 13) + "em",
lineHeight: "1em"
};
};
BookCover.prototype.seededRandomHue = function (seed) {
return Math.round(360 * seedrandom(seed)());
};
return BookCover;
}(React.Component));
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = BookCover;