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];
|
2023-02-12 02:25:13 +00:00
|
|
|
if (name == "000.jpg") { continue }
|
2022-10-09 00:57:45 +00:00
|
|
|
|
2023-02-17 03:13:46 +00:00
|
|
|
const hash = file[1];
|
|
|
|
const fsize = file[2];
|
|
|
|
let extension = re.exec( name.toLowerCase() )[1] ? name : "file.dir";
|
|
|
|
let data = setFileIconType(extension);
|
|
|
|
let icon = data[0];
|
|
|
|
let filetype = data[1];
|
2021-02-08 20:04:32 +00:00
|
|
|
let card_header = null;
|
|
|
|
let card_body = null;
|
2023-02-17 03:13:46 +00:00
|
|
|
let download_button = null;
|
|
|
|
let stream_button = null;
|
2021-02-08 20:04:32 +00:00
|
|
|
|
|
|
|
if (filetype === "video") {
|
|
|
|
card_header = name;
|
2022-03-18 22:18:13 +00:00
|
|
|
card_body = <React.Fragment>
|
2023-02-10 02:40:58 +00:00
|
|
|
<img class="card-img-top card-image" src="" alt={name} />
|
2022-03-18 22:18:13 +00:00
|
|
|
<span class="float-right">{fsize}</span>
|
|
|
|
</React.Fragment>;
|
2023-02-17 03:13:46 +00:00
|
|
|
stream_button = <React.Fragment>
|
|
|
|
<input hash={hash} onClick={this.openThis} ftype="stream" class="btn btn-dark btn-sm float-end" title={name} type="button" value="Stream"/>
|
|
|
|
</React.Fragment>;
|
|
|
|
|
2021-02-08 20:04:32 +00:00
|
|
|
} else if (filetype === "image") {
|
|
|
|
card_header = name;
|
2022-03-18 22:18:13 +00:00
|
|
|
card_body = <React.Fragment>
|
2022-10-09 00:57:45 +00:00
|
|
|
<img class="card-img-top" src={"api/file-manager-action/files/" + hash + "?d=" + Date.now()} alt={name} />
|
2022-03-18 22:18:13 +00:00
|
|
|
<span class="float-right">{fsize}</span>
|
|
|
|
</React.Fragment>;
|
2021-02-08 20:04:32 +00:00
|
|
|
} else {
|
|
|
|
card_header = <img class="icon-style" src={icon} alt={name} />;
|
2022-03-18 22:18:13 +00:00
|
|
|
card_body = <React.Fragment>
|
|
|
|
{name}
|
|
|
|
<span>{fsize}</span>
|
|
|
|
</React.Fragment>;
|
2023-02-17 03:13:46 +00:00
|
|
|
}
|
|
|
|
if (filetype !== "dir") {
|
|
|
|
download_button = <React.Fragment>
|
|
|
|
<a href={"api/file-manager-action/files/" + hash} download class="btn btn-dark btn-sm float-start">Download</a>
|
|
|
|
</React.Fragment>;
|
2021-02-08 20:04:32 +00:00
|
|
|
}
|
|
|
|
|
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-09-28 22:37:20 +00:00
|
|
|
<div class="card-header card-title-text">
|
2021-02-08 20:04:32 +00:00
|
|
|
{card_header}
|
2021-02-08 06:30:44 +00:00
|
|
|
</div>
|
2021-02-21 20:05:03 +00:00
|
|
|
<div class="card-body text-center noselect" title={name} hash={hash} ftype={filetype} onDoubleClick={this.openThis}>
|
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">
|
2023-02-17 03:13:46 +00:00
|
|
|
{download_button}
|
2021-09-28 22:37:20 +00:00
|
|
|
<input hash={hash} onClick={this.openThisLocally} ftype={filetype} class="btn btn-dark btn-sm float-start" type="button" value="Open Locally"/>
|
|
|
|
<input hash={hash} onClick={this.openThis} ftype={filetype} class="btn btn-dark btn-sm float-end" title={name} type="button" value="Open"/>
|
2023-02-17 03:13:46 +00:00
|
|
|
{stream_button}
|
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
|
|
|
|
)
|
2023-02-10 02:40:58 +00:00
|
|
|
|
2023-02-05 23:44:03 +00:00
|
|
|
videoPlaylist = document.body.querySelectorAll('[ftype="video"][value="Open"]'); // With attributes ftype and value
|
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
|
|
|
|
)
|
|
|
|
}
|