mirror of
https://github.com/filebrowser/filebrowser.git
synced 2024-06-07 23:00:43 +00:00
updates
This commit is contained in:
Henrique Dias
parent
72e65e85fb
commit
ebbe370ebb
@ -395,7 +395,7 @@ textarea {
|
||||
|
||||
body {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
padding-top: 5em;
|
||||
padding-top: 9em;
|
||||
background-color: #f8f8f8;
|
||||
text-rendering: optimizespeed;
|
||||
}
|
||||
@ -602,11 +602,15 @@ pre {
|
||||
/* HEADER */
|
||||
|
||||
header {
|
||||
z-index: 999;
|
||||
padding: 1.7em 0;
|
||||
z-index: 1000;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.075);
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
@ -621,10 +625,7 @@ header a:hover,
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
header p {
|
||||
font-size: 1.5em;
|
||||
max-width: calc(100% - 3em);
|
||||
}
|
||||
header p {}
|
||||
|
||||
header p i {
|
||||
font-size: 1em !important;
|
||||
@ -632,14 +633,10 @@ header p i {
|
||||
}
|
||||
|
||||
header #logout {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
/* background-color: rgba(0, 0, 0, 0.05); */
|
||||
border-radius: 0;
|
||||
margin: -0.5em -0.5em -0.5em 0;
|
||||
padding: .5em;
|
||||
}
|
||||
|
||||
header p i {
|
||||
vertical-align: middle;
|
||||
margin: 0 0 0 auto;
|
||||
padding: .2em;
|
||||
}
|
||||
|
||||
#search {
|
||||
@ -771,29 +768,46 @@ header p i {
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
#toolbar,
|
||||
header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
header>div {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding: 0.5em;
|
||||
max-height: 4em;
|
||||
padding: 0.5em 0.5em 0.5em 1em;
|
||||
}
|
||||
|
||||
#toolbar div,
|
||||
header div {
|
||||
header>div:first-child>div:nth-child(1) {
|
||||
margin-right: 2em;
|
||||
font-weight: 500;
|
||||
font-size: 1.5em;
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
header>div:last-child {
|
||||
background-color: #fafafa;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.075);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
header>div div {
|
||||
vertical-align: middle;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex-positive: 1;
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#toolbar p,
|
||||
header .actions {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
header #file-only {
|
||||
display: inline-block;
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.075);
|
||||
padding-right: .3em;
|
||||
margin-right: .3em;
|
||||
transition: .2s ease all;
|
||||
}
|
||||
|
||||
#file-only.disabled {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
header p {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
@ -804,49 +818,12 @@ header #open-nav {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#toolbar p a,
|
||||
#toolbar p a:hover,
|
||||
header p a,
|
||||
header p a:hover {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#toolbar {
|
||||
z-index: 1000;
|
||||
top: -4em;
|
||||
-webkit-transition: 0.2s ease-in-out all;
|
||||
transition: 0.2s ease-in-out all;
|
||||
opacity: 0;
|
||||
color: #fff;
|
||||
background-color: #2196f3;
|
||||
}
|
||||
|
||||
#toolbar.enabled {
|
||||
top: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#toolbar div:nth-child(2),
|
||||
header div:nth-child(2) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
header #overlay {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999;
|
||||
transition: .2s ease all;
|
||||
background-color: rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
header .only-side {
|
||||
display: none;
|
||||
}
|
||||
header>div div:nth-child(2) {}
|
||||
|
||||
.action:hover ul {
|
||||
display: flex;
|
||||
@ -908,11 +885,12 @@ header .only-side {
|
||||
|
||||
.action {
|
||||
display: inline-block;
|
||||
margin: 0 0.2em;
|
||||
cursor: pointer;
|
||||
-webkit-transition: 0.2s ease all;
|
||||
transition: 0.2s ease all;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
color: #546E7A;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@ -922,7 +900,7 @@ header .only-side {
|
||||
}
|
||||
|
||||
.action i {
|
||||
padding: 0.5em;
|
||||
padding: 0.4em;
|
||||
-webkit-transition: 0.2s ease-in-out all;
|
||||
transition: 0.2s ease-in-out all;
|
||||
border-radius: 50%;
|
||||
@ -932,7 +910,6 @@ header .only-side {
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
#toolbar .action span,
|
||||
header .action span {
|
||||
display: none;
|
||||
}
|
||||
@ -983,8 +960,6 @@ header .action span {
|
||||
justify-content: flex-start;
|
||||
max-width: calc(100% - 2.2em);
|
||||
width: 100%;
|
||||
opacity: 0;
|
||||
transition: .1s ease all;
|
||||
}
|
||||
|
||||
#listing.list {
|
||||
@ -1000,7 +975,7 @@ header .action span {
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.1);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
@ -1053,7 +1028,6 @@ header .action span {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
|
||||
#listing.list .item div:first-of-type {
|
||||
width: 3em;
|
||||
}
|
||||
@ -1066,6 +1040,7 @@ header .action span {
|
||||
width: calc(100% - 3em);
|
||||
}
|
||||
|
||||
|
||||
/* ANIMATIONS */
|
||||
|
||||
i.spin {
|
||||
@ -1237,130 +1212,4 @@ i.spin {
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
float: right;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
header .only-side {
|
||||
display: block;
|
||||
padding: .5em;
|
||||
background-color: #2196f3;
|
||||
color: #fff;
|
||||
max-height: 4em;
|
||||
}
|
||||
header>div:first-child #prev {
|
||||
display: none;
|
||||
}
|
||||
header #open-nav {
|
||||
display: inline-block;
|
||||
}
|
||||
/* SIDEBAR */
|
||||
header>div:nth-child(2) {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 999999;
|
||||
background-color: #fff;
|
||||
height: 100%;
|
||||
width: 95%;
|
||||
max-width: 20em;
|
||||
text-align: left;
|
||||
color: #212121;
|
||||
left: -100%;
|
||||
transition: .2s ease-in-out all;
|
||||
}
|
||||
header>div:nth-child(2).active {
|
||||
left: 0;
|
||||
}
|
||||
header>div:nth-child(2).active+#overlay {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
header #search {
|
||||
height: auto;
|
||||
background-color: transparent;
|
||||
color: #212121;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: .5em 0;
|
||||
text-align: left;
|
||||
}
|
||||
header #search input {
|
||||
color: #212121;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
min-width: 16em;
|
||||
}
|
||||
header #search i {
|
||||
color: #6f6f6f;
|
||||
display: inline-block;
|
||||
padding: .5em;
|
||||
margin: 0;
|
||||
}
|
||||
header>div:nth-child(2)>div {
|
||||
display: block;
|
||||
}
|
||||
header>div:nth-child(2) .action {
|
||||
border-radius: 0 !important;
|
||||
padding: .5em 0 !important;
|
||||
margin: 0 !important;
|
||||
text-align: left;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
header>div:nth-child(2) #prev {
|
||||
border-radius: 50% !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
header>div:nth-child(2) #prev i {
|
||||
color: #fff;
|
||||
}
|
||||
header>div:nth-child(2) .action:hover {
|
||||
background-color: rgba(0, 0, 0, .1) !important;
|
||||
}
|
||||
header>div:nth-child(2) .action:hover i {
|
||||
background-color: transparent;
|
||||
}
|
||||
header>div:nth-child(2) .action i {
|
||||
border-radius: 0;
|
||||
color: #6f6f6f;
|
||||
}
|
||||
header>div:nth-child(2) .action span {}
|
||||
header>div:nth-child(2) .action i,
|
||||
header>div:nth-child(2) .action span {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
#listing .item {
|
||||
width: calc(50% - 1em);
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
header>div:first-child p a,
|
||||
header>div:first-child p i {
|
||||
display: none !important;
|
||||
}
|
||||
header>div:first-child p {
|
||||
font-size: 1em;
|
||||
}
|
||||
#editor .frontmatter {
|
||||
column-count: 1;
|
||||
column-gap: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 650px) {
|
||||
#listing .item {
|
||||
width: 100%;
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 450px) {
|
||||
#toolbar p {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@ -85,6 +85,21 @@ Element.prototype.changeToDone = function(error, html) {
|
||||
return false;
|
||||
}
|
||||
|
||||
function getCSSRule(ruleName) {
|
||||
ruleName = ruleName.toLowerCase();
|
||||
var result = null;
|
||||
var find = Array.prototype.find;
|
||||
|
||||
find.call(document.styleSheets, styleSheet => {
|
||||
result = find.call(styleSheet.cssRules, cssRule => {
|
||||
return cssRule instanceof CSSStyleRule &&
|
||||
cssRule.selectorText.toLowerCase() == ruleName;
|
||||
});
|
||||
return result != null;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
|
||||
var toWebDavURL = function(url) {
|
||||
url = url.replace(baseURL + "/", webdavURL + "/");
|
||||
return window.location.origin + url
|
||||
@ -171,8 +186,7 @@ var reloadListing = function(callback) {
|
||||
if (request.status == 200) {
|
||||
document.querySelector('body main').innerHTML = request.responseText;
|
||||
addNewDirEvents();
|
||||
document.getElementById("listing").style.opacity = 1;
|
||||
|
||||
|
||||
if (typeof callback == 'function') {
|
||||
callback();
|
||||
}
|
||||
@ -193,23 +207,24 @@ var renameEvent = function(event) {
|
||||
location.refresh();
|
||||
}
|
||||
|
||||
let link = selectedItems[0];
|
||||
let item = document.getElementById(link);
|
||||
let span = item.getElementsByTagName('span')[0];
|
||||
let name = span.innerHTML;
|
||||
let item = document.getElementById(selectedItems[0]),
|
||||
link = item.dataset.url,
|
||||
span = item.getElementsByTagName('span')[0],
|
||||
name = span.innerHTML;
|
||||
|
||||
span.setAttribute('contenteditable', 'true');
|
||||
span.focus();
|
||||
|
||||
let keyDownEvent = (event) => {
|
||||
if (event.keyCode == 13) {
|
||||
let newName = span.innerHTML;
|
||||
let newLink = toWebDavURL(link).replace(name, newName)
|
||||
let html = document.getElementById('rename').changeToLoading();
|
||||
let request = new XMLHttpRequest();
|
||||
let newName = span.innerHTML,
|
||||
newLink = RemoveLastDirectoryPartOf(toWebDavURL(link)) + newName,
|
||||
html = document.getElementById('rename').changeToLoading(),
|
||||
request = new XMLHttpRequest();
|
||||
|
||||
request.open('MOVE', toWebDavURL(link));
|
||||
request.setRequestHeader('Destination', newLink);
|
||||
|
||||
request.setRequestHeader('Content-type', 'text/plain; charset=utf-8');
|
||||
request.send();
|
||||
request.onreadystatechange = function() {
|
||||
// TODO: redirect if it's moved to another folder
|
||||
@ -221,11 +236,10 @@ var renameEvent = function(event) {
|
||||
let newLink = encodeURI(link.replace(name, newName));
|
||||
console.log(request.body)
|
||||
reloadListing(() => {
|
||||
let newLink = encodeURI(link.replace(name, newName));
|
||||
selectedItems = [newLink];
|
||||
document.getElementById(newLink).classList.add("selected")
|
||||
var event = new CustomEvent('changed-selected');
|
||||
document.dispatchEvent(event);
|
||||
newName = btoa(newName);
|
||||
selectedItems = [newName];
|
||||
document.getElementById(newName).setAttribute("aria-selected", true);
|
||||
document.sendCostumEvent('changed-selected');
|
||||
});
|
||||
}
|
||||
|
||||
@ -376,12 +390,13 @@ var newDirEvent = function(event) {
|
||||
|
||||
// Handles the event when there is change on selected elements
|
||||
document.addEventListener("changed-selected", function(event) {
|
||||
var toolbar = document.getElementById("toolbar");
|
||||
var selectedNumber = selectedItems.length;
|
||||
document.getElementById("selected-number").innerHTML = selectedNumber;
|
||||
redefineDownloadURLs();
|
||||
|
||||
let selectedNumber = selectedItems.length,
|
||||
fileAction = document.getElementById("file-only");
|
||||
|
||||
if (selectedNumber) {
|
||||
toolbar.classList.add("enabled");
|
||||
fileAction.classList.remove("disabled");
|
||||
|
||||
if (selectedNumber > 1) {
|
||||
document.getElementById("open").classList.add("disabled");
|
||||
@ -393,12 +408,10 @@ document.addEventListener("changed-selected", function(event) {
|
||||
document.getElementById("rename").classList.remove("disabled");
|
||||
}
|
||||
|
||||
redefineDownloadURLs();
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
toolbar.classList.remove("enabled");
|
||||
fileAction.classList.add("disabled");
|
||||
return false;
|
||||
});
|
||||
|
||||
@ -406,7 +419,8 @@ var redefineDownloadURLs = function() {
|
||||
let files = "";
|
||||
|
||||
for (let i = 0; i < selectedItems.length; i++) {
|
||||
files += selectedItems[i].replace(window.location.pathname, "") + ",";
|
||||
let url = document.getElementById(selectedItems[i]).dataset.url;
|
||||
files += url.replace(window.location.pathname, "") + ",";
|
||||
}
|
||||
|
||||
files = files.substring(0, files.length - 1);
|
||||
@ -484,13 +498,26 @@ var searchEvent = function(event) {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
document.addEventListener('listing', event => {
|
||||
// Handles the current view mode and adds the event to the button
|
||||
handleViewType(document.getCookie("view-list"));
|
||||
document.getElementById("view").addEventListener("click", viewEvent);
|
||||
|
||||
let updateColumns = () => {
|
||||
let columns = Math.floor(document.getElementById('listing').offsetWidth / 300),
|
||||
itens = getCSSRule('#listing .item');
|
||||
|
||||
itens.style.width = `calc(${100/columns}% - 1em)`;
|
||||
}
|
||||
|
||||
updateColumns();
|
||||
window.addEventListener("resize", () => {
|
||||
updateColumns();
|
||||
});
|
||||
|
||||
// Add event to back button and executes back event on ESC
|
||||
document.getElementById("back").addEventListener("click", backEvent)
|
||||
document.addEventListener('keydown', (event) => {
|
||||
if (event.keyCode == 27) {
|
||||
backEvent(event);
|
||||
@ -628,6 +655,7 @@ function itemDrop(e) {
|
||||
let el = e.target,
|
||||
id = e.dataTransfer.getData("id"),
|
||||
name = e.dataTransfer.getData("name");
|
||||
|
||||
if (id == "" || name == "") return;
|
||||
|
||||
for (let i = 0; i < 5; i++) {
|
||||
@ -638,10 +666,10 @@ function itemDrop(e) {
|
||||
|
||||
if (el.id === id) return;
|
||||
|
||||
let oldLink = toWebDavURL(id);
|
||||
let newLink = toWebDavURL(el.id + name);
|
||||
let oldLink = toWebDavURL(document.getElementById(id).dataset.url),
|
||||
newLink = toWebDavURL(el.dataset.url + name),
|
||||
request = new XMLHttpRequest();
|
||||
|
||||
let request = new XMLHttpRequest();
|
||||
request.open('MOVE', oldLink);
|
||||
request.setRequestHeader('Destination', newLink);
|
||||
request.send();
|
||||
@ -660,20 +688,18 @@ function openItem(event) {
|
||||
}
|
||||
|
||||
function selectItem(event) {
|
||||
let el = event.currentTarget,
|
||||
url = el.dataset.url;
|
||||
let el = event.currentTarget;
|
||||
|
||||
if (selectedItems.length != 0) event.preventDefault();
|
||||
if (selectedItems.indexOf(url) == -1) {
|
||||
if (selectedItems.indexOf(el.id) == -1) {
|
||||
el.setAttribute("aria-selected", true);
|
||||
selectedItems.push(url);
|
||||
selectedItems.push(el.id);
|
||||
} else {
|
||||
el.setAttribute("aria-selected", false);
|
||||
selectedItems.removeElement(url);
|
||||
selectedItems.removeElement(el.id);
|
||||
}
|
||||
|
||||
var event = new CustomEvent('changed-selected');
|
||||
document.dispatchEvent(event);
|
||||
document.sendCostumEvent("changed-selected");
|
||||
return false;
|
||||
}
|
||||
|
||||
@ -969,13 +995,6 @@ document.addEventListener("DOMContentLoaded", function(event) {
|
||||
document.getElementById("delete").addEventListener("click", deleteEvent);
|
||||
}
|
||||
|
||||
document.getElementById("open-nav").addEventListener("click", event => {
|
||||
document.querySelector("header > div:nth-child(2)").classList.toggle("active");
|
||||
});
|
||||
document.getElementById("overlay").addEventListener("click", event => {
|
||||
document.querySelector("header > div:nth-child(2)").classList.toggle("active");
|
||||
});
|
||||
|
||||
if (document.getElementById('listing')) {
|
||||
document.sendCostumEvent('listing');
|
||||
}
|
||||
@ -985,36 +1004,4 @@ document.addEventListener("DOMContentLoaded", function(event) {
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
|
||||
(function() {
|
||||
let columns = Math.floor(document.getElementById('listing').offsetWidth / 300);
|
||||
var header = getCSSRule('#listing .item');
|
||||
header.style.width = `calc(${100/columns}% - 1em)`;
|
||||
|
||||
document.getElementById("listing").style.opacity = 1;
|
||||
}());
|
||||
|
||||
|
||||
window.addEventListener("resize", () => {
|
||||
let columns = Math.floor(document.getElementById('listing').offsetWidth / 300);
|
||||
var itens = getCSSRule('#listing .item');
|
||||
itens.style.width = `calc(${100/columns}% - 1em)`;
|
||||
});
|
||||
|
||||
|
||||
function getCSSRule(ruleName) {
|
||||
ruleName = ruleName.toLowerCase();
|
||||
var result = null;
|
||||
var find = Array.prototype.find;
|
||||
|
||||
find.call(document.styleSheets, styleSheet => {
|
||||
result = find.call(styleSheet.cssRules, cssRule => {
|
||||
return cssRule instanceof CSSStyleRule &&
|
||||
cssRule.selectorText.toLowerCase() == ruleName;
|
||||
});
|
||||
return result != null;
|
||||
});
|
||||
return result;
|
||||
}
|
||||
});
|
||||
@ -1,33 +0,0 @@
|
||||
{{ define "actions" }}
|
||||
<div class="action" id="open">
|
||||
<i class="material-icons" title="See raw">open_in_new</i> <span>See raw</span>
|
||||
</div>
|
||||
{{ if and .IsDir .User.AllowEdit }}
|
||||
<div class="action" id="rename">
|
||||
<i class="material-icons" title="Edit">mode_edit</i>
|
||||
</div>
|
||||
{{ end }}
|
||||
<!-- {{ if .IsDir }}
|
||||
<div class="action" id="info">
|
||||
<i class="material-icons">info</i>
|
||||
</div>
|
||||
{{ end }}-->
|
||||
<div class="action" id="download">
|
||||
<a href="?download=true">
|
||||
<i class="material-icons" title="Download">file_download</i> <span>Download</span>
|
||||
</a>
|
||||
{{ if .IsDir }}
|
||||
<ul class="prev-links">
|
||||
<a data-format="tarbz2" href="?download=tarbz2"><li>tar.bz2</li></a>
|
||||
<a data-format="targz" href="?download=targz"><li>tar.gz</li></a>
|
||||
<a data-format="tar" href="?download=tar"><li>tar</li></a>
|
||||
<a data-format="zip" href="?download=zip"><li>zip</li></a>
|
||||
</ul>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if .User.AllowEdit }}
|
||||
<div class="action" id="delete">
|
||||
<i class="material-icons" title="Delete">delete</i> <span>Delete</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -4,6 +4,7 @@
|
||||
<head>
|
||||
<title>{{.Name}}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="utf-8">
|
||||
<meta name="token" content="{{ .Token }}">
|
||||
<link rel="stylesheet" href="{{ .Config.AbsoluteURL }}/_filemanagerinternal/css/styles.css">
|
||||
{{ if ne .User.StyleSheet "" }}
|
||||
@ -19,103 +20,96 @@
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<!-- TOP BAR -->
|
||||
<div>
|
||||
{{ $lnk := .PreviousLink }}
|
||||
<div class="action{{ if eq $lnk ""}} disabled{{ end }}" id="prev">
|
||||
{{ if ne $lnk ""}}<a href="{{ $lnk }}">{{ end }}
|
||||
<i class="material-icons" title="Previous">subdirectory_arrow_left</i>
|
||||
{{ if ne $lnk ""}}</a>{{ end }}
|
||||
|
||||
{{ if ne $lnk ""}}
|
||||
<ul class="prev-links">
|
||||
{{ range $link, $name := .BreadcrumbMap }}<a href="{{ $absURL }}{{ $link }}"><li>{{ $name }}</li></a>{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
<div><p>File Manager</p></div>
|
||||
{{ if .User.AllowCommands }}
|
||||
<div id="search">
|
||||
<i class="material-icons" title="Storage">storage</i>
|
||||
<input type="text" placeholder="Search or execute a command...">
|
||||
<div>
|
||||
<div>Write your git, mercurial or svn command and press enter.</div>
|
||||
<p><i class="material-icons spin">autorenew</i></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="action" id="open-nav">
|
||||
<i class="material-icons" title="Menu">menu</i>
|
||||
</div>
|
||||
|
||||
{{ if ne .Name "/"}}<p>{{ .Name }}</p>{{ end }}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="only-side">
|
||||
{{ $lnk := .PreviousLink }}
|
||||
{{ if ne $lnk ""}}<a href="{{ $lnk }}">{{ end }}
|
||||
<div class="action{{ if eq $lnk ""}} disabled{{ end }}" id="prev">
|
||||
<i class="material-icons" title="Previous">subdirectory_arrow_left</i>
|
||||
</div>
|
||||
{{ if ne $lnk ""}}</a>{{ end }}
|
||||
|
||||
<p><a href="{{ if eq .Config.AbsoluteURL "" }}/{{ else }}{{ .Config.AbsoluteURL }}{{ end }}">File Manager</a></p>
|
||||
</div>
|
||||
|
||||
{{ if .IsDir}}
|
||||
{{ if .User.AllowCommands }}
|
||||
<div id="search">
|
||||
<i class="material-icons" title="Storage">storage</i>
|
||||
<input type="text" placeholder="Search or execute a command...">
|
||||
<div>
|
||||
<div>Write your git, mercurial or svn command and press enter.</div>
|
||||
<p><i class="material-icons spin">autorenew</i></p>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="view">
|
||||
<i class="material-icons" title="Switch view">view_headline</i> <span>Switch view</span>
|
||||
</div>
|
||||
|
||||
{{ if .User.AllowNew }}
|
||||
<div class="action" id="upload">
|
||||
<i class="material-icons" title="Upload">file_upload</i> <span>Upload</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="action">
|
||||
<a href="?download=true">
|
||||
<i class="material-icons" title="Download">file_download</i> <span>Download</span>
|
||||
</a>
|
||||
<ul class="prev-links">
|
||||
<a href="?download=tarbz2"><li>tar.bz2</li></a>
|
||||
<a href="?download=targz"><li>tar.gz</li></a>
|
||||
<a href="?download=tar"><li>tar</li></a>
|
||||
<a href="?download=zip"><li>zip</li></a>
|
||||
</ul>
|
||||
</div>
|
||||
{{ else }}
|
||||
{{ template "actions" . }}
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="logout">
|
||||
<i class="material-icons" title="Logout">exit_to_app</i> <span>Logout</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="overlay"></div>
|
||||
</header>
|
||||
|
||||
{{ if .IsDir }}
|
||||
<div id="toolbar">
|
||||
|
||||
<!-- BOTTOM BAR -->
|
||||
<div>
|
||||
<div class="action" id="back">
|
||||
<i class="material-icons" title="Back">arrow_back</i>
|
||||
<div>
|
||||
{{ $lnk := .PreviousLink }}
|
||||
<div class="action{{ if eq $lnk ""}} disabled{{ end }}" id="prev">
|
||||
{{ if ne $lnk ""}}<a href="{{ $lnk }}">{{ end }}
|
||||
<i class="material-icons" title="Previous">subdirectory_arrow_left</i>
|
||||
{{ if ne $lnk ""}}</a>{{ end }}
|
||||
|
||||
{{ if ne $lnk ""}}
|
||||
<ul class="prev-links">
|
||||
{{ range $link, $name := .BreadcrumbMap }}<a href="{{ $absURL }}{{ $link }}"><li>{{ $name }}</li></a>{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if ne .Name "/"}}<p>{{ .Name }}</p>{{ end }}
|
||||
</div>
|
||||
|
||||
<!-- ACTIONS -->
|
||||
<div class="actions">
|
||||
<div id="file-only" {{ if .IsDir }}class="disabled"{{ end }}>
|
||||
<div class="action" id="open">
|
||||
<i class="material-icons" title="See raw">open_in_new</i> <span>See raw</span>
|
||||
</div>
|
||||
{{ if and .IsDir .User.AllowEdit }}
|
||||
<div class="action" id="rename">
|
||||
<i class="material-icons" title="Edit">mode_edit</i>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .User.AllowEdit }}
|
||||
<div class="action" id="delete">
|
||||
<i class="material-icons" title="Delete">delete</i> <span>Delete</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if and (.User.AllowNew) (.IsDir) }}
|
||||
<div class="action" id="upload">
|
||||
<i class="material-icons" title="Upload">file_upload</i> <span>Upload</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="action" id="download">
|
||||
<a href="?download=true">
|
||||
<i class="material-icons" title="Download">file_download</i> <span>Download</span>
|
||||
</a>
|
||||
{{ if .IsDir }}
|
||||
<ul class="prev-links">
|
||||
<a data-format="tarbz2" href="?download=tarbz2"><li>tar.bz2</li></a>
|
||||
<a data-format="targz" href="?download=targz"><li>tar.gz</li></a>
|
||||
<a data-format="tar" href="?download=tar"><li>tar</li></a>
|
||||
<a data-format="zip" href="?download=zip"><li>zip</li></a>
|
||||
</ul>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if .IsDir }}
|
||||
<div class="action" id="view">
|
||||
<i class="material-icons" title="Switch view">view_headline</i> <span>Switch view</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<p><span id="selected-number">0</span> selected.</p>
|
||||
</div>
|
||||
<div>
|
||||
{{ template "actions" . }}
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</header>
|
||||
|
||||
<main>
|
||||
{{ template "content" . }}
|
||||
</main>
|
||||
|
||||
<footer>Served with <a rel="noopener noreferrer" href="https://caddyserver.com">Caddy</a> and <a rel="noopener noreferrer" href="https://github.com/hacdias/caddy-filemanager">File Manager</a>.</footer>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
ondblclick="openItem(event)"
|
||||
data-dir="{{ .IsDir }}"
|
||||
data-url="{{ .URL }}"
|
||||
id="{{.URL}}">
|
||||
id="{{ EncodeBase64 .Name }}">
|
||||
<div>
|
||||
{{- if .IsDir}}
|
||||
<i class="material-icons">folder</i>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
{{ if eq .Type "image" }}
|
||||
<img src="{{ .URL }}?raw=true">
|
||||
{{ else if eq .Type "audio" }}
|
||||
<audio src="{{ .URL }}?raw=true"></audio>
|
||||
<audio src="{{ .URL }}?raw=true" controls></audio>
|
||||
{{ else if eq .Type "video" }}
|
||||
<video src="{{ .URL }}?raw=true" controls>
|
||||
Sorry, your browser doesn't support embedded videos,
|
||||
|
||||
@ -4,6 +4,7 @@ import (
|
||||
"io"
|
||||
"io/ioutil"
|
||||
"net/http"
|
||||
"net/url"
|
||||
"os"
|
||||
"path/filepath"
|
||||
"strings"
|
||||
@ -29,6 +30,12 @@ func Download(w http.ResponseWriter, r *http.Request, c *config.Config, i *file.
|
||||
|
||||
if len(names) != 0 {
|
||||
for _, name := range names {
|
||||
name, err := url.QueryUnescape(name)
|
||||
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
files = append(files, filepath.Join(i.Path, name))
|
||||
}
|
||||
|
||||
@ -78,7 +85,7 @@ func Download(w http.ResponseWriter, r *http.Request, c *config.Config, i *file.
|
||||
}
|
||||
|
||||
name := i.Name()
|
||||
if name == "" {
|
||||
if name == "." || name == "" {
|
||||
name = "download"
|
||||
}
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ package page
|
||||
|
||||
import (
|
||||
"bytes"
|
||||
"encoding/base64"
|
||||
"encoding/json"
|
||||
"html/template"
|
||||
"log"
|
||||
@ -90,12 +91,15 @@ func (p Page) PrintAsHTML(w http.ResponseWriter, templates ...string) (int, erro
|
||||
a, _ := json.Marshal(v)
|
||||
return template.JS(a)
|
||||
},
|
||||
"EncodeBase64": func(s string) string {
|
||||
return base64.StdEncoding.EncodeToString([]byte(s))
|
||||
},
|
||||
}
|
||||
|
||||
if p.Minimal {
|
||||
templates = append(templates, "actions", "minimal")
|
||||
templates = append(templates, "minimal")
|
||||
} else {
|
||||
templates = append(templates, "actions", "base")
|
||||
templates = append(templates, "base")
|
||||
}
|
||||
|
||||
var tpl *template.Template
|
||||
|
||||
Loading…
Reference in New Issue
Block a user