lbry-desktop/ui/js/component/fileList/view.jsx

114 lines
3.1 KiB
React
Raw Normal View History

2017-06-06 23:19:12 +02:00
import React from "react";
import lbryuri from "lbryuri.js";
import FormField from "component/formField";
2017-06-06 23:19:12 +02:00
import FileTile from "component/fileTile";
import { BusyMessage } from "component/common.js";
2017-06-08 06:42:19 +02:00
class FileList extends React.PureComponent {
constructor(props) {
2017-06-06 23:19:12 +02:00
super(props);
this.state = {
2017-06-06 23:19:12 +02:00
sortBy: "date",
};
this._sortFunctions = {
date: function(fileInfos) {
return fileInfos.slice().reverse();
},
title: function(fileInfos) {
return fileInfos.slice().sort(function(fileInfo1, fileInfo2) {
const title1 = fileInfo1.value
? fileInfo1.value.stream.metadata.title.toLowerCase()
2017-06-06 23:19:12 +02:00
: fileInfo1.name;
const title2 = fileInfo2.value
? fileInfo2.value.stream.metadata.title.toLowerCase()
2017-06-06 23:19:12 +02:00
: fileInfo2.name;
if (title1 < title2) {
return -1;
} else if (title1 > title2) {
return 1;
} else {
return 0;
}
2017-06-06 23:19:12 +02:00
});
},
filename: function(fileInfos) {
2017-06-06 23:19:12 +02:00
return fileInfos
.slice()
.sort(function({ file_name: fileName1 }, { file_name: fileName2 }) {
const fileName1Lower = fileName1.toLowerCase();
const fileName2Lower = fileName2.toLowerCase();
if (fileName1Lower < fileName2Lower) {
return -1;
} else if (fileName2Lower > fileName1Lower) {
return 1;
} else {
return 0;
}
});
},
2017-06-06 23:19:12 +02:00
};
}
2017-08-27 07:00:44 +02:00
getChannelSignature(fileInfo) {
if (fileInfo.value) {
return fileInfo.value.publisherSignature.certificateId;
} else {
return fileInfo.metadata.publisherSignature.certificateId;
}
}
handleSortChanged(event) {
this.setState({
sortBy: event.target.value,
2017-06-06 23:19:12 +02:00
});
}
render() {
2017-06-06 23:19:12 +02:00
const { handleSortChanged, fetching, fileInfos } = this.props;
const { sortBy } = this.state;
const content = [];
this._sortFunctions[sortBy](fileInfos).forEach(fileInfo => {
let uriParams = {};
2017-06-29 00:08:16 +02:00
if (fileInfo.channel_name) {
uriParams.channelName = fileInfo.channel_name;
uriParams.contentName = fileInfo.name;
2017-08-27 07:00:44 +02:00
uriParams.claimId = this.getChannelSignature(fileInfo);
2017-06-29 00:08:16 +02:00
} else {
uriParams.claimId = fileInfo.claim_id;
uriParams.name = fileInfo.name;
}
const uri = lbryuri.build(uriParams);
2017-06-06 23:19:12 +02:00
content.push(
<FileTile
key={fileInfo.outpoint || fileInfo.claim_id}
2017-06-06 23:19:12 +02:00
uri={uri}
showPrice={false}
showLocal={false}
showActions={true}
2017-06-06 23:19:12 +02:00
showEmpty={this.props.fileTileShowEmpty}
/>
);
});
return (
2017-05-15 18:34:33 +02:00
<section className="file-list__header">
{fetching && <BusyMessage />}
2017-06-06 23:19:12 +02:00
<span className="sort-section">
{__("Sort by")} {" "}
<FormField type="select" onChange={this.handleSortChanged.bind(this)}>
2017-05-26 15:55:59 +02:00
<option value="date">{__("Date")}</option>
<option value="title">{__("Title")}</option>
</FormField>
</span>
{content}
</section>
2017-06-06 23:19:12 +02:00
);
}
}
2017-06-06 06:21:55 +02:00
export default FileList;