Moonlight-Panel/Moonlight
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated mooncore dependencies. Improved ux for the system file manager

Browse Source
This commit is contained in:
ChiaraBm
2025-03-13 12:18:13 +01:00
parent f23320eb1c
commit 340cf738dc
5 changed files with 114 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
Moonlight.Client/Implementations/SysFileSystemProvider.cs
View File

@@ -1,5 +1,7 @@
using MoonCore.Blazor.Tailwind.Fm;
using MoonCore.Blazor.Services;
using MoonCore.Blazor.Tailwind.Fm;
using MoonCore.Blazor.Tailwind.Fm.Models;
using MoonCore.Blazor.Tailwind.Services;
using MoonCore.Helpers;
using Moonlight.Shared.Http.Requests.Admin.Sys.Files;
using Moonlight.Shared.Http.Responses.Admin.Sys;
@@ -8,7 +10,9 @@ namespace Moonlight.Client.Implementations;
public class SysFileSystemProvider : IFileSystemProvider, ICompressFileSystemProvider
{
private readonly DownloadService DownloadService;
private readonly HttpApiClient HttpApiClient;
private readonly LocalStorageService LocalStorageService;
private readonly string BaseApiUrl = "api/admin/system/files";
public CompressType[] CompressTypes { get; } =
@@ -25,9 +29,11 @@ public class SysFileSystemProvider : IFileSystemProvider, ICompressFileSystemPro
}
];
public SysFileSystemProvider(HttpApiClient httpApiClient)
public SysFileSystemProvider(HttpApiClient httpApiClient, DownloadService downloadService, LocalStorageService localStorageService)
{
HttpApiClient = httpApiClient;
DownloadService = downloadService;
LocalStorageService = localStorageService;
}
public async Task<FileSystemEntry[]> List(string path)
@@ -67,6 +73,29 @@ public class SysFileSystemProvider : IFileSystemProvider, ICompressFileSystemPro
public async Task<Stream> Read(string path)
=> await HttpApiClient.GetStream($"{BaseApiUrl}/read?path={path}");
public async Task Download(Func<long, Task> updateProgress, string path, string fileName)
{
var accessToken = await LocalStorageService.GetString("AccessToken");
await DownloadService.DownloadUrl(fileName, $"{BaseApiUrl}/read?path={path}", async (bytes, _) =>
{
await updateProgress.Invoke(bytes);
}, headers =>
{
headers.Add("Authorization", $"Bearer {accessToken}");
});
}
public async Task Upload(Func<long, Task> updateProgress, string path, Stream stream)
{
var progressStream = new ProgressStream(stream, onReadChanged: new Progress<long>(async bytes =>
{
await updateProgress.Invoke(bytes);
}));
await Create(path, progressStream);
}
public async Task Compress(CompressType type, string path, string[] itemsToCompress)
{
await HttpApiClient.Post($"{BaseApiUrl}/compress", new CompressRequest()

2
Moonlight.Client/Moonlight.Client.csproj
View File

@@ -27,7 +27,7 @@
<PackageReference Include="MoonCore" Version="1.8.5" />
<PackageReference Include="MoonCore.Blazor" Version="1.2.9" />
<PackageReference Include="MoonCore.PluginFramework" Version="1.0.5"/>
<PackageReference Include="MoonCore.Blazor.Tailwind" Version="1.3.4" />
<PackageReference Include="MoonCore.Blazor.Tailwind" Version="1.3.6" />
</ItemGroup>
<!--

5
Moonlight.Client/UI/Views/Admin/Sys/Files.razor
View File

@@ -1,6 +1,7 @@
@page "/admin/system/files"
@using MoonCore.Attributes
@using MoonCore.Blazor.Services
@using MoonCore.Helpers
@using MoonCore.Blazor.Tailwind.Fm
@using Moonlight.Client.Implementations
@@ -8,6 +9,8 @@
@attribute [RequirePermission("admin.system.overview")]
@inject HttpApiClient ApiClient
@inject DownloadService DownloadService
@inject LocalStorageService LocalStorageService
<div class="mb-3">
<NavTabs Index="2" Names="UiConstants.AdminNavNames" Links="UiConstants.AdminNavLinks" />
@@ -21,6 +24,6 @@
protected override void OnInitialized()
{
FileSystemProvider = new SysFileSystemProvider(ApiClient);
FileSystemProvider = new SysFileSystemProvider(ApiClient, DownloadService, LocalStorageService);
}
}

94
Moonlight.Client/wwwroot/js/downloadService.js
View File

@@ -1,33 +1,84 @@
window.moonCoreDownloadService = {
download: async function (fileName, contentStreamReference, id, reportRef) {
const promise = new Promise(async resolve => {
const stream = await contentStreamReference.stream();
const reader = stream.getReader();
const stream = await contentStreamReference.stream();
const reader = stream.getReader();
let lastReportTime = 0;
let receivedLength = 0; // Track downloaded size
let chunks = []; // Store downloaded chunks
let lastReportTime = 0;
let receivedLength = 0; // Track downloaded size
let chunks = []; // Store downloaded chunks
while (true) {
const {done, value} = await reader.read();
if (done) break;
while (true) {
const { done, value } = await reader.read();
if (done) break;
chunks.push(value);
receivedLength += value.length;
chunks.push(value);
receivedLength += value.length;
if (reportRef) {
const now = Date.now();
if(reportRef)
{
const now = Date.now();
if (now - lastReportTime >= 500) { // Only log once per second
await reportRef.invokeMethodAsync("ReceiveReport", id, receivedLength, false);
lastReportTime = now;
if (now - lastReportTime >= 500) { // Only log once per second
await reportRef.invokeMethodAsync("ReceiveReport", id, receivedLength, false);
lastReportTime = now;
}
}
}
}
// Combine chunks into a single Blob
const blob = new Blob(chunks);
// Combine chunks into a single Blob
const blob = new Blob(chunks);
this.downloadBlob(fileName, blob);
if (reportRef)
await reportRef.invokeMethodAsync("ReceiveReport", id, receivedLength, true);
resolve();
});
await promise;
},
downloadUrl: async function (fileName, url, reportRef, id, headers) {
const promise = new Promise(async resolve => {
let loadRequest = new XMLHttpRequest();
let lastReported = Date.now();
loadRequest.open("GET", url, true);
for(let headerKey in headers) {
loadRequest.setRequestHeader(headerKey, headers[headerKey]);
}
loadRequest.responseType = "blob";
if (reportRef) {
loadRequest.onprogress = async ev => {
const now = Date.now();
if (now - lastReported >= 500) {
await reportRef.invokeMethodAsync("ReceiveReport", id, ev.loaded, false);
lastReported = now;
}
};
loadRequest.onloadend = async ev => {
await reportRef.invokeMethodAsync("ReceiveReport", id, ev.loaded, true);
}
}
loadRequest.onload = _ => {
this.downloadBlob(fileName, loadRequest.response);
resolve();
}
loadRequest.send();
});
await promise;
},
downloadBlob: function (fileName, blob)
{
const url = URL.createObjectURL(blob);
// Trigger file download
@@ -39,8 +90,5 @@ window.moonCoreDownloadService = {
document.body.removeChild(anchor);
URL.revokeObjectURL(url);
if(reportRef)
await reportRef.invokeMethodAsync("ReceiveReport", id, receivedLength, true);
}
}

14
Moonlight.Client/wwwroot/js/fileManager.js
View File

@@ -18,10 +18,10 @@ window.moonCoreFileManager = {
if(!nextItem)
return null;
let file;
let path;
if(nextItem instanceof File)
{
file = nextItem;
@@ -32,7 +32,7 @@ window.moonCoreFileManager = {
file = await this.openFileEntry(nextItem);
path = nextItem.fullPath;
}
if(file.size === 0)
{
return {
@@ -41,9 +41,9 @@ window.moonCoreFileManager = {
left: this.uploadCache.length
}
}
let stream = await this.createStreamRef(file);
return {
path: path,
stream: stream,
@@ -57,7 +57,7 @@ window.moonCoreFileManager = {
if(streamRefData == null)
return {path: item.fullPath, streamRef: null};
return {
path: item.fullPath,
streamRef: streamRefData.stream,
@@ -96,7 +96,7 @@ window.moonCoreFileManager = {
},
setup: function (id, callbackRef) {
this.ref = callbackRef;
// Check which features are supported by the browser
const supportsFileSystemAccessAPI =
'getAsFileSystemHandle' in DataTransferItem.prototype;