siesta-lite
Version:
Stress-free JavaScript unit testing and functional testing tool, works in NodeJS and browsers
82 lines (70 loc) • 2.76 kB
JSX
var React = require("react");
var ItemForArtWork = React.createClass({
render: function () {
function extractUrl(url, kind) {
var resolution = '.300x300-75';
if(kind === 'feature-movie') {
resolution = '.500x500-75';
}
return url.replace('.100x100-75', resolution);
}
function truncate(str, limit) {
var bits, i;
if ('string' !== typeof str) {
return '';
}
bits = str.split('');
if (bits.length > limit) {
for (i = bits.length - 1; i > -1; --i) {
if (i > limit) {
bits.length = i;
}
else if (' ' === bits[i]) {
bits.length = i;
break;
}
}
bits.push('...');
}
return bits.join('');
}
debugger
return (
<div className="column" key={this.props.art.trackId}>
<div className="ui fluid card">
<div className="image">
<img src={extractUrl(this.props.art.artworkUrl100, this.props.art.kind)} />
</div>
<div className="content">
<div className="header">{this.props.art.trackName || this.props.art.artistName}</div>
<div className="meta">
<a>{this.props.art.releaseDate.split('-')[0]} | {this.props.art.primaryGenreName}</a>
</div>
<div className="description">
{this.props.art.shortDescription || truncate(this.props.art.longDescription, 100) }
</div>
</div>
<div className="extra content">
<div className="ui bottom attached button" onClick={this.download}>
<i className="download icon"></i> Download
</div>
</div>
</div>
</div>
)
},
download: function() {
var imageParts = this.props.art.artworkUrl100.split('/');
var imageFilename = imageParts[imageParts.length - 1];
imageParts.pop();
var baseUrl = imageParts.join('/');
var re = /\.\d*[x]\d*[-]?\d*/;
var newImage = imageFilename.replace(re, "");
var imagePath = baseUrl + '/' + newImage;
var link = document.createElement("a");
link.download = imageFilename;
link.href = imagePath;
link.click();
}
});
module.exports = ItemForArtWork;