mirror of
https://github.com/filebrowser/filebrowser.git
synced 2024-06-07 23:00:43 +00:00
Some changes
This commit is contained in:
parent
cbad4a55b9
commit
4bd1d42e8e
@ -117,6 +117,7 @@
|
||||
src: local('Material Icons'), local('MaterialIcons-Regular'), url(material/icons.woff2) format('woff2');
|
||||
}
|
||||
|
||||
.prompt .file-list ul li:before,
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
@ -133,4 +134,4 @@
|
||||
text-rendering: optimizeLegibility;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
font-feature-settings: 'liga';
|
||||
}
|
||||
}
|
||||
|
@ -471,7 +471,7 @@ header .actions {
|
||||
|
||||
#bottom-bar>*:first-child {
|
||||
margin-right: auto;
|
||||
max-width: calc(100% - 21em);
|
||||
max-width: calc(100% - 25em);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -919,6 +919,49 @@ header .actions {
|
||||
background-color: #e9eaeb;
|
||||
}
|
||||
|
||||
/* * * * * * * * * * * * * * * *
|
||||
* PROMPT - MOVE *
|
||||
* * * * * * * * * * * * * * * */
|
||||
|
||||
.prompt .file-list {
|
||||
flex-direction: initial;
|
||||
}
|
||||
|
||||
.prompt .file-list ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.prompt .file-list ul li {
|
||||
width: 100%;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.prompt .file-list ul li[aria-selected=true] {
|
||||
background: #2196f3 !important;
|
||||
color: #fff !important;
|
||||
transition: .1s ease all;
|
||||
}
|
||||
|
||||
.prompt .file-list ul li:hover {
|
||||
background-color: #e9eaeb;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.prompt .file-list ul li:before {
|
||||
content: "folder";
|
||||
color: #6f6f6f;
|
||||
vertical-align: middle;
|
||||
padding: 0 .25em;
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.prompt .file-list ul li[aria-selected=true]:before {
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
/* * * * * * * * * * * * * * * *
|
||||
* HELP *
|
||||
@ -1041,4 +1084,4 @@ footer a:hover {
|
||||
-webkit-transform: rotate(-360deg);
|
||||
transform: rotate(-360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -102,7 +102,7 @@ function getCSSRule(rules) {
|
||||
if (cssRule.selectorText.toLowerCase() == rules[i]) found = true;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return found;
|
||||
});
|
||||
|
||||
@ -161,9 +161,7 @@ function logoutEvent(event) {
|
||||
}
|
||||
|
||||
function openEvent(event) {
|
||||
if (event.currentTarget.classList.contains('disabled')) {
|
||||
return false;
|
||||
}
|
||||
if (event.currentTarget.classList.contains('disabled')) return false;
|
||||
|
||||
let link = '?raw=true';
|
||||
|
||||
@ -177,6 +175,64 @@ function openEvent(event) {
|
||||
return false;
|
||||
}
|
||||
|
||||
function selectMoveFolder(event) {
|
||||
if(event.target.getAttribute("aria-selected") === "true") {
|
||||
event.target.setAttribute("aria-selected", false);
|
||||
return;
|
||||
} else {
|
||||
if(document.querySelector(".file-list li[aria-selected=true]")) {
|
||||
document.querySelector(".file-list li[aria-selected=true]").setAttribute("aria-selected", false);
|
||||
}
|
||||
event.target.setAttribute("aria-selected", true);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
function moveSelected(event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
function loadNextFolder(event) {
|
||||
}
|
||||
|
||||
function moveEvent(event) {
|
||||
if(event.currentTarget.classList.contains("disabled")) return;
|
||||
|
||||
let request = new XMLHttpRequest();
|
||||
|
||||
request.open("GET", window.location.pathname, true);
|
||||
request.setRequestHeader("Accept", "application/json");
|
||||
request.send();
|
||||
request.onreadystatechange = function() {
|
||||
if(request.readyState == 4) {
|
||||
if(request.status == 200) {
|
||||
let clone = document.importNode(templates.move.content, true);
|
||||
|
||||
clone.querySelector("p").innerHTML = `Choose new house for your file(s)/folder(s):`;
|
||||
|
||||
for(let f of JSON.parse(request.response)) {
|
||||
if(f.URL.split("/").length == 3) {
|
||||
if(selectedItems.includes(btoa(f.URL.split("/")[1]))) continue;
|
||||
let newNode = document.createElement("li");
|
||||
newNode.innerHTML = f.URL.split("/")[1];
|
||||
newNode.setAttribute("aria-selected", false);
|
||||
|
||||
newNode.addEventListener("dblclick", loadNextFolder);
|
||||
newNode.addEventListener("click", selectMoveFolder);
|
||||
newNode.addEventListener("submit", moveSelected);
|
||||
|
||||
clone.querySelector("div.file-list ul").appendChild(newNode);
|
||||
}
|
||||
}
|
||||
|
||||
document.body.appendChild(clone);
|
||||
document.querySelector(".overlay").classList.add("active");
|
||||
document.querySelector(".prompt").classList.add("active");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function deleteSelected(single) {
|
||||
return function(event) {
|
||||
event.preventDefault();
|
||||
@ -238,7 +294,7 @@ function deleteEvent(event) {
|
||||
clone.querySelector('.ok').innerHTML = 'Delete';
|
||||
clone.querySelector('form').addEventListener('submit', deleteSelected(single));
|
||||
|
||||
document.querySelector('body').appendChild(clone)
|
||||
document.body.appendChild(clone);
|
||||
document.querySelector('.overlay').classList.add('active');
|
||||
document.querySelector('.prompt').classList.add('active');
|
||||
|
||||
@ -414,13 +470,16 @@ document.addEventListener("DOMContentLoaded", function(event) {
|
||||
buttons.open = document.getElementById("open");
|
||||
buttons.delete = document.getElementById("delete");
|
||||
buttons.previous = document.getElementById("previous");
|
||||
buttons.move = document.getElementById("move");
|
||||
|
||||
// Attach event listeners
|
||||
buttons.logout.addEventListener("click", logoutEvent);
|
||||
buttons.open.addEventListener("click", openEvent);
|
||||
buttons.move.addEventListener("click", moveEvent);
|
||||
|
||||
templates.question = document.querySelector('#question-template');
|
||||
templates.info = document.querySelector('#info-template');
|
||||
templates.move = document.querySelector("#move-template");
|
||||
|
||||
if (user.AllowEdit) {
|
||||
buttons.delete.addEventListener("click", deleteEvent);
|
||||
@ -465,4 +524,4 @@ document.addEventListener("DOMContentLoaded", function(event) {
|
||||
|
||||
setupSearch();
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
@ -12,10 +12,10 @@
|
||||
{{- if ne .User.StyleSheet "" -}}
|
||||
<style>{{ CSS .User.StyleSheet }}</style>
|
||||
{{- end -}}
|
||||
|
||||
|
||||
<script>
|
||||
var user = JSON.parse('{{ Marshal .User }}'),
|
||||
webdavURL = "{{.Config.AbsoluteURL}}{{.Config.WebDavURL}}",
|
||||
var user = JSON.parse('{{ Marshal .User }}'),
|
||||
webdavURL = "{{.Config.AbsoluteURL}}{{.Config.WebDavURL}}",
|
||||
baseURL = "{{.Config.AbsoluteURL}}";
|
||||
</script>
|
||||
<script src="{{ .Config.AbsoluteURL }}/_filemanagerinternal/js/common.js" defer></script>
|
||||
@ -44,10 +44,10 @@
|
||||
<i class="material-icons" title="Logout">exit_to_app</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="bottom-bar">
|
||||
<div>
|
||||
{{- if ne .Name "/"}}
|
||||
{{- if ne .Name "/"}}
|
||||
<div data-dropdown class="action" id="previous">
|
||||
<i class="material-icons">subdirectory_arrow_left</i>
|
||||
<ul class="dropdown" id="breadcrumbs">
|
||||
@ -57,10 +57,10 @@
|
||||
</ul>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
|
||||
{{ if ne .Name "/"}}<p id="current-file">{{ .Name }}</p>{{ end }}
|
||||
</div>
|
||||
|
||||
|
||||
<div class="actions{{ if .IsDir }} disabled{{ end }}" id="file-only">
|
||||
{{- if and (not .IsDir) (.User.AllowEdit) }}
|
||||
{{- if .Editor}}
|
||||
@ -70,59 +70,65 @@
|
||||
</div>
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
|
||||
|
||||
<div class="action" id="save">
|
||||
<i class="material-icons" title="Save">save</i>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
|
||||
<div class="action" id="open">
|
||||
<i class="material-icons" title="See raw">open_in_new</i>
|
||||
</div>
|
||||
|
||||
|
||||
{{- if .User.AllowEdit }}
|
||||
<div class="action" id="move">
|
||||
<i class="material-icons" title="Move">forward</i>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
{{- 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>
|
||||
|
||||
|
||||
<div class="action mobile-only" id="more">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</div>
|
||||
|
||||
<div class="actions" id="main-actions">
|
||||
|
||||
<div class="actions" id="main-actions">
|
||||
{{- if .IsDir }}
|
||||
<div class="action" id="view">
|
||||
{{- if eq .Display "mosaic" }}
|
||||
<a href="?display=list"><i class="material-icons" title="Switch View">view_list</i><span>Switch view</span></a>
|
||||
{{- else }}
|
||||
{{- else }}
|
||||
<a href="?display=mosaic"><i class="material-icons" title="Switch View">view_module</i><span>Switch view</span></a>
|
||||
{{- end }}
|
||||
</div>
|
||||
|
||||
|
||||
<div class="action mobile-only" id="multiple-selection-activate">
|
||||
<i class="material-icons">check_circle</i><span>Select</span>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
|
||||
{{- 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 {{ if .IsDir }}data-dropdown{{ end }} class="action" id="download">
|
||||
{{- if not .IsDir}}<a href="?download=true">{{ end }}
|
||||
<i class="material-icons" title="Download">file_download</i><span>Download</span>
|
||||
{{- if not .IsDir}}</a>{{ end }}
|
||||
|
||||
|
||||
{{- if .IsDir }}
|
||||
<ul class="dropdown" id="download-drop">
|
||||
<a data-format="zip" href="?download=zip"><li>zip</li></a>
|
||||
@ -133,29 +139,29 @@
|
||||
</ul>
|
||||
{{- end }}
|
||||
</div>
|
||||
|
||||
|
||||
<div class="action" id="info" onclick="notImplemented(event);">
|
||||
<i class="material-icons" title="Info">info</i><span>Info</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="click-overlay"></div>
|
||||
</header>
|
||||
|
||||
</header>
|
||||
|
||||
<div id="multiple-selection" class="mobile-only">
|
||||
<p>Multiple selection enabled</p>
|
||||
<div class="action" id="multiple-selection-cancel">
|
||||
<i class="material-icons" title="Clear">clear</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<main>
|
||||
{{- template "content" . }}
|
||||
</main>
|
||||
|
||||
|
||||
<div class="overlay"></div>
|
||||
|
||||
|
||||
{{- if and (.User.AllowNew) (.IsDir) }}
|
||||
<div class="floating">
|
||||
<div class="action" id="new">
|
||||
@ -163,7 +169,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
|
||||
<template id="question-template">
|
||||
<form class="prompt">
|
||||
<h3></h3>
|
||||
@ -175,7 +181,7 @@
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
|
||||
<template id="info-template">
|
||||
<div class="prompt">
|
||||
<h3></h3>
|
||||
@ -185,10 +191,27 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<template id="move-template">
|
||||
<form class="prompt">
|
||||
<h3>Move</h3>
|
||||
<p></p>
|
||||
|
||||
<div class="file-list">
|
||||
<ul>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button type="submit" autofocus class="ok">OK</button>
|
||||
<button class="cancel" onclick="closePrompt(event);">Cancel</button>
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
<div class="help">
|
||||
<h3>Help</h3>
|
||||
|
||||
|
||||
<ul>
|
||||
<li><strong>F1</strong> - this information</li>
|
||||
<li><strong>F2</strong> - rename file</li>
|
||||
@ -199,13 +222,13 @@
|
||||
<li><strong>Double click</strong> - open a file or directory</li>
|
||||
<li><strong>Click</strong> - select file or directory</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<p>Not available yet</p>
|
||||
|
||||
|
||||
<ul>
|
||||
<li><strong>Alt + Click</strong> - select a group of files</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div>
|
||||
<button type="submit" onclick="closeHelp(event);" class="ok">OK</button>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user