2021-02-08 20:04:32 +00:00
|
|
|
let re = /(?:\.([^.]+))?$/;
|
|
|
|
|
2021-02-08 06:30:44 +00:00
|
|
|
const setFileIconType = (fileName) => {
|
2021-02-08 20:04:32 +00:00
|
|
|
let icoPath = "static/imgs/icons/bin.png";
|
|
|
|
let ftype = "file";
|
2021-02-08 06:30:44 +00:00
|
|
|
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(doc|docx|xls|xlsx|rtf)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/doc.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(7z|7zip|zip|tar.gz|tar.xz|gz|rar|jar)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "resources/images/icons/arc.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(pdf)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/pdf.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(html)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/html.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(txt|conf)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/text.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(iso|img)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/img.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(sh|batch|exe)\b/) != null)
|
2021-02-08 06:30:44 +00:00
|
|
|
icoPath = "static/imgs/icons/scrip.png";
|
2021-02-08 20:04:32 +00:00
|
|
|
if (fileName.match(/\.(png|jpg|jpeg|gif|ico)\b/) != null)
|
|
|
|
ftype = "image";
|
|
|
|
if (fileName.match(/\.(avi|mkv|wmv|flv|f4v|mov|m4v|mpg|mpeg|mp4|webm|mp3|flac|ogg)\b/) != null)
|
|
|
|
ftype = "video";
|
|
|
|
if (fileName.match(/\.(dir)\b/) != null) {
|
|
|
|
icoPath = "static/imgs/icons/folder.png";
|
|
|
|
ftype = "dir"
|
2021-02-08 06:30:44 +00:00
|
|
|
}
|
|
|
|
|
2021-02-08 20:04:32 +00:00
|
|
|
return [icoPath, ftype]
|
2021-02-08 06:30:44 +00:00
|
|
|
}
|
|
|
|
|
2021-02-08 04:49:38 +00:00
|
|
|
class FilesList extends React.Component {
|
2021-02-08 07:15:38 +00:00
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
|
|
|
this.openThis = this.openThis.bind(this);
|
|
|
|
this.openThisLocally = this.openThisLocally.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
openThis(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
openFile(e);
|
|
|
|
}
|
|
|
|
|
|
|
|
openThisLocally(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
openFileLocally(e);
|
|
|
|
}
|
|
|
|
|
2021-02-08 04:49:38 +00:00
|
|
|
render() {
|
|
|
|
let final = [];
|
2021-02-08 06:30:44 +00:00
|
|
|
let files = this.props.files[0];
|
2021-02-08 04:49:38 +00:00
|
|
|
|
|
|
|
for (let file of files) {
|
2021-02-08 20:04:32 +00:00
|
|
|
const name = file[0];
|
|
|
|
const hash = file[1];
|
|
|
|
let extension = re.exec( name.toLowerCase() )[1] ? name : "file.dir";
|
|
|
|
let data = setFileIconType(extension);
|
|
|
|
let icon = data[0];
|
|
|
|
let filetype = data[1];
|
|
|
|
let card_header = null;
|
|
|
|
let card_body = null;
|
|
|
|
|
|
|
|
if (filetype === "video") {
|
|
|
|
card_header = name;
|
2021-02-10 03:18:38 +00:00
|
|
|
card_body = <img class="card-img-top" src={"static/imgs/thumbnails/" + hash + ".jpg"} alt={name} />;
|
2021-02-08 20:04:32 +00:00
|
|
|
} else if (filetype === "image") {
|
|
|
|
card_header = name;
|
2021-02-10 03:18:38 +00:00
|
|
|
card_body = <img class="card-img-top" src={"api/file-manager-action/files/" + hash} alt={name} />;
|
2021-02-08 20:04:32 +00:00
|
|
|
} else {
|
|
|
|
card_header = <img class="icon-style" src={icon} alt={name} />;
|
|
|
|
card_body = name;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
2021-02-08 04:49:38 +00:00
|
|
|
final.push(
|
2021-02-10 04:15:32 +00:00
|
|
|
<li class="col-sm-12 col-md-6 col-lg-4" title={name}>
|
2021-02-08 04:49:38 +00:00
|
|
|
<div class="card">
|
2021-02-08 06:30:44 +00:00
|
|
|
<div class="card-header">
|
2021-02-08 20:04:32 +00:00
|
|
|
{card_header}
|
2021-02-08 06:30:44 +00:00
|
|
|
</div>
|
2021-02-10 05:30:42 +00:00
|
|
|
<div class="card-body text-center">
|
2021-02-08 20:04:32 +00:00
|
|
|
{card_body}
|
2021-02-08 04:49:38 +00:00
|
|
|
</div>
|
2021-02-08 08:02:14 +00:00
|
|
|
<div class="card-footer">
|
2021-02-09 00:36:55 +00:00
|
|
|
<input hash={hash} onClick={this.openThisLocally} ftype={filetype} class="btn btn-secondary btn-sm float-left" type="button" value="Open Locally"/>
|
|
|
|
<input hash={hash} onClick={this.openThis} ftype={filetype} class="btn btn-secondary btn-sm float-right" title={name} type="button" value="Open"/>
|
2021-02-08 04:49:38 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
2021-02-09 01:50:06 +00:00
|
|
|
</li>
|
2021-02-08 04:49:38 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
2021-02-08 08:02:14 +00:00
|
|
|
<React.Fragment>
|
2021-02-08 04:49:38 +00:00
|
|
|
{final}
|
2021-02-08 08:02:14 +00:00
|
|
|
</React.Fragment>
|
2021-02-08 04:49:38 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-02-09 23:14:32 +00:00
|
|
|
|
|
|
|
class FavoritesList extends React.Component {
|
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
|
|
|
this.loadFaveEvent = this.loadFaveEvent.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
loadFaveEvent(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
loadFavePath(e);
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
let final = [];
|
|
|
|
let faves = this.props.faves_list;
|
|
|
|
|
|
|
|
for (let fave of faves) {
|
|
|
|
let title = fave[0]
|
|
|
|
let _faveId = fave[1]
|
|
|
|
let liTag = document.createElement("LI");
|
|
|
|
let parts = (title.includes("/")) ? title.split("/") : title.split("\\");
|
|
|
|
|
|
|
|
let name = parts[parts.length - 1]
|
|
|
|
if (name.toLowerCase().includes("season")) {
|
|
|
|
name = name[name.length - 2] + "/" + name
|
|
|
|
}
|
|
|
|
|
|
|
|
final.push(
|
2021-02-10 03:18:38 +00:00
|
|
|
<li onClick={this.loadFaveEvent} faveid={_faveId} class="list-group-item text-center" name={name} title={name}>
|
2021-02-09 23:14:32 +00:00
|
|
|
{name}
|
|
|
|
</li>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<React.Fragment>
|
|
|
|
{final}
|
|
|
|
</React.Fragment>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2021-02-08 05:31:20 +00:00
|
|
|
const renderFilesList = (data = null) => {
|
2021-02-08 06:30:44 +00:00
|
|
|
const filesListElm = document.getElementById('files');
|
|
|
|
ReactDOM.render(
|
|
|
|
React.createElement(FilesList, data),
|
|
|
|
filesListElm
|
|
|
|
)
|
2021-02-08 04:49:38 +00:00
|
|
|
}
|
2021-02-09 23:14:32 +00:00
|
|
|
|
|
|
|
const renderFavesList = (data = null) => {
|
|
|
|
const favesListElm = document.getElementById("faves-list");
|
|
|
|
ReactDOM.render(
|
|
|
|
React.createElement(FavoritesList, data),
|
|
|
|
favesListElm
|
|
|
|
)
|
|
|
|
}
|