Merge branch 'master' into a

This commit is contained in:
a 2022-04-07 08:22:59 -07:00
commit 41d396edc4
4 changed files with 208 additions and 33 deletions

View file

@ -108,9 +108,9 @@ func RunMount(option *MountOptions, umask os.FileMode) bool {
mountDirHash = -mountDirHash mountDirHash = -mountDirHash
} }
*option.localSocket = fmt.Sprintf("/tmp/seaweefs-mount-%d.sock", mountDirHash) *option.localSocket = fmt.Sprintf("/tmp/seaweefs-mount-%d.sock", mountDirHash)
if err := os.Remove(*option.localSocket); err != nil && !os.IsNotExist(err) { }
glog.Fatalf("Failed to remove %s, error: %s", *option.localSocket, err.Error()) if err := os.Remove(*option.localSocket); err != nil && !os.IsNotExist(err) {
} glog.Fatalf("Failed to remove %s, error: %s", *option.localSocket, err.Error())
} }
montSocketListener, err := net.Listen("unix", *option.localSocket) montSocketListener, err := net.Listen("unix", *option.localSocket)
if err != nil { if err != nil {

View file

@ -46,8 +46,10 @@ func (fs *FilerServer) listDirectoryHandler(w http.ResponseWriter, r *http.Reque
path = "" path = ""
} }
emptyFolder := true
if len(entries) > 0 { if len(entries) > 0 {
lastFileName = entries[len(entries)-1].Name() lastFileName = entries[len(entries)-1].Name()
emptyFolder = false
} }
glog.V(4).Infof("listDirectory %s, last file %s, limit %d: %d items", path, lastFileName, limit, len(entries)) glog.V(4).Infof("listDirectory %s, last file %s, limit %d: %d items", path, lastFileName, limit, len(entries))
@ -59,12 +61,14 @@ func (fs *FilerServer) listDirectoryHandler(w http.ResponseWriter, r *http.Reque
Limit int Limit int
LastFileName string LastFileName string
ShouldDisplayLoadMore bool ShouldDisplayLoadMore bool
EmptyFolder bool
}{ }{
path, path,
entries, entries,
limit, limit,
lastFileName, lastFileName,
shouldDisplayLoadMore, shouldDisplayLoadMore,
emptyFolder,
}) })
return return
} }
@ -76,6 +80,7 @@ func (fs *FilerServer) listDirectoryHandler(w http.ResponseWriter, r *http.Reque
Limit int Limit int
LastFileName string LastFileName string
ShouldDisplayLoadMore bool ShouldDisplayLoadMore bool
EmptyFolder bool
}{ }{
path, path,
ui.ToBreadcrumb(path), ui.ToBreadcrumb(path),
@ -83,5 +88,6 @@ func (fs *FilerServer) listDirectoryHandler(w http.ResponseWriter, r *http.Reque
limit, limit,
lastFileName, lastFileName,
shouldDisplayLoadMore, shouldDisplayLoadMore,
emptyFolder,
}) })
} }

View file

@ -26,6 +26,12 @@
border-radius: 2px; border-radius: 2px;
border: 1px solid #ccc; border: 1px solid #ccc;
float: right; float: right;
margin-left: 2px;
margin-bottom: 0;
}
label {
font-weight: normal;
} }
.button:hover { .button:hover {
@ -36,6 +42,50 @@
display: none; display: none;
} }
td, th {
vertical-align: bottom;
}
.danger {
color: red;
background: #fff;
border: 1px solid #fff;
border-radius: 2px;
}
.info {
background: #fff;
border: 1px solid #fff;
border-radius: 2px;
}
.footer {
position: absolute;
bottom: 10px;
right: 10%;
min-width: 30%;
}
.progress-table {
width: 100%;
}
.progress-table-file-name {
text-align: right;
}
.progress-table-percent {
width: 60px;
text-align: right;
}
.add-files {
font-size: 46px;
text-align: center;
border: 1px dashed #999;
padding-bottom: 9px;
margin: 0 2px;
}
</style> </style>
</head> </head>
<body> <body>
@ -54,6 +104,7 @@
</a> </a>
{{ end }} {{ end }}
<label class="button" for="fileElem">Upload</label> <label class="button" for="fileElem">Upload</label>
<label class="button" onclick="handleCreateDir()">New Folder</label>
</div> </div>
</div> </div>
@ -61,13 +112,13 @@
<form class="upload-form"> <form class="upload-form">
<input type="file" id="fileElem" multiple onchange="handleFiles(this.files)"> <input type="file" id="fileElem" multiple onchange="handleFiles(this.files)">
<table width="90%"> <table width="100%">
{{$path := .Path }} {{$path := .Path }}
{{ range $entry_index, $entry := .Entries }} {{ range $entry_index, $entry := .Entries }}
<tr> <tr>
<td> <td>
{{if $entry.IsDirectory}} {{if $entry.IsDirectory}}
<img src="/seaweedfsstatic/images/folder.gif" width="20" height="23"> <img src="/seaweedfsstatic/images/folder.gif" width="20" height="16">
<a href="{{ printpath $path "/" $entry.Name "/"}}" > <a href="{{ printpath $path "/" $entry.Name "/"}}" >
{{ $entry.Name }} {{ $entry.Name }}
</a> </a>
@ -89,13 +140,25 @@
{{ $entry.Size | humanizeBytes }}&nbsp; {{ $entry.Size | humanizeBytes }}&nbsp;
{{end}} {{end}}
</td> </td>
<td nowrap> <td align="right" nowrap>
{{ $entry.Timestamp.Format "2006-01-02 15:04" }} {{ $entry.Timestamp.Format "2006-01-02 15:04" }}
</td> </td>
<td>
{{if $entry.IsDirectory}}
<label class="button danger" onclick="handleDelete('{{ printpath $path "/" $entry.Name "/" }}')">Delete</label>
{{else}}
<label class="button danger" onclick="handleDelete('{{ printpath $path "/" $entry.Name }}')">Delete</label>
{{end}}
<label class="button info" onclick="handleRename('{{ $entry.Name }}', '{{ printpath $path "/" }}')">Rename</label>
</td>
</tr> </tr>
{{ end }} {{ end }}
</table> </table>
{{if .EmptyFolder}}
<div class="row add-files">
+
</div>
{{end}}
</form> </form>
</div> </div>
@ -109,65 +172,171 @@
<br/> <br/>
<br/> <br/>
<div id="progress-area" class="footer" style="display: none;">
</div>
</div> </div>
</body> </body>
<script type="text/javascript"> <script type="text/javascript">
// ************************ Drag and drop ***************** // // ************************ Drag and drop ***************** //
let dropArea = document.getElementById("drop-area") let dropArea = document.getElementById("drop-area");
let progressArea = document.getElementById("progress-area");
// Prevent default drag behaviors // Prevent default drag behaviors
;['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => { ;['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
dropArea.addEventListener(eventName, preventDefaults, false) dropArea.addEventListener(eventName, preventDefaults, false);
document.body.addEventListener(eventName, preventDefaults, false) document.body.addEventListener(eventName, preventDefaults, false);
}) });
// Highlight drop area when item is dragged over it // Highlight drop area when item is dragged over it
;['dragenter', 'dragover'].forEach(eventName => { ;['dragenter', 'dragover'].forEach(eventName => {
dropArea.addEventListener(eventName, highlight, false) dropArea.addEventListener(eventName, highlight, false);
}) });
;['dragleave', 'drop'].forEach(eventName => { ;['dragleave', 'drop'].forEach(eventName => {
dropArea.addEventListener(eventName, unhighlight, false) dropArea.addEventListener(eventName, unhighlight, false);
}) });
// Handle dropped files // Handle dropped files
dropArea.addEventListener('drop', handleDrop, false) dropArea.addEventListener('drop', handleDrop, false);
function preventDefaults(e) { function preventDefaults(e) {
e.preventDefault() e.preventDefault();
e.stopPropagation() e.stopPropagation();
} }
function highlight(e) { function highlight(e) {
dropArea.classList.add('highlight') dropArea.classList.add('highlight');
} }
function unhighlight(e) { function unhighlight(e) {
dropArea.classList.remove('highlight') dropArea.classList.remove('highlight');
} }
function handleDrop(e) { function handleDrop(e) {
var dt = e.dataTransfer var dt = e.dataTransfer;
var files = dt.files var files = dt.files;
handleFiles(files) handleFiles(files);
} }
var uploadList = {};
function handleFiles(files) { function handleFiles(files) {
files = [...files] files = [...files];
files.forEach(uploadFile) files.forEach(startUpload);
window.location.reload() renderProgress();
files.forEach(uploadFile);
}
function startUpload(file, i) {
uploadList[file.name] = {'name': file.name, 'percent': 0, 'finish': false};
}
function renderProgress() {
var values = Object.values(uploadList);
var html = '<table class="progress-table">\n';
for (let i of values) {
html += '<tr>\n<td class="progress-table-file-name">' + i.name + '<\/td>\n';
html += '<td class="progress-table-percent">' + i.percent + '% <\/td>\n<\/tr>\n';
}
html += '<\/table>\n';
progressArea.innerHTML = html;
if (values.length > 0) {
progressArea.attributes.style.value = '';
}
console.log('Render Progress', values);
}
function reportProgress(file, percent) {
var item = uploadList[file]
item.percent = percent;
renderProgress();
}
function finishUpload(file) {
uploadList[file]['finish'] = true;
renderProgress();
var allFinish = true;
for (let i of Object.values(uploadList)) {
if (!i.finish) {
allFinish = false;
break;
}
}
if (allFinish) {
console.log('All Finish');
window.location.reload();
}
} }
function uploadFile(file, i) { function uploadFile(file, i) {
var url = window.location.href var url = window.location.href;
var xhr = new XMLHttpRequest() var xhr = new XMLHttpRequest();
var formData = new FormData() var fileName = file.name;
xhr.open('POST', url, false) xhr.upload.addEventListener('progress', function(e) {
if (e.lengthComputable) {
var percent = Math.ceil((e.loaded / e.total) * 100);
reportProgress(fileName, percent)
}
});
xhr.upload.addEventListener('loadend', function(e) {
finishUpload(fileName);
});
var formData = new FormData();
xhr.open('POST', url, true);
formData.append('file', file);
xhr.send(formData);
}
formData.append('file', file) function handleCreateDir() {
xhr.send(formData) var dirName = prompt('Directory Name:', '');
dirName = dirName.trim();
if (dirName == null || dirName == '') {
return;
}
var baseUrl = window.location.href;
if (!baseUrl.endsWith('/')) {
baseUrl += '/';
}
var url = baseUrl + dirName;
if (!url.endsWith('/')) {
url += '/';
}
var xhr = new XMLHttpRequest();
xhr.open('POST', url, false);
xhr.setRequestHeader('Content-Type', '');
xhr.send();
window.location.reload();
}
function handleRename(originName, basePath) {
var newName = prompt('New Name:', originName);
if (newName == null || newName == '') {
return;
}
var url = basePath + newName;
var originPath = basePath + originName;
url += '?mv.from=' + originPath;
var xhr = new XMLHttpRequest();
xhr.open('POST', url, false);
xhr.setRequestHeader('Content-Type', '');
xhr.send();
window.location.reload();
}
function handleDelete(path) {
if (!confirm('Are you sure to delete ' + path + '?')) {
return;
}
var url = path;
if (url.endsWith('/')) {
url += '?recursive=true';
}
var xhr = new XMLHttpRequest();
xhr.open('DELETE', url, false);
xhr.send();
window.location.reload();
} }
</script> </script>
</html> </html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 80 B

After

Width:  |  Height:  |  Size: 77 B